Merge remote-tracking branch 'origin/dev' into dev

Zzm0809 · Oct 26, 2023 · 91388ef · 91388ef
2 parents f401afd + 2dc7fa6
commit 91388ef
Show file tree

Hide file tree

Showing 8 changed files with 96 additions and 94 deletions.
diff --git a/dinky-web/src/global.less b/dinky-web/src/global.less
@@ -399,8 +399,8 @@ h5 {
   scrollbar-width: thin;
 }
 
-.editor-full-screen{
-  .ant-tabs-tabpane{
+.editor-full-screen {
+  .ant-tabs-tabpane {
     height: 100vh;
   }
 }

diff --git a/dinky-web/src/pages/DataStudio/FooterContainer/index.tsx b/dinky-web/src/pages/DataStudio/FooterContainer/index.tsx
@@ -20,7 +20,7 @@
 import useThemeValue from '@/hooks/useThemeValue';
 import JobRunningModal from '@/pages/DataStudio/FooterContainer/JobRunningModal';
 import { getCurrentTab } from '@/pages/DataStudio/function';
-import { StateType,TabsPageType,VIEW} from '@/pages/DataStudio/model';
+import { StateType, TabsPageType, VIEW } from '@/pages/DataStudio/model';
 import { getSseData } from '@/services/api';
 import { l } from '@/utils/intl';
 import { connect } from '@@/exports';

diff --git a/dinky-web/src/pages/DataStudio/HeaderContainer/index.tsx b/dinky-web/src/pages/DataStudio/HeaderContainer/index.tsx
@@ -196,7 +196,7 @@ const HeaderContainer = (props: any) => {
   const routes: ButtonRoute[] = [
     // 保存按钮 icon
     {
-      hotKey: (e: KeyboardEvent) => e.ctrlKey && e.key === 's' || e.metaKey && e.key === 's',
+      hotKey: (e: KeyboardEvent) => (e.ctrlKey && e.key === 's') || (e.metaKey && e.key === 's'),
       hotKeyDesc: 'Ctrl/Command +S',
       isShow: projectCommonShow(currentTab?.type),
       icon: <SaveOutlined />,
@@ -216,7 +216,8 @@ const HeaderContainer = (props: any) => {
     {
       // 检查 sql按钮
       icon: <ScheduleOutlined />,
-      hotKey: (e: KeyboardEvent) => e.altKey && e.code === 'Digit2' || e.altKey && e.key === '@',
+      hotKey: (e: KeyboardEvent) =>
+        (e.altKey && e.code === 'Digit2') || (e.altKey && e.key === '@'),
       hotKeyDesc: 'Alt+2/@',
       title: l('pages.datastudio.editor.check'),
       click: () => showExplain(),

diff --git a/dinky-web/src/pages/DataStudio/MiddleContainer/Editor/index.tsx b/dinky-web/src/pages/DataStudio/MiddleContainer/Editor/index.tsx
@@ -17,6 +17,7 @@
  *
  */
 
+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';
@@ -37,7 +38,6 @@ import { Button, Spin } from 'antd';
 import { editor, KeyCode, KeyMod } from 'monaco-editor';
 import React, { useState } from 'react';
 import { format } from 'sql-formatter';
-import { useEditor } from '@/hooks/useEditor';
 
 export type EditorProps = {
   taskId: number;

diff --git a/dinky-web/src/pages/DataStudio/MiddleContainer/KeyBoard/constant.tsx b/dinky-web/src/pages/DataStudio/MiddleContainer/KeyBoard/constant.tsx
@@ -34,7 +34,7 @@ export const KEY_BOARD_MIDDLE = [
     key: 'alt3',
     label: 'Alt + 3',
     description: l('shortcut.key.beautify')
-  },
+  }
   // {
   //   key: 'f2',
   //   label: 'F2',

diff --git a/dinky-web/src/pages/DataStudio/MiddleContainer/index.tsx b/dinky-web/src/pages/DataStudio/MiddleContainer/index.tsx
@@ -51,8 +51,7 @@ const MiddleContainer = (props: any) => {
   } = props;
   const themeValue = useThemeValue();
 
-
-  const {fullscreen} = useEditor();
+  const { fullscreen } = useEditor();
 
   const [contextMenuPosition, setContextMenuPosition] = useState({});
   const [contextMenuVisible, setContextMenuVisible] = useState(false);
@@ -252,7 +251,15 @@ const MiddleContainer = (props: any) => {
         </Space>
       ),
       children: (
-        <ContentScroll height={activeKey === item.key ? fullscreen ? document.body.clientHeight : props.centerContentHeight - 35 : 0}>
+        <ContentScroll
+          height={
+            activeKey === item.key
+              ? fullscreen
+                ? document.body.clientHeight
+                : props.centerContentHeight - 35
+              : 0
+          }
+        >
           {renderContent()}
         </ContentScroll>
       )

diff --git a/dinky-web/src/pages/DataStudio/index.tsx b/dinky-web/src/pages/DataStudio/index.tsx
@@ -16,7 +16,7 @@
  */
 
 import { AuthorizedObject, useAccess } from '@/hooks/useAccess';
-import { FullScreenProvider, useEditor } from '@/hooks/useEditor';
+import { useEditor } from '@/hooks/useEditor';
 import useThemeValue from '@/hooks/useThemeValue';
 import BottomContainer from '@/pages/DataStudio/BottomContainer';
 import FooterContainer from '@/pages/DataStudio/FooterContainer';
@@ -199,57 +199,52 @@ const DataStudio = (props: any) => {
     />
   );
 
-  return (
-      fullscreen ? (
-        <MiddleContainer />
-      ) : (
-        <PageContainer title={false} breadcrumb={{ style: { display: 'none' } }}>
-          <PersistGate loading={null} persistor={persist}>
-            <div style={{ marginInline: -10, marginTop: -6, width: size.width }}>
-              <SecondHeaderContainer size={size} activeBreadcrumbTitle={activeBreadcrumbTitle} />
-              <Layout
-                hasSider
-                style={{
-                  minHeight: size.contentHeight,
-                  maxHeight: size.contentHeight,
-                  paddingInline: 0
-                }}
-              >
-                <Sider collapsed collapsedWidth={40}>
-                  <div style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
-                    {LeftTopMenu}
-                    {LeftBottomMenu}
-                  </div>
-                </Sider>
+  return fullscreen ? (
+    <MiddleContainer />
+  ) : (
+    <PageContainer title={false} breadcrumb={{ style: { display: 'none' } }}>
+      <PersistGate loading={null} persistor={persist}>
+        <div style={{ marginInline: -10, marginTop: -6, width: size.width }}>
+          <SecondHeaderContainer size={size} activeBreadcrumbTitle={activeBreadcrumbTitle} />
+          <Layout
+            hasSider
+            style={{
+              minHeight: size.contentHeight,
+              maxHeight: size.contentHeight,
+              paddingInline: 0
+            }}
+          >
+            <Sider collapsed collapsedWidth={40}>
+              <div style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
+                {LeftTopMenu}
+                {LeftBottomMenu}
+              </div>
+            </Sider>
 
-                <Content style={{ display: 'flex', flexDirection: 'column', minWidth: 0 }}>
-                  <div style={{ display: 'flex' }}>
-                    <LeftContainer size={size} />
-                    <Content
-                      style={{
-                        width:
-                          size.width -
-                          2 * VIEW.sideWidth -
-                          leftContainer.width -
-                          rightContainer.width
-                      }}
-                    >
-                      <MiddleContainer />
-                    </Content>
-                    <RightContainer size={size} bottomHeight={bottomHeight} />
-                  </div>
-                  {<BottomContainer size={size} />}
+            <Content style={{ display: 'flex', flexDirection: 'column', minWidth: 0 }}>
+              <div style={{ display: 'flex' }}>
+                <LeftContainer size={size} />
+                <Content
+                  style={{
+                    width:
+                      size.width - 2 * VIEW.sideWidth - leftContainer.width - rightContainer.width
+                  }}
+                >
+                  <MiddleContainer />
                 </Content>
+                <RightContainer size={size} bottomHeight={bottomHeight} />
+              </div>
+              {<BottomContainer size={size} />}
+            </Content>
 
-                <Sider collapsed collapsedWidth={40}>
-                  {RightTopMenu}
-                </Sider>
-              </Layout>
-              {<FooterContainer token={token} />}
-            </div>
-          </PersistGate>
-        </PageContainer>
-      )
+            <Sider collapsed collapsedWidth={40}>
+              {RightTopMenu}
+            </Sider>
+          </Layout>
+          {<FooterContainer token={token} />}
+        </div>
+      </PersistGate>
+    </PageContainer>
   );
 };
 

diff --git a/dinky-web/src/utils/function.tsx b/dinky-web/src/utils/function.tsx
@@ -124,41 +124,40 @@ export function getLocalTheme(): string {
  * @constructor
  */
 export function convertCodeEditTheme() {
-
-      /**
-       * user can define a new theme by calling the defineTheme method on the editor.
-       */
-      editor.defineTheme(CODE_EDIT_THEME.VS_CUSTOME, {
-        base: 'vs', // 指定基础主题 , 可选值: 'vs', 'vs-dark', 'hc-black' , base theme
-        inherit: true, // 是否继承基础主题配置 , 默认为 true, is to inherit the base theme
-        // rules is an array of rules. The array must not be sparse (i.e. do not use holes).
-        rules: [
-          { token: 'comment', foreground: '#008800', fontStyle: 'italic' },
-          { token: 'keyword', foreground: '#064cff', fontStyle: 'bold' },
-          { token: 'string', foreground: '#507dee' },
-          { token: 'delimiter', foreground: '#041d81' },
-          {
-            token: 'readonly',
-            foreground: '#e73a6e',
-            background: '#141414',
-            fontStyle: 'italic'
-          },
-          { token: 'number', foreground: '#ffffff' }
-        ],
-        // colors is an object of color identifiers and their color values.
-        colors: {
-          'editor.background': '#2f2e2e', //  editor background color
-          'editor.lineHighlightBackground': '#959cb6', //  editor line highlight background color
-          'editorLineNumber.foreground': '#ffffff', //   editor line number color
-          'editorCursor.foreground': '#ffffff', //  editor cursor color
-          'editorIndentGuide.background': '#ffffff', //  editor indent guide color
-          'editor.foreground': '#ffffff', //  editor selection highlight border color
-          'editor.selectionBackground': '#4ba1ef', //  editor selection highlight color
-          'editor.selectionHighlightBorder': '#4ba1ef', //  editor selection highlight border color
-          'editor.findMatchBackground': '#4ba1ef', //  editor find match highlight color
-          'editor.wordHighlightBackground': '#8bb2d2' //  editor word highlight color
-        }
-      });
+  /**
+   * user can define a new theme by calling the defineTheme method on the editor.
+   */
+  editor.defineTheme(CODE_EDIT_THEME.VS_CUSTOME, {
+    base: 'vs', // 指定基础主题 , 可选值: 'vs', 'vs-dark', 'hc-black' , base theme
+    inherit: true, // 是否继承基础主题配置 , 默认为 true, is to inherit the base theme
+    // rules is an array of rules. The array must not be sparse (i.e. do not use holes).
+    rules: [
+      { token: 'comment', foreground: '#008800', fontStyle: 'italic' },
+      { token: 'keyword', foreground: '#064cff', fontStyle: 'bold' },
+      { token: 'string', foreground: '#507dee' },
+      { token: 'delimiter', foreground: '#041d81' },
+      {
+        token: 'readonly',
+        foreground: '#e73a6e',
+        background: '#141414',
+        fontStyle: 'italic'
+      },
+      { token: 'number', foreground: '#ffffff' }
+    ],
+    // colors is an object of color identifiers and their color values.
+    colors: {
+      'editor.background': '#2f2e2e', //  editor background color
+      'editor.lineHighlightBackground': '#959cb6', //  editor line highlight background color
+      'editorLineNumber.foreground': '#ffffff', //   editor line number color
+      'editorCursor.foreground': '#ffffff', //  editor cursor color
+      'editorIndentGuide.background': '#ffffff', //  editor indent guide color
+      'editor.foreground': '#ffffff', //  editor selection highlight border color
+      'editor.selectionBackground': '#4ba1ef', //  editor selection highlight color
+      'editor.selectionHighlightBorder': '#4ba1ef', //  editor selection highlight border color
+      'editor.findMatchBackground': '#4ba1ef', //  editor find match highlight color
+      'editor.wordHighlightBackground': '#8bb2d2' //  editor word highlight color
+    }
+  });
 
   const theme = getLocalTheme();
   switch (theme) {