@perses-dev/dashboards 0.0.0-snapshot-time-zone-selector-946f408 → 0.0.0-snapshot-panel-actions-520389b

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.
Files changed (44) hide show
  1. package/dist/cjs/components/DashboardToolbar/DashboardToolbar.js +98 -109
  2. package/dist/cjs/components/Panel/Panel.js +60 -1
  3. package/dist/cjs/components/Panel/PanelActions.js +86 -16
  4. package/dist/cjs/components/Panel/PanelHeader.js +47 -3
  5. package/dist/cjs/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.js +1 -13
  6. package/dist/cjs/components/SaveDashboardButton/SaveDashboardButton.js +3 -10
  7. package/dist/cjs/context/DashboardProvider/DashboardProvider.js +2 -4
  8. package/dist/cjs/context/useDashboard.js +1 -3
  9. package/dist/cjs/views/ViewDashboard/ViewDashboard.js +0 -2
  10. package/dist/components/DashboardToolbar/DashboardToolbar.d.ts.map +1 -1
  11. package/dist/components/DashboardToolbar/DashboardToolbar.js +100 -111
  12. package/dist/components/DashboardToolbar/DashboardToolbar.js.map +1 -1
  13. package/dist/components/Panel/Panel.d.ts +5 -0
  14. package/dist/components/Panel/Panel.d.ts.map +1 -1
  15. package/dist/components/Panel/Panel.js +60 -1
  16. package/dist/components/Panel/Panel.js.map +1 -1
  17. package/dist/components/Panel/PanelActions.d.ts +5 -3
  18. package/dist/components/Panel/PanelActions.d.ts.map +1 -1
  19. package/dist/components/Panel/PanelActions.js +87 -17
  20. package/dist/components/Panel/PanelActions.js.map +1 -1
  21. package/dist/components/Panel/PanelHeader.d.ts +5 -1
  22. package/dist/components/Panel/PanelHeader.d.ts.map +1 -1
  23. package/dist/components/Panel/PanelHeader.js +47 -3
  24. package/dist/components/Panel/PanelHeader.js.map +1 -1
  25. package/dist/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.d.ts.map +1 -1
  26. package/dist/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.js +2 -14
  27. package/dist/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.js.map +1 -1
  28. package/dist/components/SaveDashboardButton/SaveDashboardButton.d.ts.map +1 -1
  29. package/dist/components/SaveDashboardButton/SaveDashboardButton.js +4 -11
  30. package/dist/components/SaveDashboardButton/SaveDashboardButton.js.map +1 -1
  31. package/dist/context/DashboardProvider/DashboardProvider.d.ts +0 -1
  32. package/dist/context/DashboardProvider/DashboardProvider.d.ts.map +1 -1
  33. package/dist/context/DashboardProvider/DashboardProvider.js +3 -5
  34. package/dist/context/DashboardProvider/DashboardProvider.js.map +1 -1
  35. package/dist/context/DashboardProvider/save-changes-dialog-slice.d.ts +1 -2
  36. package/dist/context/DashboardProvider/save-changes-dialog-slice.d.ts.map +1 -1
  37. package/dist/context/DashboardProvider/save-changes-dialog-slice.js.map +1 -1
  38. package/dist/context/useDashboard.d.ts.map +1 -1
  39. package/dist/context/useDashboard.js +1 -3
  40. package/dist/context/useDashboard.js.map +1 -1
  41. package/dist/views/ViewDashboard/ViewDashboard.d.ts.map +1 -1
  42. package/dist/views/ViewDashboard/ViewDashboard.js +1 -3
  43. package/dist/views/ViewDashboard/ViewDashboard.js.map +1 -1
  44. package/package.json +5 -5
@@ -90,7 +90,7 @@ function DashboardProvider(props) {
90
90
  }
91
91
  function initStore(props) {
92
92
  const { initialState: { dashboardResource, isEditMode, viewPanelRef, setViewPanelRef } } = props;
93
- const { kind, metadata, spec: { display, duration, timeZone = _core.DEFAULT_DASHBOARD_TIMEZONE, refreshInterval = _core.DEFAULT_REFRESH_INTERVAL, datasources } } = dashboardResource;
93
+ const { kind, metadata, spec: { display, duration, refreshInterval = _core.DEFAULT_REFRESH_INTERVAL, datasources } } = dashboardResource;
94
94
  const ttl = 'ttl' in dashboardResource.spec ? dashboardResource.spec.ttl : undefined;
95
95
  let { spec: { layouts, panels } } = dashboardResource;
96
96
  // Set fallbacks in case the frontend is used with a non-Perses backend
@@ -115,14 +115,13 @@ function initStore(props) {
115
115
  display,
116
116
  duration,
117
117
  refreshInterval,
118
- timeZone,
119
118
  datasources,
120
119
  ttl,
121
120
  isEditMode: !!isEditMode,
122
121
  setEditMode: (isEditMode)=>set({
123
122
  isEditMode
124
123
  }),
125
- setDashboard: ({ kind, metadata, spec: { display, panels = {}, layouts = [], duration, refreshInterval, timeZone, datasources = {} } })=>{
124
+ setDashboard: ({ kind, metadata, spec: { display, panels = {}, layouts = [], duration, refreshInterval, datasources = {} } })=>{
126
125
  set((state)=>{
127
126
  state.kind = kind;
128
127
  state.metadata = metadata;
@@ -133,7 +132,6 @@ function initStore(props) {
133
132
  state.panelGroupOrder = panelGroupOrder;
134
133
  state.duration = duration;
135
134
  state.refreshInterval = refreshInterval ?? _core.DEFAULT_REFRESH_INTERVAL;
136
- state.timeZone = timeZone ?? _core.DEFAULT_DASHBOARD_TIMEZONE;
137
135
  state.datasources = datasources;
138
136
  // TODO: add ttl here to e.g allow edition from JSON view, but probably requires quite some refactoring
139
137
  });
@@ -24,7 +24,7 @@ const _core = require("@perses-dev/core");
24
24
  const _DashboardProvider = require("./DashboardProvider");
25
25
  const _VariableProvider = require("./VariableProvider");
26
26
  function useDashboard() {
27
- const { panels, panelGroups, panelGroupOrder, setDashboard: setDashboardResource, kind, metadata, display, duration, refreshInterval, timeZone, datasources, ttl } = (0, _DashboardProvider.useDashboardStore)(({ panels, panelGroups, panelGroupOrder, setDashboard, kind, metadata, display, duration, refreshInterval, timeZone, datasources, ttl })=>({
27
+ const { panels, panelGroups, panelGroupOrder, setDashboard: setDashboardResource, kind, metadata, display, duration, refreshInterval, datasources, ttl } = (0, _DashboardProvider.useDashboardStore)(({ panels, panelGroups, panelGroupOrder, setDashboard, kind, metadata, display, duration, refreshInterval, datasources, ttl })=>({
28
28
  panels,
29
29
  panelGroups,
30
30
  panelGroupOrder,
@@ -34,7 +34,6 @@ function useDashboard() {
34
34
  display,
35
35
  duration,
36
36
  refreshInterval,
37
- timeZone,
38
37
  datasources,
39
38
  ttl
40
39
  }));
@@ -51,7 +50,6 @@ function useDashboard() {
51
50
  variables,
52
51
  duration,
53
52
  refreshInterval,
54
- timeZone,
55
53
  datasources
56
54
  }
57
55
  } : {
@@ -34,7 +34,6 @@ function ViewDashboard(props) {
34
34
  const { spec } = dashboardResource;
35
35
  const dashboardDuration = spec.duration ?? _core.DEFAULT_DASHBOARD_DURATION;
36
36
  const dashboardRefreshInterval = spec.refreshInterval ?? _core.DEFAULT_REFRESH_INTERVAL;
37
- const initialTimeZone = spec.timeZone ?? _core.DEFAULT_DASHBOARD_TIMEZONE;
38
37
  const initialTimeRange = (0, _pluginsystem.useInitialTimeRange)(dashboardDuration);
39
38
  const initialRefreshInterval = (0, _pluginsystem.useInitialRefreshInterval)(dashboardRefreshInterval);
40
39
  const { data } = (0, _pluginsystem.usePluginBuiltinVariableDefinitions)();
@@ -87,7 +86,6 @@ function ViewDashboard(props) {
87
86
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_pluginsystem.TimeRangeProviderWithQueryParams, {
88
87
  initialTimeRange: initialTimeRange,
89
88
  initialRefreshInterval: initialRefreshInterval,
90
- initialTimeZone: initialTimeZone,
91
89
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_context.VariableProviderWithQueryParams, {
92
90
  initialVariableDefinitions: spec.variables,
93
91
  externalVariableDefinitions: externalVariableDefinitions,
@@ -1 +1 @@
1
- {"version":3,"file":"DashboardToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/DashboardToolbar/DashboardToolbar.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAE,YAAY,EAAe,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,eAAe,EAAe,MAAM,eAAe,CAAC;AAW7D,MAAM,WAAW,qBAAqB;IACpC,aAAa,EAAE,MAAM,CAAC;IACtB,uBAAuB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACtC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,mBAAmB,EAAE,OAAO,CAAC;IAC7B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,MAAM,CAAC,EAAE,eAAe,CAAC;CAC1B;AAED,eAAO,MAAM,gBAAgB,UAAW,qBAAqB,KAAG,YAyG/D,CAAC"}
1
+ {"version":3,"file":"DashboardToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/DashboardToolbar/DashboardToolbar.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,eAAe,EAAe,MAAM,eAAe,CAAC;AAW7D,MAAM,WAAW,qBAAqB;IACpC,aAAa,EAAE,MAAM,CAAC;IACtB,uBAAuB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACtC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,mBAAmB,EAAE,OAAO,CAAC;IAC7B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,MAAM,CAAC,EAAE,eAAe,CAAC;CAC1B;AAED,eAAO,MAAM,gBAAgB,UAAW,qBAAqB,KAAG,YAgG/D,CAAC"}
@@ -12,9 +12,8 @@
12
12
  // limitations under the License.
13
13
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
14
14
  import { Typography, Stack, Button, Box, useTheme, useMediaQuery, Alert } from '@mui/material';
15
- import { ErrorBoundary, ErrorAlert, TimeZoneSelector, getTimeZoneOptions } from '@perses-dev/components';
16
- import { TimeRangeControls, useTimeZone } from '@perses-dev/plugin-system';
17
- import { useCallback } from 'react';
15
+ import { ErrorBoundary, ErrorAlert } from '@perses-dev/components';
16
+ import { TimeRangeControls } from '@perses-dev/plugin-system';
18
17
  import { useEditMode } from '../../context';
19
18
  import { AddPanelButton } from '../AddPanelButton';
20
19
  import { AddGroupButton } from '../AddGroupButton';
@@ -30,127 +29,117 @@ export const DashboardToolbar = (props)=>{
30
29
  const { isEditMode } = useEditMode();
31
30
  const isBiggerThanSm = useMediaQuery(useTheme().breakpoints.up('sm'));
32
31
  const isBiggerThanMd = useMediaQuery(useTheme().breakpoints.up('md'));
33
- const { timeZone, setTimeZone } = useTimeZone();
34
- const timeZoneOptions = getTimeZoneOptions();
35
32
  const dashboardTitle = dashboardTitleComponent ? dashboardTitleComponent : /*#__PURE__*/ _jsx(Typography, {
36
33
  variant: "h2",
37
34
  children: dashboardName
38
35
  });
39
36
  const testId = 'dashboard-toolbar';
40
- const handleTimeZoneChange = useCallback((timeZoneOption)=>{
41
- setTimeZone(timeZoneOption.value);
42
- }, [
43
- setTimeZone
44
- ]);
45
- return /*#__PURE__*/ _jsxs(Stack, {
46
- "data-testid": testId,
47
- children: [
48
- /*#__PURE__*/ _jsxs(Box, {
49
- px: 2,
50
- py: 1.5,
51
- display: "flex",
52
- sx: {
53
- backgroundColor: (theme)=>theme.palette.primary.main + (isEditMode ? '30' : '0')
54
- },
55
- children: [
56
- dashboardTitle,
57
- isEditMode ? /*#__PURE__*/ _jsxs(Stack, {
58
- direction: "row",
59
- gap: 1,
60
- ml: "auto",
61
- children: [
62
- isReadonly && /*#__PURE__*/ _jsx(Alert, {
63
- severity: "warning",
64
- sx: {
65
- backgroundColor: 'transparent',
66
- padding: 0
67
- },
68
- children: "Dashboard managed via code only. Download JSON and commit changes to save."
69
- }),
70
- /*#__PURE__*/ _jsxs(Stack, {
71
- direction: "row",
72
- spacing: 0.5,
73
- ml: 1,
74
- whiteSpace: "nowrap",
75
- children: [
76
- isVariableEnabled && /*#__PURE__*/ _jsx(EditVariablesButton, {}),
77
- isDatasourceEnabled && /*#__PURE__*/ _jsx(EditDatasourcesButton, {}),
78
- /*#__PURE__*/ _jsx(AddPanelButton, {}),
79
- /*#__PURE__*/ _jsx(AddGroupButton, {})
80
- ]
81
- }),
82
- /*#__PURE__*/ _jsx(SaveDashboardButton, {
83
- onSave: onSave,
84
- isDisabled: isReadonly
85
- }),
86
- /*#__PURE__*/ _jsx(Button, {
87
- variant: "outlined",
88
- onClick: onCancelButtonClick,
89
- children: "Cancel"
90
- })
91
- ]
92
- }) : /*#__PURE__*/ _jsx(_Fragment, {
93
- children: isBiggerThanSm && /*#__PURE__*/ _jsx(Stack, {
37
+ return /*#__PURE__*/ _jsx(_Fragment, {
38
+ children: /*#__PURE__*/ _jsxs(Stack, {
39
+ "data-testid": testId,
40
+ children: [
41
+ /*#__PURE__*/ _jsxs(Box, {
42
+ px: 2,
43
+ py: 1.5,
44
+ display: "flex",
45
+ sx: {
46
+ backgroundColor: (theme)=>theme.palette.primary.main + (isEditMode ? '30' : '0')
47
+ },
48
+ children: [
49
+ dashboardTitle,
50
+ isEditMode ? /*#__PURE__*/ _jsxs(Stack, {
94
51
  direction: "row",
95
52
  gap: 1,
96
53
  ml: "auto",
97
- children: /*#__PURE__*/ _jsx(EditButton, {
98
- onClick: onEditButtonClick
99
- })
100
- })
101
- })
102
- ]
103
- }),
104
- /*#__PURE__*/ _jsxs(Box, {
105
- sx: {
106
- display: 'flex',
107
- width: '100%',
108
- alignItems: 'start',
109
- padding: (theme)=>theme.spacing(1, 2, 0, 2),
110
- flexDirection: isBiggerThanMd ? 'row' : 'column',
111
- flexWrap: 'nowrap',
112
- gap: 1
113
- },
114
- children: [
115
- /*#__PURE__*/ _jsx(Box, {
116
- width: "100%",
117
- children: /*#__PURE__*/ _jsx(ErrorBoundary, {
118
- FallbackComponent: ErrorAlert,
119
- children: /*#__PURE__*/ _jsx(DashboardStickyToolbar, {
120
- initialVariableIsSticky: initialVariableIsSticky,
121
- sx: {
122
- backgroundColor: ({ palette })=>palette.background.default
123
- }
124
- })
125
- })
126
- }),
127
- /*#__PURE__*/ _jsx(Stack, {
128
- direction: "row",
129
- ml: "auto",
130
- flexWrap: "wrap",
131
- justifyContent: "end",
132
- children: /*#__PURE__*/ _jsxs(Stack, {
133
- direction: "row",
134
- spacing: 1,
135
- mt: 1,
136
- ml: 1,
137
54
  children: [
138
- /*#__PURE__*/ _jsx(TimeRangeControls, {}),
139
- /*#__PURE__*/ _jsx(TimeZoneSelector, {
140
- timeZoneOptions: timeZoneOptions,
141
- value: timeZone,
142
- onChange: handleTimeZoneChange
55
+ isReadonly && /*#__PURE__*/ _jsx(Alert, {
56
+ severity: "warning",
57
+ sx: {
58
+ backgroundColor: 'transparent',
59
+ padding: 0
60
+ },
61
+ children: "Dashboard managed via code only. Download JSON and commit changes to save."
143
62
  }),
144
- /*#__PURE__*/ _jsx(DownloadButton, {}),
145
- /*#__PURE__*/ _jsx(EditJsonButton, {
146
- isReadonly: !isEditMode
63
+ /*#__PURE__*/ _jsxs(Stack, {
64
+ direction: "row",
65
+ spacing: 0.5,
66
+ ml: 1,
67
+ whiteSpace: "nowrap",
68
+ children: [
69
+ isVariableEnabled && /*#__PURE__*/ _jsx(EditVariablesButton, {}),
70
+ isDatasourceEnabled && /*#__PURE__*/ _jsx(EditDatasourcesButton, {}),
71
+ /*#__PURE__*/ _jsx(AddPanelButton, {}),
72
+ /*#__PURE__*/ _jsx(AddGroupButton, {})
73
+ ]
74
+ }),
75
+ /*#__PURE__*/ _jsx(SaveDashboardButton, {
76
+ onSave: onSave,
77
+ isDisabled: isReadonly
78
+ }),
79
+ /*#__PURE__*/ _jsx(Button, {
80
+ variant: "outlined",
81
+ onClick: onCancelButtonClick,
82
+ children: "Cancel"
147
83
  })
148
84
  ]
85
+ }) : /*#__PURE__*/ _jsx(_Fragment, {
86
+ children: isBiggerThanSm && /*#__PURE__*/ _jsx(Stack, {
87
+ direction: "row",
88
+ gap: 1,
89
+ ml: "auto",
90
+ children: /*#__PURE__*/ _jsx(EditButton, {
91
+ onClick: onEditButtonClick
92
+ })
93
+ })
94
+ })
95
+ ]
96
+ }),
97
+ /*#__PURE__*/ _jsxs(Box, {
98
+ sx: {
99
+ display: 'flex',
100
+ width: '100%',
101
+ alignItems: 'start',
102
+ padding: (theme)=>theme.spacing(1, 2, 0, 2),
103
+ flexDirection: isBiggerThanMd ? 'row' : 'column',
104
+ flexWrap: 'nowrap',
105
+ gap: 1
106
+ },
107
+ children: [
108
+ /*#__PURE__*/ _jsx(Box, {
109
+ width: "100%",
110
+ children: /*#__PURE__*/ _jsx(ErrorBoundary, {
111
+ FallbackComponent: ErrorAlert,
112
+ children: /*#__PURE__*/ _jsx(DashboardStickyToolbar, {
113
+ initialVariableIsSticky: initialVariableIsSticky,
114
+ sx: {
115
+ backgroundColor: ({ palette })=>palette.background.default
116
+ }
117
+ })
118
+ })
119
+ }),
120
+ /*#__PURE__*/ _jsx(Stack, {
121
+ direction: "row",
122
+ ml: "auto",
123
+ flexWrap: "wrap",
124
+ justifyContent: "end",
125
+ children: /*#__PURE__*/ _jsxs(Stack, {
126
+ direction: "row",
127
+ spacing: 1,
128
+ mt: 1,
129
+ ml: 1,
130
+ children: [
131
+ /*#__PURE__*/ _jsx(TimeRangeControls, {}),
132
+ /*#__PURE__*/ _jsx(DownloadButton, {}),
133
+ /*#__PURE__*/ _jsx(EditJsonButton, {
134
+ isReadonly: !isEditMode
135
+ })
136
+ ]
137
+ })
149
138
  })
150
- })
151
- ]
152
- })
153
- ]
139
+ ]
140
+ })
141
+ ]
142
+ })
154
143
  });
155
144
  };
156
145
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/DashboardToolbar/DashboardToolbar.tsx"],"sourcesContent":["// Copyright 2023 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 { Typography, Stack, Button, Box, useTheme, useMediaQuery, Alert } from '@mui/material';\nimport {\n ErrorBoundary,\n ErrorAlert,\n TimeZoneSelector,\n getTimeZoneOptions,\n TimeZoneOption,\n} from '@perses-dev/components';\nimport { TimeRangeControls, useTimeZone } from '@perses-dev/plugin-system';\nimport { ReactElement, useCallback } from 'react';\nimport { OnSaveDashboard, useEditMode } from '../../context';\nimport { AddPanelButton } from '../AddPanelButton';\nimport { AddGroupButton } from '../AddGroupButton';\nimport { DownloadButton } from '../DownloadButton';\nimport { EditVariablesButton } from '../Variables';\nimport { EditDatasourcesButton } from '../Datasources';\nimport { EditButton } from '../EditButton';\nimport { EditJsonButton } from '../EditJsonButton';\nimport { SaveDashboardButton } from '../SaveDashboardButton';\nimport { DashboardStickyToolbar } from '../DashboardStickyToolbar';\n\nexport interface DashboardToolbarProps {\n dashboardName: string;\n dashboardTitleComponent?: JSX.Element;\n initialVariableIsSticky?: boolean;\n isReadonly: boolean;\n isVariableEnabled: boolean;\n isDatasourceEnabled: boolean;\n onEditButtonClick: () => void;\n onCancelButtonClick: () => void;\n onSave?: OnSaveDashboard;\n}\n\nexport const DashboardToolbar = (props: DashboardToolbarProps): ReactElement => {\n const {\n dashboardName,\n dashboardTitleComponent,\n initialVariableIsSticky,\n isReadonly,\n isVariableEnabled,\n isDatasourceEnabled,\n onEditButtonClick,\n onCancelButtonClick,\n onSave,\n } = props;\n\n const { isEditMode } = useEditMode();\n\n const isBiggerThanSm = useMediaQuery(useTheme().breakpoints.up('sm'));\n const isBiggerThanMd = useMediaQuery(useTheme().breakpoints.up('md'));\n\n const { timeZone, setTimeZone } = useTimeZone();\n const timeZoneOptions = getTimeZoneOptions();\n\n const dashboardTitle = dashboardTitleComponent ? (\n dashboardTitleComponent\n ) : (\n <Typography variant=\"h2\">{dashboardName}</Typography>\n );\n\n const testId = 'dashboard-toolbar';\n\n const handleTimeZoneChange = useCallback(\n (timeZoneOption: TimeZoneOption) => {\n setTimeZone(timeZoneOption.value);\n },\n [setTimeZone]\n );\n\n return (\n <Stack data-testid={testId}>\n <Box\n px={2}\n py={1.5}\n display=\"flex\"\n sx={{ backgroundColor: (theme) => theme.palette.primary.main + (isEditMode ? '30' : '0') }}\n >\n {dashboardTitle}\n {isEditMode ? (\n <Stack direction=\"row\" gap={1} ml=\"auto\">\n {isReadonly && (\n <Alert severity=\"warning\" sx={{ backgroundColor: 'transparent', padding: 0 }}>\n Dashboard managed via code only. Download JSON and commit changes to save.\n </Alert>\n )}\n <Stack direction=\"row\" spacing={0.5} ml={1} whiteSpace=\"nowrap\">\n {isVariableEnabled && <EditVariablesButton />}\n {isDatasourceEnabled && <EditDatasourcesButton />}\n <AddPanelButton />\n <AddGroupButton />\n </Stack>\n <SaveDashboardButton onSave={onSave} isDisabled={isReadonly} />\n <Button variant=\"outlined\" onClick={onCancelButtonClick}>\n Cancel\n </Button>\n </Stack>\n ) : (\n <>\n {isBiggerThanSm && (\n <Stack direction=\"row\" gap={1} ml=\"auto\">\n <EditButton onClick={onEditButtonClick} />\n </Stack>\n )}\n </>\n )}\n </Box>\n <Box\n sx={{\n display: 'flex',\n width: '100%',\n alignItems: 'start',\n padding: (theme) => theme.spacing(1, 2, 0, 2),\n flexDirection: isBiggerThanMd ? 'row' : 'column',\n flexWrap: 'nowrap',\n gap: 1,\n }}\n >\n <Box width=\"100%\">\n <ErrorBoundary FallbackComponent={ErrorAlert}>\n <DashboardStickyToolbar\n initialVariableIsSticky={initialVariableIsSticky}\n sx={{\n backgroundColor: ({ palette }) => palette.background.default,\n }}\n />\n </ErrorBoundary>\n </Box>\n <Stack direction=\"row\" ml=\"auto\" flexWrap=\"wrap\" justifyContent=\"end\">\n <Stack direction=\"row\" spacing={1} mt={1} ml={1}>\n <TimeRangeControls />\n <TimeZoneSelector timeZoneOptions={timeZoneOptions} value={timeZone} onChange={handleTimeZoneChange} />\n <DownloadButton />\n <EditJsonButton isReadonly={!isEditMode} />\n </Stack>\n </Stack>\n </Box>\n </Stack>\n );\n};\n"],"names":["Typography","Stack","Button","Box","useTheme","useMediaQuery","Alert","ErrorBoundary","ErrorAlert","TimeZoneSelector","getTimeZoneOptions","TimeRangeControls","useTimeZone","useCallback","useEditMode","AddPanelButton","AddGroupButton","DownloadButton","EditVariablesButton","EditDatasourcesButton","EditButton","EditJsonButton","SaveDashboardButton","DashboardStickyToolbar","DashboardToolbar","props","dashboardName","dashboardTitleComponent","initialVariableIsSticky","isReadonly","isVariableEnabled","isDatasourceEnabled","onEditButtonClick","onCancelButtonClick","onSave","isEditMode","isBiggerThanSm","breakpoints","up","isBiggerThanMd","timeZone","setTimeZone","timeZoneOptions","dashboardTitle","variant","testId","handleTimeZoneChange","timeZoneOption","value","data-testid","px","py","display","sx","backgroundColor","theme","palette","primary","main","direction","gap","ml","severity","padding","spacing","whiteSpace","isDisabled","onClick","width","alignItems","flexDirection","flexWrap","FallbackComponent","background","default","justifyContent","mt","onChange"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/DashboardToolbar/DashboardToolbar.tsx"],"sourcesContent":["// Copyright 2023 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 { Typography, Stack, Button, Box, useTheme, useMediaQuery, Alert } from '@mui/material';\nimport { ErrorBoundary, ErrorAlert } from '@perses-dev/components';\nimport { TimeRangeControls } from '@perses-dev/plugin-system';\nimport { ReactElement } from 'react';\nimport { OnSaveDashboard, useEditMode } from '../../context';\nimport { AddPanelButton } from '../AddPanelButton';\nimport { AddGroupButton } from '../AddGroupButton';\nimport { DownloadButton } from '../DownloadButton';\nimport { EditVariablesButton } from '../Variables';\nimport { EditDatasourcesButton } from '../Datasources';\nimport { EditButton } from '../EditButton';\nimport { EditJsonButton } from '../EditJsonButton';\nimport { SaveDashboardButton } from '../SaveDashboardButton';\nimport { DashboardStickyToolbar } from '../DashboardStickyToolbar';\n\nexport interface DashboardToolbarProps {\n dashboardName: string;\n dashboardTitleComponent?: JSX.Element;\n initialVariableIsSticky?: boolean;\n isReadonly: boolean;\n isVariableEnabled: boolean;\n isDatasourceEnabled: boolean;\n onEditButtonClick: () => void;\n onCancelButtonClick: () => void;\n onSave?: OnSaveDashboard;\n}\n\nexport const DashboardToolbar = (props: DashboardToolbarProps): ReactElement => {\n const {\n dashboardName,\n dashboardTitleComponent,\n initialVariableIsSticky,\n isReadonly,\n isVariableEnabled,\n isDatasourceEnabled,\n onEditButtonClick,\n onCancelButtonClick,\n onSave,\n } = props;\n\n const { isEditMode } = useEditMode();\n\n const isBiggerThanSm = useMediaQuery(useTheme().breakpoints.up('sm'));\n const isBiggerThanMd = useMediaQuery(useTheme().breakpoints.up('md'));\n\n const dashboardTitle = dashboardTitleComponent ? (\n dashboardTitleComponent\n ) : (\n <Typography variant=\"h2\">{dashboardName}</Typography>\n );\n\n const testId = 'dashboard-toolbar';\n\n return (\n <>\n <Stack data-testid={testId}>\n <Box\n px={2}\n py={1.5}\n display=\"flex\"\n sx={{ backgroundColor: (theme) => theme.palette.primary.main + (isEditMode ? '30' : '0') }}\n >\n {dashboardTitle}\n {isEditMode ? (\n <Stack direction=\"row\" gap={1} ml=\"auto\">\n {isReadonly && (\n <Alert severity=\"warning\" sx={{ backgroundColor: 'transparent', padding: 0 }}>\n Dashboard managed via code only. Download JSON and commit changes to save.\n </Alert>\n )}\n <Stack direction=\"row\" spacing={0.5} ml={1} whiteSpace=\"nowrap\">\n {isVariableEnabled && <EditVariablesButton />}\n {isDatasourceEnabled && <EditDatasourcesButton />}\n <AddPanelButton />\n <AddGroupButton />\n </Stack>\n <SaveDashboardButton onSave={onSave} isDisabled={isReadonly} />\n <Button variant=\"outlined\" onClick={onCancelButtonClick}>\n Cancel\n </Button>\n </Stack>\n ) : (\n <>\n {isBiggerThanSm && (\n <Stack direction=\"row\" gap={1} ml=\"auto\">\n <EditButton onClick={onEditButtonClick} />\n </Stack>\n )}\n </>\n )}\n </Box>\n <Box\n sx={{\n display: 'flex',\n width: '100%',\n alignItems: 'start',\n padding: (theme) => theme.spacing(1, 2, 0, 2),\n flexDirection: isBiggerThanMd ? 'row' : 'column',\n flexWrap: 'nowrap',\n gap: 1,\n }}\n >\n <Box width=\"100%\">\n <ErrorBoundary FallbackComponent={ErrorAlert}>\n <DashboardStickyToolbar\n initialVariableIsSticky={initialVariableIsSticky}\n sx={{\n backgroundColor: ({ palette }) => palette.background.default,\n }}\n />\n </ErrorBoundary>\n </Box>\n <Stack direction=\"row\" ml=\"auto\" flexWrap=\"wrap\" justifyContent=\"end\">\n <Stack direction=\"row\" spacing={1} mt={1} ml={1}>\n <TimeRangeControls />\n <DownloadButton />\n <EditJsonButton isReadonly={!isEditMode} />\n </Stack>\n </Stack>\n </Box>\n </Stack>\n </>\n );\n};\n"],"names":["Typography","Stack","Button","Box","useTheme","useMediaQuery","Alert","ErrorBoundary","ErrorAlert","TimeRangeControls","useEditMode","AddPanelButton","AddGroupButton","DownloadButton","EditVariablesButton","EditDatasourcesButton","EditButton","EditJsonButton","SaveDashboardButton","DashboardStickyToolbar","DashboardToolbar","props","dashboardName","dashboardTitleComponent","initialVariableIsSticky","isReadonly","isVariableEnabled","isDatasourceEnabled","onEditButtonClick","onCancelButtonClick","onSave","isEditMode","isBiggerThanSm","breakpoints","up","isBiggerThanMd","dashboardTitle","variant","testId","data-testid","px","py","display","sx","backgroundColor","theme","palette","primary","main","direction","gap","ml","severity","padding","spacing","whiteSpace","isDisabled","onClick","width","alignItems","flexDirection","flexWrap","FallbackComponent","background","default","justifyContent","mt"],"mappings":"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"}
@@ -9,6 +9,11 @@ export interface PanelProps extends CardProps<'section'> {
9
9
  editHandlers?: PanelHeaderProps['editHandlers'];
10
10
  panelOptions?: PanelOptions;
11
11
  panelGroupItemId?: PanelGroupItemId;
12
+ /**
13
+ * Project name to use for the panel. If not provided, will attempt to extract from URL.
14
+ * @default extracted from URL or 'unknown-project'
15
+ */
16
+ projectName?: string;
12
17
  }
13
18
  export type PanelOptions = {
14
19
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAqB,SAAS,EAAE,MAAM,eAAe,CAAC;AAE7D,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEnD,OAAO,EAAE,SAAS,EAA2B,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEjD,OAAO,EAAe,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAE9D,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,SAAS,CAAC;IACtD,UAAU,EAAE,eAAe,CAAC;IAC5B,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC;AAED,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,SAAS,CAAC;CAC/C,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,KAAK,kDAmGhB,CAAC"}
1
+ {"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAqB,SAAS,EAAE,MAAM,eAAe,CAAC;AAE7D,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEnD,OAAO,EAAE,SAAS,EAA2B,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEjD,OAAO,EAAe,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAE9D,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,SAAS,CAAC;IACtD,UAAU,EAAE,eAAe,CAAC;IAC5B,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,SAAS,CAAC;CAC/C,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC,CAAC;AA8CF;;;;;;;GAOG;AACH,eAAO,MAAM,KAAK,kDAyHhB,CAAC"}
@@ -18,6 +18,39 @@ import { memo, useMemo, useState } from 'react';
18
18
  import useResizeObserver from 'use-resize-observer';
19
19
  import { PanelContent } from './PanelContent';
20
20
  import { PanelHeader } from './PanelHeader';
21
+ // Function to extract project name from URL (kept as fallback)
22
+ const extractProjectNameFromUrl = ()=>{
23
+ try {
24
+ if (process.env.NODE_ENV === 'test') {
25
+ return 'test-project';
26
+ }
27
+ if (typeof window !== 'undefined' && (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1')) {
28
+ const urlPath = window.location.pathname;
29
+ if (urlPath === '/' || urlPath === '') {
30
+ return 'dev-project';
31
+ }
32
+ }
33
+ const urlPath = window.location.pathname;
34
+ // Split the path and look for the project name after "/projects/"
35
+ const pathSegments = urlPath.split('/').filter((segment)=>segment.length > 0);
36
+ const projectsIndex = pathSegments.findIndex((segment)=>segment === 'projects');
37
+ if (projectsIndex !== -1 && projectsIndex + 1 < pathSegments.length) {
38
+ const projectName = pathSegments[projectsIndex + 1];
39
+ if (projectName && projectName.trim().length > 0) {
40
+ return projectName;
41
+ }
42
+ }
43
+ // Fallback: try to extract from URL parameters
44
+ const urlParams = new URLSearchParams(window.location.search);
45
+ const projectParam = urlParams.get('project');
46
+ if (projectParam && projectParam.trim().length > 0) {
47
+ return projectParam;
48
+ }
49
+ return 'unknown-project';
50
+ } catch {
51
+ return 'unknown-project';
52
+ }
53
+ };
21
54
  /**
22
55
  * Renders a PanelDefinition's content inside of a Card.
23
56
  *
@@ -26,7 +59,7 @@ import { PanelHeader } from './PanelHeader';
26
59
  * <PanelContent> // renders loading, error or panel based on the queries' status
27
60
  * <PanelPluginLoader> // loads a panel plugin from the plugin registry and renders the PanelComponent with data from props.queryResults
28
61
  */ export const Panel = /*#__PURE__*/ memo(function Panel(props) {
29
- const { definition, readHandlers, editHandlers, onMouseEnter, onMouseLeave, sx, panelOptions, panelGroupItemId, ...others } = props;
62
+ const { definition, readHandlers, editHandlers, onMouseEnter, onMouseLeave, sx, panelOptions, panelGroupItemId, projectName: providedProjectName, ...others } = props;
30
63
  // Make sure we have an ID we can use for aria attributes
31
64
  const generatedPanelId = useId('Panel');
32
65
  const headerId = `${generatedPanelId}-header`;
@@ -46,6 +79,29 @@ import { PanelHeader } from './PanelHeader';
46
79
  ]);
47
80
  const chartsTheme = useChartsTheme();
48
81
  const { queryResults } = useDataQueriesContext();
82
+ // Use provided project name or extract from URL as fallback
83
+ const projectName = useMemo(()=>{
84
+ return providedProjectName || extractProjectNameFromUrl();
85
+ }, [
86
+ providedProjectName
87
+ ]);
88
+ const panelPropsForActions = useMemo(()=>{
89
+ return {
90
+ spec: definition.spec.plugin.spec,
91
+ queryResults: queryResults.map((query)=>({
92
+ definition: query.definition,
93
+ data: query.data
94
+ })),
95
+ contentDimensions,
96
+ definition,
97
+ projectName
98
+ };
99
+ }, [
100
+ definition,
101
+ contentDimensions,
102
+ queryResults,
103
+ projectName
104
+ ]);
49
105
  const handleMouseEnter = (e)=>{
50
106
  onMouseEnter?.(e);
51
107
  };
@@ -80,9 +136,12 @@ import { PanelHeader } from './PanelHeader';
80
136
  title: definition.spec.display.name,
81
137
  description: definition.spec.display.description,
82
138
  queryResults: queryResults,
139
+ panelPluginKind: definition.spec.plugin.kind,
83
140
  readHandlers: readHandlers,
84
141
  editHandlers: editHandlers,
85
142
  links: definition.spec.links,
143
+ projectName: projectName,
144
+ panelProps: panelPropsForActions,
86
145
  sx: {
87
146
  paddingX: `${chartsTheme.container.padding.default}px`
88
147
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Panel/Panel.tsx"],"sourcesContent":["// Copyright 2023 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 { Card, CardContent, CardProps } from '@mui/material';\nimport { ErrorAlert, ErrorBoundary, combineSx, useChartsTheme, useId } from '@perses-dev/components';\nimport { PanelDefinition } from '@perses-dev/core';\nimport { useDataQueriesContext } from '@perses-dev/plugin-system';\nimport { ReactNode, memo, useMemo, useState } from 'react';\nimport useResizeObserver from 'use-resize-observer';\nimport { PanelGroupItemId } from '../../context';\nimport { PanelContent } from './PanelContent';\nimport { PanelHeader, PanelHeaderProps } from './PanelHeader';\n\nexport interface PanelProps extends CardProps<'section'> {\n definition: PanelDefinition;\n readHandlers?: PanelHeaderProps['readHandlers'];\n editHandlers?: PanelHeaderProps['editHandlers'];\n panelOptions?: PanelOptions;\n panelGroupItemId?: PanelGroupItemId;\n}\n\nexport type PanelOptions = {\n /**\n * Allow you to hide the panel header if desired.\n * This can be useful in embedded mode for example.\n */\n hideHeader?: boolean;\n /**\n * Content to render in right of the panel header. (top right of the panel)\n * It will only be rendered when the panel is in edit mode.\n */\n extra?: (props: PanelExtraProps) => ReactNode;\n};\n\nexport type PanelExtraProps = {\n /**\n * The PanelDefinition for the panel.\n */\n panelDefinition?: PanelDefinition;\n /**\n * The PanelGroupItemId for the panel.\n */\n panelGroupItemId?: PanelGroupItemId;\n};\n\n/**\n * Renders a PanelDefinition's content inside of a Card.\n *\n * Internal structure:\n * <Panel> // renders an entire panel, incl. header and action buttons\n * <PanelContent> // renders loading, error or panel based on the queries' status\n * <PanelPluginLoader> // loads a panel plugin from the plugin registry and renders the PanelComponent with data from props.queryResults\n */\nexport const Panel = memo(function Panel(props: PanelProps) {\n const {\n definition,\n readHandlers,\n editHandlers,\n onMouseEnter,\n onMouseLeave,\n sx,\n panelOptions,\n panelGroupItemId,\n ...others\n } = props;\n\n // Make sure we have an ID we can use for aria attributes\n const generatedPanelId = useId('Panel');\n const headerId = `${generatedPanelId}-header`;\n\n const [contentElement, setContentElement] = useState<HTMLElement | null>(null);\n\n const { width, height } = useResizeObserver({ ref: contentElement });\n\n const contentDimensions = useMemo(() => {\n if (width === undefined || height === undefined) return undefined;\n return { width, height };\n }, [width, height]);\n\n const chartsTheme = useChartsTheme();\n\n const { queryResults } = useDataQueriesContext();\n\n const handleMouseEnter: CardProps['onMouseEnter'] = (e) => {\n onMouseEnter?.(e);\n };\n\n const handleMouseLeave: CardProps['onMouseLeave'] = (e) => {\n onMouseLeave?.(e);\n };\n\n return (\n <Card\n component=\"section\"\n sx={combineSx(\n {\n width: '100%',\n height: '100%',\n display: 'flex',\n flexFlow: 'column nowrap',\n ':hover': { '--panel-hover': 'block' },\n },\n sx\n )}\n variant=\"outlined\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n aria-labelledby={headerId}\n aria-describedby={headerId}\n data-testid=\"panel\"\n {...others}\n >\n {!panelOptions?.hideHeader && (\n <PanelHeader\n extra={panelOptions?.extra?.({ panelDefinition: definition, panelGroupItemId })}\n id={headerId}\n title={definition.spec.display.name}\n description={definition.spec.display.description}\n queryResults={queryResults}\n readHandlers={readHandlers}\n editHandlers={editHandlers}\n links={definition.spec.links}\n sx={{ paddingX: `${chartsTheme.container.padding.default}px` }}\n />\n )}\n <CardContent\n component=\"figure\"\n sx={{\n position: 'relative',\n overflow: 'hidden',\n flexGrow: 1,\n margin: 0,\n padding: 0,\n // Override MUI default style for last-child\n ':last-child': {\n padding: 0,\n },\n }}\n ref={setContentElement}\n >\n <ErrorBoundary FallbackComponent={ErrorAlert} resetKeys={[definition.spec]}>\n <PanelContent\n definition={definition}\n panelPluginKind={definition.spec.plugin.kind}\n spec={definition.spec.plugin.spec}\n contentDimensions={contentDimensions}\n queryResults={queryResults}\n />\n </ErrorBoundary>\n </CardContent>\n </Card>\n );\n});\n"],"names":["Card","CardContent","ErrorAlert","ErrorBoundary","combineSx","useChartsTheme","useId","useDataQueriesContext","memo","useMemo","useState","useResizeObserver","PanelContent","PanelHeader","Panel","props","definition","readHandlers","editHandlers","onMouseEnter","onMouseLeave","sx","panelOptions","panelGroupItemId","others","generatedPanelId","headerId","contentElement","setContentElement","width","height","ref","contentDimensions","undefined","chartsTheme","queryResults","handleMouseEnter","e","handleMouseLeave","component","display","flexFlow","variant","aria-labelledby","aria-describedby","data-testid","hideHeader","extra","panelDefinition","id","title","spec","name","description","links","paddingX","container","padding","default","position","overflow","flexGrow","margin","FallbackComponent","resetKeys","panelPluginKind","plugin","kind"],"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,SAASA,IAAI,EAAEC,WAAW,QAAmB,gBAAgB;AAC7D,SAASC,UAAU,EAAEC,aAAa,EAAEC,SAAS,EAAEC,cAAc,EAAEC,KAAK,QAAQ,yBAAyB;AAErG,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAAoBC,IAAI,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAQ;AAC3D,OAAOC,uBAAuB,sBAAsB;AAEpD,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,WAAW,QAA0B,gBAAgB;AAkC9D;;;;;;;CAOC,GACD,OAAO,MAAMC,sBAAQN,KAAK,SAASM,MAAMC,KAAiB;IACxD,MAAM,EACJC,UAAU,EACVC,YAAY,EACZC,YAAY,EACZC,YAAY,EACZC,YAAY,EACZC,EAAE,EACFC,YAAY,EACZC,gBAAgB,EAChB,GAAGC,QACJ,GAAGT;IAEJ,yDAAyD;IACzD,MAAMU,mBAAmBnB,MAAM;IAC/B,MAAMoB,WAAW,GAAGD,iBAAiB,OAAO,CAAC;IAE7C,MAAM,CAACE,gBAAgBC,kBAAkB,GAAGlB,SAA6B;IAEzE,MAAM,EAAEmB,KAAK,EAAEC,MAAM,EAAE,GAAGnB,kBAAkB;QAAEoB,KAAKJ;IAAe;IAElE,MAAMK,oBAAoBvB,QAAQ;QAChC,IAAIoB,UAAUI,aAAaH,WAAWG,WAAW,OAAOA;QACxD,OAAO;YAAEJ;YAAOC;QAAO;IACzB,GAAG;QAACD;QAAOC;KAAO;IAElB,MAAMI,cAAc7B;IAEpB,MAAM,EAAE8B,YAAY,EAAE,GAAG5B;IAEzB,MAAM6B,mBAA8C,CAACC;QACnDlB,eAAekB;IACjB;IAEA,MAAMC,mBAA8C,CAACD;QACnDjB,eAAeiB;IACjB;IAEA,qBACE,MAACrC;QACCuC,WAAU;QACVlB,IAAIjB,UACF;YACEyB,OAAO;YACPC,QAAQ;YACRU,SAAS;YACTC,UAAU;YACV,UAAU;gBAAE,iBAAiB;YAAQ;QACvC,GACApB;QAEFqB,SAAQ;QACRvB,cAAciB;QACdhB,cAAckB;QACdK,mBAAiBjB;QACjBkB,oBAAkBlB;QAClBmB,eAAY;QACX,GAAGrB,MAAM;;YAET,CAACF,cAAcwB,4BACd,KAACjC;gBACCkC,OAAOzB,cAAcyB,QAAQ;oBAAEC,iBAAiBhC;oBAAYO;gBAAiB;gBAC7E0B,IAAIvB;gBACJwB,OAAOlC,WAAWmC,IAAI,CAACX,OAAO,CAACY,IAAI;gBACnCC,aAAarC,WAAWmC,IAAI,CAACX,OAAO,CAACa,WAAW;gBAChDlB,cAAcA;gBACdlB,cAAcA;gBACdC,cAAcA;gBACdoC,OAAOtC,WAAWmC,IAAI,CAACG,KAAK;gBAC5BjC,IAAI;oBAAEkC,UAAU,GAAGrB,YAAYsB,SAAS,CAACC,OAAO,CAACC,OAAO,CAAC,EAAE,CAAC;gBAAC;;0BAGjE,KAACzD;gBACCsC,WAAU;gBACVlB,IAAI;oBACFsC,UAAU;oBACVC,UAAU;oBACVC,UAAU;oBACVC,QAAQ;oBACRL,SAAS;oBACT,4CAA4C;oBAC5C,eAAe;wBACbA,SAAS;oBACX;gBACF;gBACA1B,KAAKH;0BAEL,cAAA,KAACzB;oBAAc4D,mBAAmB7D;oBAAY8D,WAAW;wBAAChD,WAAWmC,IAAI;qBAAC;8BACxE,cAAA,KAACvC;wBACCI,YAAYA;wBACZiD,iBAAiBjD,WAAWmC,IAAI,CAACe,MAAM,CAACC,IAAI;wBAC5ChB,MAAMnC,WAAWmC,IAAI,CAACe,MAAM,CAACf,IAAI;wBACjCnB,mBAAmBA;wBACnBG,cAAcA;;;;;;AAM1B,GAAG"}
1
+ {"version":3,"sources":["../../../src/components/Panel/Panel.tsx"],"sourcesContent":["// Copyright 2023 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 { Card, CardContent, CardProps } from '@mui/material';\nimport { ErrorAlert, ErrorBoundary, combineSx, useChartsTheme, useId } from '@perses-dev/components';\nimport { PanelDefinition } from '@perses-dev/core';\nimport { useDataQueriesContext } from '@perses-dev/plugin-system';\nimport { ReactNode, memo, useMemo, useState } from 'react';\nimport useResizeObserver from 'use-resize-observer';\nimport { PanelGroupItemId } from '../../context';\nimport { PanelContent } from './PanelContent';\nimport { PanelHeader, PanelHeaderProps } from './PanelHeader';\n\nexport interface PanelProps extends CardProps<'section'> {\n definition: PanelDefinition;\n readHandlers?: PanelHeaderProps['readHandlers'];\n editHandlers?: PanelHeaderProps['editHandlers'];\n panelOptions?: PanelOptions;\n panelGroupItemId?: PanelGroupItemId;\n /**\n * Project name to use for the panel. If not provided, will attempt to extract from URL.\n * @default extracted from URL or 'unknown-project'\n */\n projectName?: string;\n}\n\nexport type PanelOptions = {\n /**\n * Allow you to hide the panel header if desired.\n * This can be useful in embedded mode for example.\n */\n hideHeader?: boolean;\n /**\n * Content to render in right of the panel header. (top right of the panel)\n * It will only be rendered when the panel is in edit mode.\n */\n extra?: (props: PanelExtraProps) => ReactNode;\n};\n\nexport type PanelExtraProps = {\n /**\n * The PanelDefinition for the panel.\n */\n panelDefinition?: PanelDefinition;\n /**\n * The PanelGroupItemId for the panel.\n */\n panelGroupItemId?: PanelGroupItemId;\n};\n\n// Function to extract project name from URL (kept as fallback)\nconst extractProjectNameFromUrl = (): string => {\n try {\n if (process.env.NODE_ENV === 'test') {\n return 'test-project';\n }\n\n if (\n typeof window !== 'undefined' &&\n (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1')\n ) {\n const urlPath = window.location.pathname;\n\n if (urlPath === '/' || urlPath === '') {\n return 'dev-project';\n }\n }\n\n const urlPath = window.location.pathname;\n\n // Split the path and look for the project name after \"/projects/\"\n const pathSegments = urlPath.split('/').filter((segment) => segment.length > 0);\n const projectsIndex = pathSegments.findIndex((segment) => segment === 'projects');\n\n if (projectsIndex !== -1 && projectsIndex + 1 < pathSegments.length) {\n const projectName = pathSegments[projectsIndex + 1];\n if (projectName && projectName.trim().length > 0) {\n return projectName;\n }\n }\n\n // Fallback: try to extract from URL parameters\n const urlParams = new URLSearchParams(window.location.search);\n const projectParam = urlParams.get('project');\n if (projectParam && projectParam.trim().length > 0) {\n return projectParam;\n }\n\n return 'unknown-project';\n } catch {\n return 'unknown-project';\n }\n};\n\n/**\n * Renders a PanelDefinition's content inside of a Card.\n *\n * Internal structure:\n * <Panel> // renders an entire panel, incl. header and action buttons\n * <PanelContent> // renders loading, error or panel based on the queries' status\n * <PanelPluginLoader> // loads a panel plugin from the plugin registry and renders the PanelComponent with data from props.queryResults\n */\nexport const Panel = memo(function Panel(props: PanelProps) {\n const {\n definition,\n readHandlers,\n editHandlers,\n onMouseEnter,\n onMouseLeave,\n sx,\n panelOptions,\n panelGroupItemId,\n projectName: providedProjectName,\n ...others\n } = props;\n\n // Make sure we have an ID we can use for aria attributes\n const generatedPanelId = useId('Panel');\n const headerId = `${generatedPanelId}-header`;\n\n const [contentElement, setContentElement] = useState<HTMLElement | null>(null);\n\n const { width, height } = useResizeObserver({ ref: contentElement });\n\n const contentDimensions = useMemo(() => {\n if (width === undefined || height === undefined) return undefined;\n return { width, height };\n }, [width, height]);\n\n const chartsTheme = useChartsTheme();\n\n const { queryResults } = useDataQueriesContext();\n\n // Use provided project name or extract from URL as fallback\n const projectName = useMemo(() => {\n return providedProjectName || extractProjectNameFromUrl();\n }, [providedProjectName]);\n\n const panelPropsForActions = useMemo(() => {\n return {\n spec: definition.spec.plugin.spec,\n queryResults: queryResults.map((query) => ({\n definition: query.definition,\n data: query.data,\n })),\n contentDimensions,\n definition,\n projectName,\n };\n }, [definition, contentDimensions, queryResults, projectName]);\n\n const handleMouseEnter: CardProps['onMouseEnter'] = (e) => {\n onMouseEnter?.(e);\n };\n\n const handleMouseLeave: CardProps['onMouseLeave'] = (e) => {\n onMouseLeave?.(e);\n };\n\n return (\n <Card\n component=\"section\"\n sx={combineSx(\n {\n width: '100%',\n height: '100%',\n display: 'flex',\n flexFlow: 'column nowrap',\n ':hover': { '--panel-hover': 'block' },\n },\n sx\n )}\n variant=\"outlined\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n aria-labelledby={headerId}\n aria-describedby={headerId}\n data-testid=\"panel\"\n {...others}\n >\n {!panelOptions?.hideHeader && (\n <PanelHeader\n extra={panelOptions?.extra?.({ panelDefinition: definition, panelGroupItemId })}\n id={headerId}\n title={definition.spec.display.name}\n description={definition.spec.display.description}\n queryResults={queryResults}\n panelPluginKind={definition.spec.plugin.kind}\n readHandlers={readHandlers}\n editHandlers={editHandlers}\n links={definition.spec.links}\n projectName={projectName}\n panelProps={panelPropsForActions}\n sx={{ paddingX: `${chartsTheme.container.padding.default}px` }}\n />\n )}\n <CardContent\n component=\"figure\"\n sx={{\n position: 'relative',\n overflow: 'hidden',\n flexGrow: 1,\n margin: 0,\n padding: 0,\n // Override MUI default style for last-child\n ':last-child': {\n padding: 0,\n },\n }}\n ref={setContentElement}\n >\n <ErrorBoundary FallbackComponent={ErrorAlert} resetKeys={[definition.spec]}>\n <PanelContent\n definition={definition}\n panelPluginKind={definition.spec.plugin.kind}\n spec={definition.spec.plugin.spec}\n contentDimensions={contentDimensions}\n queryResults={queryResults}\n />\n </ErrorBoundary>\n </CardContent>\n </Card>\n );\n});\n"],"names":["Card","CardContent","ErrorAlert","ErrorBoundary","combineSx","useChartsTheme","useId","useDataQueriesContext","memo","useMemo","useState","useResizeObserver","PanelContent","PanelHeader","extractProjectNameFromUrl","process","env","NODE_ENV","window","location","hostname","urlPath","pathname","pathSegments","split","filter","segment","length","projectsIndex","findIndex","projectName","trim","urlParams","URLSearchParams","search","projectParam","get","Panel","props","definition","readHandlers","editHandlers","onMouseEnter","onMouseLeave","sx","panelOptions","panelGroupItemId","providedProjectName","others","generatedPanelId","headerId","contentElement","setContentElement","width","height","ref","contentDimensions","undefined","chartsTheme","queryResults","panelPropsForActions","spec","plugin","map","query","data","handleMouseEnter","e","handleMouseLeave","component","display","flexFlow","variant","aria-labelledby","aria-describedby","data-testid","hideHeader","extra","panelDefinition","id","title","name","description","panelPluginKind","kind","links","panelProps","paddingX","container","padding","default","position","overflow","flexGrow","margin","FallbackComponent","resetKeys"],"mappings":"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"}
@@ -1,12 +1,12 @@
1
1
  /// <reference types="react" />
2
- import { QueryData } from '@perses-dev/plugin-system';
3
- import { Link } from '@perses-dev/core';
2
+ import { Link, TimeSeriesData } from '@perses-dev/core';
4
3
  export interface PanelActionsProps {
5
4
  title: string;
6
5
  description?: string;
7
6
  descriptionTooltipId: string;
8
7
  links?: Link[];
9
8
  extra?: React.ReactNode;
9
+ panelPluginKind: string;
10
10
  editHandlers?: {
11
11
  onEditPanelClick: () => void;
12
12
  onDuplicatePanelClick: () => void;
@@ -16,7 +16,9 @@ export interface PanelActionsProps {
16
16
  isPanelViewed?: boolean;
17
17
  onViewPanelClick: () => void;
18
18
  };
19
- queryResults: QueryData[];
19
+ queryResults: TimeSeriesData | undefined;
20
+ projectName?: string;
21
+ panelProps?: Record<string, unknown>;
20
22
  }
21
23
  export declare const PanelActions: React.FC<PanelActionsProps>;
22
24
  //# sourceMappingURL=PanelActions.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"PanelActions.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/PanelActions.tsx"],"names":[],"mappings":";AAuBA,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAGtD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAWxC,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IACf,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE;QACb,gBAAgB,EAAE,MAAM,IAAI,CAAC;QAC7B,qBAAqB,EAAE,MAAM,IAAI,CAAC;QAClC,kBAAkB,EAAE,MAAM,IAAI,CAAC;KAChC,CAAC;IACF,YAAY,CAAC,EAAE;QACb,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,gBAAgB,EAAE,MAAM,IAAI,CAAC;KAC9B,CAAC;IACF,YAAY,EAAE,SAAS,EAAE,CAAC;CAC3B;AASD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAqMpD,CAAC"}
1
+ {"version":3,"file":"PanelActions.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/PanelActions.tsx"],"names":[],"mappings":";AA0BA,OAAO,EAAE,IAAI,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAWxD,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IACf,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE;QACb,gBAAgB,EAAE,MAAM,IAAI,CAAC;QAC7B,qBAAqB,EAAE,MAAM,IAAI,CAAC;QAClC,kBAAkB,EAAE,MAAM,IAAI,CAAC;KAChC,CAAC;IACF,YAAY,CAAC,EAAE;QACb,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,gBAAgB,EAAE,MAAM,IAAI,CAAC;KAC9B,CAAC;IACF,YAAY,EAAE,cAAc,GAAG,SAAS,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACtC;AASD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA6RpD,CAAC"}