1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
import React from 'react';
import {
TimelineVisibility,
kTimelineVisibilities,
PersonalTimelineChangePropertyRequest
} from '../data/timeline';
import OperationDialog, {
OperationSelectInputInfoOption
} from '../common/OperationDialog';
export interface TimelinePropertyInfo {
visibility: TimelineVisibility;
description: string;
}
export interface TimelinePropertyChangeDialogProps {
open: boolean;
close: () => void;
oldInfo: TimelinePropertyInfo;
onProcess: (request: PersonalTimelineChangePropertyRequest) => Promise<void>;
}
const labelMap: { [key in TimelineVisibility]: string } = {
Private: 'timeline.visibility.private',
Public: 'timeline.visibility.public',
Register: 'timeline.visibility.register'
};
const TimelinePropertyChangeDialog: React.FC<TimelinePropertyChangeDialogProps> = props => {
return (
<OperationDialog
title={'timeline.dialogChangeProperty.title'}
titleColor="default"
inputScheme={[
{
type: 'select',
label: 'timeline.dialogChangeProperty.visibility',
options: kTimelineVisibilities.map<OperationSelectInputInfoOption>(
v => ({
label: labelMap[v],
value: v
})
),
initValue: props.oldInfo.visibility
},
{
type: 'text',
label: 'timeline.dialogChangeProperty.description',
initValue: props.oldInfo.description
}
]}
open={props.open}
close={props.close}
onProcess={([newVisibility, newDescription]) => {
const req: PersonalTimelineChangePropertyRequest = {};
if (newVisibility !== props.oldInfo.visibility) {
req.visibility = newVisibility as TimelineVisibility;
}
if (newDescription !== props.oldInfo.description) {
req.description = newDescription as string;
}
return props.onProcess(req);
}}
/>
);
};
export default TimelinePropertyChangeDialog;
|
