mirror of
https://github.com/dbeaver/cloudbeaver.git
synced 2026-10-25 09:34:18 +08:00
CB-2501 refactor: plugins structure
This commit is contained in:
@@ -9,11 +9,10 @@
|
||||
import { observer } from 'mobx-react-lite';
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { Button, useClipboard, useMapResource } from '@cloudbeaver/core-blocks';
|
||||
import { Button, useClipboard, useMapResource, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import { ConnectionDialectResource, ConnectionExecutionContextService, createConnectionParam } from '@cloudbeaver/core-connections';
|
||||
import { useService } from '@cloudbeaver/core-di';
|
||||
import { CommonDialogWrapper, DialogComponentProps } from '@cloudbeaver/core-dialogs';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import type { IDatabaseDataModel } from '@cloudbeaver/plugin-data-viewer';
|
||||
import { SQLCodeEditorLoader } from '@cloudbeaver/plugin-sql-editor';
|
||||
|
||||
|
||||
@@ -10,12 +10,10 @@ import { observer } from 'mobx-react-lite';
|
||||
import { useEffect } from 'react';
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { splitStyles, Split, ResizerControls, Pane, splitHorizontalStyles, Overlay, OverlayMessage, OverlayActions, Button, useMapResource, getComputed, OverlayHeader, OverlayHeaderIcon, OverlayHeaderTitle, OverlayHeaderSubTitle, useSplitUserState, Loader } from '@cloudbeaver/core-blocks';
|
||||
import { splitStyles, Split, ResizerControls, Pane, splitHorizontalStyles, Overlay, OverlayMessage, OverlayActions, Button, useMapResource, getComputed, OverlayHeader, OverlayHeaderIcon, OverlayHeaderTitle, OverlayHeaderSubTitle, useSplitUserState, Loader, useStyles, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import { ConnectionExecutionContextResource, ConnectionInfoResource, DBDriverResource } from '@cloudbeaver/core-connections';
|
||||
import { useService } from '@cloudbeaver/core-di';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import { NodeManagerUtils } from '@cloudbeaver/core-navigation-tree';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
import { CaptureView } from '@cloudbeaver/core-view';
|
||||
|
||||
import type { ISqlEditorTabState } from './ISqlEditorTabState';
|
||||
|
||||
@@ -8,10 +8,10 @@
|
||||
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { Button } from '@cloudbeaver/core-blocks';
|
||||
import { Button, Translate } from '@cloudbeaver/core-blocks';
|
||||
import { CommonDialogWrapper, DialogComponent } from '@cloudbeaver/core-dialogs';
|
||||
import { Translate } from '@cloudbeaver/core-localization';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
|
||||
|
||||
|
||||
const style = css`
|
||||
footer {
|
||||
@@ -34,7 +34,7 @@ export const ScriptImportDialog: DialogComponent<null, boolean> = function Scrip
|
||||
rejectDialog,
|
||||
className,
|
||||
}) {
|
||||
return styled(useStyles(style))(
|
||||
return styled(style)(
|
||||
<CommonDialogWrapper
|
||||
size='small'
|
||||
title='ui_changes_might_be_lost'
|
||||
|
||||
@@ -10,9 +10,8 @@ import { observer } from 'mobx-react-lite';
|
||||
import { useMemo, useState } from 'react';
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { StaticImage, UploadArea } from '@cloudbeaver/core-blocks';
|
||||
import { StaticImage, UploadArea, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import { useService } from '@cloudbeaver/core-di';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import { BASE_TAB_STYLES, ITabData, TabList, TabPanelList, TabsState, VERTICAL_ROTATED_TAB_STYLES } from '@cloudbeaver/core-ui';
|
||||
import { MetadataMap } from '@cloudbeaver/core-utils';
|
||||
import { useCaptureViewContext } from '@cloudbeaver/core-view';
|
||||
|
||||
@@ -11,13 +11,11 @@ import { observer } from 'mobx-react-lite';
|
||||
import { useEffect } from 'react';
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { Button, ErrorMessage, Loader, useClipboard, useErrorDetails, useObservableRef } from '@cloudbeaver/core-blocks';
|
||||
import { Button, ErrorMessage, Loader, useClipboard, useErrorDetails, useObservableRef, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import { ConnectionInfoResource, createConnectionParam } from '@cloudbeaver/core-connections';
|
||||
import { useService } from '@cloudbeaver/core-di';
|
||||
import { CommonDialogWrapper, DialogComponentProps } from '@cloudbeaver/core-dialogs';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import { GQLErrorCatcher, SqlDialectInfo } from '@cloudbeaver/core-sdk';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
import { SQLCodeEditorLoader, SqlDialectInfoService } from '@cloudbeaver/plugin-sql-editor';
|
||||
|
||||
import { SqlGeneratorsResource } from './SqlGeneratorsResource';
|
||||
@@ -62,7 +60,6 @@ export const GeneratedSqlDialog = observer<DialogComponentProps<Payload>>(functi
|
||||
rejectDialog,
|
||||
payload,
|
||||
}) {
|
||||
const style = useStyles(styles);
|
||||
const translate = useTranslate();
|
||||
const copy = useClipboard();
|
||||
|
||||
@@ -118,7 +115,7 @@ export const GeneratedSqlDialog = observer<DialogComponentProps<Payload>>(functi
|
||||
});
|
||||
});
|
||||
|
||||
return styled(style)(
|
||||
return styled(styles)(
|
||||
<CommonDialogWrapper
|
||||
size='large'
|
||||
title='app_shared_sql_generators_dialog_title'
|
||||
@@ -144,7 +141,7 @@ export const GeneratedSqlDialog = observer<DialogComponentProps<Payload>>(functi
|
||||
>
|
||||
<wrapper>
|
||||
<Loader loading={state.loading}>
|
||||
{() => styled(style)(
|
||||
{() => styled(styles)(
|
||||
<SQLCodeEditorLoader
|
||||
bindings={{
|
||||
autoCursor: false,
|
||||
|
||||
+2
-5
@@ -11,11 +11,9 @@ import styled, { css } from 'reshadow';
|
||||
|
||||
import {
|
||||
Split, Pane, ResizerControls, splitStyles, TextPlaceholder,
|
||||
Table, TableHeader, TableColumnHeader, TableBody, Textarea, useSplitUserState
|
||||
Table, TableHeader, TableColumnHeader, TableBody, Textarea, useSplitUserState, useTranslate
|
||||
} from '@cloudbeaver/core-blocks';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import type { SqlExecutionPlanNode } from '@cloudbeaver/core-sdk';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
|
||||
import { NestedNode } from './NestedNode';
|
||||
import { useExecutionPlanTreeState } from './useExecutionPlanTreeState';
|
||||
@@ -53,12 +51,11 @@ interface Props {
|
||||
export const ExecutionPlanTreeBlock = observer<Props>(function ExecutionPlanTreeBlock({
|
||||
nodeList, query, onNodeSelect, className,
|
||||
}) {
|
||||
const style = useStyles(styles, splitStyles);
|
||||
const translate = useTranslate();
|
||||
const splitState = useSplitUserState('execution-plan-block');
|
||||
const state = useExecutionPlanTreeState(nodeList, onNodeSelect);
|
||||
|
||||
return styled(style)(
|
||||
return styled(styles, splitStyles)(
|
||||
<Split
|
||||
{...splitState}
|
||||
className={className}
|
||||
|
||||
@@ -9,7 +9,6 @@
|
||||
import styled, { css, use } from 'reshadow';
|
||||
|
||||
import { Icon } from '@cloudbeaver/core-blocks';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
|
||||
interface Props {
|
||||
expanded: boolean;
|
||||
@@ -33,7 +32,7 @@ const styles = css`
|
||||
`;
|
||||
|
||||
export const Expand: React.FC<Props> = function Expand({ expanded, onClick, className }) {
|
||||
return styled(useStyles(styles))(
|
||||
return styled(styles)(
|
||||
<Icon
|
||||
className={className}
|
||||
name='arrow'
|
||||
|
||||
@@ -12,7 +12,6 @@ import styled, { css } from 'reshadow';
|
||||
import { TableItem, TableColumnValue, EventTableItemSelectionFlag } from '@cloudbeaver/core-blocks';
|
||||
import { EventContext } from '@cloudbeaver/core-events';
|
||||
import type { ObjectPropertyInfo } from '@cloudbeaver/core-sdk';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
|
||||
import type { IExecutionPlanNode } from './ExecutionPlanTreeContext';
|
||||
import { Expand } from './Expand';
|
||||
@@ -43,7 +42,6 @@ interface Props {
|
||||
}
|
||||
|
||||
export const NestedNode: React.FC<Props> = function NestedNode({ columns, node, depth, className }) {
|
||||
const style = useStyles(styles);
|
||||
const [expanded, setExpanded] = useState(true);
|
||||
|
||||
const expand = useCallback((event: React.MouseEvent<any, MouseEvent>) => {
|
||||
@@ -53,7 +51,7 @@ export const NestedNode: React.FC<Props> = function NestedNode({ columns, node,
|
||||
|
||||
const hasChildren = node.children.length > 0;
|
||||
|
||||
return styled(style)(
|
||||
return styled(styles)(
|
||||
<>
|
||||
<TableItem key={`${node.id}_${depth}`} className={className} item={node.id} selectOnItem>
|
||||
{columns.map((column, idx) => {
|
||||
|
||||
+2
-5
@@ -11,10 +11,8 @@ import { observer } from 'mobx-react-lite';
|
||||
import { useMemo } from 'react';
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { Table, TableHeader, TableColumnHeader, TableBody, TextPlaceholder } from '@cloudbeaver/core-blocks';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import { Table, TableHeader, TableColumnHeader, TableBody, TextPlaceholder, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import type { ObjectPropertyInfo, SqlExecutionPlanNode } from '@cloudbeaver/core-sdk';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
|
||||
import { isVisibleProperty } from '../useExecutionPlanTreeState';
|
||||
import { PropertiesPanelItemsGroup } from './PropertiesPanelItemsGroup';
|
||||
@@ -35,7 +33,6 @@ interface Props {
|
||||
}
|
||||
|
||||
export const PropertiesPanel = observer<Props>(function PropertiesPanel({ selectedNode, nodeList, className }) {
|
||||
const style = useStyles(styles);
|
||||
const translate = useTranslate();
|
||||
|
||||
const { general, details } = useMemo(() => computed(() => {
|
||||
@@ -66,7 +63,7 @@ export const PropertiesPanel = observer<Props>(function PropertiesPanel({ select
|
||||
const nameColumnTitle = translate('sql_execution_plan_properties_panel_name');
|
||||
const valueColumnTitle = translate('sql_execution_plan_properties_panel_value');
|
||||
|
||||
return styled(style)(
|
||||
return styled(styles)(
|
||||
<Table className={className}>
|
||||
<TableHeader>
|
||||
<TableColumnHeader title={nameColumnTitle}>
|
||||
|
||||
+1
-3
@@ -12,7 +12,6 @@ import styled, { css } from 'reshadow';
|
||||
|
||||
import { Split, Pane, ResizerControls, splitStyles, Loader, useSplitUserState } from '@cloudbeaver/core-blocks';
|
||||
import { useService } from '@cloudbeaver/core-di';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
|
||||
import type { IExecutionPlanTab } from '../../ISqlEditorTabState';
|
||||
import { ExecutionPlanTreeBlock } from './ExecutionPlanTreeBlock';
|
||||
@@ -35,7 +34,6 @@ interface Props {
|
||||
export const SqlExecutionPlanPanel = observer<Props>(function SqlExecutionPlanPanel({
|
||||
executionPlanTab,
|
||||
}) {
|
||||
const style = useStyles(styles, splitStyles);
|
||||
const sqlExecutionPlanService = useService(SqlExecutionPlanService);
|
||||
const data = sqlExecutionPlanService.data.get(executionPlanTab.tabId);
|
||||
const [selectedNode, setSelectedNode] = useState<string | null>(null);
|
||||
@@ -50,7 +48,7 @@ export const SqlExecutionPlanPanel = observer<Props>(function SqlExecutionPlanPa
|
||||
);
|
||||
}
|
||||
|
||||
return styled(style)(
|
||||
return styled(styles, splitStyles)(
|
||||
<Split
|
||||
{...splitState}
|
||||
mode={selectedNode ? splitState.mode : 'minimize'}
|
||||
|
||||
@@ -10,7 +10,8 @@ import { observer } from 'mobx-react-lite';
|
||||
import { useContext } from 'react';
|
||||
import styled from 'reshadow';
|
||||
|
||||
import { ComponentStyle, useStyles } from '@cloudbeaver/core-theming';
|
||||
import { useStyles } from '@cloudbeaver/core-blocks';
|
||||
import type { ComponentStyle } from '@cloudbeaver/core-theming';
|
||||
import { ITabData, Tab, TabIcon, TabTitle } from '@cloudbeaver/core-ui';
|
||||
import { CaptureViewContext, useDataContext } from '@cloudbeaver/core-view';
|
||||
|
||||
|
||||
@@ -9,10 +9,8 @@
|
||||
import { observer } from 'mobx-react-lite';
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { TextPlaceholder } from '@cloudbeaver/core-blocks';
|
||||
import { TextPlaceholder, useStyles, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import { useService } from '@cloudbeaver/core-di';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import { useStyles } from '@cloudbeaver/core-theming';
|
||||
import { ITabData, TabsState, TabList, TabPanel, BASE_TAB_STYLES } from '@cloudbeaver/core-ui';
|
||||
|
||||
import type { ISqlEditorTabState } from '../ISqlEditorTabState';
|
||||
|
||||
@@ -9,9 +9,8 @@
|
||||
import { observer } from 'mobx-react-lite';
|
||||
import styled, { css } from 'reshadow';
|
||||
|
||||
import { Loader, TextPlaceholder } from '@cloudbeaver/core-blocks';
|
||||
import { Loader, TextPlaceholder, useTranslate } from '@cloudbeaver/core-blocks';
|
||||
import { useService } from '@cloudbeaver/core-di';
|
||||
import { useTranslate } from '@cloudbeaver/core-localization';
|
||||
import { TableViewerStorageService } from '@cloudbeaver/plugin-data-viewer';
|
||||
|
||||
import type { IStatisticsTab } from '../ISqlEditorTabState';
|
||||
|
||||
Reference in New Issue
Block a user