@perses-dev/dashboards 0.16.0 → 0.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/DashboardToolbar/DashboardToolbar.js +6 -12
- package/dist/cjs/components/GridLayout/GridLayout.js +13 -2
- package/dist/cjs/components/GridLayout/GridTitle.js +3 -5
- package/dist/cjs/components/Panel/PanelHeader.js +1 -1
- package/dist/cjs/components/PanelDrawer/PanelDrawer.js +1 -3
- package/dist/cjs/components/Variables/Variable.js +2 -46
- package/dist/cjs/components/Variables/VariableEditor.js +142 -130
- package/dist/cjs/components/Variables/VariableEditorForm/VariableEditorForm.js +303 -167
- package/dist/cjs/components/Variables/VariableList.js +10 -8
- package/dist/cjs/components/Variables/variable-model.js +74 -0
- package/dist/components/DashboardToolbar/DashboardToolbar.js +6 -12
- package/dist/components/DashboardToolbar/DashboardToolbar.js.map +1 -1
- package/dist/components/GridLayout/GridLayout.d.ts.map +1 -1
- package/dist/components/GridLayout/GridLayout.js +13 -2
- package/dist/components/GridLayout/GridLayout.js.map +1 -1
- package/dist/components/GridLayout/GridTitle.js +3 -5
- package/dist/components/GridLayout/GridTitle.js.map +1 -1
- package/dist/components/Panel/PanelHeader.js +1 -1
- package/dist/components/Panel/PanelHeader.js.map +1 -1
- package/dist/components/PanelDrawer/PanelDrawer.js +1 -3
- package/dist/components/PanelDrawer/PanelDrawer.js.map +1 -1
- package/dist/components/Variables/Variable.d.ts.map +1 -1
- package/dist/components/Variables/Variable.js +3 -47
- package/dist/components/Variables/Variable.js.map +1 -1
- package/dist/components/Variables/VariableEditor.d.ts.map +1 -1
- package/dist/components/Variables/VariableEditor.js +142 -130
- package/dist/components/Variables/VariableEditor.js.map +1 -1
- package/dist/components/Variables/VariableEditorForm/VariableEditorForm.d.ts.map +1 -1
- package/dist/components/Variables/VariableEditorForm/VariableEditorForm.js +300 -169
- package/dist/components/Variables/VariableEditorForm/VariableEditorForm.js.map +1 -1
- package/dist/components/Variables/VariableEditorForm/variable-editor-form-model.js.map +1 -1
- package/dist/components/Variables/VariableList.d.ts.map +1 -1
- package/dist/components/Variables/VariableList.js +10 -8
- package/dist/components/Variables/VariableList.js.map +1 -1
- package/dist/components/Variables/variable-model.d.ts +8 -0
- package/dist/components/Variables/variable-model.d.ts.map +1 -0
- package/dist/components/Variables/variable-model.js +64 -0
- package/dist/components/Variables/variable-model.js.map +1 -0
- package/package.json +4 -4
|
@@ -11,15 +11,19 @@
|
|
|
11
11
|
// See the License for the specific language governing permissions and
|
|
12
12
|
// limitations under the License.
|
|
13
13
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
14
|
-
import React, { useMemo } from 'react';
|
|
15
|
-
import { Box, Typography, Switch, TextField, Grid, FormControl, InputLabel, MenuItem, Select, Button, Stack } from '@mui/material';
|
|
14
|
+
import React, { useMemo, useState } from 'react';
|
|
15
|
+
import { Box, Typography, Switch, TextField, Grid, FormControl, InputLabel, MenuItem, Select, Button, Stack, Alert, Chip, IconButton, ClickAwayListener } from '@mui/material';
|
|
16
16
|
import { useImmer } from 'use-immer';
|
|
17
17
|
import { PluginEditor } from '@perses-dev/plugin-system';
|
|
18
|
+
import { ErrorBoundary } from '@perses-dev/components';
|
|
19
|
+
import Refresh from 'mdi-material-ui/Refresh';
|
|
20
|
+
import { useListVariablePluginValues } from '../variable-model';
|
|
18
21
|
import { getVariableDefinitionFromState, getInitialState } from './variable-editor-form-model';
|
|
19
22
|
const VARIABLE_TYPES = [
|
|
20
23
|
'ListVariable',
|
|
21
24
|
'TextVariable'
|
|
22
25
|
];
|
|
26
|
+
const DEFAULT_MAX_PREVIEW_VALUES = 50;
|
|
23
27
|
// TODO: Replace with proper validation library
|
|
24
28
|
function getValidation(state) {
|
|
25
29
|
/** Name validation */ let name = null;
|
|
@@ -40,209 +44,336 @@ const SectionHeader = ({ children })=>/*#__PURE__*/ _jsx(Typography, {
|
|
|
40
44
|
variant: "subtitle1",
|
|
41
45
|
children: children
|
|
42
46
|
});
|
|
43
|
-
|
|
44
|
-
const
|
|
45
|
-
const
|
|
46
|
-
|
|
47
|
-
|
|
47
|
+
function VariableListPreview({ definition }) {
|
|
48
|
+
const { data , isFetching , error } = useListVariablePluginValues(definition);
|
|
49
|
+
const [maxValues, setMaxValues] = useState(DEFAULT_MAX_PREVIEW_VALUES);
|
|
50
|
+
const showAll = ()=>{
|
|
51
|
+
setMaxValues(undefined);
|
|
52
|
+
};
|
|
53
|
+
let notShown = 0;
|
|
54
|
+
if (data && (data === null || data === void 0 ? void 0 : data.length) > 0 && maxValues) {
|
|
55
|
+
notShown = data.length - maxValues;
|
|
56
|
+
}
|
|
57
|
+
const errorMessage = error === null || error === void 0 ? void 0 : error.message;
|
|
48
58
|
return /*#__PURE__*/ _jsxs(Box, {
|
|
49
59
|
children: [
|
|
50
|
-
/*#__PURE__*/ _jsx(
|
|
51
|
-
|
|
60
|
+
errorMessage && /*#__PURE__*/ _jsx(Alert, {
|
|
61
|
+
severity: "error",
|
|
62
|
+
children: errorMessage
|
|
63
|
+
}),
|
|
64
|
+
isFetching && 'Loading...',
|
|
65
|
+
(data === null || data === void 0 ? void 0 : data.length) === 0 && /*#__PURE__*/ _jsx(Alert, {
|
|
66
|
+
severity: "info",
|
|
67
|
+
children: "No results"
|
|
52
68
|
}),
|
|
53
|
-
/*#__PURE__*/ _jsxs(
|
|
54
|
-
container: true,
|
|
55
|
-
spacing: 2,
|
|
56
|
-
mb: 2,
|
|
69
|
+
/*#__PURE__*/ _jsxs(_Fragment, {
|
|
57
70
|
children: [
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
/*#__PURE__*/ _jsx(Grid, {
|
|
76
|
-
item: true,
|
|
77
|
-
xs: 6,
|
|
78
|
-
children: /*#__PURE__*/ _jsxs(FormControl, {
|
|
79
|
-
fullWidth: true,
|
|
80
|
-
children: [
|
|
81
|
-
/*#__PURE__*/ _jsx(InputLabel, {
|
|
82
|
-
id: "variable-type-select-label",
|
|
83
|
-
children: "Type"
|
|
84
|
-
}),
|
|
85
|
-
/*#__PURE__*/ _jsx(Select, {
|
|
86
|
-
labelId: "variable-type-select-label",
|
|
87
|
-
id: "variable-type-select",
|
|
88
|
-
label: "Type",
|
|
89
|
-
value: state.kind,
|
|
90
|
-
onChange: (v)=>{
|
|
91
|
-
setState((draft)=>{
|
|
92
|
-
draft.kind = v.target.value;
|
|
93
|
-
});
|
|
94
|
-
},
|
|
95
|
-
children: VARIABLE_TYPES.map((v)=>/*#__PURE__*/ _jsx(MenuItem, {
|
|
96
|
-
value: v,
|
|
97
|
-
children: v
|
|
98
|
-
}, v))
|
|
99
|
-
})
|
|
100
|
-
]
|
|
101
|
-
})
|
|
102
|
-
}),
|
|
103
|
-
/*#__PURE__*/ _jsx(Grid, {
|
|
104
|
-
item: true,
|
|
105
|
-
xs: 6,
|
|
106
|
-
children: /*#__PURE__*/ _jsx(TextField, {
|
|
107
|
-
fullWidth: true,
|
|
108
|
-
label: "Label",
|
|
109
|
-
value: state.title,
|
|
110
|
-
onChange: (v)=>{
|
|
111
|
-
setState((draft)=>{
|
|
112
|
-
draft.title = v.target.value;
|
|
113
|
-
});
|
|
114
|
-
}
|
|
115
|
-
})
|
|
116
|
-
}),
|
|
117
|
-
/*#__PURE__*/ _jsx(Grid, {
|
|
118
|
-
item: true,
|
|
119
|
-
xs: 12,
|
|
120
|
-
children: /*#__PURE__*/ _jsx(TextField, {
|
|
121
|
-
fullWidth: true,
|
|
122
|
-
label: "Description",
|
|
123
|
-
value: state.description,
|
|
124
|
-
onChange: (v)=>{
|
|
125
|
-
setState((draft)=>{
|
|
126
|
-
draft.description = v.target.value;
|
|
127
|
-
});
|
|
128
|
-
}
|
|
129
|
-
})
|
|
71
|
+
data === null || data === void 0 ? void 0 : data.slice(0, maxValues).map((val)=>/*#__PURE__*/ _jsx(Chip, {
|
|
72
|
+
sx: {
|
|
73
|
+
mr: 1,
|
|
74
|
+
mb: 1
|
|
75
|
+
},
|
|
76
|
+
size: "small",
|
|
77
|
+
label: val.label
|
|
78
|
+
}, val.value)),
|
|
79
|
+
notShown > 0 && /*#__PURE__*/ _jsx(Chip, {
|
|
80
|
+
onClick: showAll,
|
|
81
|
+
variant: "outlined",
|
|
82
|
+
sx: {
|
|
83
|
+
mr: 1,
|
|
84
|
+
mb: 1
|
|
85
|
+
},
|
|
86
|
+
size: "small",
|
|
87
|
+
label: `+${notShown} more`
|
|
130
88
|
})
|
|
131
89
|
]
|
|
132
|
-
})
|
|
133
|
-
|
|
90
|
+
})
|
|
91
|
+
]
|
|
92
|
+
});
|
|
93
|
+
}
|
|
94
|
+
export function VariableEditForm({ initialVariableDefinition , onChange , onCancel }) {
|
|
95
|
+
const [state, setState] = useImmer(getInitialState(initialVariableDefinition));
|
|
96
|
+
const validation = useMemo(()=>getValidation(state), [
|
|
97
|
+
state
|
|
98
|
+
]);
|
|
99
|
+
const [previewKey, setPreviewKey] = React.useState(0);
|
|
100
|
+
const refreshPreview = ()=>{
|
|
101
|
+
setPreviewKey((prev)=>prev + 1);
|
|
102
|
+
};
|
|
103
|
+
/** We use the `previewKey` that we increment to know when to explicity update the
|
|
104
|
+
* spec that will be used for preview. The reason why we do this is to avoid
|
|
105
|
+
* having to re-fetch the values when the user is still editing the spec.
|
|
106
|
+
*/ const previewSpec = useMemo(()=>{
|
|
107
|
+
return getVariableDefinitionFromState(state);
|
|
108
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
109
|
+
}, [
|
|
110
|
+
previewKey
|
|
111
|
+
]);
|
|
112
|
+
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
113
|
+
children: [
|
|
114
|
+
/*#__PURE__*/ _jsxs(Box, {
|
|
115
|
+
sx: {
|
|
116
|
+
display: 'flex',
|
|
117
|
+
alignItems: 'center',
|
|
118
|
+
padding: (theme)=>theme.spacing(1, 2),
|
|
119
|
+
borderBottom: (theme)=>`1px solid ${theme.palette.grey[100]}`
|
|
120
|
+
},
|
|
134
121
|
children: [
|
|
135
|
-
/*#__PURE__*/ _jsx(
|
|
136
|
-
|
|
122
|
+
/*#__PURE__*/ _jsx(Typography, {
|
|
123
|
+
variant: "h2",
|
|
124
|
+
children: "Template Variables / Edit Variable"
|
|
137
125
|
}),
|
|
138
|
-
/*#__PURE__*/
|
|
139
|
-
|
|
140
|
-
spacing:
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
126
|
+
/*#__PURE__*/ _jsxs(Stack, {
|
|
127
|
+
direction: "row",
|
|
128
|
+
spacing: 1,
|
|
129
|
+
sx: {
|
|
130
|
+
marginLeft: 'auto'
|
|
131
|
+
},
|
|
132
|
+
children: [
|
|
133
|
+
/*#__PURE__*/ _jsx(Button, {
|
|
134
|
+
disabled: !validation.isValid,
|
|
135
|
+
variant: "contained",
|
|
136
|
+
onClick: ()=>{
|
|
137
|
+
onChange(getVariableDefinitionFromState(state));
|
|
138
|
+
},
|
|
139
|
+
children: "Update"
|
|
140
|
+
}),
|
|
141
|
+
/*#__PURE__*/ _jsx(Button, {
|
|
142
|
+
variant: "outlined",
|
|
143
|
+
onClick: ()=>{
|
|
144
|
+
onCancel();
|
|
145
|
+
},
|
|
146
|
+
children: "Cancel"
|
|
153
147
|
})
|
|
154
|
-
|
|
148
|
+
]
|
|
155
149
|
})
|
|
156
150
|
]
|
|
157
151
|
}),
|
|
158
|
-
|
|
152
|
+
/*#__PURE__*/ _jsxs(Box, {
|
|
153
|
+
padding: 2,
|
|
154
|
+
sx: {
|
|
155
|
+
overflowY: 'scroll'
|
|
156
|
+
},
|
|
159
157
|
children: [
|
|
160
|
-
/*#__PURE__*/ _jsx(
|
|
161
|
-
|
|
162
|
-
}),
|
|
163
|
-
/*#__PURE__*/ _jsx(Grid, {
|
|
164
|
-
container: true,
|
|
165
|
-
spacing: 2,
|
|
158
|
+
/*#__PURE__*/ _jsx(Typography, {
|
|
159
|
+
variant: "h3",
|
|
166
160
|
mb: 2,
|
|
167
|
-
children:
|
|
168
|
-
item: true,
|
|
169
|
-
xs: 6,
|
|
170
|
-
children: /*#__PURE__*/ _jsx(PluginEditor, {
|
|
171
|
-
width: 500,
|
|
172
|
-
pluginType: "Variable",
|
|
173
|
-
pluginKindLabel: "Source",
|
|
174
|
-
value: state.listVariableFields.plugin,
|
|
175
|
-
onChange: (val)=>{
|
|
176
|
-
setState((draft)=>{
|
|
177
|
-
draft.listVariableFields.plugin = val;
|
|
178
|
-
});
|
|
179
|
-
}
|
|
180
|
-
})
|
|
181
|
-
})
|
|
161
|
+
children: "Edit Variable"
|
|
182
162
|
}),
|
|
183
163
|
/*#__PURE__*/ _jsx(SectionHeader, {
|
|
184
|
-
children: "
|
|
164
|
+
children: "General"
|
|
185
165
|
}),
|
|
186
166
|
/*#__PURE__*/ _jsxs(Grid, {
|
|
187
167
|
container: true,
|
|
188
|
-
spacing:
|
|
189
|
-
mb:
|
|
168
|
+
spacing: 2,
|
|
169
|
+
mb: 2,
|
|
190
170
|
children: [
|
|
191
|
-
/*#__PURE__*/
|
|
171
|
+
/*#__PURE__*/ _jsx(Grid, {
|
|
172
|
+
item: true,
|
|
173
|
+
xs: 6,
|
|
174
|
+
children: /*#__PURE__*/ _jsx(TextField, {
|
|
175
|
+
required: true,
|
|
176
|
+
error: !!validation.name,
|
|
177
|
+
fullWidth: true,
|
|
178
|
+
label: "Name",
|
|
179
|
+
value: state.name,
|
|
180
|
+
helperText: validation.name,
|
|
181
|
+
onChange: (v)=>{
|
|
182
|
+
setState((draft)=>{
|
|
183
|
+
draft.name = v.target.value;
|
|
184
|
+
});
|
|
185
|
+
}
|
|
186
|
+
})
|
|
187
|
+
}),
|
|
188
|
+
/*#__PURE__*/ _jsx(Grid, {
|
|
189
|
+
item: true,
|
|
190
|
+
xs: 6,
|
|
191
|
+
children: /*#__PURE__*/ _jsxs(FormControl, {
|
|
192
|
+
fullWidth: true,
|
|
193
|
+
children: [
|
|
194
|
+
/*#__PURE__*/ _jsx(InputLabel, {
|
|
195
|
+
id: "variable-type-select-label",
|
|
196
|
+
children: "Type"
|
|
197
|
+
}),
|
|
198
|
+
/*#__PURE__*/ _jsx(Select, {
|
|
199
|
+
labelId: "variable-type-select-label",
|
|
200
|
+
id: "variable-type-select",
|
|
201
|
+
label: "Type",
|
|
202
|
+
value: state.kind,
|
|
203
|
+
onChange: (v)=>{
|
|
204
|
+
setState((draft)=>{
|
|
205
|
+
draft.kind = v.target.value;
|
|
206
|
+
});
|
|
207
|
+
},
|
|
208
|
+
children: VARIABLE_TYPES.map((v)=>/*#__PURE__*/ _jsx(MenuItem, {
|
|
209
|
+
value: v,
|
|
210
|
+
children: v
|
|
211
|
+
}, v))
|
|
212
|
+
})
|
|
213
|
+
]
|
|
214
|
+
})
|
|
215
|
+
}),
|
|
216
|
+
/*#__PURE__*/ _jsx(Grid, {
|
|
217
|
+
item: true,
|
|
218
|
+
xs: 6,
|
|
219
|
+
children: /*#__PURE__*/ _jsx(TextField, {
|
|
220
|
+
fullWidth: true,
|
|
221
|
+
label: "Label",
|
|
222
|
+
value: state.title,
|
|
223
|
+
onChange: (v)=>{
|
|
224
|
+
setState((draft)=>{
|
|
225
|
+
draft.title = v.target.value;
|
|
226
|
+
});
|
|
227
|
+
}
|
|
228
|
+
})
|
|
229
|
+
}),
|
|
230
|
+
/*#__PURE__*/ _jsx(Grid, {
|
|
192
231
|
item: true,
|
|
193
232
|
xs: 12,
|
|
194
|
-
children:
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
233
|
+
children: /*#__PURE__*/ _jsx(TextField, {
|
|
234
|
+
fullWidth: true,
|
|
235
|
+
label: "Description",
|
|
236
|
+
value: state.description,
|
|
237
|
+
onChange: (v)=>{
|
|
238
|
+
setState((draft)=>{
|
|
239
|
+
draft.description = v.target.value;
|
|
240
|
+
});
|
|
241
|
+
}
|
|
242
|
+
})
|
|
243
|
+
})
|
|
244
|
+
]
|
|
245
|
+
}),
|
|
246
|
+
state.kind === 'TextVariable' && /*#__PURE__*/ _jsxs(_Fragment, {
|
|
247
|
+
children: [
|
|
248
|
+
/*#__PURE__*/ _jsx(SectionHeader, {
|
|
249
|
+
children: "Text Options"
|
|
250
|
+
}),
|
|
251
|
+
/*#__PURE__*/ _jsx(Grid, {
|
|
252
|
+
container: true,
|
|
253
|
+
spacing: 2,
|
|
254
|
+
mb: 2,
|
|
255
|
+
children: /*#__PURE__*/ _jsx(Grid, {
|
|
256
|
+
item: true,
|
|
257
|
+
xs: 12,
|
|
258
|
+
children: /*#__PURE__*/ _jsx(TextField, {
|
|
259
|
+
label: "Value",
|
|
260
|
+
value: state.textVariableFields.value,
|
|
261
|
+
onChange: (v)=>{
|
|
199
262
|
setState((draft)=>{
|
|
200
|
-
draft.
|
|
263
|
+
draft.textVariableFields.value = v.target.value;
|
|
201
264
|
});
|
|
202
265
|
}
|
|
203
266
|
})
|
|
267
|
+
})
|
|
268
|
+
})
|
|
269
|
+
]
|
|
270
|
+
}),
|
|
271
|
+
state.kind === 'ListVariable' && /*#__PURE__*/ _jsxs(_Fragment, {
|
|
272
|
+
children: [
|
|
273
|
+
/*#__PURE__*/ _jsx(SectionHeader, {
|
|
274
|
+
children: "List Options"
|
|
275
|
+
}),
|
|
276
|
+
/*#__PURE__*/ _jsxs(Grid, {
|
|
277
|
+
container: true,
|
|
278
|
+
spacing: 2,
|
|
279
|
+
mb: 2,
|
|
280
|
+
children: [
|
|
281
|
+
/*#__PURE__*/ _jsxs(Grid, {
|
|
282
|
+
item: true,
|
|
283
|
+
xs: 6,
|
|
284
|
+
children: [
|
|
285
|
+
/*#__PURE__*/ _jsx(ClickAwayListener, {
|
|
286
|
+
onClickAway: ()=>refreshPreview(),
|
|
287
|
+
children: /*#__PURE__*/ _jsx(Box, {})
|
|
288
|
+
}),
|
|
289
|
+
/*#__PURE__*/ _jsx(PluginEditor, {
|
|
290
|
+
width: 500,
|
|
291
|
+
pluginType: "Variable",
|
|
292
|
+
pluginKindLabel: "Source",
|
|
293
|
+
value: state.listVariableFields.plugin,
|
|
294
|
+
onChange: (val)=>{
|
|
295
|
+
setState((draft)=>{
|
|
296
|
+
draft.listVariableFields.plugin = val;
|
|
297
|
+
});
|
|
298
|
+
}
|
|
299
|
+
})
|
|
300
|
+
]
|
|
301
|
+
}),
|
|
302
|
+
/*#__PURE__*/ _jsx(Grid, {
|
|
303
|
+
item: true,
|
|
304
|
+
xs: 12,
|
|
305
|
+
children: /*#__PURE__*/ _jsxs(ErrorBoundary, {
|
|
306
|
+
FallbackComponent: ()=>/*#__PURE__*/ _jsx("div", {
|
|
307
|
+
children: "Error"
|
|
308
|
+
}),
|
|
309
|
+
children: [
|
|
310
|
+
/*#__PURE__*/ _jsxs(Stack, {
|
|
311
|
+
direction: 'row',
|
|
312
|
+
spacing: 1,
|
|
313
|
+
alignItems: "center",
|
|
314
|
+
children: [
|
|
315
|
+
/*#__PURE__*/ _jsx(Typography, {
|
|
316
|
+
variant: "caption",
|
|
317
|
+
children: "Preview Values"
|
|
318
|
+
}),
|
|
319
|
+
/*#__PURE__*/ _jsx(IconButton, {
|
|
320
|
+
onClick: refreshPreview,
|
|
321
|
+
size: "small",
|
|
322
|
+
children: /*#__PURE__*/ _jsx(Refresh, {})
|
|
323
|
+
})
|
|
324
|
+
]
|
|
325
|
+
}),
|
|
326
|
+
/*#__PURE__*/ _jsx(VariableListPreview, {
|
|
327
|
+
definition: previewSpec
|
|
328
|
+
})
|
|
329
|
+
]
|
|
330
|
+
})
|
|
331
|
+
})
|
|
204
332
|
]
|
|
205
333
|
}),
|
|
334
|
+
/*#__PURE__*/ _jsx(SectionHeader, {
|
|
335
|
+
children: "Dropdown Options"
|
|
336
|
+
}),
|
|
206
337
|
/*#__PURE__*/ _jsxs(Grid, {
|
|
207
|
-
|
|
208
|
-
|
|
338
|
+
container: true,
|
|
339
|
+
spacing: 1,
|
|
340
|
+
mb: 1,
|
|
209
341
|
children: [
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
342
|
+
/*#__PURE__*/ _jsxs(Grid, {
|
|
343
|
+
item: true,
|
|
344
|
+
xs: 12,
|
|
345
|
+
children: [
|
|
346
|
+
"Allow Multiple",
|
|
347
|
+
/*#__PURE__*/ _jsx(Switch, {
|
|
348
|
+
checked: state.listVariableFields.allowMultiple,
|
|
349
|
+
onChange: (e)=>{
|
|
350
|
+
setState((draft)=>{
|
|
351
|
+
draft.listVariableFields.allowMultiple = e.target.checked;
|
|
352
|
+
});
|
|
353
|
+
}
|
|
354
|
+
})
|
|
355
|
+
]
|
|
356
|
+
}),
|
|
357
|
+
/*#__PURE__*/ _jsxs(Grid, {
|
|
358
|
+
item: true,
|
|
359
|
+
xs: 12,
|
|
360
|
+
children: [
|
|
361
|
+
"Allow All",
|
|
362
|
+
/*#__PURE__*/ _jsx(Switch, {
|
|
363
|
+
checked: state.listVariableFields.allowAll,
|
|
364
|
+
onChange: (e)=>{
|
|
365
|
+
setState((draft)=>{
|
|
366
|
+
draft.listVariableFields.allowAll = e.target.checked;
|
|
367
|
+
});
|
|
368
|
+
}
|
|
369
|
+
})
|
|
370
|
+
]
|
|
218
371
|
})
|
|
219
372
|
]
|
|
220
373
|
})
|
|
221
374
|
]
|
|
222
375
|
})
|
|
223
376
|
]
|
|
224
|
-
}),
|
|
225
|
-
/*#__PURE__*/ _jsxs(Stack, {
|
|
226
|
-
direction: 'row',
|
|
227
|
-
spacing: 2,
|
|
228
|
-
justifyContent: "end",
|
|
229
|
-
children: [
|
|
230
|
-
/*#__PURE__*/ _jsx(Button, {
|
|
231
|
-
disabled: !validation.isValid,
|
|
232
|
-
variant: "contained",
|
|
233
|
-
onClick: ()=>{
|
|
234
|
-
onChange(getVariableDefinitionFromState(state));
|
|
235
|
-
},
|
|
236
|
-
children: "Update"
|
|
237
|
-
}),
|
|
238
|
-
/*#__PURE__*/ _jsx(Button, {
|
|
239
|
-
variant: "outlined",
|
|
240
|
-
onClick: ()=>{
|
|
241
|
-
onCancel();
|
|
242
|
-
},
|
|
243
|
-
children: "Cancel"
|
|
244
|
-
})
|
|
245
|
-
]
|
|
246
377
|
})
|
|
247
378
|
]
|
|
248
379
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/VariableEditorForm.tsx"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport React, { useMemo } from 'react';\nimport {\n Box,\n Typography,\n Switch,\n TextField,\n Grid,\n FormControl,\n InputLabel,\n MenuItem,\n Select,\n Button,\n Stack,\n} from '@mui/material';\nimport { useImmer } from 'use-immer';\nimport { PluginEditor } from '@perses-dev/plugin-system';\nimport { VariableDefinition } from '@perses-dev/core';\nimport { VariableEditorState, getVariableDefinitionFromState, getInitialState } from './variable-editor-form-model';\n\nconst VARIABLE_TYPES = ['ListVariable', 'TextVariable'] as const;\n\n// TODO: Replace with proper validation library\nfunction getValidation(state: ReturnType<typeof getInitialState>) {\n /** Name validation */\n let name = null;\n if (!state.name) {\n name = 'Name is required';\n }\n // name can only contain alphanumeric characters and underscores and no spaces\n if (state.name && !/^[a-zA-Z0-9_-]+$/.test(state.name)) {\n name = 'Name can only contain alphanumeric characters, underscores, and dashes';\n }\n\n return {\n name,\n isValid: !name,\n };\n}\n\nconst SectionHeader = ({ children }: React.PropsWithChildren) => (\n <Typography pb={2} variant=\"subtitle1\">\n {children}\n </Typography>\n);\n\nexport function VariableEditForm({\n initialVariableDefinition,\n onChange,\n onCancel,\n}: {\n initialVariableDefinition: VariableDefinition;\n onChange: (def: VariableDefinition) => void;\n onCancel: () => void;\n}) {\n const [state, setState] = useImmer(getInitialState(initialVariableDefinition));\n const validation = useMemo(() => getValidation(state), [state]);\n\n return (\n <Box>\n <SectionHeader>General</SectionHeader>\n <Grid container spacing={2} mb={2}>\n <Grid item xs={6}>\n <TextField\n required\n error={!!validation.name}\n fullWidth\n label=\"Name\"\n value={state.name}\n helperText={validation.name}\n onChange={(v) => {\n setState((draft) => {\n draft.name = v.target.value as string;\n });\n }}\n />\n </Grid>\n <Grid item xs={6}>\n <FormControl fullWidth>\n <InputLabel id=\"variable-type-select-label\">Type</InputLabel>\n <Select\n labelId=\"variable-type-select-label\"\n id=\"variable-type-select\"\n label=\"Type\"\n value={state.kind}\n onChange={(v) => {\n setState((draft) => {\n draft.kind = v.target.value as VariableEditorState['kind'];\n });\n }}\n >\n {VARIABLE_TYPES.map((v) => (\n <MenuItem key={v} value={v}>\n {v}\n </MenuItem>\n ))}\n </Select>\n </FormControl>\n </Grid>\n <Grid item xs={6}>\n <TextField\n fullWidth\n label=\"Label\"\n value={state.title}\n onChange={(v) => {\n setState((draft) => {\n draft.title = v.target.value;\n });\n }}\n />\n </Grid>\n <Grid item xs={12}>\n <TextField\n fullWidth\n label=\"Description\"\n value={state.description}\n onChange={(v) => {\n setState((draft) => {\n draft.description = v.target.value;\n });\n }}\n />\n </Grid>\n </Grid>\n\n {state.kind === 'TextVariable' && (\n <>\n <SectionHeader>Text Options</SectionHeader>\n <Grid container spacing={2} mb={2}>\n <Grid item xs={12}>\n <TextField\n label=\"Value\"\n value={state.textVariableFields.value}\n onChange={(v) => {\n setState((draft) => {\n draft.textVariableFields.value = v.target.value;\n });\n }}\n />\n </Grid>\n </Grid>\n </>\n )}\n\n {state.kind === 'ListVariable' && (\n <>\n <SectionHeader>List Options</SectionHeader>\n <Grid container spacing={2} mb={2}>\n <Grid item xs={6}>\n <PluginEditor\n width={500}\n pluginType=\"Variable\"\n pluginKindLabel=\"Source\"\n value={state.listVariableFields.plugin}\n onChange={(val) => {\n setState((draft) => {\n draft.listVariableFields.plugin = val;\n });\n }}\n />\n </Grid>\n </Grid>\n\n <SectionHeader>Dropdown Options</SectionHeader>\n <Grid container spacing={1} mb={1}>\n <Grid item xs={12}>\n Allow Multiple\n <Switch\n checked={state.listVariableFields.allowMultiple}\n onChange={(e) => {\n setState((draft) => {\n draft.listVariableFields.allowMultiple = e.target.checked;\n });\n }}\n />\n </Grid>\n <Grid item xs={12}>\n Allow All\n <Switch\n checked={state.listVariableFields.allowAll}\n onChange={(e) => {\n setState((draft) => {\n draft.listVariableFields.allowAll = e.target.checked;\n });\n }}\n />\n </Grid>\n </Grid>\n </>\n )}\n\n <Stack direction={'row'} spacing={2} justifyContent=\"end\">\n <Button\n disabled={!validation.isValid}\n variant=\"contained\"\n onClick={() => {\n onChange(getVariableDefinitionFromState(state));\n }}\n >\n Update\n </Button>\n <Button\n variant=\"outlined\"\n onClick={() => {\n onCancel();\n }}\n >\n Cancel\n </Button>\n </Stack>\n </Box>\n );\n}\n"],"names":["React","useMemo","Box","Typography","Switch","TextField","Grid","FormControl","InputLabel","MenuItem","Select","Button","Stack","useImmer","PluginEditor","getVariableDefinitionFromState","getInitialState","VARIABLE_TYPES","getValidation","state","name","test","isValid","SectionHeader","children","pb","variant","VariableEditForm","initialVariableDefinition","onChange","onCancel","setState","validation","container","spacing","mb","item","xs","required","error","fullWidth","label","value","helperText","v","draft","target","id","labelId","kind","map","title","description","textVariableFields","width","pluginType","pluginKindLabel","listVariableFields","plugin","val","checked","allowMultiple","e","allowAll","direction","justifyContent","disabled","onClick"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/VariableEditorForm.tsx"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport React, { useMemo, useState } from 'react';\nimport {\n Box,\n Typography,\n Switch,\n TextField,\n Grid,\n FormControl,\n InputLabel,\n MenuItem,\n Select,\n Button,\n Stack,\n Alert,\n Chip,\n IconButton,\n ClickAwayListener,\n} from '@mui/material';\nimport { useImmer } from 'use-immer';\nimport { PluginEditor } from '@perses-dev/plugin-system';\nimport { VariableDefinition, ListVariableDefinition } from '@perses-dev/core';\nimport { ErrorBoundary } from '@perses-dev/components';\nimport Refresh from 'mdi-material-ui/Refresh';\n\nimport { useListVariablePluginValues } from '../variable-model';\nimport { VariableEditorState, getVariableDefinitionFromState, getInitialState } from './variable-editor-form-model';\n\nconst VARIABLE_TYPES = ['ListVariable', 'TextVariable'] as const;\nconst DEFAULT_MAX_PREVIEW_VALUES = 50;\n\n// TODO: Replace with proper validation library\nfunction getValidation(state: ReturnType<typeof getInitialState>) {\n /** Name validation */\n let name = null;\n if (!state.name) {\n name = 'Name is required';\n }\n // name can only contain alphanumeric characters and underscores and no spaces\n if (state.name && !/^[a-zA-Z0-9_-]+$/.test(state.name)) {\n name = 'Name can only contain alphanumeric characters, underscores, and dashes';\n }\n\n return {\n name,\n isValid: !name,\n };\n}\n\nconst SectionHeader = ({ children }: React.PropsWithChildren) => (\n <Typography pb={2} variant=\"subtitle1\">\n {children}\n </Typography>\n);\n\nfunction VariableListPreview({ definition }: { definition: ListVariableDefinition }) {\n const { data, isFetching, error } = useListVariablePluginValues(definition);\n const [maxValues, setMaxValues] = useState<number | undefined>(DEFAULT_MAX_PREVIEW_VALUES);\n const showAll = () => {\n setMaxValues(undefined);\n };\n let notShown = 0;\n\n if (data && data?.length > 0 && maxValues) {\n notShown = data.length - maxValues;\n }\n const errorMessage = (error as Error)?.message;\n\n return (\n <Box>\n {errorMessage && <Alert severity=\"error\">{errorMessage}</Alert>}\n {isFetching && 'Loading...'}\n {data?.length === 0 && <Alert severity=\"info\">No results</Alert>}\n <>\n {data?.slice(0, maxValues).map((val) => (\n <Chip sx={{ mr: 1, mb: 1 }} size=\"small\" key={val.value} label={val.label} />\n ))}\n {notShown > 0 && (\n <Chip onClick={showAll} variant=\"outlined\" sx={{ mr: 1, mb: 1 }} size=\"small\" label={`+${notShown} more`} />\n )}\n </>\n </Box>\n );\n}\n\nexport function VariableEditForm({\n initialVariableDefinition,\n onChange,\n onCancel,\n}: {\n initialVariableDefinition: VariableDefinition;\n onChange: (def: VariableDefinition) => void;\n onCancel: () => void;\n}) {\n const [state, setState] = useImmer(getInitialState(initialVariableDefinition));\n const validation = useMemo(() => getValidation(state), [state]);\n\n const [previewKey, setPreviewKey] = React.useState(0);\n\n const refreshPreview = () => {\n setPreviewKey((prev) => prev + 1);\n };\n\n /** We use the `previewKey` that we increment to know when to explicity update the\n * spec that will be used for preview. The reason why we do this is to avoid\n * having to re-fetch the values when the user is still editing the spec.\n */\n const previewSpec = useMemo(() => {\n return getVariableDefinitionFromState(state) as ListVariableDefinition;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [previewKey]);\n\n return (\n <>\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n padding: (theme) => theme.spacing(1, 2),\n borderBottom: (theme) => `1px solid ${theme.palette.grey[100]}`,\n }}\n >\n <Typography variant=\"h2\">Template Variables / Edit Variable</Typography>\n <Stack direction=\"row\" spacing={1} sx={{ marginLeft: 'auto' }}>\n <Button\n disabled={!validation.isValid}\n variant=\"contained\"\n onClick={() => {\n onChange(getVariableDefinitionFromState(state));\n }}\n >\n Update\n </Button>\n <Button\n variant=\"outlined\"\n onClick={() => {\n onCancel();\n }}\n >\n Cancel\n </Button>\n </Stack>\n </Box>\n <Box padding={2} sx={{ overflowY: 'scroll' }}>\n <Typography variant=\"h3\" mb={2}>\n Edit Variable\n </Typography>\n <SectionHeader>General</SectionHeader>\n <Grid container spacing={2} mb={2}>\n <Grid item xs={6}>\n <TextField\n required\n error={!!validation.name}\n fullWidth\n label=\"Name\"\n value={state.name}\n helperText={validation.name}\n onChange={(v) => {\n setState((draft) => {\n draft.name = v.target.value as string;\n });\n }}\n />\n </Grid>\n <Grid item xs={6}>\n <FormControl fullWidth>\n <InputLabel id=\"variable-type-select-label\">Type</InputLabel>\n <Select\n labelId=\"variable-type-select-label\"\n id=\"variable-type-select\"\n label=\"Type\"\n value={state.kind}\n onChange={(v) => {\n setState((draft) => {\n draft.kind = v.target.value as VariableEditorState['kind'];\n });\n }}\n >\n {VARIABLE_TYPES.map((v) => (\n <MenuItem key={v} value={v}>\n {v}\n </MenuItem>\n ))}\n </Select>\n </FormControl>\n </Grid>\n <Grid item xs={6}>\n <TextField\n fullWidth\n label=\"Label\"\n value={state.title}\n onChange={(v) => {\n setState((draft) => {\n draft.title = v.target.value;\n });\n }}\n />\n </Grid>\n <Grid item xs={12}>\n <TextField\n fullWidth\n label=\"Description\"\n value={state.description}\n onChange={(v) => {\n setState((draft) => {\n draft.description = v.target.value;\n });\n }}\n />\n </Grid>\n </Grid>\n\n {state.kind === 'TextVariable' && (\n <>\n <SectionHeader>Text Options</SectionHeader>\n <Grid container spacing={2} mb={2}>\n <Grid item xs={12}>\n <TextField\n label=\"Value\"\n value={state.textVariableFields.value}\n onChange={(v) => {\n setState((draft) => {\n draft.textVariableFields.value = v.target.value;\n });\n }}\n />\n </Grid>\n </Grid>\n </>\n )}\n\n {state.kind === 'ListVariable' && (\n <>\n <SectionHeader>List Options</SectionHeader>\n <Grid container spacing={2} mb={2}>\n <Grid item xs={6}>\n {/** Hack?: Cool technique to refresh the preview to simulate onBlur event */}\n <ClickAwayListener onClickAway={() => refreshPreview()}>\n <Box />\n </ClickAwayListener>\n {/** */}\n <PluginEditor\n width={500}\n pluginType=\"Variable\"\n pluginKindLabel=\"Source\"\n value={state.listVariableFields.plugin}\n onChange={(val) => {\n setState((draft) => {\n draft.listVariableFields.plugin = val;\n });\n }}\n />\n </Grid>\n <Grid item xs={12}>\n <ErrorBoundary FallbackComponent={() => <div>Error</div>}>\n <Stack direction={'row'} spacing={1} alignItems=\"center\">\n <Typography variant=\"caption\">Preview Values</Typography>\n <IconButton onClick={refreshPreview} size=\"small\">\n <Refresh />\n </IconButton>\n </Stack>\n <VariableListPreview definition={previewSpec} />\n </ErrorBoundary>\n </Grid>\n </Grid>\n\n <SectionHeader>Dropdown Options</SectionHeader>\n <Grid container spacing={1} mb={1}>\n <Grid item xs={12}>\n Allow Multiple\n <Switch\n checked={state.listVariableFields.allowMultiple}\n onChange={(e) => {\n setState((draft) => {\n draft.listVariableFields.allowMultiple = e.target.checked;\n });\n }}\n />\n </Grid>\n <Grid item xs={12}>\n Allow All\n <Switch\n checked={state.listVariableFields.allowAll}\n onChange={(e) => {\n setState((draft) => {\n draft.listVariableFields.allowAll = e.target.checked;\n });\n }}\n />\n </Grid>\n </Grid>\n </>\n )}\n </Box>\n </>\n );\n}\n"],"names":["React","useMemo","useState","Box","Typography","Switch","TextField","Grid","FormControl","InputLabel","MenuItem","Select","Button","Stack","Alert","Chip","IconButton","ClickAwayListener","useImmer","PluginEditor","ErrorBoundary","Refresh","useListVariablePluginValues","getVariableDefinitionFromState","getInitialState","VARIABLE_TYPES","DEFAULT_MAX_PREVIEW_VALUES","getValidation","state","name","test","isValid","SectionHeader","children","pb","variant","VariableListPreview","definition","data","isFetching","error","maxValues","setMaxValues","showAll","undefined","notShown","length","errorMessage","message","severity","slice","map","val","sx","mr","mb","size","label","value","onClick","VariableEditForm","initialVariableDefinition","onChange","onCancel","setState","validation","previewKey","setPreviewKey","refreshPreview","prev","previewSpec","display","alignItems","padding","theme","spacing","borderBottom","palette","grey","direction","marginLeft","disabled","overflowY","container","item","xs","required","fullWidth","helperText","v","draft","target","id","labelId","kind","title","description","textVariableFields","onClickAway","width","pluginType","pluginKindLabel","listVariableFields","plugin","FallbackComponent","div","checked","allowMultiple","e","allowAll"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,OAAOA,KAAK,IAAIC,OAAO,EAAEC,QAAQ,QAAQ,OAAO,CAAC;AACjD,SACEC,GAAG,EACHC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,IAAI,EACJC,WAAW,EACXC,UAAU,EACVC,QAAQ,EACRC,MAAM,EACNC,MAAM,EACNC,KAAK,EACLC,KAAK,EACLC,IAAI,EACJC,UAAU,EACVC,iBAAiB,QACZ,eAAe,CAAC;AACvB,SAASC,QAAQ,QAAQ,WAAW,CAAC;AACrC,SAASC,YAAY,QAAQ,2BAA2B,CAAC;AAEzD,SAASC,aAAa,QAAQ,wBAAwB,CAAC;AACvD,OAAOC,OAAO,MAAM,yBAAyB,CAAC;AAE9C,SAASC,2BAA2B,QAAQ,mBAAmB,CAAC;AAChE,SAA8BC,8BAA8B,EAAEC,eAAe,QAAQ,8BAA8B,CAAC;AAEpH,MAAMC,cAAc,GAAG;IAAC,cAAc;IAAE,cAAc;CAAC,AAAS,AAAC;AACjE,MAAMC,0BAA0B,GAAG,EAAE,AAAC;AAEtC,+CAA+C;AAC/C,SAASC,aAAa,CAACC,KAAyC,EAAE;IAChE,oBAAoB,GACpB,IAAIC,IAAI,GAAG,IAAI,AAAC;IAChB,IAAI,CAACD,KAAK,CAACC,IAAI,EAAE;QACfA,IAAI,GAAG,kBAAkB,CAAC;IAC5B,CAAC;IACD,8EAA8E;IAC9E,IAAID,KAAK,CAACC,IAAI,IAAI,CAAC,mBAAmBC,IAAI,CAACF,KAAK,CAACC,IAAI,CAAC,EAAE;QACtDA,IAAI,GAAG,wEAAwE,CAAC;IAClF,CAAC;IAED,OAAO;QACLA,IAAI;QACJE,OAAO,EAAE,CAACF,IAAI;KACf,CAAC;AACJ,CAAC;AAED,MAAMG,aAAa,GAAG,CAAC,EAAEC,QAAQ,CAAA,EAA2B,iBAC1D,KAAC7B,UAAU;QAAC8B,EAAE,EAAE,CAAC;QAAEC,OAAO,EAAC,WAAW;kBACnCF,QAAQ;MACE,AACd,AAAC;AAEF,SAASG,mBAAmB,CAAC,EAAEC,UAAU,CAAA,EAA0C,EAAE;IACnF,MAAM,EAAEC,IAAI,CAAA,EAAEC,UAAU,CAAA,EAAEC,KAAK,CAAA,EAAE,GAAGlB,2BAA2B,CAACe,UAAU,CAAC,AAAC;IAC5E,MAAM,CAACI,SAAS,EAAEC,YAAY,CAAC,GAAGxC,QAAQ,CAAqBwB,0BAA0B,CAAC,AAAC;IAC3F,MAAMiB,OAAO,GAAG,IAAM;QACpBD,YAAY,CAACE,SAAS,CAAC,CAAC;IAC1B,CAAC,AAAC;IACF,IAAIC,QAAQ,GAAG,CAAC,AAAC;IAEjB,IAAIP,IAAI,IAAIA,CAAAA,IAAI,aAAJA,IAAI,WAAQ,GAAZA,KAAAA,CAAY,GAAZA,IAAI,CAAEQ,MAAM,CAAA,GAAG,CAAC,IAAIL,SAAS,EAAE;QACzCI,QAAQ,GAAGP,IAAI,CAACQ,MAAM,GAAGL,SAAS,CAAC;IACrC,CAAC;IACD,MAAMM,YAAY,GAAG,AAACP,KAAK,aAALA,KAAK,WAAmB,GAAzB,KAAA,CAAyB,GAAzB,AAACA,KAAK,CAAYQ,OAAO,AAAC;IAE/C,qBACE,MAAC7C,GAAG;;YACD4C,YAAY,kBAAI,KAACjC,KAAK;gBAACmC,QAAQ,EAAC,OAAO;0BAAEF,YAAY;cAAS;YAC9DR,UAAU,IAAI,YAAY;YAC1BD,CAAAA,IAAI,aAAJA,IAAI,WAAQ,GAAZA,KAAAA,CAAY,GAAZA,IAAI,CAAEQ,MAAM,CAAA,KAAK,CAAC,kBAAI,KAAChC,KAAK;gBAACmC,QAAQ,EAAC,MAAM;0BAAC,YAAU;cAAQ;0BAChE;;oBACGX,IAAI,aAAJA,IAAI,WAAO,GAAXA,KAAAA,CAAW,GAAXA,IAAI,CAAEY,KAAK,CAAC,CAAC,EAAET,SAAS,CAAC,CAACU,GAAG,CAAC,CAACC,GAAG,iBACjC,KAACrC,IAAI;4BAACsC,EAAE,EAAE;gCAAEC,EAAE,EAAE,CAAC;gCAAEC,EAAE,EAAE,CAAC;6BAAE;4BAAEC,IAAI,EAAC,OAAO;4BAAiBC,KAAK,EAAEL,GAAG,CAACK,KAAK;2BAA3BL,GAAG,CAACM,KAAK,CAAsB,AAC9E,CAAC;oBACDb,QAAQ,GAAG,CAAC,kBACX,KAAC9B,IAAI;wBAAC4C,OAAO,EAAEhB,OAAO;wBAAER,OAAO,EAAC,UAAU;wBAACkB,EAAE,EAAE;4BAAEC,EAAE,EAAE,CAAC;4BAAEC,EAAE,EAAE,CAAC;yBAAE;wBAAEC,IAAI,EAAC,OAAO;wBAACC,KAAK,EAAE,CAAC,CAAC,EAAEZ,QAAQ,CAAC,KAAK,CAAC;sBAAI,AAC7G;;cACA;;MACC,CACN;AACJ,CAAC;AAED,OAAO,SAASe,gBAAgB,CAAC,EAC/BC,yBAAyB,CAAA,EACzBC,QAAQ,CAAA,EACRC,QAAQ,CAAA,EAKT,EAAE;IACD,MAAM,CAACnC,KAAK,EAAEoC,QAAQ,CAAC,GAAG9C,QAAQ,CAACM,eAAe,CAACqC,yBAAyB,CAAC,CAAC,AAAC;IAC/E,MAAMI,UAAU,GAAGhE,OAAO,CAAC,IAAM0B,aAAa,CAACC,KAAK,CAAC,EAAE;QAACA,KAAK;KAAC,CAAC,AAAC;IAEhE,MAAM,CAACsC,UAAU,EAAEC,aAAa,CAAC,GAAGnE,KAAK,CAACE,QAAQ,CAAC,CAAC,CAAC,AAAC;IAEtD,MAAMkE,cAAc,GAAG,IAAM;QAC3BD,aAAa,CAAC,CAACE,IAAI,GAAKA,IAAI,GAAG,CAAC,CAAC,CAAC;IACpC,CAAC,AAAC;IAEF;;;GAGC,GACD,MAAMC,WAAW,GAAGrE,OAAO,CAAC,IAAM;QAChC,OAAOsB,8BAA8B,CAACK,KAAK,CAAC,CAA2B;IACvE,uDAAuD;IACzD,CAAC,EAAE;QAACsC,UAAU;KAAC,CAAC,AAAC;IAEjB,qBACE;;0BACE,MAAC/D,GAAG;gBACFkD,EAAE,EAAE;oBACFkB,OAAO,EAAE,MAAM;oBACfC,UAAU,EAAE,QAAQ;oBACpBC,OAAO,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;oBACvCC,YAAY,EAAE,CAACF,KAAK,GAAK,CAAC,UAAU,EAAEA,KAAK,CAACG,OAAO,CAACC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;iBAChE;;kCAED,KAAC1E,UAAU;wBAAC+B,OAAO,EAAC,IAAI;kCAAC,oCAAkC;sBAAa;kCACxE,MAACtB,KAAK;wBAACkE,SAAS,EAAC,KAAK;wBAACJ,OAAO,EAAE,CAAC;wBAAEtB,EAAE,EAAE;4BAAE2B,UAAU,EAAE,MAAM;yBAAE;;0CAC3D,KAACpE,MAAM;gCACLqE,QAAQ,EAAE,CAAChB,UAAU,CAAClC,OAAO;gCAC7BI,OAAO,EAAC,WAAW;gCACnBwB,OAAO,EAAE,IAAM;oCACbG,QAAQ,CAACvC,8BAA8B,CAACK,KAAK,CAAC,CAAC,CAAC;gCAClD,CAAC;0CACF,QAED;8BAAS;0CACT,KAAChB,MAAM;gCACLuB,OAAO,EAAC,UAAU;gCAClBwB,OAAO,EAAE,IAAM;oCACbI,QAAQ,EAAE,CAAC;gCACb,CAAC;0CACF,QAED;8BAAS;;sBACH;;cACJ;0BACN,MAAC5D,GAAG;gBAACsE,OAAO,EAAE,CAAC;gBAAEpB,EAAE,EAAE;oBAAE6B,SAAS,EAAE,QAAQ;iBAAE;;kCAC1C,KAAC9E,UAAU;wBAAC+B,OAAO,EAAC,IAAI;wBAACoB,EAAE,EAAE,CAAC;kCAAE,eAEhC;sBAAa;kCACb,KAACvB,aAAa;kCAAC,SAAO;sBAAgB;kCACtC,MAACzB,IAAI;wBAAC4E,SAAS;wBAACR,OAAO,EAAE,CAAC;wBAAEpB,EAAE,EAAE,CAAC;;0CAC/B,KAAChD,IAAI;gCAAC6E,IAAI;gCAACC,EAAE,EAAE,CAAC;0CACd,cAAA,KAAC/E,SAAS;oCACRgF,QAAQ;oCACR9C,KAAK,EAAE,CAAC,CAACyB,UAAU,CAACpC,IAAI;oCACxB0D,SAAS;oCACT9B,KAAK,EAAC,MAAM;oCACZC,KAAK,EAAE9B,KAAK,CAACC,IAAI;oCACjB2D,UAAU,EAAEvB,UAAU,CAACpC,IAAI;oCAC3BiC,QAAQ,EAAE,CAAC2B,CAAC,GAAK;wCACfzB,QAAQ,CAAC,CAAC0B,KAAK,GAAK;4CAClBA,KAAK,CAAC7D,IAAI,GAAG4D,CAAC,CAACE,MAAM,CAACjC,KAAK,AAAU,CAAC;wCACxC,CAAC,CAAC,CAAC;oCACL,CAAC;kCACD;8BACG;0CACP,KAACnD,IAAI;gCAAC6E,IAAI;gCAACC,EAAE,EAAE,CAAC;0CACd,cAAA,MAAC7E,WAAW;oCAAC+E,SAAS;;sDACpB,KAAC9E,UAAU;4CAACmF,EAAE,EAAC,4BAA4B;sDAAC,MAAI;0CAAa;sDAC7D,KAACjF,MAAM;4CACLkF,OAAO,EAAC,4BAA4B;4CACpCD,EAAE,EAAC,sBAAsB;4CACzBnC,KAAK,EAAC,MAAM;4CACZC,KAAK,EAAE9B,KAAK,CAACkE,IAAI;4CACjBhC,QAAQ,EAAE,CAAC2B,CAAC,GAAK;gDACfzB,QAAQ,CAAC,CAAC0B,KAAK,GAAK;oDAClBA,KAAK,CAACI,IAAI,GAAGL,CAAC,CAACE,MAAM,CAACjC,KAAK,AAA+B,CAAC;gDAC7D,CAAC,CAAC,CAAC;4CACL,CAAC;sDAEAjC,cAAc,CAAC0B,GAAG,CAAC,CAACsC,CAAC,iBACpB,KAAC/E,QAAQ;oDAASgD,KAAK,EAAE+B,CAAC;8DACvBA,CAAC;mDADWA,CAAC,CAEL,AACZ,CAAC;0CACK;;kCACG;8BACT;0CACP,KAAClF,IAAI;gCAAC6E,IAAI;gCAACC,EAAE,EAAE,CAAC;0CACd,cAAA,KAAC/E,SAAS;oCACRiF,SAAS;oCACT9B,KAAK,EAAC,OAAO;oCACbC,KAAK,EAAE9B,KAAK,CAACmE,KAAK;oCAClBjC,QAAQ,EAAE,CAAC2B,CAAC,GAAK;wCACfzB,QAAQ,CAAC,CAAC0B,KAAK,GAAK;4CAClBA,KAAK,CAACK,KAAK,GAAGN,CAAC,CAACE,MAAM,CAACjC,KAAK,CAAC;wCAC/B,CAAC,CAAC,CAAC;oCACL,CAAC;kCACD;8BACG;0CACP,KAACnD,IAAI;gCAAC6E,IAAI;gCAACC,EAAE,EAAE,EAAE;0CACf,cAAA,KAAC/E,SAAS;oCACRiF,SAAS;oCACT9B,KAAK,EAAC,aAAa;oCACnBC,KAAK,EAAE9B,KAAK,CAACoE,WAAW;oCACxBlC,QAAQ,EAAE,CAAC2B,CAAC,GAAK;wCACfzB,QAAQ,CAAC,CAAC0B,KAAK,GAAK;4CAClBA,KAAK,CAACM,WAAW,GAAGP,CAAC,CAACE,MAAM,CAACjC,KAAK,CAAC;wCACrC,CAAC,CAAC,CAAC;oCACL,CAAC;kCACD;8BACG;;sBACF;oBAEN9B,KAAK,CAACkE,IAAI,KAAK,cAAc,kBAC5B;;0CACE,KAAC9D,aAAa;0CAAC,cAAY;8BAAgB;0CAC3C,KAACzB,IAAI;gCAAC4E,SAAS;gCAACR,OAAO,EAAE,CAAC;gCAAEpB,EAAE,EAAE,CAAC;0CAC/B,cAAA,KAAChD,IAAI;oCAAC6E,IAAI;oCAACC,EAAE,EAAE,EAAE;8CACf,cAAA,KAAC/E,SAAS;wCACRmD,KAAK,EAAC,OAAO;wCACbC,KAAK,EAAE9B,KAAK,CAACqE,kBAAkB,CAACvC,KAAK;wCACrCI,QAAQ,EAAE,CAAC2B,CAAC,GAAK;4CACfzB,QAAQ,CAAC,CAAC0B,KAAK,GAAK;gDAClBA,KAAK,CAACO,kBAAkB,CAACvC,KAAK,GAAG+B,CAAC,CAACE,MAAM,CAACjC,KAAK,CAAC;4CAClD,CAAC,CAAC,CAAC;wCACL,CAAC;sCACD;kCACG;8BACF;;sBACN,AACJ;oBAEA9B,KAAK,CAACkE,IAAI,KAAK,cAAc,kBAC5B;;0CACE,KAAC9D,aAAa;0CAAC,cAAY;8BAAgB;0CAC3C,MAACzB,IAAI;gCAAC4E,SAAS;gCAACR,OAAO,EAAE,CAAC;gCAAEpB,EAAE,EAAE,CAAC;;kDAC/B,MAAChD,IAAI;wCAAC6E,IAAI;wCAACC,EAAE,EAAE,CAAC;;0DAEd,KAACpE,iBAAiB;gDAACiF,WAAW,EAAE,IAAM9B,cAAc,EAAE;0DACpD,cAAA,KAACjE,GAAG,KAAG;8CACW;0DAEpB,KAACgB,YAAY;gDACXgF,KAAK,EAAE,GAAG;gDACVC,UAAU,EAAC,UAAU;gDACrBC,eAAe,EAAC,QAAQ;gDACxB3C,KAAK,EAAE9B,KAAK,CAAC0E,kBAAkB,CAACC,MAAM;gDACtCzC,QAAQ,EAAE,CAACV,GAAG,GAAK;oDACjBY,QAAQ,CAAC,CAAC0B,KAAK,GAAK;wDAClBA,KAAK,CAACY,kBAAkB,CAACC,MAAM,GAAGnD,GAAG,CAAC;oDACxC,CAAC,CAAC,CAAC;gDACL,CAAC;8CACD;;sCACG;kDACP,KAAC7C,IAAI;wCAAC6E,IAAI;wCAACC,EAAE,EAAE,EAAE;kDACf,cAAA,MAACjE,aAAa;4CAACoF,iBAAiB,EAAE,kBAAM,KAACC,KAAG;8DAAC,OAAK;kDAAM;;8DACtD,MAAC5F,KAAK;oDAACkE,SAAS,EAAE,KAAK;oDAAEJ,OAAO,EAAE,CAAC;oDAAEH,UAAU,EAAC,QAAQ;;sEACtD,KAACpE,UAAU;4DAAC+B,OAAO,EAAC,SAAS;sEAAC,gBAAc;0DAAa;sEACzD,KAACnB,UAAU;4DAAC2C,OAAO,EAAES,cAAc;4DAAEZ,IAAI,EAAC,OAAO;sEAC/C,cAAA,KAACnC,OAAO,KAAG;0DACA;;kDACP;8DACR,KAACe,mBAAmB;oDAACC,UAAU,EAAEiC,WAAW;kDAAI;;0CAClC;sCACX;;8BACF;0CAEP,KAACtC,aAAa;0CAAC,kBAAgB;8BAAgB;0CAC/C,MAACzB,IAAI;gCAAC4E,SAAS;gCAACR,OAAO,EAAE,CAAC;gCAAEpB,EAAE,EAAE,CAAC;;kDAC/B,MAAChD,IAAI;wCAAC6E,IAAI;wCAACC,EAAE,EAAE,EAAE;;4CAAE,gBAEjB;0DAAA,KAAChF,MAAM;gDACLqG,OAAO,EAAE9E,KAAK,CAAC0E,kBAAkB,CAACK,aAAa;gDAC/C7C,QAAQ,EAAE,CAAC8C,CAAC,GAAK;oDACf5C,QAAQ,CAAC,CAAC0B,KAAK,GAAK;wDAClBA,KAAK,CAACY,kBAAkB,CAACK,aAAa,GAAGC,CAAC,CAACjB,MAAM,CAACe,OAAO,CAAC;oDAC5D,CAAC,CAAC,CAAC;gDACL,CAAC;8CACD;;sCACG;kDACP,MAACnG,IAAI;wCAAC6E,IAAI;wCAACC,EAAE,EAAE,EAAE;;4CAAE,WAEjB;0DAAA,KAAChF,MAAM;gDACLqG,OAAO,EAAE9E,KAAK,CAAC0E,kBAAkB,CAACO,QAAQ;gDAC1C/C,QAAQ,EAAE,CAAC8C,CAAC,GAAK;oDACf5C,QAAQ,CAAC,CAAC0B,KAAK,GAAK;wDAClBA,KAAK,CAACY,kBAAkB,CAACO,QAAQ,GAAGD,CAAC,CAACjB,MAAM,CAACe,OAAO,CAAC;oDACvD,CAAC,CAAC,CAAC;gDACL,CAAC;8CACD;;sCACG;;8BACF;;sBACN,AACJ;;cACG;;MACL,CACH;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/variable-editor-form-model.ts"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { VariableDefinition,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/variable-editor-form-model.ts"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { VariableDefinition, ListVariableDefinition, TextVariableDefinition, Display } from '@perses-dev/core';\n\nexport function getInitialState(initialVariableDefinition: VariableDefinition) {\n const textVariableFields = {\n value: (initialVariableDefinition as TextVariableDefinition).spec.value ?? '',\n };\n\n const listVariableFields = {\n allowMultiple: false,\n allowAll: false,\n plugin: {\n kind: '',\n spec: {},\n },\n };\n if (initialVariableDefinition.kind === 'ListVariable') {\n listVariableFields.allowMultiple = initialVariableDefinition.spec.allow_all_value ?? false;\n listVariableFields.allowAll = initialVariableDefinition.spec.allow_all_value ?? false;\n listVariableFields.plugin = initialVariableDefinition.spec.plugin;\n }\n\n return {\n name: initialVariableDefinition.spec.name,\n title: initialVariableDefinition.spec.display?.name,\n kind: initialVariableDefinition.kind,\n description: '',\n listVariableFields,\n textVariableFields,\n };\n}\n\nexport type VariableEditorState = ReturnType<typeof getInitialState>;\n\nexport function getVariableDefinitionFromState(state: VariableEditorState): VariableDefinition {\n const { name, title, kind } = state;\n\n const commonSpec = {\n name,\n display: {\n name: title,\n } as Display,\n };\n\n if (kind === 'TextVariable') {\n const textVariableDefinition: TextVariableDefinition = {\n kind,\n spec: {\n ...commonSpec,\n ...state.textVariableFields,\n },\n };\n return textVariableDefinition;\n }\n\n if (kind === 'ListVariable') {\n const listVariableDefinition: ListVariableDefinition = {\n kind,\n spec: {\n ...commonSpec,\n allow_multiple: state.listVariableFields.allowMultiple,\n allow_all_value: state.listVariableFields.allowAll,\n plugin: state.listVariableFields.plugin,\n },\n };\n\n return listVariableDefinition;\n }\n throw new Error(`Unknown variable kind: ${kind}`);\n}\n"],"names":["getInitialState","initialVariableDefinition","textVariableFields","value","spec","listVariableFields","allowMultiple","allowAll","plugin","kind","allow_all_value","name","title","display","description","getVariableDefinitionFromState","state","commonSpec","textVariableDefinition","listVariableDefinition","allow_multiple","Error"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAIjC,OAAO,SAASA,eAAe,CAACC,yBAA6C,EAAE;QAqBpEA,GAAsC;QAnBtC,MAAgE;IADzE,MAAMC,kBAAkB,GAAG;QACzBC,KAAK,EAAE,CAAA,MAAgE,GAAhE,AAACF,yBAAyB,CAA4BG,IAAI,CAACD,KAAK,cAAhE,MAAgE,cAAhE,MAAgE,GAAI,EAAE;KAC9E,AAAC;IAEF,MAAME,kBAAkB,GAAG;QACzBC,aAAa,EAAE,KAAK;QACpBC,QAAQ,EAAE,KAAK;QACfC,MAAM,EAAE;YACNC,IAAI,EAAE,EAAE;YACRL,IAAI,EAAE,EAAE;SACT;KACF,AAAC;IACF,IAAIH,yBAAyB,CAACQ,IAAI,KAAK,cAAc,EAAE;YAClBR,gBAA8C;QAAjFI,kBAAkB,CAACC,aAAa,GAAGL,CAAAA,gBAA8C,GAA9CA,yBAAyB,CAACG,IAAI,CAACM,eAAe,cAA9CT,gBAA8C,cAA9CA,gBAA8C,GAAI,KAAK,CAAC;YAC7DA,iBAA8C;QAA5EI,kBAAkB,CAACE,QAAQ,GAAGN,CAAAA,iBAA8C,GAA9CA,yBAAyB,CAACG,IAAI,CAACM,eAAe,cAA9CT,iBAA8C,cAA9CA,iBAA8C,GAAI,KAAK,CAAC;QACtFI,kBAAkB,CAACG,MAAM,GAAGP,yBAAyB,CAACG,IAAI,CAACI,MAAM,CAAC;IACpE,CAAC;IAED,OAAO;QACLG,IAAI,EAAEV,yBAAyB,CAACG,IAAI,CAACO,IAAI;QACzCC,KAAK,EAAEX,CAAAA,GAAsC,GAAtCA,yBAAyB,CAACG,IAAI,CAACS,OAAO,cAAtCZ,GAAsC,WAAM,GAA5CA,KAAAA,CAA4C,GAA5CA,GAAsC,CAAEU,IAAI;QACnDF,IAAI,EAAER,yBAAyB,CAACQ,IAAI;QACpCK,WAAW,EAAE,EAAE;QACfT,kBAAkB;QAClBH,kBAAkB;KACnB,CAAC;AACJ,CAAC;AAID,OAAO,SAASa,8BAA8B,CAACC,KAA0B,EAAsB;IAC7F,MAAM,EAAEL,IAAI,CAAA,EAAEC,KAAK,CAAA,EAAEH,IAAI,CAAA,EAAE,GAAGO,KAAK,AAAC;IAEpC,MAAMC,UAAU,GAAG;QACjBN,IAAI;QACJE,OAAO,EAAE;YACPF,IAAI,EAAEC,KAAK;SACZ;KACF,AAAC;IAEF,IAAIH,IAAI,KAAK,cAAc,EAAE;QAC3B,MAAMS,sBAAsB,GAA2B;YACrDT,IAAI;YACJL,IAAI,EAAE;gBACJ,GAAGa,UAAU;gBACb,GAAGD,KAAK,CAACd,kBAAkB;aAC5B;SACF,AAAC;QACF,OAAOgB,sBAAsB,CAAC;IAChC,CAAC;IAED,IAAIT,IAAI,KAAK,cAAc,EAAE;QAC3B,MAAMU,sBAAsB,GAA2B;YACrDV,IAAI;YACJL,IAAI,EAAE;gBACJ,GAAGa,UAAU;gBACbG,cAAc,EAAEJ,KAAK,CAACX,kBAAkB,CAACC,aAAa;gBACtDI,eAAe,EAAEM,KAAK,CAACX,kBAAkB,CAACE,QAAQ;gBAClDC,MAAM,EAAEQ,KAAK,CAACX,kBAAkB,CAACG,MAAM;aACxC;SACF,AAAC;QAEF,OAAOW,sBAAsB,CAAC;IAChC,CAAC;IACD,MAAM,IAAIE,KAAK,CAAC,CAAC,uBAAuB,EAAEZ,IAAI,CAAC,CAAC,CAAC,CAAC;AACpD,CAAC"}
|