From 15236d4f22c7562e944a60e76a86f37e57648349 Mon Sep 17 00:00:00 2001 From: Monish <139316519+m-o-n-i-s-h@users.noreply.github.com> Date: Fri, 29 Sep 2023 19:41:27 +0530 Subject: [PATCH 1/5] execute btn changes --- src/card/Card.tsx | 2 + src/card/view/CardView.tsx | 84 +++++++++++++++++++++++++------------ src/config/ReportConfig.tsx | 18 ++++++++ src/page/Page.tsx | 4 ++ 4 files changed, 81 insertions(+), 27 deletions(-) diff --git a/src/card/Card.tsx b/src/card/Card.tsx index fe6ffe0d9..21f504022 100644 --- a/src/card/Card.tsx +++ b/src/card/Card.tsx @@ -39,6 +39,7 @@ const NeoCard = ({ extensions, // A set of enabled extensions. globalParameters, // Query parameters that are globally set for the entire dashboard. dashboardSettings, // Dictionary of settings for the entire dashboard. + enableExecuteButtonForIds, // Reports will have save buttons to execute cypher queries onRemovePressed, // action to take when the card is removed. (passed from parent) onClonePressed, // action to take when user presses the clone button onReportHelpButtonPressed, // action to take when someone clicks the 'help' button in the report settings. @@ -131,6 +132,7 @@ const NeoCard = ({ settingsOpen={settingsOpen} editable={editable} dashboardSettings={dashboardSettings} + enableExecuteButtonForIds={enableExecuteButtonForIds} extensions={extensions} settings={report.settings ? report.settings : {}} updateReportSetting={(name, value) => onReportSettingUpdate(id, name, value)} diff --git a/src/card/view/CardView.tsx b/src/card/view/CardView.tsx index ff4bd05b6..fc53ddf47 100644 --- a/src/card/view/CardView.tsx +++ b/src/card/view/CardView.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'; import { ReportItemContainer } from '../CardStyle'; import NeoCardViewHeader from './CardViewHeader'; import NeoCardViewFooter from './CardViewFooter'; -import { CardContent } from '@mui/material'; +import { CardContent, Fab } from '@mui/material'; import NeoCodeEditorComponent from '../../component/editor/CodeEditorComponent'; import { CARD_FOOTER_HEIGHT, CARD_HEADER_HEIGHT } from '../../config/CardConfig'; import { getReportTypes } from '../../extensions/ExtensionUtils'; @@ -14,6 +14,7 @@ import { PlayCircleIconSolid } from '@neo4j-ndl/react/icons'; import { extensionEnabled } from '../../utils/ReportUtils'; import { objMerge } from '../../utils/ObjectManipulation'; import { REPORT_TYPES } from '../../config/ReportConfig'; +import { PlayArrowOutlined } from '@mui/icons-material'; const NeoCardView = ({ id, @@ -31,6 +32,7 @@ const NeoCardView = ({ type, selection, dashboardSettings, + enableExecuteButtonForIds, settings, updateReportSetting, createNotification, @@ -138,6 +140,11 @@ const NeoCardView = ({ if (!settingsOpen) { setLastRunTimestamp(Date.now()); } + + // Resets the report with save button + if (enableExecuteButtonForIds.map((report) => report.id).includes(id)) { + setActive(false); + } }, [JSON.stringify(localParameters)]); useEffect(() => { @@ -168,6 +175,52 @@ const NeoCardView = ({ : `${reportHeight}px`, overflow: 'auto', }; + const executeButton = ( +
+ { + setActive(true); + }} + color='success' + size='small' + > + + Execute + +
+ ); + + const cypherQueryEditor = ( + <> + { + setActive(true); + }} + clean + size='small' + > + + + {}} + placeholder={'No query specified...'} + /> + + ); + const reportContent = ( {active ? ( @@ -194,33 +247,10 @@ const NeoCardView = ({ queryTimeLimit={dashboardSettings.queryTimeLimit ? dashboardSettings.queryTimeLimit : 20} setFields={onFieldsUpdate} /> + ) : settings.hideQueryEditorInAutoRunOnMode ? ( + executeButton ) : ( - <> - { - setActive(true); - }} - clean - > - - - {}} - placeholder={'No query specified...'} - /> - + cypherQueryEditor )} ); diff --git a/src/config/ReportConfig.tsx b/src/config/ReportConfig.tsx index 879199d96..d743689c8 100644 --- a/src/config/ReportConfig.tsx +++ b/src/config/ReportConfig.tsx @@ -25,6 +25,15 @@ export const RUN_QUERY_DELAY_MS = 300; // The default number of rows to process in a visualization. export const DEFAULT_ROW_LIMIT = 100; +const hideQueryEditorInAutoRunOnMode = { + hideQueryEditorInAutoRunOnMode: { + label: 'Hide query editor on auto run on mode', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, +}; + // A dictionary of available reports (visualizations). const _REPORT_TYPES = { table: { @@ -87,6 +96,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, refreshRate: { label: 'Refresh rate (seconds)', type: SELECTION_TYPES.NUMBER, @@ -285,6 +295,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, iconStyle: { label: 'Node Label images', type: SELECTION_TYPES.TEXT, @@ -459,6 +470,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, refreshRate: { label: 'Refresh rate (seconds)', type: SELECTION_TYPES.NUMBER, @@ -618,6 +630,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, refreshRate: { label: 'Refresh rate (seconds)', type: SELECTION_TYPES.NUMBER, @@ -795,6 +808,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, refreshRate: { label: 'Refresh rate (seconds)', type: SELECTION_TYPES.NUMBER, @@ -970,6 +984,7 @@ const _REPORT_TYPES = { // values: [true, false], // default: true, // }, + // ...hideQueryEditorInAutoRunOnMode, // refreshRate: { // label: 'Refresh rate (seconds)', // type: SELECTION_TYPES.NUMBER, @@ -1084,6 +1099,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, }, }, value: { @@ -1150,6 +1166,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, refreshRate: { label: 'Refresh rate (seconds)', type: SELECTION_TYPES.NUMBER, @@ -1194,6 +1211,7 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, + ...hideQueryEditorInAutoRunOnMode, refreshRate: { label: 'Refresh rate (seconds)', type: SELECTION_TYPES.NUMBER, diff --git a/src/page/Page.tsx b/src/page/Page.tsx index 6c3ec18fb..b0a213b02 100644 --- a/src/page/Page.tsx +++ b/src/page/Page.tsx @@ -49,6 +49,9 @@ export const NeoPage = ({ const [lastElement, setLastElement] = React.useState(
); const [animated, setAnimated] = React.useState(false); // To turn off animations when cards are dragged around. + // If hideQueryEditorInAutoRunOnMode is true and autorun option is false + const enableExecuteButtonForIds = reports.filter((report: any) => report.settings?.hideQueryEditorInAutoRunOnMode); + const availableHandles = () => { if (dashboardSettings.resizing && dashboardSettings.resizing == 'all') { return ['s', 'w', 'e', 'sw', 'se']; @@ -199,6 +202,7 @@ export const NeoPage = ({ id={id} key={getReportKey(pagenumber, id)} dashboardSettings={dashboardSettings} + enableExecuteButtonForIds={enableExecuteButtonForIds} onRemovePressed={onRemovePressed} onClonePressed={(id) => { const { x, y } = getAddCardButtonPosition(); From ddea19692e9a1f92bdf36129e8bc26712b3fc5fc Mon Sep 17 00:00:00 2001 From: Monish <139316519+m-o-n-i-s-h@users.noreply.github.com> Date: Fri, 29 Sep 2023 11:42:18 +0530 Subject: [PATCH 2/5] Merged execute btn name configurable changes --- src/config/ReportConfig.tsx | 132 +++++++++++++++++++++++++++++++++++- 1 file changed, 131 insertions(+), 1 deletion(-) diff --git a/src/config/ReportConfig.tsx b/src/config/ReportConfig.tsx index d743689c8..c4dd45900 100644 --- a/src/config/ReportConfig.tsx +++ b/src/config/ReportConfig.tsx @@ -313,6 +313,30 @@ const _REPORT_TYPES = { values: [true, false], default: false, }, + description: { + label: 'Report Description', + type: SELECTION_TYPES.MULTILINE_TEXT, + default: 'Enter markdown here...', + }, + customTablePropertiesOfModal: { + label: 'Customized Ordering and Hide Features Of Attributes In Detailed Modal', + type: SELECTION_TYPES.DICTIONARY, + }, + minimizable: { + label: 'Minimize Button', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + pageIdAndParameterName: { + label: '::', + type: SELECTION_TYPES.TEXT, + }, + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, }, }, bar: { @@ -476,6 +500,22 @@ const _REPORT_TYPES = { type: SELECTION_TYPES.NUMBER, default: '0 (No refresh)', }, + description: { + label: 'Report Description', + type: SELECTION_TYPES.MULTILINE_TEXT, + default: 'Enter markdown here...', + }, + minimizable: { + label: 'Minimize Button', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, }, }, pie: { @@ -636,6 +676,22 @@ const _REPORT_TYPES = { type: SELECTION_TYPES.NUMBER, default: '0 (No refresh)', }, + description: { + label: 'Report Description', + type: SELECTION_TYPES.MULTILINE_TEXT, + default: 'Enter markdown here...', + }, + minimizable: { + label: 'Minimize Button', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, }, }, line: { @@ -814,6 +870,22 @@ const _REPORT_TYPES = { type: SELECTION_TYPES.NUMBER, default: '0 (No refresh)', }, + description: { + label: 'Report Description', + type: SELECTION_TYPES.MULTILINE_TEXT, + default: 'Enter markdown here...', + }, + minimizable: { + label: 'Minimize Button', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, }, }, // TODO - move to advanced visualization. @@ -995,6 +1067,11 @@ const _REPORT_TYPES = { // type: SELECTION_TYPES.MULTILINE_TEXT, // default: 'Enter markdown here...', // }, + // executeButtonName: { + // label: 'Execute Button Name', + // type: SELECTION_TYPES.TEXT, + // default: 'Execute', + // }, // }, // }, map: { @@ -1099,7 +1176,28 @@ const _REPORT_TYPES = { values: [true, false], default: true, }, - ...hideQueryEditorInAutoRunOnMode, + hideQueryEditorInAutoRunOnMode: { + label: 'Hide query editor on auto run on mode', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + description: { + label: 'Report Description', + type: SELECTION_TYPES.MULTILINE_TEXT, + default: 'Enter markdown here...', + }, + minimizable: { + label: 'Minimize Button', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, }, }, value: { @@ -1172,6 +1270,22 @@ const _REPORT_TYPES = { type: SELECTION_TYPES.NUMBER, default: '0 (No refresh)', }, + description: { + label: 'Report Description', + type: SELECTION_TYPES.MULTILINE_TEXT, + default: 'Enter markdown here...', + }, + minimizable: { + label: 'Minimize Button', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, }, }, json: { @@ -1217,6 +1331,22 @@ const _REPORT_TYPES = { type: SELECTION_TYPES.NUMBER, default: '0 (No refresh)', }, + description: { + label: 'Report Description', + type: SELECTION_TYPES.MULTILINE_TEXT, + default: 'Enter markdown here...', + }, + minimizable: { + label: 'Minimize Button', + type: SELECTION_TYPES.LIST, + values: [true, false], + default: false, + }, + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, }, }, select: { From 6dcf9af08bd90004ad95502f0973d4890505d0f4 Mon Sep 17 00:00:00 2001 From: Monish <139316519+m-o-n-i-s-h@users.noreply.github.com> Date: Fri, 29 Sep 2023 11:42:18 +0530 Subject: [PATCH 3/5] Btn changes added --- src/card/view/CardView.tsx | 35 ++++++++++++++++++++--------------- 1 file changed, 20 insertions(+), 15 deletions(-) diff --git a/src/card/view/CardView.tsx b/src/card/view/CardView.tsx index fc53ddf47..63abfb9ed 100644 --- a/src/card/view/CardView.tsx +++ b/src/card/view/CardView.tsx @@ -2,19 +2,18 @@ import React, { useEffect, useState } from 'react'; import { ReportItemContainer } from '../CardStyle'; import NeoCardViewHeader from './CardViewHeader'; import NeoCardViewFooter from './CardViewFooter'; -import { CardContent, Fab } from '@mui/material'; +import { CardContent, Fab, Stack } from '@mui/material'; import NeoCodeEditorComponent from '../../component/editor/CodeEditorComponent'; import { CARD_FOOTER_HEIGHT, CARD_HEADER_HEIGHT } from '../../config/CardConfig'; import { getReportTypes } from '../../extensions/ExtensionUtils'; import NeoCodeViewerComponent from '../../component/editor/CodeViewerComponent'; import { NeoReportWrapper } from '../../report/ReportWrapper'; import { identifyStyleRuleParameters } from '../../extensions/styling/StyleRuleEvaluator'; -import { IconButton } from '@neo4j-ndl/react'; -import { PlayCircleIconSolid } from '@neo4j-ndl/react/icons'; +import { IconButton, Typography } from '@neo4j-ndl/react'; +import { PlayCircleIconSolid, PlayIconOutline } from '@neo4j-ndl/react/icons'; import { extensionEnabled } from '../../utils/ReportUtils'; import { objMerge } from '../../utils/ObjectManipulation'; import { REPORT_TYPES } from '../../config/ReportConfig'; -import { PlayArrowOutlined } from '@mui/icons-material'; const NeoCardView = ({ id, @@ -177,17 +176,23 @@ const NeoCardView = ({ }; const executeButton = (
- { - setActive(true); - }} - color='success' - size='small' - > - - Execute - + + { + setActive(true); + }} + size='large' + style={{ + color: '#ffffff', + backgroundColor: 'green', + }} + > + + + + {settings.executeButtonName ?? 'Execute'} + +
); From 716866a0d260044f0cdc3a7fdf17ec8f447bbe61 Mon Sep 17 00:00:00 2001 From: Monish <139316519+m-o-n-i-s-h@users.noreply.github.com> Date: Thu, 28 Sep 2023 21:38:08 +0530 Subject: [PATCH 4/5] Execute Button Disabled Functionality --- src/card/view/CardView.tsx | 12 ++++++++++++ src/utils/parameterUtils.ts | 22 ++++++++++++++++++++++ 2 files changed, 34 insertions(+) create mode 100644 src/utils/parameterUtils.ts diff --git a/src/card/view/CardView.tsx b/src/card/view/CardView.tsx index 63abfb9ed..dd743ab35 100644 --- a/src/card/view/CardView.tsx +++ b/src/card/view/CardView.tsx @@ -12,6 +12,8 @@ import { identifyStyleRuleParameters } from '../../extensions/styling/StyleRuleE import { IconButton, Typography } from '@neo4j-ndl/react'; import { PlayCircleIconSolid, PlayIconOutline } from '@neo4j-ndl/react/icons'; import { extensionEnabled } from '../../utils/ReportUtils'; +import { PlayArrowOutlined } from '@mui/icons-material'; +import { checkParametersNameInGlobalParameter, extractAllParameterNames } from '../../utils/parameterUtils'; import { objMerge } from '../../utils/ObjectManipulation'; import { REPORT_TYPES } from '../../config/ReportConfig'; @@ -174,10 +176,20 @@ const NeoCardView = ({ : `${reportHeight}px`, overflow: 'auto', }; + + const isParametersDefined = (cypherQuery: string) => { + const parameterNames = extractAllParameterNames(cypherQuery); + if (globalParameters) { + return checkParametersNameInGlobalParameter(parameterNames, globalParameters); + } + return false; + }; + const executeButton = (
{ setActive(true); }} diff --git a/src/utils/parameterUtils.ts b/src/utils/parameterUtils.ts new file mode 100644 index 000000000..d2ce7b0a0 --- /dev/null +++ b/src/utils/parameterUtils.ts @@ -0,0 +1,22 @@ +export const extractAllParameterNames = (cypherQuery) => { + // A regular expression pattern to match parameter names following '$' + const pattern = /\$([A-Za-z_]\w*)/g; + + const parameterNames: string[] = []; + let match: any; + + while ((match = pattern.exec(cypherQuery)) !== null) { + parameterNames.push(match[1]); + } + + return parameterNames; +} + +export const checkParametersNameInGlobalParameter = (parameterNames: string[], globalParameterNames: any,) => { + for (const key of parameterNames) { + if (!globalParameterNames[key] || globalParameterNames[key].trim() === '') { + return true; + } + } + return false; +} \ No newline at end of file From 1b136b46569ec6007f9f4c9d4db28cabc8056ae3 Mon Sep 17 00:00:00 2001 From: Monish <139316519+m-o-n-i-s-h@users.noreply.github.com> Date: Fri, 29 Sep 2023 20:08:57 +0530 Subject: [PATCH 5/5] refactored code --- src/config/ReportConfig.tsx | 50 +++++++++++-------------------------- 1 file changed, 15 insertions(+), 35 deletions(-) diff --git a/src/config/ReportConfig.tsx b/src/config/ReportConfig.tsx index c4dd45900..caf2ada77 100644 --- a/src/config/ReportConfig.tsx +++ b/src/config/ReportConfig.tsx @@ -34,6 +34,14 @@ const hideQueryEditorInAutoRunOnMode = { }, }; +const executeButtonName = { + executeButtonName: { + label: 'Execute Button Name', + type: SELECTION_TYPES.TEXT, + default: 'Execute', + }, +}; + // A dictionary of available reports (visualizations). const _REPORT_TYPES = { table: { @@ -332,11 +340,7 @@ const _REPORT_TYPES = { label: '::', type: SELECTION_TYPES.TEXT, }, - executeButtonName: { - label: 'Execute Button Name', - type: SELECTION_TYPES.TEXT, - default: 'Execute', - }, + ...executeButtonName, }, }, bar: { @@ -511,11 +515,7 @@ const _REPORT_TYPES = { values: [true, false], default: false, }, - executeButtonName: { - label: 'Execute Button Name', - type: SELECTION_TYPES.TEXT, - default: 'Execute', - }, + ...executeButtonName, }, }, pie: { @@ -687,11 +687,7 @@ const _REPORT_TYPES = { values: [true, false], default: false, }, - executeButtonName: { - label: 'Execute Button Name', - type: SELECTION_TYPES.TEXT, - default: 'Execute', - }, + ...executeButtonName, }, }, line: { @@ -881,11 +877,7 @@ const _REPORT_TYPES = { values: [true, false], default: false, }, - executeButtonName: { - label: 'Execute Button Name', - type: SELECTION_TYPES.TEXT, - default: 'Execute', - }, + ...executeButtonName, }, }, // TODO - move to advanced visualization. @@ -1193,11 +1185,7 @@ const _REPORT_TYPES = { values: [true, false], default: false, }, - executeButtonName: { - label: 'Execute Button Name', - type: SELECTION_TYPES.TEXT, - default: 'Execute', - }, + ...executeButtonName, }, }, value: { @@ -1281,11 +1269,7 @@ const _REPORT_TYPES = { values: [true, false], default: false, }, - executeButtonName: { - label: 'Execute Button Name', - type: SELECTION_TYPES.TEXT, - default: 'Execute', - }, + ...executeButtonName, }, }, json: { @@ -1342,11 +1326,7 @@ const _REPORT_TYPES = { values: [true, false], default: false, }, - executeButtonName: { - label: 'Execute Button Name', - type: SELECTION_TYPES.TEXT, - default: 'Execute', - }, + ...executeButtonName, }, }, select: {