CB-2501 refactor: plugins structure

This commit is contained in:
Wroud
2022-10-04 16:32:09 +03:00
parent 5aadb5251c
commit e2bc7b0f3d
357 changed files with 780 additions and 923 deletions
@@ -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,
@@ -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) => {
@@ -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}>
@@ -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';