From 2e28f84b12c49880c9cbd831e60870c80abdd2c5 Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 20:34:35 +0530 Subject: [PATCH 1/8] feat: add reset button for output preview --- .../molecules/InterpretationLog.tsx | 59 +++++++++++++++++-- 1 file changed, 53 insertions(+), 6 deletions(-) diff --git a/src/components/molecules/InterpretationLog.tsx b/src/components/molecules/InterpretationLog.tsx index 0a771535..4d14bc51 100644 --- a/src/components/molecules/InterpretationLog.tsx +++ b/src/components/molecules/InterpretationLog.tsx @@ -94,6 +94,12 @@ export const InterpretationLog: React.FC = ({ isOpen, se setCustomValue(event.target.value); }; + const handleReset = () => { + setLog(''); + setTableData([]); + setBinaryData(null); + }; + useEffect(() => { socket?.on('log', handleLog); socket?.on('serializableCallback', handleSerializableCallback); @@ -172,12 +178,34 @@ export const InterpretationLog: React.FC = ({ isOpen, se > { binaryData ? ( -
- - {t('interpretation_log.titles.screenshot')} - - {t('interpretation_log.titles.screenshot')} -
+ <> +
+ + {t('interpretation_log.titles.screenshot')} + + {t('interpretation_log.titles.screenshot')} +
+ + ) : tableData.length > 0 ? ( <> @@ -203,6 +231,25 @@ export const InterpretationLog: React.FC = ({ isOpen, se {t('interpretation_log.messages.additional_rows')} + ) : ( From 8cd5efcac301edb93cad100a0ca474e4962e9436 Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 20:35:26 +0530 Subject: [PATCH 2/8] feat: add reset button translation --- public/locales/de.json | 1 + public/locales/en.json | 1 + public/locales/es.json | 1 + public/locales/ja.json | 1 + public/locales/zh.json | 1 + 5 files changed, 5 insertions(+) diff --git a/public/locales/de.json b/public/locales/de.json index 28855c78..6ea6e509 100644 --- a/public/locales/de.json +++ b/public/locales/de.json @@ -250,6 +250,7 @@ "interpretation_buttons": { "buttons": { "preview": "Vorschau der Ausgabedaten anzeigen", + "reset": "Zurücksetzen", "yes": "Ja", "no": "Nein" }, diff --git a/public/locales/en.json b/public/locales/en.json index 8084b5f2..0b4f9461 100644 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -251,6 +251,7 @@ "interpretation_buttons": { "buttons": { "preview": "Get Preview of Output Data", + "reset": "Reset", "yes": "Yes", "no": "No" }, diff --git a/public/locales/es.json b/public/locales/es.json index 4ef417ea..40ef1d6b 100644 --- a/public/locales/es.json +++ b/public/locales/es.json @@ -251,6 +251,7 @@ "interpretation_buttons": { "buttons": { "preview": "Obtener Vista Previa de Datos de Salida", + "reset": "Restablecer", "yes": "Sí", "no": "No" }, diff --git a/public/locales/ja.json b/public/locales/ja.json index b40cc6e6..946ae029 100644 --- a/public/locales/ja.json +++ b/public/locales/ja.json @@ -251,6 +251,7 @@ "interpretation_buttons": { "buttons": { "preview": "出力データのプレビューを取得", + "reset": "リセット", "yes": "はい", "no": "いいえ" }, diff --git a/public/locales/zh.json b/public/locales/zh.json index 600fd821..8ec36ddc 100644 --- a/public/locales/zh.json +++ b/public/locales/zh.json @@ -251,6 +251,7 @@ "interpretation_buttons": { "buttons": { "preview": "获取输出数据预览", + "reset": "重置", "yes": "是", "no": "否" }, From 74da84a14421e8ecdab6366150e2bd4b26ffc3f7 Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 21:42:48 +0530 Subject: [PATCH 3/8] feat: add output preview reset notification --- src/components/molecules/InterpretationLog.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/molecules/InterpretationLog.tsx b/src/components/molecules/InterpretationLog.tsx index 4d14bc51..05e2876c 100644 --- a/src/components/molecules/InterpretationLog.tsx +++ b/src/components/molecules/InterpretationLog.tsx @@ -35,7 +35,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se const { width } = useBrowserDimensionsStore(); const { socket } = useSocketStore(); - const { currentWorkflowActionsState } = useGlobalInfoStore(); + const { currentWorkflowActionsState, notify } = useGlobalInfoStore(); const toggleDrawer = (newOpen: boolean) => (event: React.KeyboardEvent | React.MouseEvent) => { if ( @@ -98,6 +98,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se setLog(''); setTableData([]); setBinaryData(null); + notify("success", t('interpretation_log.notifications.reset_success')); }; useEffect(() => { From 64f452b4dc1546d4fcaafe041d00c50bfad73ad8 Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 21:43:35 +0530 Subject: [PATCH 4/8] feat: add reset success translation --- public/locales/de.json | 3 +++ public/locales/en.json | 3 +++ public/locales/es.json | 3 +++ public/locales/ja.json | 3 +++ public/locales/zh.json | 3 +++ 5 files changed, 15 insertions(+) diff --git a/public/locales/de.json b/public/locales/de.json index 6ea6e509..90beaa14 100644 --- a/public/locales/de.json +++ b/public/locales/de.json @@ -245,6 +245,9 @@ "mimetype": "Medientyp: ", "image_below": "Bild wird unten angezeigt:", "separator": "--------------------------------------------------" + }, + "notifications": { + "reset_success": "Vorschau erfolgreich zurückgesetzt" } }, "interpretation_buttons": { diff --git a/public/locales/en.json b/public/locales/en.json index 0b4f9461..7752ad78 100644 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -246,6 +246,9 @@ "mimetype": "mimetype: ", "image_below": "Image is rendered below:", "separator": "--------------------------------------------------" + }, + "notifications": { + "reset_success": "Output Preview reset successfully" } }, "interpretation_buttons": { diff --git a/public/locales/es.json b/public/locales/es.json index 40ef1d6b..00fa379e 100644 --- a/public/locales/es.json +++ b/public/locales/es.json @@ -265,6 +265,9 @@ "use_previous": "¿Desea usar su selección anterior como condición para realizar esta acción?", "previous_action": "Su acción anterior fue: ", "element_text": "en un elemento con texto " + }, + "notifications": { + "reset_success": "Vista previa restablecida correctamente" } }, "recording_page": { diff --git a/public/locales/ja.json b/public/locales/ja.json index 946ae029..b444c81a 100644 --- a/public/locales/ja.json +++ b/public/locales/ja.json @@ -246,6 +246,9 @@ "mimetype": "MIMEタイプ: ", "image_below": "画像は以下に表示されます：", "separator": "--------------------------------------------------" + }, + "notifications": { + "reset_success": "出力プレビューが正常にリセットされました" } }, "interpretation_buttons": { diff --git a/public/locales/zh.json b/public/locales/zh.json index 8ec36ddc..27455ebe 100644 --- a/public/locales/zh.json +++ b/public/locales/zh.json @@ -246,6 +246,9 @@ "mimetype": "MIME类型：", "image_below": "图片显示如下：", "separator": "--------------------------------------------------" + }, + "notifications": { + "reset_success": "输出预览已成功重置" } }, "interpretation_buttons": { From c2b7088b180a6804b36ec2c08e54009b634ff608 Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 22:58:23 +0530 Subject: [PATCH 5/8] feat: add context handlers to reset output preview log --- src/context/globalInfo.tsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/context/globalInfo.tsx b/src/context/globalInfo.tsx index 58589c3a..ac281630 100644 --- a/src/context/globalInfo.tsx +++ b/src/context/globalInfo.tsx @@ -32,6 +32,8 @@ interface GlobalInfo { hasScreenshotAction: boolean; hasScrapeSchemaAction: boolean; }) => void; + shouldResetInterpretationLog: boolean; + resetInterpretationLog: () => void; }; class GlobalInfoStore implements Partial { @@ -53,6 +55,7 @@ class GlobalInfoStore implements Partial { hasScreenshotAction: false, hasScrapeSchemaAction: false, }; + shouldResetInterpretationLog = false; }; const globalInfoStore = new GlobalInfoStore(); @@ -71,6 +74,7 @@ export const GlobalInfoProvider = ({ children }: { children: JSX.Element }) => { const [recordingName, setRecordingName] = useState(globalInfoStore.recordingName); const [recordingUrl, setRecordingUrl] = useState(globalInfoStore.recordingUrl); const [currentWorkflowActionsState, setCurrentWorkflowActionsState] = useState(globalInfoStore.currentWorkflowActionsState); + const [shouldResetInterpretationLog, setShouldResetInterpretationLog] = useState(globalInfoStore.shouldResetInterpretationLog); const notify = (severity: 'error' | 'warning' | 'info' | 'success', message: string) => { setNotification({ severity, message, isOpen: true }); @@ -87,6 +91,14 @@ export const GlobalInfoProvider = ({ children }: { children: JSX.Element }) => { } } + const resetInterpretationLog = () => { + setShouldResetInterpretationLog(true); + // Reset the flag after a short delay to allow components to respond + setTimeout(() => { + setShouldResetInterpretationLog(false); + }, 100); + } + return ( { setRecordingUrl, currentWorkflowActionsState, setCurrentWorkflowActionsState, + shouldResetInterpretationLog, + resetInterpretationLog, }} > {children} From e16d1a1c113b8066a882532422b8d9c001cd660d Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 22:59:54 +0530 Subject: [PATCH 6/8] feat: add reset interpretation context action on confirm text data --- src/components/organisms/RightSidePanel.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/components/organisms/RightSidePanel.tsx b/src/components/organisms/RightSidePanel.tsx index 224e0954..ba178b7b 100644 --- a/src/components/organisms/RightSidePanel.tsx +++ b/src/components/organisms/RightSidePanel.tsx @@ -57,7 +57,7 @@ export const RightSidePanel: React.FC = ({ onFinishCapture const [hoverStates, setHoverStates] = useState<{ [id: string]: boolean }>({}); const [browserStepIdList, setBrowserStepIdList] = useState([]); - const { lastAction, notify, currentWorkflowActionsState, setCurrentWorkflowActionsState } = useGlobalInfoStore(); + const { lastAction, notify, currentWorkflowActionsState, setCurrentWorkflowActionsState, resetInterpretationLog } = useGlobalInfoStore(); const { getText, startGetText, stopGetText, getScreenshot, startGetScreenshot, stopGetScreenshot, getList, startGetList, stopGetList, startPaginationMode, stopPaginationMode, paginationType, updatePaginationType, limitType, customLimit, updateLimitType, updateCustomLimit, stopLimitMode, startLimitMode, captureStage, setCaptureStage } = useActionContext(); const { browserSteps, updateBrowserTextStepLabel, deleteBrowserStep, addScreenshotStep, updateListTextFieldLabel, removeListTextField } = useBrowserSteps(); const { id, socket } = useSocketStore(); @@ -225,8 +225,9 @@ export const RightSidePanel: React.FC = ({ onFinishCapture if (hasTextSteps) { socket?.emit('action', { action: 'scrapeSchema', settings }); } + resetInterpretationLog(); onFinishCapture(); - }, [stopGetText, getTextSettingsObject, socket, browserSteps, confirmedTextSteps]); + }, [stopGetText, getTextSettingsObject, socket, browserSteps, confirmedTextSteps, resetInterpretationLog]); const getListSettingsObject = useCallback(() => { let settings: { From fb7fafbae6a9cb2742a25f724db60ca5c309051b Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 23:02:15 +0530 Subject: [PATCH 7/8] feat: rm reset button for output preview --- .../molecules/InterpretationLog.tsx | 53 +++---------------- 1 file changed, 6 insertions(+), 47 deletions(-) diff --git a/src/components/molecules/InterpretationLog.tsx b/src/components/molecules/InterpretationLog.tsx index 05e2876c..99b9fc8b 100644 --- a/src/components/molecules/InterpretationLog.tsx +++ b/src/components/molecules/InterpretationLog.tsx @@ -179,34 +179,12 @@ export const InterpretationLog: React.FC = ({ isOpen, se > { binaryData ? ( - <> -
- - {t('interpretation_log.titles.screenshot')} - - {t('interpretation_log.titles.screenshot')} -
- - +
+ + {t('interpretation_log.titles.screenshot')} + + {t('interpretation_log.titles.screenshot')} +
) : tableData.length > 0 ? ( <> @@ -232,25 +210,6 @@ export const InterpretationLog: React.FC = ({ isOpen, se {t('interpretation_log.messages.additional_rows')} - ) : ( From 827e5ecbafbeff21879286a3459217b7eff536b7 Mon Sep 17 00:00:00 2001 From: RohitR311 Date: Sat, 21 Dec 2024 23:04:44 +0530 Subject: [PATCH 8/8] feat: reset data based on current interpretation log state --- src/components/molecules/InterpretationLog.tsx | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/src/components/molecules/InterpretationLog.tsx b/src/components/molecules/InterpretationLog.tsx index 99b9fc8b..227e621c 100644 --- a/src/components/molecules/InterpretationLog.tsx +++ b/src/components/molecules/InterpretationLog.tsx @@ -35,7 +35,7 @@ export const InterpretationLog: React.FC = ({ isOpen, se const { width } = useBrowserDimensionsStore(); const { socket } = useSocketStore(); - const { currentWorkflowActionsState, notify } = useGlobalInfoStore(); + const { currentWorkflowActionsState, shouldResetInterpretationLog, notify } = useGlobalInfoStore(); const toggleDrawer = (newOpen: boolean) => (event: React.KeyboardEvent | React.MouseEvent) => { if ( @@ -94,12 +94,13 @@ export const InterpretationLog: React.FC = ({ isOpen, se setCustomValue(event.target.value); }; - const handleReset = () => { - setLog(''); - setTableData([]); - setBinaryData(null); - notify("success", t('interpretation_log.notifications.reset_success')); - }; + useEffect(() => { + if (shouldResetInterpretationLog) { + setLog(''); + setTableData([]); + setBinaryData(null); + } + }, [shouldResetInterpretationLog]); useEffect(() => { socket?.on('log', handleLog);