Skip to content

Commit

Permalink
Spotless Apply
Browse files Browse the repository at this point in the history
  • Loading branch information
Zzm0809 authored and github-actions[bot] committed Nov 11, 2024
1 parent 859be2f commit 67f6996
Show file tree
Hide file tree
Showing 4 changed files with 83 additions and 70 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -435,7 +435,11 @@ export const SqlTask = memo((props: FlinkSqlProps & any) => {
}, [currentState, updateAction]);

const handleStop = useCallback(async () => {
const result = await cancelTask(l('pages.datastudio.editor.stop.job'), currentState.taskId, false);
const result = await cancelTask(
l('pages.datastudio.editor.stop.job'),
currentState.taskId,
false
);
if (result.success) {
setCurrentState((prevState) => {
return {
Expand Down
24 changes: 12 additions & 12 deletions dinky-web/src/pages/DataStudioNew/ContextMenuSpace.tsx
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
import {Space} from "antd";
import React from "react";

import { Space } from 'antd';
import React from 'react';

interface ContextMenuSpaceProps {
onContextMenu: (e: React.MouseEvent<HTMLElement>) => void;
children: React.ReactNode| JSX.Element | string;
children: React.ReactNode | JSX.Element | string;
}

export const ContextMenuSpace = (props: ContextMenuSpaceProps) => {

const {onContextMenu, children} = props;
return <>
<Space onContextMenu={onContextMenu} size={0}>
{children}
</Space>
</>
}
const { onContextMenu, children } = props;
return (
<>
<Space onContextMenu={onContextMenu} size={0}>
{children}
</Space>
</>
);
};
119 changes: 64 additions & 55 deletions dinky-web/src/pages/DataStudioNew/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,12 @@
*
*/

import {DockLayout, TabData} from 'rc-dock';
import React, {lazy, useEffect, useMemo, useRef, useState} from 'react';
import {PageContainer} from '@ant-design/pro-layout';
import {Col, ConfigProvider, Row, Space, Spin, theme as antdTheme} from 'antd';
import { DockLayout, TabData } from 'rc-dock';
import React, { lazy, useEffect, useMemo, useRef, useState } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Col, ConfigProvider, Row, Space, Spin, theme as antdTheme } from 'antd';
import Toolbar from '@/pages/DataStudioNew/Toolbar';
import {DataStudioActionType, RightContextMenuState} from '@/pages/DataStudioNew/data.d';
import { DataStudioActionType, RightContextMenuState } from '@/pages/DataStudioNew/data.d';
import {
getAllPanel,
getLayoutState,
Expand All @@ -32,27 +32,27 @@ import {
} from '@/pages/DataStudioNew/function';
// import 'rc-dock/dist/rc-dock.css';
// import 'rc-dock/dist/rc-dock-dark.css';
import RightContextMenu, {useRightMenuItem} from '@/pages/DataStudioNew/RightContextMenu';
import {MenuInfo} from 'rc-menu/es/interface';
import {lazyComponent, ToolbarRoutes} from '@/pages/DataStudioNew/Toolbar/ToolbarRoute';
import {ToolbarPosition, ToolbarRoute} from '@/pages/DataStudioNew/Toolbar/data.d';
import {groups} from '@/pages/DataStudioNew/ContentLayout';
import {connect} from 'umi';
import {CenterTab, DataStudioState} from '@/pages/DataStudioNew/model';
import {mapDispatchToProps} from '@/pages/DataStudioNew/DvaFunction';
import {AliveScope, KeepAlive, useAliveController} from 'react-activation';
import {activeTab, createNewPanel} from '@/pages/DataStudioNew/DockLayoutFunction';
import RightContextMenu, { useRightMenuItem } from '@/pages/DataStudioNew/RightContextMenu';
import { MenuInfo } from 'rc-menu/es/interface';
import { lazyComponent, ToolbarRoutes } from '@/pages/DataStudioNew/Toolbar/ToolbarRoute';
import { ToolbarPosition, ToolbarRoute } from '@/pages/DataStudioNew/Toolbar/data.d';
import { groups } from '@/pages/DataStudioNew/ContentLayout';
import { connect } from 'umi';
import { CenterTab, DataStudioState } from '@/pages/DataStudioNew/model';
import { mapDispatchToProps } from '@/pages/DataStudioNew/DvaFunction';
import { AliveScope, KeepAlive, useAliveController } from 'react-activation';
import { activeTab, createNewPanel } from '@/pages/DataStudioNew/DockLayoutFunction';
import * as Algorithm from './Algorithm';
import {PanelData} from 'rc-dock/lib/DockData';
import {useAsyncEffect} from 'ahooks';
import {useTheme} from '@/hooks/useThemeValue';
import {DataStudioContext} from '@/pages/DataStudioNew/DataStudioContext';
import { PanelData } from 'rc-dock/lib/DockData';
import { useAsyncEffect } from 'ahooks';
import { useTheme } from '@/hooks/useThemeValue';
import { DataStudioContext } from '@/pages/DataStudioNew/DataStudioContext';
import './css/index.less';
import {getTenantByLocalStorage} from '@/utils/function';
import { getTenantByLocalStorage } from '@/utils/function';
import FooterContainer from '@/pages/DataStudioNew/FooterContainer';
import {useToken} from 'antd/es/theme/internal';
import {TAG_RIGHT_CONTEXT_MENU} from "@/pages/DataStudioNew/constants";
import {ContextMenuSpace} from "@/pages/DataStudioNew/ContextMenuSpace";
import { useToken } from 'antd/es/theme/internal';
import { TAG_RIGHT_CONTEXT_MENU } from '@/pages/DataStudioNew/constants';
import { ContextMenuSpace } from '@/pages/DataStudioNew/ContextMenuSpace';

const SqlTask = lazy(() => import('@/pages/DataStudioNew/CenterTabContent/SqlTask'));
const DataSourceDetail = lazy(
Expand Down Expand Up @@ -82,8 +82,8 @@ const DataStudioNew: React.FC = (props: any) => {
const [_, token] = useToken();

const dockLayoutRef = useRef<DockLayout>(null);
const {drop} = useAliveController();
const menuItem = useRightMenuItem({dataStudioState});
const { drop } = useAliveController();
const menuItem = useRightMenuItem({ dataStudioState });

// 作业树右键弹出框状态
const [rightContextMenuState, setRightContextMenuState] = useState<RightContextMenuState>({
Expand Down Expand Up @@ -132,10 +132,10 @@ const DataStudioNew: React.FC = (props: any) => {
await queryFlinkUdfOptions();
await queryDataSourceDataList();
await querySuggestions();
await queryUserData({id: getTenantByLocalStorage()});
await queryUserData({ id: getTenantByLocalStorage() });
}, []);
useEffect(() => {
const {actionType, params} = dataStudioState.action;
const { actionType, params } = dataStudioState.action;
if (actionType?.includes('task-run-')) {
const dockLayout = dockLayoutRef.current!!;
let position: ToolbarPosition = 'leftBottom';
Expand Down Expand Up @@ -221,7 +221,7 @@ const DataStudioNew: React.FC = (props: any) => {
const rightContextMenuHandle = (e: any) => handleRightClick(e, setRightContextMenuState);

const handleMenuClick = (values: MenuInfo) => {
setRightContextMenuState((prevState) => ({...prevState, show: false}));
setRightContextMenuState((prevState) => ({ ...prevState, show: false }));

switch (values.key) {
case 'showToolbarDesc':
Expand Down Expand Up @@ -273,15 +273,14 @@ const DataStudioNew: React.FC = (props: any) => {
*/
const rightContextTagMenuHandle = (e: any) => handleRightClick(e, setRightContextTagMenuState);


/**
* 右键菜单的点击事件 | right-click menu click event of the right-click menu
* @param {MenuInfo} node
*/
const handleTagRightMenuClick = (node: MenuInfo) => {
setRightContextTagMenuState((prevState) => ({...prevState, show: false}));
const {key} = node;
console.log('key', key,node);
setRightContextTagMenuState((prevState) => ({ ...prevState, show: false }));
const { key } = node;
console.log('key', key, node);
switch (key) {
case 'closeAll':
console.log('closeAll');
Expand All @@ -297,11 +296,11 @@ const DataStudioNew: React.FC = (props: any) => {
};

const saveTab = (tabData: TabData & any) => {
let {id, group, title} = tabData;
return {id, group, title};
let { id, group, title } = tabData;
return { id, group, title };
};
const loadTab = (tab: TabData) => {
const {id, title, group} = tab;
const { id, title, group } = tab;
if (group !== 'centerContent') {
const route = ToolbarRoutes.find((x) => x.key === id) as ToolbarRoute;
const content = ToolbarRoutes.find((item) => item.key === route.key)!!.content();
Expand Down Expand Up @@ -338,30 +337,38 @@ const DataStudioNew: React.FC = (props: any) => {
switch (tabData.tabType) {
case 'task':
const titleContent = (
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle} >
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle}>
{getTabIcon(tabData.params.dialect, 19)} {tabData.title}
</ContextMenuSpace>
);
if (tabData.isUpdate) {
return (
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle} >
<span style={{color: '#52c41a'}}>
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle}>
<span style={{ color: '#52c41a' }}>
{titleContent}
{' *'}
{' *'}
</span>
</ContextMenuSpace>
);
}
return <ContextMenuSpace onContextMenu={rightContextTagMenuHandle}>{titleContent}</ContextMenuSpace>;
return (
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle}>
{titleContent}
</ContextMenuSpace>
);
case 'dataSource':
const dialect = tabData.params.type;
return (
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle} >
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle}>
{getTabIcon(dialect, 19)} {tabData.title}
</ContextMenuSpace>
);
default:
return <ContextMenuSpace onContextMenu={rightContextTagMenuHandle}>{tabData.title}</ContextMenuSpace>;
return (
<ContextMenuSpace onContextMenu={rightContextTagMenuHandle}>
{tabData.title}
</ContextMenuSpace>
);
}
};

Expand All @@ -373,7 +380,7 @@ const DataStudioNew: React.FC = (props: any) => {
// todo 添加中间tab内容
switch (tabData.tabType) {
case 'task':
content = <SqlTask tabData={tabData}/>;
content = <SqlTask tabData={tabData} />;
break;
case 'dataSource':
content = <DataSourceDetail {...currentData} />;
Expand Down Expand Up @@ -459,7 +466,7 @@ const DataStudioNew: React.FC = (props: any) => {
});
};
return (
<DataStudioContext.Provider value={{theme: theme}}>
<DataStudioContext.Provider value={{ theme: theme }}>
<ConfigProvider
theme={{
token: {
Expand All @@ -482,11 +489,11 @@ const DataStudioNew: React.FC = (props: any) => {
<PageContainer
breadcrumb={{}}
title={false}
childrenContentStyle={{margin: 0, padding: 0}}
childrenContentStyle={{ margin: 0, padding: 0 }}
className={(theme === 'light' ? 'light-theme' : 'dark-theme') + ' page-container'}
>
<Spin spinning={loading} size={'large'} tip={'loading'}>
<Row style={{height: 'calc(100vh - 81px)'}}>
<Row style={{ height: 'calc(100vh - 81px)' }}>
{/*左边工具栏*/}
<Col
style={{
Expand All @@ -497,7 +504,7 @@ const DataStudioNew: React.FC = (props: any) => {
onContextMenu={rightContextMenuHandle}
>
{/*左上工具栏*/}
<Col style={{width: 'inherit', height: '50%'}}>
<Col style={{ width: 'inherit', height: '50%' }}>
<Toolbar
height={toolbarSize}
showDesc={dataStudioState.toolbar.showDesc}
Expand Down Expand Up @@ -527,14 +534,14 @@ const DataStudioNew: React.FC = (props: any) => {
</Col>

{/* 中间内容栏*/}
<Col style={{height: 'inherit'}} flex='auto' className={'content-container'}>
<Col style={{ height: 'inherit' }} flex='auto' className={'content-container'}>
<AliveScope>
<DockLayout
ref={dockLayoutRef}
layout={layout}
groups={groups(updateAction)}
dropMode={'edge'}
style={{position: 'absolute', left: 0, top: 0, right: 0, bottom: 0}}
style={{ position: 'absolute', left: 0, top: 0, right: 0, bottom: 0 }}
onLayoutChange={async (newLayout, currentTabId, direction) => {
// todo 这里移到方向会导致布局和算法异常,先暂时规避掉
if (
Expand All @@ -551,7 +558,7 @@ const DataStudioNew: React.FC = (props: any) => {
currentTabId &&
direction === 'remove' &&
(dockLayoutRef.current?.find(currentTabId) as PanelData)?.group ===
'centerContent'
'centerContent'
) {
drop(currentTabId).then();

Expand Down Expand Up @@ -591,7 +598,7 @@ const DataStudioNew: React.FC = (props: any) => {

{/*右边工具栏*/}
<Col
style={{width: toolbarSize, height: 'inherit'}}
style={{ width: toolbarSize, height: 'inherit' }}
flex='none'
onContextMenu={rightContextMenuHandle}
>
Expand All @@ -606,14 +613,14 @@ const DataStudioNew: React.FC = (props: any) => {
</Col>
</Row>

<FooterContainer token={token}/>
<FooterContainer token={token} />

{/* 树的右键菜单*/}
<RightContextMenu
contextMenuPosition={rightContextMenuState.position}
open={rightContextMenuState.show}
openChange={() =>
setRightContextMenuState((prevState) => ({...prevState, show: false}))
setRightContextMenuState((prevState) => ({ ...prevState, show: false }))
}
items={menuItem}
onClick={handleMenuClick}
Expand All @@ -624,7 +631,9 @@ const DataStudioNew: React.FC = (props: any) => {
items={TAG_RIGHT_CONTEXT_MENU}
contextMenuPosition={rightContextTagMenuState.position}
open={rightContextTagMenuState.show}
openChange={() => setRightContextTagMenuState(prevState => ({...prevState, show: false}))}
openChange={() =>
setRightContextTagMenuState((prevState) => ({ ...prevState, show: false }))
}
/>
</Spin>
</PageContainer>
Expand All @@ -634,7 +643,7 @@ const DataStudioNew: React.FC = (props: any) => {
};

export default connect(
({DataStudio}: { DataStudio: DataStudioState }) => ({
({ DataStudio }: { DataStudio: DataStudioState }) => ({
dataStudioState: DataStudio
}),
mapDispatchToProps
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -80,10 +80,10 @@ const ResourceOverView: React.FC<connect> = (props) => {
});
}, []);

useEffect( () => {
useEffect(() => {
// if enableResource is true, then refresh the tree, otherwise do nothing
if (enableResource) {
refreshTree();
refreshTree();
}
}, [enableResource]);

Expand Down

0 comments on commit 67f6996

Please sign in to comment.