Fix datastudio tabs switch bug (#2537)

* Optimize the process * fix some bug * remove processid in sse
DataLinkDC · Nov 16, 2023 · 8bf8adc · 8bf8adc
1 parent 1f0b2b6
commit 8bf8adc
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 22 deletions.
diff --git a/dinky-admin/src/main/resources/log4j2.xml b/dinky-admin/src/main/resources/log4j2.xml
@@ -61,7 +61,7 @@
       <!--这个是输出日志的格式，如果对里面的参数不理解，可以去看我的这篇文章，网址是：“https://blog.csdn.net/qq_42449963/article/details/104617356”-->
       <!--<PatternLayout pattern="[dinky] %d{yyyy-MM-dd HH:mm:ss.SSS} %-5level %class{36} %L %M - %msg%xEx%n"/>-->
       <PatternLayout
-              pattern="%d{yyyy-MM-dd HH:mm:ss.SSS} %p %c{20}(%L): %m"/>
+              pattern="%d{yyyy-MM-dd HH:mm:ss.SSS} %c{20}(%L): %m"/>
     </LogSseAppender>
 
   </appenders>

diff --git a/dinky-app/dinky-app-1.16/src/main/java/org/dinky/app/MainApp.java b/dinky-app/dinky-app-1.16/src/main/java/org/dinky/app/MainApp.java
@@ -54,8 +54,7 @@ public static void main(String[] args) throws Exception {
             DBUtil.init(appConfig);
             Submitter.submit(appConfig);
         } catch (Exception e) {
-            log.error("exectue app failed with config: {}", appConfig);
-            throw e;
+            log.error("exectue app failed : ", e);
         } finally {
             log.info("Start Monitor Job");
             FlinkAppUtil.monitorFlinkTask(appConfig.getTaskId());

diff --git a/dinky-web/src/pages/DataStudio/MiddleContainer/Editor/index.tsx b/dinky-web/src/pages/DataStudio/MiddleContainer/Editor/index.tsx
@@ -19,7 +19,6 @@
 
 import CodeEdit from '@/components/CustomEditor/CodeEdit';
 import { useEditor } from '@/hooks/useEditor';
-import { getCurrentTab } from '@/pages/DataStudio/function';
 import { TASK_VAR_FILTER } from '@/pages/DataStudio/MiddleContainer/Editor/constants';
 import DiffModal from '@/pages/DataStudio/MiddleContainer/Editor/DiffModal';
 import {
@@ -42,14 +41,13 @@ import React, { useEffect, useRef, useState } from 'react';
 import { format } from 'sql-formatter';
 
 export type EditorProps = {
-  taskId: number;
+  tabsItem: DataStudioTabsItemType
   height?: number;
 };
 
 const CodeEditor: React.FC<EditorProps & any> = (props) => {
   const {
-    taskId,
-    tabs: { panes, activeKey },
+    tabsItem,
     dispatch,
     height
   } = props;
@@ -69,12 +67,11 @@ const CodeEditor: React.FC<EditorProps & any> = (props) => {
   const editorInstance = useRef<editor.IStandaloneCodeEditor | any>();
   const monacoInstance = useRef<Monaco | any>();
 
-  const currentTab = getCurrentTab(panes, activeKey) as DataStudioTabsItemType;
-  const currentData = currentTab.params.taskData;
+  const currentData = tabsItem.params.taskData;
 
   const loadTask = (cache: TaskDataType, serverParams: TaskDataType) => {
     if (!cache) {
-      currentTab.params.taskData = { ...serverParams, useResult: true, maxRowNum: 100 };
+      tabsItem.params.taskData = { ...serverParams, useResult: true, maxRowNum: 100 };
       dispatch({ type: STUDIO_MODEL.saveTabs, payload: { ...props.tabs } });
       return;
     }
@@ -93,16 +90,16 @@ const CodeEditor: React.FC<EditorProps & any> = (props) => {
   };
 
   const { loading, data } = useRequest(
-    { url: API_CONSTANTS.TASK, params: { id: taskId } },
-    { onSuccess: (data: any) => loadTask(currentTab.params.taskData, data) }
+    { url: API_CONSTANTS.TASK, params: { id: tabsItem.params.taskId } },
+    { onSuccess: (data: any) => loadTask(tabsItem.params.taskData, data) }
   );
 
   const upDateTask = (useServerVersion: boolean) => {
     if (useServerVersion) {
-      currentTab.params.taskData = { ...data, useResult: true, maxRowNum: 100 };
-      currentTab.isModified = false;
+      tabsItem.params.taskData = { ...data, useResult: true, maxRowNum: 100 };
+      tabsItem.isModified = false;
     } else {
-      currentTab.isModified = true;
+      tabsItem.isModified = true;
     }
     dispatch({ type: STUDIO_MODEL.saveTabs, payload: { ...props.tabs } });
     setIsModalOpen(false);
@@ -129,13 +126,13 @@ const CodeEditor: React.FC<EditorProps & any> = (props) => {
   };
 
   const handleEditChange = (v: string | undefined) => {
-    if (!currentData || !currentTab) {
+    if (!currentData || !tabsItem) {
       return;
     }
     if (typeof v === 'string') {
       currentData.statement = v;
     }
-    currentTab.isModified = true;
+    tabsItem.isModified = true;
     dispatch({
       type: STUDIO_MODEL.saveTabs,
       payload: { ...props.tabs }
@@ -149,7 +146,7 @@ const CodeEditor: React.FC<EditorProps & any> = (props) => {
           diffs={diff}
           open={isModalOpen}
           language={
-            currentTab?.params?.taskData?.dialect?.toLowerCase() === DIALECT.FLINK_SQL
+            tabsItem?.params?.taskData?.dialect?.toLowerCase() === DIALECT.FLINK_SQL
               ? 'flinksql'
               : 'sql'
           }
@@ -159,9 +156,9 @@ const CodeEditor: React.FC<EditorProps & any> = (props) => {
         <CodeEdit
           monacoRef={monacoInstance}
           editorRef={editorInstance}
-          code={currentTab?.params?.taskData?.statement}
+          code={tabsItem?.params?.taskData?.statement}
           language={
-            currentTab?.params?.taskData?.dialect?.toLowerCase() === DIALECT.FLINK_SQL
+            tabsItem?.params?.taskData?.dialect?.toLowerCase() === DIALECT.FLINK_SQL
               ? 'flinksql'
               : 'sql'
           }

diff --git a/dinky-web/src/pages/DataStudio/MiddleContainer/index.tsx b/dinky-web/src/pages/DataStudio/MiddleContainer/index.tsx
@@ -236,10 +236,9 @@ const MiddleContainer = (props: any) => {
           return TabsPageType.None;
         }
 
-        const v = item.params;
         return (
           <Editor
-            taskId={v.taskId}
+            tabsItem={item}
             height={
               activeKey === item.key
                 ? fullscreen