@perses-dev/dashboards 0.0.0-snapshot-time-range-height-80d08fc

package/dist/components/Variables/VariableEditor.js

@@ -0,0 +1,265 @@
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useMemo } from 'react';
+import { Button, Stack, Box, TableContainer, TableBody, TableRow, TableCell as MuiTableCell, Table, TableHead, Switch, Typography, IconButton, Alert, styled } from '@mui/material';
+import { useImmer } from 'use-immer';
+import PencilIcon from 'mdi-material-ui/Pencil';
+import TrashIcon from 'mdi-material-ui/TrashCan';
+import ArrowUp from 'mdi-material-ui/ArrowUp';
+import ArrowDown from 'mdi-material-ui/ArrowDown';
+import { VariableEditForm } from './VariableEditorForm';
+import { VARIABLE_TYPES } from './variable-model';
+function getVariableLabelByKind(kind) {
+    var ref;
+    return (ref = VARIABLE_TYPES.find((variableType)=>variableType.kind === kind)) === null || ref === void 0 ? void 0 : ref.label;
+}
+function getValidation(variableDefinitions) {
+    const errors = [];
+    /**  Variable names must be unique */ const variableNames = variableDefinitions.map((variableDefinition)=>variableDefinition.spec.name);
+    const uniqueVariableNames = new Set(variableNames);
+    if (variableNames.length !== uniqueVariableNames.size) {
+        errors.push('Variable names must be unique');
+    }
+    return {
+        errors: errors,
+        isValid: errors.length === 0
+    };
+}
+export function VariableEditor(props) {
+    const [variableDefinitions, setVariableDefinitions] = useImmer(props.variableDefinitions);
+    const [variableEditIdx, setVariableEditIdx] = useState(null);
+    const validation = useMemo(()=>getValidation(variableDefinitions), [
+        variableDefinitions
+    ]);
+    const currentEditingVariableDefinition = typeof variableEditIdx === 'number' && variableDefinitions[variableEditIdx];
+    const removeVariable = (index)=>{
+        setVariableDefinitions((draft)=>{
+            draft.splice(index, 1);
+        });
+    };
+    const addVariable = ()=>{
+        setVariableDefinitions((draft)=>{
+            draft.push({
+                kind: 'TextVariable',
+                spec: {
+                    name: 'NewVariable',
+                    value: ''
+                }
+            });
+        });
+        setVariableEditIdx(variableDefinitions.length);
+    };
+    const toggleVariableVisibility = (index, visible)=>{
+        setVariableDefinitions((draft)=>{
+            const v = draft[index];
+            if (!v) {
+                return;
+            }
+            if (!v.spec.display) {
+                v.spec.display = {
+                    name: v.spec.name,
+                    hidden: false
+                };
+            }
+            v.spec.display.hidden = visible === false;
+        });
+    };
+    const changeVariableOrder = (index, direction)=>{
+        setVariableDefinitions((draft)=>{
+            if (direction === 'up') {
+                const prevElement = draft[index - 1];
+                const currentElement = draft[index];
+                if (index === 0 || !prevElement || !currentElement) {
+                    return;
+                }
+                draft[index - 1] = currentElement;
+                draft[index] = prevElement;
+            } else {
+                const nextElement = draft[index + 1];
+                const currentElement1 = draft[index];
+                if (index === draft.length - 1 || !nextElement || !currentElement1) {
+                    return;
+                }
+                draft[index + 1] = currentElement1;
+                draft[index] = nextElement;
+            }
+        });
+    };
+    var ref;
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            currentEditingVariableDefinition && /*#__PURE__*/ _jsx(VariableEditForm, {
+                initialVariableDefinition: currentEditingVariableDefinition,
+                onChange: (definition)=>{
+                    setVariableDefinitions((draft)=>{
+                        draft[variableEditIdx] = definition;
+                        setVariableEditIdx(null);
+                    });
+                },
+                onCancel: ()=>setVariableEditIdx(null)
+            }),
+            !currentEditingVariableDefinition && /*#__PURE__*/ _jsxs(_Fragment, {
+                children: [
+                    /*#__PURE__*/ _jsxs(Box, {
+                        sx: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            padding: (theme)=>theme.spacing(1, 2),
+                            borderBottom: (theme)=>`1px solid ${theme.palette.divider}`
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "h2",
+                                children: "Variables"
+                            }),
+                            /*#__PURE__*/ _jsxs(Stack, {
+                                direction: "row",
+                                spacing: 1,
+                                marginLeft: "auto",
+                                children: [
+                                    /*#__PURE__*/ _jsx(Button, {
+                                        disabled: props.variableDefinitions === variableDefinitions || !validation.isValid,
+                                        variant: "contained",
+                                        onClick: ()=>{
+                                            props.onChange(variableDefinitions);
+                                        },
+                                        children: "Apply"
+                                    }),
+                                    /*#__PURE__*/ _jsx(Button, {
+                                        color: "secondary",
+                                        variant: "outlined",
+                                        onClick: ()=>{
+                                            props.onCancel();
+                                        },
+                                        children: "Cancel"
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx(Box, {
+                        padding: 2,
+                        sx: {
+                            overflowY: 'scroll'
+                        },
+                        children: /*#__PURE__*/ _jsxs(Stack, {
+                            spacing: 2,
+                            children: [
+                                !validation.isValid && validation.errors.map((error)=>/*#__PURE__*/ _jsx(Alert, {
+                                        severity: "error",
+                                        children: error
+                                    }, error)),
+                                /*#__PURE__*/ _jsx(TableContainer, {
+                                    children: /*#__PURE__*/ _jsxs(Table, {
+                                        sx: {
+                                            minWidth: 650
+                                        },
+                                        "aria-label": "simple table",
+                                        children: [
+                                            /*#__PURE__*/ _jsx(TableHead, {
+                                                children: /*#__PURE__*/ _jsxs(TableRow, {
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            children: "Visibility"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            children: "Name"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            children: "Type"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            align: "right",
+                                                            children: "Action"
+                                                        })
+                                                    ]
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(TableBody, {
+                                                children: variableDefinitions.map((v, idx)=>{
+                                                    var ref1;
+                                                    /*#__PURE__*/ return _jsxs(TableRow, {
+                                                        children: [
+                                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                                component: "th",
+                                                                scope: "row",
+                                                                children: /*#__PURE__*/ _jsx(Switch, {
+                                                                    checked: ((ref1 = v.spec.display) === null || ref1 === void 0 ? void 0 : ref1.hidden) !== true,
+                                                                    onChange: (e)=>{
+                                                                        toggleVariableVisibility(idx, e.target.checked);
+                                                                    }
+                                                                })
+                                                            }),
+                                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                                component: "th",
+                                                                scope: "row",
+                                                                sx: {
+                                                                    fontWeight: 'bold'
+                                                                },
+                                                                children: v.spec.name
+                                                            }),
+                                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                                children: (ref = getVariableLabelByKind(v.kind)) !== null && ref !== void 0 ? ref : v.kind
+                                                            }),
+                                                            /*#__PURE__*/ _jsxs(TableCell, {
+                                                                align: "right",
+                                                                children: [
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>changeVariableOrder(idx, 'up'),
+                                                                        disabled: idx === 0,
+                                                                        children: /*#__PURE__*/ _jsx(ArrowUp, {})
+                                                                    }),
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>changeVariableOrder(idx, 'down'),
+                                                                        disabled: idx === variableDefinitions.length - 1,
+                                                                        children: /*#__PURE__*/ _jsx(ArrowDown, {})
+                                                                    }),
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>setVariableEditIdx(idx),
+                                                                        children: /*#__PURE__*/ _jsx(PencilIcon, {})
+                                                                    }),
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>removeVariable(idx),
+                                                                        children: /*#__PURE__*/ _jsx(TrashIcon, {})
+                                                                    })
+                                                                ]
+                                                            })
+                                                        ]
+                                                    }, v.spec.name);
+                                                })
+                                            })
+                                        ]
+                                    })
+                                }),
+                                /*#__PURE__*/ _jsx(Box, {
+                                    display: "flex",
+                                    children: /*#__PURE__*/ _jsx(Button, {
+                                        onClick: addVariable,
+                                        variant: "contained",
+                                        children: "Add New"
+                                    })
+                                })
+                            ]
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+}
+const TableCell = styled(MuiTableCell)(({ theme  })=>({
+        borderBottom: `solid 1px ${theme.palette.divider}`
+    }));
+
+//# sourceMappingURL=VariableEditor.js.map

package/dist/components/Variables/VariableEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Variables/VariableEditor.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 { useState, useMemo } from 'react';\nimport {\n  Button,\n  Stack,\n  Box,\n  TableContainer,\n  TableBody,\n  TableRow,\n  TableCell as MuiTableCell,\n  Table,\n  TableHead,\n  Switch,\n  Typography,\n  IconButton,\n  Alert,\n  styled,\n} from '@mui/material';\nimport { VariableDefinition } from '@perses-dev/core';\nimport { useImmer } from 'use-immer';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\n\nimport { VariableEditForm } from './VariableEditorForm';\nimport { VARIABLE_TYPES } from './variable-model';\n\nfunction getVariableLabelByKind(kind: string) {\n  return VARIABLE_TYPES.find((variableType) => variableType.kind === kind)?.label;\n}\n\nfunction getValidation(variableDefinitions: VariableDefinition[]) {\n  const errors = [];\n\n  /**  Variable names must be unique */\n  const variableNames = variableDefinitions.map((variableDefinition) => variableDefinition.spec.name);\n  const uniqueVariableNames = new Set(variableNames);\n  if (variableNames.length !== uniqueVariableNames.size) {\n    errors.push('Variable names must be unique');\n  }\n  return {\n    errors: errors,\n    isValid: errors.length === 0,\n  };\n}\n\nexport function VariableEditor(props: {\n  variableDefinitions: VariableDefinition[];\n  onChange: (variableDefinitions: VariableDefinition[]) => void;\n  onCancel: () => void;\n}) {\n  const [variableDefinitions, setVariableDefinitions] = useImmer(props.variableDefinitions);\n  const [variableEditIdx, setVariableEditIdx] = useState<number | null>(null);\n\n  const validation = useMemo(() => getValidation(variableDefinitions), [variableDefinitions]);\n  const currentEditingVariableDefinition = typeof variableEditIdx === 'number' && variableDefinitions[variableEditIdx];\n\n  const removeVariable = (index: number) => {\n    setVariableDefinitions((draft) => {\n      draft.splice(index, 1);\n    });\n  };\n\n  const addVariable = () => {\n    setVariableDefinitions((draft) => {\n      draft.push({\n        kind: 'TextVariable',\n        spec: {\n          name: 'NewVariable',\n          value: '',\n        },\n      });\n    });\n    setVariableEditIdx(variableDefinitions.length);\n  };\n\n  const toggleVariableVisibility = (index: number, visible: boolean) => {\n    setVariableDefinitions((draft) => {\n      const v = draft[index];\n      if (!v) {\n        return;\n      }\n      if (!v.spec.display) {\n        v.spec.display = {\n          name: v.spec.name,\n          hidden: false,\n        };\n      }\n      v.spec.display.hidden = visible === false;\n    });\n  };\n\n  const changeVariableOrder = (index: number, direction: 'up' | 'down') => {\n    setVariableDefinitions((draft) => {\n      if (direction === 'up') {\n        const prevElement = draft[index - 1];\n        const currentElement = draft[index];\n        if (index === 0 || !prevElement || !currentElement) {\n          return;\n        }\n        draft[index - 1] = currentElement;\n        draft[index] = prevElement;\n      } else {\n        const nextElement = draft[index + 1];\n        const currentElement = draft[index];\n        if (index === draft.length - 1 || !nextElement || !currentElement) {\n          return;\n        }\n        draft[index + 1] = currentElement;\n        draft[index] = nextElement;\n      }\n    });\n  };\n\n  return (\n    <>\n      {currentEditingVariableDefinition && (\n        <VariableEditForm\n          initialVariableDefinition={currentEditingVariableDefinition}\n          onChange={(definition) => {\n            setVariableDefinitions((draft) => {\n              draft[variableEditIdx] = definition;\n              setVariableEditIdx(null);\n            });\n          }}\n          onCancel={() => setVariableEditIdx(null)}\n        />\n      )}\n      {!currentEditingVariableDefinition && (\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.divider}`,\n            }}\n          >\n            <Typography variant=\"h2\">Variables</Typography>\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n              <Button\n                disabled={props.variableDefinitions === variableDefinitions || !validation.isValid}\n                variant=\"contained\"\n                onClick={() => {\n                  props.onChange(variableDefinitions);\n                }}\n              >\n                Apply\n              </Button>\n              <Button\n                color=\"secondary\"\n                variant=\"outlined\"\n                onClick={() => {\n                  props.onCancel();\n                }}\n              >\n                Cancel\n              </Button>\n            </Stack>\n          </Box>\n          <Box padding={2} sx={{ overflowY: 'scroll' }}>\n            <Stack spacing={2}>\n              {!validation.isValid &&\n                validation.errors.map((error) => (\n                  <Alert severity=\"error\" key={error}>\n                    {error}\n                  </Alert>\n                ))}\n              <TableContainer>\n                <Table sx={{ minWidth: 650 }} aria-label=\"simple table\">\n                  <TableHead>\n                    <TableRow>\n                      <TableCell>Visibility</TableCell>\n                      <TableCell>Name</TableCell>\n                      <TableCell>Type</TableCell>\n                      <TableCell align=\"right\">Action</TableCell>\n                    </TableRow>\n                  </TableHead>\n                  <TableBody>\n                    {variableDefinitions.map((v, idx) => (\n                      <TableRow key={v.spec.name}>\n                        <TableCell component=\"th\" scope=\"row\">\n                          <Switch\n                            checked={v.spec.display?.hidden !== true}\n                            onChange={(e) => {\n                              toggleVariableVisibility(idx, e.target.checked);\n                            }}\n                          />\n                        </TableCell>\n                        <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold' }}>\n                          {v.spec.name}\n                        </TableCell>\n                        <TableCell>{getVariableLabelByKind(v.kind) ?? v.kind}</TableCell>\n                        <TableCell align=\"right\">\n                          <IconButton onClick={() => changeVariableOrder(idx, 'up')} disabled={idx === 0}>\n                            <ArrowUp />\n                          </IconButton>\n                          <IconButton\n                            onClick={() => changeVariableOrder(idx, 'down')}\n                            disabled={idx === variableDefinitions.length - 1}\n                          >\n                            <ArrowDown />\n                          </IconButton>\n\n                          <IconButton onClick={() => setVariableEditIdx(idx)}>\n                            <PencilIcon />\n                          </IconButton>\n                          <IconButton onClick={() => removeVariable(idx)}>\n                            <TrashIcon />\n                          </IconButton>\n                        </TableCell>\n                      </TableRow>\n                    ))}\n                  </TableBody>\n                </Table>\n              </TableContainer>\n              <Box display=\"flex\">\n                <Button onClick={addVariable} variant=\"contained\">\n                  Add New\n                </Button>\n              </Box>\n            </Stack>\n          </Box>\n        </>\n      )}\n    </>\n  );\n}\n\nconst TableCell = styled(MuiTableCell)(({ theme }) => ({\n  borderBottom: `solid 1px ${theme.palette.divider}`,\n}));\n"],"names":["useState","useMemo","Button","Stack","Box","TableContainer","TableBody","TableRow","TableCell","MuiTableCell","Table","TableHead","Switch","Typography","IconButton","Alert","styled","useImmer","PencilIcon","TrashIcon","ArrowUp","ArrowDown","VariableEditForm","VARIABLE_TYPES","getVariableLabelByKind","kind","find","variableType","label","getValidation","variableDefinitions","errors","variableNames","map","variableDefinition","spec","name","uniqueVariableNames","Set","length","size","push","isValid","VariableEditor","props","setVariableDefinitions","variableEditIdx","setVariableEditIdx","validation","currentEditingVariableDefinition","removeVariable","index","draft","splice","addVariable","value","toggleVariableVisibility","visible","v","display","hidden","changeVariableOrder","direction","prevElement","currentElement","nextElement","initialVariableDefinition","onChange","definition","onCancel","sx","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","marginLeft","disabled","onClick","color","overflowY","error","severity","minWidth","aria-label","align","idx","component","scope","checked","e","target","fontWeight"],"mappings":"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"}

package/dist/components/Variables/VariableEditorForm/VariableEditorForm.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { VariableDefinition } from '@perses-dev/core';
+export declare function VariableEditForm({ initialVariableDefinition, onChange, onCancel, }: {
+    initialVariableDefinition: VariableDefinition;
+    onChange: (def: VariableDefinition) => void;
+    onCancel: () => void;
+}): JSX.Element;
+//# sourceMappingURL=VariableEditorForm.d.ts.map

package/dist/components/Variables/VariableEditorForm/VariableEditorForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VariableEditorForm.d.ts","sourceRoot":"","sources":["../../../../src/components/Variables/VariableEditorForm/VariableEditorForm.tsx"],"names":[],"mappings":";AAkCA,OAAO,EAAE,kBAAkB,EAA0B,MAAM,kBAAkB,CAAC;AAqF9E,wBAAgB,gBAAgB,CAAC,EAC/B,yBAAyB,EACzB,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,yBAAyB,EAAE,kBAAkB,CAAC;IAC9C,QAAQ,EAAE,CAAC,GAAG,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB,eAgNA"}