From 236494b6d2f817f978803cde6774976a0799c5db Mon Sep 17 00:00:00 2001 From: Aleksei Potsetsuev Date: Mon, 13 May 2024 20:34:17 +0700 Subject: [PATCH 1/5] CB-5070 refactor: forms design --- .../core-blocks/src/Containers/Group.m.css | 4 ++ .../core-blocks/src/Containers/Group.tsx | 4 +- .../core-blocks/src/Table/TableHeader.m.css | 8 +++ .../Administration/Users/Teams/CreateTeam.tsx | 10 +-- .../GrantedConnections/ConnectionList.m.css | 32 +++------ .../GrantedConnections/ConnectionList.tsx | 65 +++++++++--------- .../GrantedConnections/GrantedConnections.tsx | 5 +- .../GrantedConnectionsList.m.css | 31 +++------ .../GrantedConnectionsList.tsx | 65 +++++++++--------- .../GrantedConnectionsTableHeader.m.css | 24 +++---- .../GrantedConnectionsTableHeader.tsx | 8 +-- .../Teams/GrantedUsers/GrantedUserList.m.css | 29 +++----- .../Teams/GrantedUsers/GrantedUserList.tsx | 59 ++++++++-------- .../Users/Teams/GrantedUsers/GrantedUsers.tsx | 9 ++- .../GrantedUsersTableHeader.m.css | 23 +++---- .../GrantedUsersTableHeader.tsx | 8 +-- .../Users/Teams/GrantedUsers/UserList.m.css | 29 +++----- .../Users/Teams/GrantedUsers/UserList.tsx | 62 ++++++++--------- .../Users/Teams/Options/TeamOptions.tsx | 6 +- .../Administration/Users/Teams/TeamForm.m.css | 68 +++---------------- .../Administration/Users/Teams/TeamForm.tsx | 37 +++++----- .../Users/Teams/TeamsTable/TeamEdit.m.css | 13 ++-- .../Users/Teams/TeamsTable/TeamEdit.tsx | 6 +- .../UserForm/AdministrationUserForm.m.css | 28 ++------ .../Users/UserForm/AdministrationUserForm.tsx | 15 ++-- .../UserFormConnectionAccess.tsx | 12 ++-- .../UserFormConnectionAccessPanel.tsx | 10 ++- .../Users/UserForm/Info/UserFormInfo.tsx | 38 ++++------- .../Origin/UserFormOriginInfoPanel.tsx | 5 +- .../Users/UsersTable/CreateUser.tsx | 15 ++-- .../Users/UsersTable/UserEdit.m.css | 5 -- .../Users/UsersTable/UserEdit.tsx | 6 +- 32 files changed, 299 insertions(+), 440 deletions(-) diff --git a/webapp/packages/core-blocks/src/Containers/Group.m.css b/webapp/packages/core-blocks/src/Containers/Group.m.css index 94ebaf14c3..50d599e7f5 100644 --- a/webapp/packages/core-blocks/src/Containers/Group.m.css +++ b/webapp/packages/core-blocks/src/Containers/Group.m.css @@ -12,6 +12,10 @@ .surface { composes: theme-background-surface theme-text-on-surface from global; } +.border { + composes: theme-border-color-background from global; + border: 1px solid; +} .group { align-content: baseline; box-sizing: border-box; diff --git a/webapp/packages/core-blocks/src/Containers/Group.tsx b/webapp/packages/core-blocks/src/Containers/Group.tsx index 94927d58bb..cda463b627 100644 --- a/webapp/packages/core-blocks/src/Containers/Group.tsx +++ b/webapp/packages/core-blocks/src/Containers/Group.tsx @@ -20,12 +20,13 @@ interface Props extends IContainerProps { secondary?: boolean; center?: boolean; box?: boolean; + border?: boolean; hideOverflow?: boolean; boxNoOverflow?: boolean; } export const Group = forwardRef>(function Group( - { form, center, box, secondary, boxNoOverflow, hideOverflow, className, ...rest }, + { form, center, box, border, secondary, boxNoOverflow, hideOverflow, className, ...rest }, ref, ) { const styles = useS(style, containerStyles, elementsSizeStyles); @@ -51,6 +52,7 @@ export const Group = forwardRef tr { diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/CreateTeam.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/CreateTeam.tsx index 2cfd10dfc0..96d34d0079 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/CreateTeam.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/CreateTeam.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { Container, Group, GroupTitle, s, Translate, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { Container, Group, GroupTitle, Loader, s, Translate, useS, useTranslate } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import style from './CreateTeam.m.css'; @@ -24,12 +24,14 @@ export const CreateTeam: React.FC = observer(function CreateTeam() { } return ( - + - - + + + + ); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css index 08b446ef0f..7f6dfcf099 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css @@ -1,28 +1,14 @@ -.group { - position: relative; -} +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ -.group, -.container, -.tableContainer { +.group { height: 100%; } - -.container { - display: flex; - flex-direction: column; - width: 100%; -} - -.tableContainer { - overflow: auto; -} - -.grantedConnectionsTableHeader { +.header { flex: 0 0 auto; } - -.table { - composes: theme-background-surface theme-text-on-surface from global; - width: 100%; -} \ No newline at end of file diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.tsx index 0759eeca36..aa5967b97d 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.tsx @@ -11,6 +11,7 @@ import { useCallback, useState } from 'react'; import { Button, + Container, getComputed, getSelectedItems, Group, @@ -26,11 +27,11 @@ import { import { Connection, DBDriverResource } from '@cloudbeaver/core-connections'; import { useService } from '@cloudbeaver/core-di'; +import styles from './ConnectionList.m.css'; import { getFilteredConnections } from './getFilteredConnections'; import { GrantedConnectionsTableHeader, IFilterState } from './GrantedConnectionsTableHeader/GrantedConnectionsTableHeader'; import { GrantedConnectionsTableInnerHeader } from './GrantedConnectionsTableHeader/GrantedConnectionsTableInnerHeader'; import { GrantedConnectionsTableItem } from './GrantedConnectionsTableItem'; -import styles from './ConnectionList.m.css'; interface Props { connectionList: Connection[]; @@ -60,40 +61,40 @@ export const ConnectionList = observer(function ConnectionList({ connecti const keys = connections.map(connection => connection.id); return ( - -
- + + + - -
- !grantedSubjects.includes(item)} size="big"> - - - {!connections.length && filterState.filterValue && ( - - {translate('ui_search_no_result_placeholder')} - - )} - {connections.map(connection => { - const driver = driversResource.get(connection.driverId); - return ( - - ); - })} - -
-
-
+ + + + !grantedSubjects.includes(item)}> + + + {!connections.length && filterState.filterValue && ( + + {translate('ui_search_no_result_placeholder')} + + )} + {connections.map(connection => { + const driver = driversResource.get(connection.driverId); + return ( + + ); + })} + +
+ ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnections.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnections.tsx index 0d0f10edee..364000c718 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnections.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnections.tsx @@ -8,7 +8,6 @@ import { observer } from 'mobx-react-lite'; import { - ColoredContainer, Container, getComputed, Group, @@ -76,7 +75,7 @@ export const GrantedConnections: TabContainerPanelComponent = ob return ( {() => ( - + {!connections.length ? ( {translate('administration_teams_team_granted_connections_empty')} @@ -102,7 +101,7 @@ export const GrantedConnections: TabContainerPanelComponent = ob )} - + )} ); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css index 5671a83df0..0d475761e0 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css @@ -1,28 +1,13 @@ -.box { - position: relative; -} - -.box, -.innerBox, -.tableBox { +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +.group { height: 100%; } - -.innerBox { - display: flex; - flex-direction: column; - width: 100%; -} - .header { flex: 0 0 auto; } - -.tableBox { - overflow: auto; -} - -.table { - composes: theme-background-surface theme-text-on-surface from global; - width: 100%; -} diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.tsx index 0432ca14b6..d9db50eaed 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.tsx @@ -11,6 +11,7 @@ import { useCallback, useState } from 'react'; import { Button, + Container, getComputed, getSelectedItems, Group, @@ -70,43 +71,45 @@ export const GrantedConnectionList = observer(function GrantedConnectionL } return ( - -
- + + + + + - -
- - - - {tableInfoText && ( - - {translate(tableInfoText)} - - )} - {connections.map(connection => { - const driver = driversResource.get(connection.driverId); - return ( - - ); - })} - -
-
-
+ + + + + + + {tableInfoText && ( + + {translate(tableInfoText)} + + )} + {connections.map(connection => { + const driver = driversResource.get(connection.driverId); + return ( + + ); + })} + +
+ ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.m.css index 9756fef33f..d1ca9b666b 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.m.css @@ -1,18 +1,12 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .header { - composes: theme-border-color-background theme-background-surface theme-text-on-surface from global; - overflow: hidden; - position: sticky; - top: 0; - z-index: 1; - display: flex; - align-items: center; - justify-content: space-between; - padding: 16px; - gap: 16px; + composes: theme-border-color-background from global; border-bottom: 1px solid; -} - -.buttons { - display: flex; - gap: 16px; + flex-shrink: 0; } diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.tsx index f3a0e88a92..c6480555ad 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsTableHeader/GrantedConnectionsTableHeader.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { Filter, s, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { Container, Filter, s, useS, useTranslate } from '@cloudbeaver/core-blocks'; import style from './GrantedConnectionsTableHeader.m.css'; @@ -26,14 +26,14 @@ export const GrantedConnectionsTableHeader = observer(function GrantedCon const translate = useTranslate(); return ( -
+ -
{children}
-
+ {children} + ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css index 202675a708..692f3ead06 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css @@ -1,27 +1,14 @@ -.box { - position: relative; -} - -.box, -.innerBox, -.tableBox { +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +.group { height: 100%; } -.innerBox { - display: flex; - flex-direction: column; - width: 100%; -} - .header { flex: 0 0 auto; } - -.tableBox { - overflow: auto; -} - -.table { - composes: theme-background-surface theme-text-on-surface from global; -} diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.tsx index af186ae5e1..85a150b35d 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.tsx @@ -12,6 +12,7 @@ import { useCallback, useState } from 'react'; import { UsersResource } from '@cloudbeaver/core-authentication'; import { Button, + Container, getComputed, getSelectedItems, Group, @@ -81,40 +82,42 @@ export const GrantedUserList = observer(function GrantedUserList({ grante } return ( - -
- + + + + + - -
- isEditable(item)}> - - - {tableInfoText && ( - - {translate(tableInfoText)} - - )} - {users.map(user => ( - - ))} - -
-
-
+ + + + isEditable(item)}> + + + {tableInfoText && ( + + {translate(tableInfoText)} + + )} + {users.map(user => ( + + ))} + +
+ ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsers.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsers.tsx index 4977c9cb6e..f1fe31856d 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsers.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsers.tsx @@ -9,7 +9,6 @@ import { observer } from 'mobx-react-lite'; import { AdminUser, UsersResource, UsersResourceFilterKey } from '@cloudbeaver/core-authentication'; import { - ColoredContainer, Container, getComputed, Group, @@ -58,18 +57,18 @@ export const GrantedUsers: TabContainerPanelComponent = observer if (isDefaultTeam) { return ( - + {translate('plugin_authentication_administration_team_default_users_tooltip')} - + ); } return ( {() => ( - + {!users.resource.values.length ? ( {translate('administration_teams_team_granted_users_empty')} @@ -90,7 +89,7 @@ export const GrantedUsers: TabContainerPanelComponent = observer )} - + )} ); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.m.css index 9756fef33f..55d3274892 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.m.css @@ -1,18 +1,11 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .header { - composes: theme-border-color-background theme-background-surface theme-text-on-surface from global; - overflow: hidden; - position: sticky; - top: 0; - z-index: 1; - display: flex; - align-items: center; - justify-content: space-between; - padding: 16px; - gap: 16px; + composes: theme-border-color-background from global; border-bottom: 1px solid; } - -.buttons { - display: flex; - gap: 16px; -} diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.tsx index d9cdb396bb..d12986d115 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUsersTableHeader/GrantedUsersTableHeader.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { Filter, s, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { Container, Filter, s, useS, useTranslate } from '@cloudbeaver/core-blocks'; import style from './GrantedUsersTableHeader.m.css'; @@ -26,14 +26,14 @@ export const GrantedUsersTableHeader = observer(function GrantedUsersTabl const translate = useTranslate(); return ( -
+ -
{children}
-
+ {children} + ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.m.css index 202675a708..692f3ead06 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.m.css @@ -1,27 +1,14 @@ -.box { - position: relative; -} - -.box, -.innerBox, -.tableBox { +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +.group { height: 100%; } -.innerBox { - display: flex; - flex-direction: column; - width: 100%; -} - .header { flex: 0 0 auto; } - -.tableBox { - overflow: auto; -} - -.table { - composes: theme-background-surface theme-text-on-surface from global; -} diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.tsx index 21cb1e9bbf..85005f1a1f 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/UserList.tsx @@ -12,6 +12,7 @@ import { useCallback, useState } from 'react'; import { UsersResource } from '@cloudbeaver/core-authentication'; import { Button, + Container, getComputed, getSelectedItems, Group, @@ -71,42 +72,37 @@ export const UserList = observer(function UserList({ userList, grantedUse } return ( - -
- + + + - -
- isEditable(item) && !grantedUsers.includes(item)} - > - - - {!users.length && filterState.filterValue && ( - - {translate('ui_search_no_result_placeholder')} - - )} - {users.map(user => ( - - ))} - -
-
-
+ + + + isEditable(item) && !grantedUsers.includes(item)}> + + + {!users.length && filterState.filterValue && ( + + {translate('ui_search_no_result_placeholder')} + + )} + {users.map(user => ( + + ))} + +
+ ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/Options/TeamOptions.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/Options/TeamOptions.tsx index 3d1ed36a6a..7103c0cd59 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/Options/TeamOptions.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/Options/TeamOptions.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { ColoredContainer, Group, InputField, Textarea, useResource, useTranslate } from '@cloudbeaver/core-blocks'; +import { Container, Group, InputField, Textarea, useResource, useTranslate } from '@cloudbeaver/core-blocks'; import { ServerConfigResource } from '@cloudbeaver/core-root'; import type { TabContainerPanelComponent } from '@cloudbeaver/core-ui'; @@ -21,7 +21,7 @@ export const TeamOptions: TabContainerPanelComponent = observer( const edit = state.mode === 'edit'; return ( - + {translate('administration_teams_team_id')} @@ -35,6 +35,6 @@ export const TeamOptions: TabContainerPanelComponent = observer( {!serverConfigResource.resource.distributed && } - + ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.m.css index d1fdd531ef..b9090587dd 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.m.css @@ -1,17 +1,14 @@ -.form { - width: 100%; - height: 100%; - display: flex; - flex: 1; - flex-direction: column; - overflow: auto; -} +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .topBar { - composes: theme-border-color-background theme-background-secondary theme-text-on-secondary from global; - position: relative; - display: flex; - padding-top: 16px; + composes: theme-border-color-background from global; + margin-bottom: 16px; } .topBar:before { @@ -22,50 +19,3 @@ border-bottom: solid 2px; border-color: inherit; } - -.topBarTabs { - flex: 1; -} - -.topBarActions { - display: flex; - align-items: center; - padding: 0 24px; - gap: 16px; -} - -.statusMessage { - composes: theme-typography--caption from global; - height: 24px; - padding: 0 16px; - display: flex; - align-items: center; - gap: 8px; -} - -.statusMessage .iconOrImage { - height: 24px; - width: 24px; -} - -.box { - composes: theme-background-secondary theme-text-on-secondary from global; - display: flex; - flex-direction: column; - flex: 1; - height: 100%; - overflow: auto; -} -.content { - composes: theme-background-secondary theme-border-color-background from global; - position: relative; - display: flex; - flex: 1; - flex-direction: column; - overflow: auto; -} -.tabList { - position: relative; - flex-shrink: 0; - align-items: center; -} diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx index 5d6efd1d82..ba90aaa56e 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx @@ -10,12 +10,13 @@ import { useEffect } from 'react'; import type { TeamInfo } from '@cloudbeaver/core-authentication'; import { + Container, Form, - IconOrImage, Loader, Placeholder, s, SContext, + StatusMessage, useExecutor, useForm, useObjectRef, @@ -23,6 +24,7 @@ import { useTranslate, } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; +import { ENotificationType } from '@cloudbeaver/core-events'; import { TabBigUnderlineStyleRegistry, TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; import { teamContext } from './Contexts/teamContext'; @@ -70,35 +72,28 @@ export const TeamForm = observer(function TeamForm({ state, onCancel, onS }, []); return ( -
+ -
-
-
-
- {state.statusMessage && ( - <> - - {translate(state.statusMessage)} - - )} -
+ + + + - + -
-
+ + -
-
-
+ + + -
-
+ +
); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.m.css index b2e3ec8e74..769db6084c 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.m.css @@ -1,8 +1,11 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ + .box { - composes: theme-background-secondary theme-text-on-secondary from global; - box-sizing: border-box; - padding-bottom: 24px; - display: flex; - flex-direction: column; height: 664px; } diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.tsx index beac2879ce..d0b05b90e3 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.tsx @@ -9,7 +9,7 @@ import { observer } from 'mobx-react-lite'; import { useCallback, useContext } from 'react'; import { TeamsResource } from '@cloudbeaver/core-authentication'; -import { s, TableContext, useS } from '@cloudbeaver/core-blocks'; +import { Container, s, TableContext, useS } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { TeamForm } from '../TeamForm'; @@ -34,8 +34,8 @@ export const TeamEdit = observer(function TeamEdit({ item }) { data.config.teamId = item; return ( -
+ -
+ ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.m.css index 3f7d709ce4..d8633380d7 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.m.css @@ -6,10 +6,8 @@ * you may not use this file except in compliance with the License. */ -.bar { - composes: theme-border-color-background theme-background-secondary theme-text-on-secondary from global; - position: relative; - display: flex; +.header { + composes: theme-border-color-background from global; margin-bottom: 16px; &:before { @@ -22,24 +20,6 @@ } } -.tabList { - display: flex; - position: relative; - flex-shrink: 0; - align-items: center; -} - -.contentBox { - composes: theme-background-secondary theme-text-on-secondary theme-border-color-background from global; - display: flex; - flex: 1; - flex-direction: column; - overflow: auto; -} - -.submittingForm { - flex: 1; - overflow: auto; - display: flex; - flex-direction: column; +.statusMessage { + margin-bottom: 8px; } diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx index 63084cfe54..f6710afbe3 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx @@ -62,14 +62,19 @@ export const AdministrationUserForm = observer(function AdministrationUse useAutoLoad(AdministrationUserForm, state); return ( -
+ - - + + - + - + diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccess.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccess.tsx index a903b645ae..cb5846299e 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccess.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccess.tsx @@ -8,7 +8,7 @@ import { observer } from 'mobx-react-lite'; import { - ColoredContainer, + Container, Group, Table, TableBody, @@ -68,11 +68,11 @@ export const UserFormConnectionAccess: TabContainerPanelComponent if (connections.length === 0) { return ( - + {translate('authentication_administration_user_connections_empty')} - + ); } @@ -92,9 +92,9 @@ export const UserFormConnectionAccess: TabContainerPanelComponent // } return ( - + {/* {info && } */} - + @@ -114,6 +114,6 @@ export const UserFormConnectionAccess: TabContainerPanelComponent
- + ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccessPanel.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccessPanel.tsx index 6cd6896344..b102127d84 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccessPanel.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccessPanel.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { ColoredContainer, Group, TextPlaceholder, useAutoLoad, useTranslate } from '@cloudbeaver/core-blocks'; +import { ColoredContainer, Container, Group, TextPlaceholder, useAutoLoad, useTranslate } from '@cloudbeaver/core-blocks'; import { type TabContainerPanelComponent, useTab } from '@cloudbeaver/core-ui'; import type { UserFormProps } from '../AdministrationUserFormService'; @@ -29,11 +29,9 @@ export const UserFormConnectionAccessPanel: TabContainerPanelComponent - - {translate('connections_connection_access_admin_info')} - - + + {translate('connections_connection_access_admin_info')} + ); } diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Info/UserFormInfo.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Info/UserFormInfo.tsx index 49f5fe6d9e..ffcf2a7818 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Info/UserFormInfo.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Info/UserFormInfo.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { ColoredContainer, Container, FieldCheckbox, Group, GroupTitle, Placeholder, useAutoLoad, useTranslate } from '@cloudbeaver/core-blocks'; +import { Container, FieldCheckbox, Group, GroupTitle, Placeholder, useAutoLoad, useTranslate } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { TabContainerPanelComponent, useTab, useTabState } from '@cloudbeaver/core-ui'; @@ -30,29 +30,21 @@ export const UserFormInfo: TabContainerPanelComponent = observer( const disabled = tabState.isLoading(); const userManagementDisabled = administrationUsersManagementService.externalUserProviderEnabled; - // let info: TLocalizationToken | null = null; - - // if (formState.mode === FormMode.Edit && tabState.isChanged()) { - // info = 'ui_save_reminder'; - // } return ( - - {/* {info && } */} - - - - - - - {translate('authentication_user_status')} - - {translate('authentication_user_enabled')} - - - - - - + + + + + + + {translate('authentication_user_status')} + + {translate('authentication_user_enabled')} + + + + + ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx index 8436266bba..faa1f6bb2e 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx @@ -11,7 +11,6 @@ import { Fragment } from 'react'; import { AdminUserOrigin, UsersResource } from '@cloudbeaver/core-authentication'; import { Button, - ColoredContainer, Combobox, ConfirmationDialog, Container, @@ -87,7 +86,7 @@ export const UserFormOriginInfoPanel: TabContainerPanelComponent } return ( - + )} - + ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/CreateUser.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/CreateUser.tsx index 8b0fa7a4c7..61abf479fa 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/CreateUser.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/CreateUser.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { ColoredContainer, Group, GroupTitle, Loader, s, Translate, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { Container, Group, GroupTitle, Loader, s, Translate, useS, useTranslate } from '@cloudbeaver/core-blocks'; import type { IFormState } from '@cloudbeaver/core-ui'; import { AdministrationUserForm } from '../UserForm/AdministrationUserForm'; @@ -24,22 +24,15 @@ export const CreateUser = observer(function CreateUser({ state, onCancel const styles = useS(style); return ( - + - + - + ); }); diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.m.css index 63e887ee08..7dde534b0c 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.m.css @@ -7,10 +7,5 @@ */ .box { - composes: theme-background-secondary theme-text-on-secondary from global; - box-sizing: border-box; - padding-bottom: 24px; height: 600px; - display: flex; - flex-direction: column; } diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx index 2e5c97bec7..65ea2ce954 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx @@ -8,7 +8,7 @@ import { observer } from 'mobx-react-lite'; import { useState } from 'react'; -import { Loader, s, TableItemExpandProps, useS } from '@cloudbeaver/core-blocks'; +import { Container, Loader, s, TableItemExpandProps, useS } from '@cloudbeaver/core-blocks'; import { App, useService } from '@cloudbeaver/core-di'; import { FormMode } from '@cloudbeaver/core-ui'; @@ -30,10 +30,10 @@ export const UserEdit = observer>(function UserEdit }); return ( -
+ -
+ ); }); From e5008d60c2d187998af533874e3efc9784384572 Mon Sep 17 00:00:00 2001 From: Aleksei Potsetsuev Date: Tue, 14 May 2024 13:27:39 +0700 Subject: [PATCH 2/5] Merge remote-tracking branch 'origin/devel' into refactor/cb-5070/forms-design --- .../core-administration/src/manifest.ts | 14 +- webapp/packages/core-app/src/Body.m.css | 11 +- webapp/packages/core-app/src/Body.tsx | 8 +- webapp/packages/core-app/src/manifest.ts | 10 +- .../core-authentication/src/manifest.ts | 55 +- webapp/packages/core-blocks/src/Cell.m.css | 49 +- webapp/packages/core-blocks/src/Cell.tsx | 28 +- .../CommonDialog/CommonDialogWrapper.m.css | 6 +- .../src/CommonDialog/DialogsPortal.tsx | 8 +- .../core-blocks/src/DisplayError.m.css | 9 +- .../core-blocks/src/ErrorMessage.test.tsx | 6 +- .../src/FormControls/FieldLabel.m.css | 7 + .../src/FormControls/InputFiles.m.css | 35 +- .../src/FormControls/InputFiles.tsx | 2 +- .../HTMLTemplates/app-loading-screen.html.ejs | 48 +- .../src/ToolsPanel/ToolsPanel.m.css | 4 +- .../core-blocks/src/ToolsPanel/ToolsPanel.tsx | 6 +- webapp/packages/core-blocks/src/manifest.ts | 4 +- .../packages/core-bootstrap/src/bootstrap.ts | 29 +- .../packages/core-bootstrap/src/manifest.ts | 2 +- .../core-bootstrap/src/renderLayout.m.css | 9 +- .../core-bootstrap/src/renderLayout.tsx | 4 +- .../core-browser-cookies/src/manifest.ts | 4 +- .../core-browser-settings/src/manifest.ts | 8 +- webapp/packages/core-browser/package.json | 10 +- .../src/ServiceWorkerBootstrap.ts | 8 +- .../core-browser/src/ServiceWorkerService.ts | 122 ++++- webapp/packages/core-browser/src/manifest.ts | 14 +- .../core-browser/src/service-worker.ts | 107 +++- .../core-cli/configs/webpack.config.js | 257 +++++++--- .../configs/webpack.product.config.js | 54 +- .../configs/webpack.product.dev.config.js | 13 +- webapp/packages/core-cli/package.json | 1 + .../core-client-activity/src/manifest.ts | 4 +- .../packages/core-connections/src/manifest.ts | 49 +- webapp/packages/core-di/src/App.ts | 48 +- webapp/packages/core-di/src/AppContext.tsx | 6 +- webapp/packages/core-di/src/AppContextLazy.ts | 10 + .../AppLoadingScreen/HideAppLoadingScreen.tsx | 13 + .../HideAppLoadingScreenLazy.ts | 10 + .../AppLoadingScreen/displayUpdateStatus.ts | 19 + .../useAppLoadingScreen.ts | 7 + webapp/packages/core-di/src/PluginManifest.ts | 3 +- .../src/__tests__/app-init/app-init.test.ts | 2 +- .../src/__tests__/app-init/manifest.ts | 4 +- webapp/packages/core-di/src/index.ts | 12 +- webapp/packages/core-di/src/manifest.ts | 3 +- webapp/packages/core-dialogs/src/manifest.ts | 8 +- webapp/packages/core-events/src/manifest.ts | 10 +- .../src/LocalizationService.ts | 15 +- .../core-localization/src/manifest.ts | 4 +- .../core-navigation-tree/src/manifest.ts | 22 +- webapp/packages/core-product/src/manifest.ts | 4 +- webapp/packages/core-projects/src/manifest.ts | 12 +- .../core-resource-manager/src/manifest.ts | 19 +- webapp/packages/core-root/src/manifest.ts | 70 +-- webapp/packages/core-routing/src/manifest.ts | 10 +- webapp/packages/core-sdk/src/manifest.ts | 10 +- .../core-server-localization/src/manifest.ts | 4 +- .../core-session-localization/src/manifest.ts | 4 +- .../src/manifest.ts | 12 +- .../core-settings-user/src/manifest.ts | 10 +- webapp/packages/core-settings/src/manifest.ts | 12 +- webapp/packages/core-storage/src/manifest.ts | 4 +- .../core-task-manager/src/manifest.ts | 4 +- .../packages/core-theming/src/ThemeService.ts | 3 +- webapp/packages/core-theming/src/manifest.ts | 12 +- .../src/styles/main/typography.pure.scss | 5 +- .../core-ui/src/Form/Components/BaseForm.tsx | 7 +- .../core-ui/src/SideBarPanel/SideBarPanel.tsx | 4 +- .../packages/core-ui/src/Tabs/Tab/Tab.m.css | 1 + .../src/Tabs/Tab/TabBigUnderlineStyles.m.css | 6 +- .../src/Tabs/Tab/TabIconVerticalRotated.m.css | 2 +- .../src/Tabs/Tab/TabStyleRegistries.ts | 2 +- .../Tabs/Tab/TabTitleBigUnderlineStyles.m.css | 6 +- .../Tabs/Tab/TabTitleVerticalRotated.m.css | 2 +- .../core-ui/src/Tabs/Tab/TabUnderline.m.css | 40 +- .../core-ui/src/Tabs/Tab/TabVertical.m.css | 6 +- .../src/Tabs/Tab/TabVerticalRotated.m.css | 36 +- .../packages/core-ui/src/Tabs/TabList.m.css | 26 + webapp/packages/core-ui/src/Tabs/TabList.tsx | 100 ++-- .../core-ui/src/Tabs/TabListVertical.m.css | 2 +- .../src/Tabs/TabListVerticalRotated.m.css | 3 +- webapp/packages/core-ui/src/index.ts | 2 - webapp/packages/core-ui/src/manifest.ts | 25 +- .../core-version-update/src/manifest.ts | 8 +- webapp/packages/core-version/src/manifest.ts | 10 +- webapp/packages/core-view/src/manifest.ts | 14 +- .../src/Administration/Administration.tsx | 5 +- .../plugin-administration/src/manifest.ts | 28 +- .../Administration/Users/Teams/TeamForm.tsx | 7 +- .../Users/UserForm/AdministrationUserForm.tsx | 8 +- .../Users/UsersAdministration.tsx | 18 +- .../Users/shared/UsersAdministrationTab.m.css | 24 +- .../src/manifest.ts | 70 +-- .../src/Dialog/AuthDialog.m.css | 26 +- .../src/Dialog/AuthDialog.tsx | 117 +++-- .../plugin-authentication/src/manifest.ts | 14 +- .../src/PluginBrowserBootstrap.ts | 48 +- .../src/PluginBrowserPreloadingBootstrap.ts | 32 ++ .../packages/plugin-browser/src/locales/en.ts | 12 +- .../packages/plugin-browser/src/locales/it.ts | 12 +- .../packages/plugin-browser/src/locales/ru.ts | 9 +- .../packages/plugin-browser/src/locales/zh.ts | 12 +- .../packages/plugin-browser/src/manifest.ts | 9 +- .../plugin-connection-custom/src/manifest.ts | 10 +- .../plugin-connection-search/src/manifest.ts | 19 +- .../src/manifest.ts | 12 +- .../CreateConnection/CreateConnection.tsx | 3 +- .../src/manifest.ts | 22 +- .../src/ConnectionForm/ConnectionForm.tsx | 20 +- .../plugin-connections/src/manifest.ts | 40 +- .../src/Dialog/ProcessorConfigureDialog.tsx | 21 +- .../plugin-data-export/src/manifest.ts | 25 +- .../plugin-data-import/src/manifest.ts | 14 +- .../src/manifest.ts | 28 +- .../src/manifest.ts | 8 +- .../TableViewer/TableFooter/TableFooter.tsx | 2 +- .../TableHeader/TableWhereFilter.m.css | 3 + .../TableHeader/TableWhereFilter.tsx | 30 +- .../TablePresentationBar.tsx | 5 +- .../shared/TablePresentationBar.m.css | 2 +- .../src/TableViewer/ValuePanel/ValuePanel.tsx | 7 +- .../TextValue/TextValuePresentation.tsx | 10 +- .../shared/TextValuePresentationTab.m.css | 3 + .../plugin-data-viewer/src/manifest.ts | 52 +- .../src/manifest.ts | 12 +- .../src/manifest.ts | 10 +- .../plugin-ddl-viewer/src/manifest.ts | 12 +- .../plugin-devtools/src/PluginBootstrap.ts | 4 +- .../packages/plugin-devtools/src/manifest.ts | 5 +- .../plugin-gis-viewer/src/manifest.ts | 12 +- .../src/Shortcuts/ShortcutsDialog.m.css | 3 - .../src/Shortcuts/ShortcutsDialog.tsx | 6 +- webapp/packages/plugin-help/src/manifest.ts | 5 +- .../plugin-localization/src/manifest.ts | 4 +- .../src/LogViewer/LogViewerInfoPanel.m.css | 4 + .../src/LogViewer/LogViewerInfoPanel.tsx | 16 +- .../plugin-log-viewer/src/manifest.ts | 16 +- .../plugin-navigation-tabs/src/manifest.ts | 8 +- .../src/manifest.ts | 8 +- .../plugin-navigation-tree-rm/src/manifest.ts | 12 +- .../plugin-navigation-tree/src/manifest.ts | 31 +- .../ObjectPropertiesPage/ObjectFolders.tsx | 4 +- .../plugin-object-viewer/src/manifest.ts | 25 +- .../packages/plugin-product/src/manifest.ts | 5 +- .../packages/plugin-projects/src/manifest.ts | 5 +- .../src/manifest.ts | 5 +- .../src/manifest.ts | 12 +- .../plugin-resource-manager/src/manifest.ts | 18 +- webapp/packages/plugin-root/src/manifest.ts | 14 +- .../plugin-session-expiration/src/manifest.ts | 12 +- .../src/manifest.ts | 8 +- .../src/manifest.ts | 4 +- .../plugin-settings-menu/src/manifest.ts | 4 +- .../plugin-settings-panel/src/manifest.ts | 8 +- .../src/manifest.ts | 12 +- .../src/manifest.ts | 12 +- .../plugin-sql-editor-new/src/manifest.ts | 10 +- .../plugin-sql-editor-screen/src/manifest.ts | 12 +- .../src/SqlEditor/SqlEditor.tsx | 7 +- .../src/SqlEditor/shared/SqlEditorTab.m.css | 3 +- .../plugin-sql-editor/src/manifest.ts | 55 +- .../plugin-sql-generator/src/manifest.ts | 14 +- .../plugin-task-manager/src/manifest.ts | 8 +- webapp/packages/plugin-theme/src/manifest.ts | 4 +- .../src/ToolsPanel/ToolsPanel.tsx | 16 +- .../plugin-tools-panel/src/manifest.ts | 12 +- .../src/manifest.ts | 8 +- .../TopNavBar/AppStateMenu/AppStateMenu.m.css | 9 +- .../plugin-top-app-bar/src/manifest.ts | 5 +- .../src/manifest.ts | 4 +- .../src/UserProfileSettings.tsx | 2 +- .../src/manifest.ts | 7 +- .../src/UserProfileOptionsPanel.tsx | 10 +- .../plugin-user-profile/src/manifest.ts | 37 +- .../src/VersionChecker.tsx | 7 +- .../src/manifest.ts | 5 +- .../packages/plugin-version/src/manifest.ts | 4 +- .../packages/product-default/src/manifest.ts | 5 +- .../packages/tests-runner/src/renderInApp.tsx | 7 +- webapp/yarn.lock | 476 +++++++++++++++++- 182 files changed, 2150 insertions(+), 1378 deletions(-) create mode 100644 webapp/packages/core-di/src/AppContextLazy.ts create mode 100644 webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreen.tsx create mode 100644 webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreenLazy.ts create mode 100644 webapp/packages/core-di/src/AppLoadingScreen/displayUpdateStatus.ts rename webapp/packages/core-di/src/{ => AppLoadingScreen}/useAppLoadingScreen.ts (84%) create mode 100644 webapp/packages/plugin-browser/src/PluginBrowserPreloadingBootstrap.ts diff --git a/webapp/packages/core-administration/src/manifest.ts b/webapp/packages/core-administration/src/manifest.ts index 9fa20bb554..e3c9c4bdd6 100644 --- a/webapp/packages/core-administration/src/manifest.ts +++ b/webapp/packages/core-administration/src/manifest.ts @@ -7,16 +7,16 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { AdministrationItemService } from './AdministrationItem/AdministrationItemService'; -import { AdministrationLocaleService } from './AdministrationLocaleService'; -import { AdministrationScreenService } from './AdministrationScreen/AdministrationScreenService'; -import { ConfigurationWizardService } from './AdministrationScreen/ConfigurationWizard/ConfigurationWizardService'; -import { PermissionsResource } from './PermissionsResource'; - export const coreAdministrationManifest: PluginManifest = { info: { name: 'Core Administration', }, - providers: [AdministrationItemService, PermissionsResource, AdministrationScreenService, ConfigurationWizardService, AdministrationLocaleService], + providers: [ + () => import('./AdministrationItem/AdministrationItemService').then(m => m.AdministrationItemService), + () => import('./PermissionsResource').then(m => m.PermissionsResource), + () => import('./AdministrationScreen/AdministrationScreenService').then(m => m.AdministrationScreenService), + () => import('./AdministrationScreen/ConfigurationWizard/ConfigurationWizardService').then(m => m.ConfigurationWizardService), + () => import('./AdministrationLocaleService').then(m => m.AdministrationLocaleService), + ], }; diff --git a/webapp/packages/core-app/src/Body.m.css b/webapp/packages/core-app/src/Body.m.css index e454c3ced3..befbe51ef8 100644 --- a/webapp/packages/core-app/src/Body.m.css +++ b/webapp/packages/core-app/src/Body.m.css @@ -1,6 +1,13 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .bodyContent { composes: theme-background-surface theme-text-on-surface theme-typography from global; - height: var(--app-height); + height: var(--app-height, 100vh); display: flex; padding: 0 !important; flex-direction: column; @@ -8,5 +15,5 @@ } .loader { - height: var(--app-height); + height: var(--app-height, 100vh); } diff --git a/webapp/packages/core-app/src/Body.tsx b/webapp/packages/core-app/src/Body.tsx index 7de2d8538f..95add4a0f9 100644 --- a/webapp/packages/core-app/src/Body.tsx +++ b/webapp/packages/core-app/src/Body.tsx @@ -54,8 +54,12 @@ export const Body = observer(function Body() { {Screen && } - - + + + + + + diff --git a/webapp/packages/core-app/src/manifest.ts b/webapp/packages/core-app/src/manifest.ts index 0042da0973..e857c64f6c 100644 --- a/webapp/packages/core-app/src/manifest.ts +++ b/webapp/packages/core-app/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { AppLocaleService } from './AppLocaleService'; -import { AppScreenBootstrap } from './AppScreen/AppScreenBootstrap'; -import { AppScreenService } from './AppScreen/AppScreenService'; - export const coreAppManifest: PluginManifest = { info: { name: 'Core App', }, - providers: [AppScreenService, AppScreenBootstrap, AppLocaleService], + providers: [ + () => import('./AppScreen/AppScreenService').then(m => m.AppScreenService), + () => import('./AppScreen/AppScreenBootstrap').then(m => m.AppScreenBootstrap), + () => import('./AppLocaleService').then(m => m.AppLocaleService), + ], }; diff --git a/webapp/packages/core-authentication/src/manifest.ts b/webapp/packages/core-authentication/src/manifest.ts index d61ab7a50e..3b8902a9de 100644 --- a/webapp/packages/core-authentication/src/manifest.ts +++ b/webapp/packages/core-authentication/src/manifest.ts @@ -7,48 +7,29 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { AppAuthService } from './AppAuthService'; -import { AuthConfigurationParametersResource } from './AuthConfigurationParametersResource'; -import { AuthConfigurationsResource } from './AuthConfigurationsResource'; -import { AuthInfoService } from './AuthInfoService'; -import { AuthProviderService } from './AuthProviderService'; -import { AuthProvidersResource } from './AuthProvidersResource'; -import { AuthRolesResource } from './AuthRolesResource'; -import { AuthSettingsService } from './AuthSettingsService'; -import { LocaleService } from './LocaleService'; -import { PasswordPolicyService } from './PasswordPolicyService'; -import { TeamMetaParametersResource } from './TeamMetaParametersResource'; -import { TeamsManagerService } from './TeamsManagerService'; -import { TeamsResource } from './TeamsResource'; -import { UserConfigurationBootstrap } from './UserConfigurationBootstrap'; -import { UserDataService } from './UserDataService'; -import { UserInfoResource } from './UserInfoResource'; -import { UserMetaParametersResource } from './UserMetaParametersResource'; -import { UsersResource } from './UsersResource'; - export const coreAuthenticationManifest: PluginManifest = { info: { name: 'Core Authentication', }, providers: [ - AppAuthService, - AuthInfoService, - AuthProviderService, - AuthProvidersResource, - AuthSettingsService, - AuthConfigurationsResource, - AuthConfigurationParametersResource, - TeamsManagerService, - TeamsResource, - UserDataService, - UserInfoResource, - UsersResource, - UserMetaParametersResource, - UserConfigurationBootstrap, - AuthRolesResource, - TeamMetaParametersResource, - PasswordPolicyService, - LocaleService, + () => import('./AppAuthService').then(m => m.AppAuthService), + () => import('./AuthConfigurationParametersResource').then(m => m.AuthConfigurationParametersResource), + () => import('./AuthConfigurationsResource').then(m => m.AuthConfigurationsResource), + () => import('./AuthInfoService').then(m => m.AuthInfoService), + () => import('./AuthProviderService').then(m => m.AuthProviderService), + () => import('./AuthProvidersResource').then(m => m.AuthProvidersResource), + () => import('./AuthRolesResource').then(m => m.AuthRolesResource), + () => import('./AuthSettingsService').then(m => m.AuthSettingsService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./PasswordPolicyService').then(m => m.PasswordPolicyService), + () => import('./TeamMetaParametersResource').then(m => m.TeamMetaParametersResource), + () => import('./TeamsManagerService').then(m => m.TeamsManagerService), + () => import('./TeamsResource').then(m => m.TeamsResource), + () => import('./UserConfigurationBootstrap').then(m => m.UserConfigurationBootstrap), + () => import('./UserDataService').then(m => m.UserDataService), + () => import('./UserInfoResource').then(m => m.UserInfoResource), + () => import('./UserMetaParametersResource').then(m => m.UserMetaParametersResource), + () => import('./UsersResource').then(m => m.UsersResource), ], }; diff --git a/webapp/packages/core-blocks/src/Cell.m.css b/webapp/packages/core-blocks/src/Cell.m.css index 34a58ddfbd..9fd1d009a0 100644 --- a/webapp/packages/core-blocks/src/Cell.m.css +++ b/webapp/packages/core-blocks/src/Cell.m.css @@ -1,30 +1,43 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .main { position: relative; - display: flex; - align-items: center; - padding: 8px; -} -.before { - margin-right: 16px; - width: 24px; - height: 24px; - flex-shrink: 0; + + & .before { + width: 24px; + height: 24px; + flex-shrink: 0; + } + & .after { + flex-shrink: 0; + } + & .info { + line-height: 1.4; + font-weight: 500; + } + & .description { + line-height: 1.2; + } } -.after { - margin-left: 16px; - flex-shrink: 0; + +.big { + & .before { + width: 32px; + height: 32px; + } } + .info { composes: theme-typography--body2 from global; - flex: 1; - line-height: 1.4; - display: flex; - flex-direction: column; - font-weight: 500; } + .description { composes: theme-typography--caption from global; - line-height: 1.2; } .ripple { diff --git a/webapp/packages/core-blocks/src/Cell.tsx b/webapp/packages/core-blocks/src/Cell.tsx index 445d09ab56..5bf51a7edc 100644 --- a/webapp/packages/core-blocks/src/Cell.tsx +++ b/webapp/packages/core-blocks/src/Cell.tsx @@ -8,6 +8,7 @@ import { observer } from 'mobx-react-lite'; import style from './Cell.m.css'; +import { Container } from './Containers/Container'; import { s } from './s'; import { useS } from './useS'; @@ -16,23 +17,32 @@ interface Props { before?: React.ReactElement; after?: React.ReactElement; ripple?: boolean; + big?: boolean; className?: string; children?: React.ReactNode; } -export const Cell = observer(function Cell({ before, after, description, className, ripple = true, children }) { +export const Cell = observer(function Cell({ before, after, description, className, ripple = true, big, children }) { const styles = useS(style); return ( -
-
-
{before}
-
+
+ + {before && ( + + {before} + + )} + {children} - {description &&
{description}
} -
-
{after}
-
+ {description && {description}} + + {after && ( + + {after} + + )} +
); }); diff --git a/webapp/packages/core-blocks/src/CommonDialog/CommonDialog/CommonDialogWrapper.m.css b/webapp/packages/core-blocks/src/CommonDialog/CommonDialog/CommonDialogWrapper.m.css index 413e555b14..2a3e392b80 100644 --- a/webapp/packages/core-blocks/src/CommonDialog/CommonDialog/CommonDialogWrapper.m.css +++ b/webapp/packages/core-blocks/src/CommonDialog/CommonDialog/CommonDialogWrapper.m.css @@ -29,7 +29,7 @@ &.small { min-width: 404px; min-height: 262px; - max-height: max(var(--app-height) - 48px, 262px); + max-height: max(var(--app-height, 100vh) - 48px, 262px); &.fixedSize { width: 404px; @@ -42,7 +42,7 @@ &.medium { min-width: 576px; min-height: 374px; - max-height: max(var(--app-height) - 48px, 374px); + max-height: max(var(--app-height, 100vh) - 48px, 374px); &.fixedSize { width: 576px; @@ -55,7 +55,7 @@ &.large { min-width: 720px; min-height: 468px; - max-height: max(var(--app-height) - 48px, 468px); + max-height: max(var(--app-height, 100vh) - 48px, 468px); &.fixedSize { width: 720px; diff --git a/webapp/packages/core-blocks/src/CommonDialog/DialogsPortal.tsx b/webapp/packages/core-blocks/src/CommonDialog/DialogsPortal.tsx index 4c60f20c37..139fbee6d6 100644 --- a/webapp/packages/core-blocks/src/CommonDialog/DialogsPortal.tsx +++ b/webapp/packages/core-blocks/src/CommonDialog/DialogsPortal.tsx @@ -84,8 +84,8 @@ export const DialogsPortal = observer(function DialogsPortal() { }, [activeDialog]); return ( - - + +
{commonDialogService.dialogs.map((dialog, i, arr) => ( @@ -99,8 +99,8 @@ export const DialogsPortal = observer(function DialogsPortal() { ))}
- - + + ); }); diff --git a/webapp/packages/core-blocks/src/DisplayError.m.css b/webapp/packages/core-blocks/src/DisplayError.m.css index 8254e30bc5..a5a26e487a 100644 --- a/webapp/packages/core-blocks/src/DisplayError.m.css +++ b/webapp/packages/core-blocks/src/DisplayError.m.css @@ -1,3 +1,10 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .error { width: 100%; height: 100%; @@ -5,7 +12,7 @@ overflow: auto; &.root { - height: var(--app-height); + height: var(--app-height, 100vh); } } .errorInnerBlock { diff --git a/webapp/packages/core-blocks/src/ErrorMessage.test.tsx b/webapp/packages/core-blocks/src/ErrorMessage.test.tsx index 3fa58e3665..e635622071 100644 --- a/webapp/packages/core-blocks/src/ErrorMessage.test.tsx +++ b/webapp/packages/core-blocks/src/ErrorMessage.test.tsx @@ -6,7 +6,7 @@ * you may not use this file except in compliance with the License. */ import '@testing-library/jest-dom'; -import { screen } from '@testing-library/react'; +import { screen, waitFor } from '@testing-library/react'; import { coreEventsManifest } from '@cloudbeaver/core-events'; import { coreLocalizationManifest } from '@cloudbeaver/core-localization'; @@ -18,7 +18,7 @@ import { ErrorMessage } from './ErrorMessage'; const app = createApp(coreEventsManifest, coreSettingsManifest, coreThemingManifest, coreLocalizationManifest); -test('icons.svg#name', () => { +test('icons.svg#name', async () => { renderInApp(, app); - expect(screen.getByText('error')).not.toBeNull(); + await waitFor(() => expect(screen.getByText('error')).not.toBeNull()); }); diff --git a/webapp/packages/core-blocks/src/FormControls/FieldLabel.m.css b/webapp/packages/core-blocks/src/FormControls/FieldLabel.m.css index 3cf2127a3b..7414370d28 100644 --- a/webapp/packages/core-blocks/src/FormControls/FieldLabel.m.css +++ b/webapp/packages/core-blocks/src/FormControls/FieldLabel.m.css @@ -1,3 +1,10 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .fieldLabel { composes: theme-typography--body1 from global; box-sizing: border-box; diff --git a/webapp/packages/core-blocks/src/FormControls/InputFiles.m.css b/webapp/packages/core-blocks/src/FormControls/InputFiles.m.css index e1e4cde4f4..9086680bdc 100644 --- a/webapp/packages/core-blocks/src/FormControls/InputFiles.m.css +++ b/webapp/packages/core-blocks/src/FormControls/InputFiles.m.css @@ -1,18 +1,29 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .fieldLabel { - display: block; composes: theme-typography--body1 from global; - font-weight: 500; } -.fieldLabel:not(:empty) { - padding-bottom: 10px; -} -.inputContainer { - position: relative; -} -.tags { - padding-top: 8px; +.field { + & .fieldLabel { + display: block; + font-weight: 500; + } + & .fieldLabel:not(:empty) { + padding-bottom: 10px; + } + & .inputContainer { + position: relative; + } + & .tags { + padding-top: 8px; - &:empty { - display: none; + &:empty { + display: none; + } } } diff --git a/webapp/packages/core-blocks/src/FormControls/InputFiles.tsx b/webapp/packages/core-blocks/src/FormControls/InputFiles.tsx index d870c8258e..2246c1ec93 100644 --- a/webapp/packages/core-blocks/src/FormControls/InputFiles.tsx +++ b/webapp/packages/core-blocks/src/FormControls/InputFiles.tsx @@ -168,7 +168,7 @@ export const InputFiles: InputFilesType = observer( const files = Array.from(value ?? []); return ( - + {children} diff --git a/webapp/packages/core-blocks/src/HTMLTemplates/app-loading-screen.html.ejs b/webapp/packages/core-blocks/src/HTMLTemplates/app-loading-screen.html.ejs index 280a55aeec..825ad45b93 100644 --- a/webapp/packages/core-blocks/src/HTMLTemplates/app-loading-screen.html.ejs +++ b/webapp/packages/core-blocks/src/HTMLTemplates/app-loading-screen.html.ejs @@ -8,12 +8,20 @@ right: 0; bottom: 0; display: flex; + flex-direction: column; + gap: 16px; align-items: center; justify-content: center; transition: opacity 0.3s; background: white; } + #app-loading-screen .app-loading-screen__status { + font-weight: 500; + color: #244357; + transition: opacity 5s; + } + #app-loading-screen .app-loading-screen__logo-spinner { transform-origin: center; -webkit-animation: spin 2s linear infinite; @@ -21,11 +29,11 @@ animation: spin 2s linear infinite; } - :not(:empty)+#app-loading-screen.app-loading-screen--fade-out { + :not(:empty) + #app-loading-screen.app-loading-screen--fade-out { opacity: 0; } - :not(:empty)+#app-loading-screen.app-loading-screen--hidden { + :not(:empty) + #app-loading-screen.app-loading-screen--hidden { display: none; } @@ -49,25 +57,33 @@ } - - + + clip-rule="evenodd" + /> - + - - \ No newline at end of file +
Loading...
+
+ diff --git a/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.m.css b/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.m.css index c3b3aa007d..4f82f75a7b 100644 --- a/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.m.css +++ b/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.m.css @@ -15,8 +15,8 @@ align-items: center; } -.fixedHeight { - height: 32px; +.minHeight { + min-height: 32px; } .rounded { diff --git a/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.tsx b/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.tsx index c04e0847b2..45076e4141 100644 --- a/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.tsx +++ b/webapp/packages/core-blocks/src/ToolsPanel/ToolsPanel.tsx @@ -17,7 +17,7 @@ interface Props { type?: TType; center?: boolean; rounded?: boolean; - fixedHeight?: boolean; + minHeight?: boolean; bottomBorder?: boolean; } @@ -26,11 +26,11 @@ export const ToolsPanel: React.FC> = observer(fun children, center, rounded, - fixedHeight, + minHeight, type = 'primary', bottomBorder = false, }) { const styles = useS(style); - return
{children}
; + return
{children}
; }); diff --git a/webapp/packages/core-blocks/src/manifest.ts b/webapp/packages/core-blocks/src/manifest.ts index 4c5f9c238c..99794a641e 100644 --- a/webapp/packages/core-blocks/src/manifest.ts +++ b/webapp/packages/core-blocks/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { BlocksLocaleService } from './BlocksLocaleService'; - export const coreBlocksManifest: PluginManifest = { info: { name: 'Core Blocks', }, - providers: [BlocksLocaleService], + providers: [() => import('./BlocksLocaleService').then(m => m.BlocksLocaleService)], }; diff --git a/webapp/packages/core-bootstrap/src/bootstrap.ts b/webapp/packages/core-bootstrap/src/bootstrap.ts index 0c32fe89e4..98db1dec2e 100644 --- a/webapp/packages/core-bootstrap/src/bootstrap.ts +++ b/webapp/packages/core-bootstrap/src/bootstrap.ts @@ -11,26 +11,45 @@ import { App, PluginManifest } from '@cloudbeaver/core-di'; import { executionExceptionContext, SyncExecutor } from '@cloudbeaver/core-executor'; import { coreManifests } from './manifest'; -import { renderLayout } from './renderLayout'; -export function bootstrap(plugins: PluginManifest[]): App { +export async function bootstrap(plugins: PluginManifest[]): Promise { configure({ enforceActions: 'never' }); const app = new App([...coreManifests, ...plugins]); + let exception: Error | null = null; + + try { + await app.start(); + } catch (e: any) { + exception = e; + } + + const { renderLayout } = await import('./renderLayout'); const render = renderLayout(app.getServiceInjector()); const unmountExecutor = new SyncExecutor(); unmountExecutor.addHandler(() => render.unmount()); - app.onStart.before(unmountExecutor); - app.onStart.addHandler(() => render.renderApp()); + app.onStart.before(unmountExecutor, undefined, data => data.preload); + app.onStart.addHandler(({ preload }) => { + if (!preload) { + render.renderApp(); + } + }); app.onStart.addPostHandler((_, context) => { const exception = context.getContext(executionExceptionContext); if (exception.exception) { + console.error(exception.exception); render.renderError(exception.exception); } }); - app.start().catch(); + if (exception) { + console.error(exception); + render.renderError(exception); + } else { + render.renderApp(); + } + return app; } diff --git a/webapp/packages/core-bootstrap/src/manifest.ts b/webapp/packages/core-bootstrap/src/manifest.ts index 20a994c437..5c1baf1dd4 100644 --- a/webapp/packages/core-bootstrap/src/manifest.ts +++ b/webapp/packages/core-bootstrap/src/manifest.ts @@ -49,6 +49,7 @@ export const coreManifests: PluginManifest[] = [ }, coreDIManifest, coreRoutingManifest, // important, should be first because the router starts in load phase first after all plugins register phase + coreBrowserManifest, coreThemingManifest, coreLocalizationManifest, coreSettingsLocalizationManifest, @@ -61,7 +62,6 @@ export const coreManifests: PluginManifest[] = [ coreResourceManifest, coreSDKManifest, coreRootManifest, - coreBrowserManifest, coreBrowserSettingsManifest, coreBrowserCookiesManifest, coreProductManifest, diff --git a/webapp/packages/core-bootstrap/src/renderLayout.m.css b/webapp/packages/core-bootstrap/src/renderLayout.m.css index 729727bf6c..975b57df72 100644 --- a/webapp/packages/core-bootstrap/src/renderLayout.m.css +++ b/webapp/packages/core-bootstrap/src/renderLayout.m.css @@ -1,3 +1,10 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ .loader { - height: var(--app-height); + height: var(--app-height, 100vh); } diff --git a/webapp/packages/core-bootstrap/src/renderLayout.tsx b/webapp/packages/core-bootstrap/src/renderLayout.tsx index a886d50a4d..69b0187e2b 100644 --- a/webapp/packages/core-bootstrap/src/renderLayout.tsx +++ b/webapp/packages/core-bootstrap/src/renderLayout.tsx @@ -10,7 +10,7 @@ import { createRoot, Root } from 'react-dom/client'; import { BodyLazy } from '@cloudbeaver/core-app'; import { DisplayError, ErrorBoundary, Loader, s } from '@cloudbeaver/core-blocks'; -import { AppContext, IServiceInjector } from '@cloudbeaver/core-di'; +import { AppContext, HideAppLoadingScreen, IServiceInjector } from '@cloudbeaver/core-di'; import styles from './renderLayout.m.css'; @@ -51,6 +51,7 @@ export function renderLayout(serviceInjector: IServiceInjector): IRender { }> + , @@ -60,6 +61,7 @@ export function renderLayout(serviceInjector: IServiceInjector): IRender { this.initRoot().render( + , ); }, diff --git a/webapp/packages/core-browser-cookies/src/manifest.ts b/webapp/packages/core-browser-cookies/src/manifest.ts index b77dec20d1..8d6747e401 100644 --- a/webapp/packages/core-browser-cookies/src/manifest.ts +++ b/webapp/packages/core-browser-cookies/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { CookiesService } from './CookiesService'; - export const coreBrowserCookiesManifest: PluginManifest = { info: { name: 'Core Browser Cookies', }, - providers: [CookiesService], + providers: [() => import('./CookiesService').then(m => m.CookiesService)], }; diff --git a/webapp/packages/core-browser-settings/src/manifest.ts b/webapp/packages/core-browser-settings/src/manifest.ts index 3939ee825d..fe997de14f 100644 --- a/webapp/packages/core-browser-settings/src/manifest.ts +++ b/webapp/packages/core-browser-settings/src/manifest.ts @@ -7,13 +7,13 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { BrowserSettingsService } from './BrowserSettingsService'; -import { LocaleService } from './LocaleService'; - export const coreBrowserSettingsManifest: PluginManifest = { info: { name: 'Core Browser Settings', }, - providers: [BrowserSettingsService, LocaleService], + providers: [ + () => import('./BrowserSettingsService').then(m => m.BrowserSettingsService), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/core-browser/package.json b/webapp/packages/core-browser/package.json index 0ebe3c12d5..ac9229eec9 100644 --- a/webapp/packages/core-browser/package.json +++ b/webapp/packages/core-browser/package.json @@ -24,9 +24,13 @@ "dexie": "^3.2.6", "karma": "^6.4.3", "mobx": "^6.12.0", - "workbox-core": "^7.0.0", - "workbox-precaching": "^7.0.0", - "workbox-window": "^7.0.0" + "workbox-cacheable-response": "^7.1.0", + "workbox-core": "^7.1.0", + "workbox-expiration": "^7.1.0", + "workbox-precaching": "^7.1.0", + "workbox-routing": "^7.1.0", + "workbox-strategies": "^7.1.0", + "workbox-window": "^7.1.0" }, "peerDependencies": {}, "devDependencies": { diff --git a/webapp/packages/core-browser/src/ServiceWorkerBootstrap.ts b/webapp/packages/core-browser/src/ServiceWorkerBootstrap.ts index 7cf8422f9a..42560c931a 100644 --- a/webapp/packages/core-browser/src/ServiceWorkerBootstrap.ts +++ b/webapp/packages/core-browser/src/ServiceWorkerBootstrap.ts @@ -14,8 +14,10 @@ export class ServiceWorkerBootstrap extends Bootstrap { constructor(private readonly serviceWorkerService: ServiceWorkerService) { super(); } - register(): void | Promise {} - load(): void | Promise { - this.serviceWorkerService.register(); + async register(): Promise { + await this.serviceWorkerService.register(); + } + async load(): Promise { + await this.serviceWorkerService.load(); } } diff --git a/webapp/packages/core-browser/src/ServiceWorkerService.ts b/webapp/packages/core-browser/src/ServiceWorkerService.ts index 0742ebf78a..3d789dff78 100644 --- a/webapp/packages/core-browser/src/ServiceWorkerService.ts +++ b/webapp/packages/core-browser/src/ServiceWorkerService.ts @@ -6,53 +6,125 @@ * you may not use this file except in compliance with the License. */ /// -import { Workbox } from 'workbox-window'; +import { Workbox, WorkboxLifecycleEvent, WorkboxMessageEvent } from 'workbox-window'; -import { injectable } from '@cloudbeaver/core-di'; +import { Disposable, injectable } from '@cloudbeaver/core-di'; import { Executor, IExecutor } from '@cloudbeaver/core-executor'; import { GlobalConstants } from '@cloudbeaver/core-utils'; +export interface IUpdateData { + type: 'updating' | 'finished' | 'installing'; + progress?: number; +} + @injectable() -export class ServiceWorkerService { - readonly onUpdate: IExecutor; +export class ServiceWorkerService extends Disposable { + readonly onUpdate: IExecutor; private readonly workerURL: string; private workbox: Workbox | null; + private updateIntervalId: ReturnType | null; + private isUpdating: boolean; + private registration: ServiceWorkerRegistration | null; constructor() { + super(); this.onUpdate = new Executor(); this.workerURL = GlobalConstants.absoluteRootUrl('service-worker.js'); this.workbox = null; + this.updateIntervalId = null; + this.registration = null; + this.isUpdating = false; + this.handleMessage = this.handleMessage.bind(this); + this.handleControlling = this.handleControlling.bind(this); } - register(): void | Promise { - if ('serviceWorker' in navigator) { - if (process.env.NODE_ENV === 'development') { - navigator.serviceWorker - .getRegistration(this.workerURL) - .then(registration => registration?.unregister()) - .catch(); - } else { - this.workbox = new Workbox(this.workerURL); - this.registerSkipWaitingPrompt(this.workbox); - this.workbox.register(); - setInterval(() => this.workbox?.update(), 1000 * 60 * 60); + async register(): Promise { + if (!('serviceWorker' in navigator)) { + return; + } + + if (process.env.NODE_ENV === 'development') { + const registration = await navigator.serviceWorker.getRegistration(this.workerURL); + registration?.unregister(); + } else { + this.workbox = new Workbox(this.workerURL); + this.registration = (await this.workbox.register()) || null; + // should be after registration + this.registerEventListeners(); + + if (this.registration?.active) { + this.isUpdating = true; } } } - private registerSkipWaitingPrompt(workbox: Workbox): void { - workbox.addEventListener('controlling', async event => { - if (!event.isUpdate) { - return; + async load(): Promise { + if (this.registration?.installing || this.registration?.waiting) { + this.onUpdate.execute({ + type: this.isUpdating ? 'updating' : 'installing', + }); + } + + await this.workbox?.update(); + + if (this.registration?.active) { + // wait for update only for active service worker + if (this.registration.installing || this.registration.waiting) { + // handled by refresh at 'controlling' event + await new Promise(() => {}); } + } - await this.onUpdate.execute(); - window.location.reload(); - }); + this.updateIntervalId = setInterval(() => this.workbox?.update(), 1000 * 60 * 60 * 24); + } + + dispose(): void { + if (this.updateIntervalId) { + clearInterval(this.updateIntervalId); + } + + this.workbox?.removeEventListener('message', this.handleMessage); + this.workbox?.removeEventListener('controlling', this.handleControlling); + } + + private registerEventListeners(): void { + this.workbox?.addEventListener('message', this.handleMessage); + this.workbox?.addEventListener('controlling', this.handleControlling); + } + + private handleMessage({ data }: WorkboxMessageEvent) { + switch (data.type) { + case 'mode': + { + this.onUpdate.execute({ + type: this.isUpdating || data.isUpdate ? 'updating' : 'installing', + }); + } + break; + case 'progress': + { + const progress = Math.min(1, Math.max(0, data.progress)); - workbox.addEventListener('waiting', event => { - workbox.messageSkipWaiting(); + this.onUpdate.execute({ + type: this.isUpdating || data.isUpdate ? 'updating' : 'installing', + progress, + }); + } + break; + } + } + + private async handleControlling(event: WorkboxLifecycleEvent) { + this.isUpdating = false; + await this.onUpdate.execute({ + type: 'finished', }); + + if (!event.isUpdate) { + return; + } + + window.location.reload(); } } diff --git a/webapp/packages/core-browser/src/manifest.ts b/webapp/packages/core-browser/src/manifest.ts index b6602d6437..918bcbe27d 100644 --- a/webapp/packages/core-browser/src/manifest.ts +++ b/webapp/packages/core-browser/src/manifest.ts @@ -7,15 +7,17 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { IndexedDBService } from './IndexedDB/IndexedDBService'; -import { LocalStorageSaveService } from './LocalStorageSaveService'; -import { ServiceWorkerBootstrap } from './ServiceWorkerBootstrap'; -import { ServiceWorkerService } from './ServiceWorkerService'; - export const coreBrowserManifest: PluginManifest = { info: { name: 'Core Browser', }, - providers: [ServiceWorkerBootstrap, ServiceWorkerService, IndexedDBService, LocalStorageSaveService], + preload: [ + () => import('./ServiceWorkerBootstrap').then(module => module.ServiceWorkerBootstrap), + () => import('./ServiceWorkerService').then(module => module.ServiceWorkerService), + ], + providers: [ + () => import('./IndexedDB/IndexedDBService').then(module => module.IndexedDBService), + () => import('./LocalStorageSaveService').then(module => module.LocalStorageSaveService), + ], }; diff --git a/webapp/packages/core-browser/src/service-worker.ts b/webapp/packages/core-browser/src/service-worker.ts index c754710c94..4849f1b029 100644 --- a/webapp/packages/core-browser/src/service-worker.ts +++ b/webapp/packages/core-browser/src/service-worker.ts @@ -1,16 +1,29 @@ -import { clientsClaim } from 'workbox-core'; -import { cleanupOutdatedCaches, matchPrecache, precacheAndRoute } from 'workbox-precaching'; +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +import { CacheableResponsePlugin } from 'workbox-cacheable-response'; +import { cacheNames, clientsClaim, WorkboxPlugin } from 'workbox-core'; +import { ExpirationPlugin } from 'workbox-expiration'; +import { addPlugins, matchPrecache, precacheAndRoute } from 'workbox-precaching'; +import { getOrCreatePrecacheController } from 'workbox-precaching/utils/getOrCreatePrecacheController'; +import { registerRoute } from 'workbox-routing'; +import { CacheFirst } from 'workbox-strategies'; /// declare const self: ServiceWorkerGlobalScope; const manifest = self.__WB_MANIFEST; -addEventListener('message', event => { - if (event.data && event.data.type === 'SKIP_WAITING') { - self.skipWaiting(); - } -}); +async function broadcastMessage(message: Record) { + const clients = await self.clients.matchAll({ includeUncontrolled: true }); + clients.forEach(client => { + client.postMessage(message); + }); +} addEventListener('fetch', async event => { if (!(event instanceof FetchEvent)) { @@ -23,17 +36,19 @@ addEventListener('fetch', async event => { if (url.pathname == '/') { event.respondWith( (async () => { + const preCachedResponsePromise = matchPrecache('/index.html'); + const networkResponsePromise = fetch(request, { cache: 'no-cache', method: 'HEAD' }); try { // Try to fetch the request from the network. // If it's redirect then return it. - const response = await fetch(request, { cache: 'no-cache', method: 'HEAD' }); + const response = await networkResponsePromise; if (response.type == 'opaqueredirect') { return response; } } catch {} - const preCachedResponse = await matchPrecache('/index.html'); + const preCachedResponse = await preCachedResponsePromise; return preCachedResponse ?? (await fetch(request)); })(), @@ -41,6 +56,78 @@ addEventListener('fetch', async event => { } }); +self.addEventListener('install', () => { + self.skipWaiting(); +}); + +function createUpdateProgressPlugin(): WorkboxPlugin { + const precacheController = getOrCreatePrecacheController(); + let updated = 0; + let hasPreviousCache = null as boolean | null; + + return { + handlerWillStart: async ({ request, state }) => { + if (state) { + state.originalRequest = request; + } + if (hasPreviousCache === null) { + hasPreviousCache = await caches.has(cacheNames.precache); + + await broadcastMessage({ + type: 'mode', + isUpdate: hasPreviousCache, + }); + } + }, + cachedResponseWillBeUsed: async ({ event, cachedResponse, cacheName }) => { + if (event.type === 'install' && cacheName === cacheNames.precache) { + const size = Math.max(precacheController.getURLsToCacheKeys().size, 1); + updated++; + + await broadcastMessage({ + type: 'progress', + progress: updated / size, + }); + } + + return cachedResponse; + }, + }; +} + +addPlugins([createUpdateProgressPlugin()]); + clientsClaim(); -cleanupOutdatedCaches(); precacheAndRoute(manifest); + +registerRoute( + ({ request }) => request.destination === 'font', + new CacheFirst({ + cacheName: 'fonts', + plugins: [ + new CacheableResponsePlugin({ + statuses: [0, 200], + }), + new ExpirationPlugin({ + maxEntries: 1000, + maxAgeSeconds: 7 * 24 * 60 * 60, + }), + ], + }), +); + +registerRoute( + ({ request }) => request.destination === 'image', + new CacheFirst({ + cacheName: 'images', + plugins: [ + new CacheableResponsePlugin({ + statuses: [0, 200], + }), + new ExpirationPlugin({ + maxEntries: 1000, + maxAgeSeconds: 7 * 24 * 60 * 60, + }), + ], + }), +); diff --git a/webapp/packages/core-cli/configs/webpack.config.js b/webapp/packages/core-cli/configs/webpack.config.js index 04d987cf88..5a70152855 100644 --- a/webapp/packages/core-cli/configs/webpack.config.js +++ b/webapp/packages/core-cli/configs/webpack.config.js @@ -11,7 +11,12 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const { SourceAssetsResolver } = require('../utils/SourceAssetsResolver.js'); const { IgnoreNotFoundExportPlugin } = require('../utils/IgnoreNotFoundExportPlugin.js'); const excludedFromVendor = require('./excludedFromVendor.js'); +const WorkboxPlugin = require('workbox-webpack-plugin'); const webpack = require('webpack'); +const { getServiceWorkerSource } = require('./webpack.product.utils.js'); + +const main = resolve('dist/index.js'); +const sso = require.resolve('@cloudbeaver/plugin-sso/dist/index.js'); const nodeModules = [ resolve('node_modules'), // product @@ -22,46 +27,78 @@ const nodeModules = [ module.exports = (env, argv) => { process.env.NODE_ENV = argv.mode; const devMode = argv.mode !== 'production'; + + const workboxPlugin = []; + + if (!devMode) { + workboxPlugin.push( + new WorkboxPlugin.InjectManifest({ + swSrc: getServiceWorkerSource(), + swDest: 'service-worker.js', + maximumFileSizeToCacheInBytes: 20 * 1024 * 1024, + exclude: [ + /license\.txt$/, + /\.map$/, + /manifest.*\.js$/, + /\.tsx?$/, + /\.tsbuildinfo$/, + /\.DS_Store$/, + /\.svg$/, + /.woff2?$/, + /.eot$/, + /.ttf$/, + /.otf$/, + ], + }), + ); + + if (devMode) { + // Suppress the "InjectManifest has been called multiple times" warning by reaching into + // the private properties of the plugin and making sure it never ends up in the state + // where it makes that warning. + // https://github.com/GoogleChrome/workbox/blob/v6/packages/workbox-webpack-plugin/src/inject-manifest.ts#L260-L282 + Object.defineProperty(workboxPlugin, 'alreadyCalled', { + get() { + return false; + }, + set() { + // do nothing; the internals try to set it to true, which then results in a warning + // on the next run of webpack. + }, + }); + } + } function getBaseStyleLoaders() { const loaders = []; // Broke styles order in dev mode - // if (devMode) { - // loaders.push('style-loader'); - // } else { - loaders.push(MiniCssExtractPlugin.loader); - // } + if (devMode) { + loaders.push('style-loader'); + } else { + loaders.push(MiniCssExtractPlugin.loader); + } return loaders; } - function generateStyleLoaders(options = { hasModule: false, disable: false, pure: false }) { - const moduleScope = options.hasModule ? 'local' : 'global'; - let modules = { - mode: moduleScope, - localIdentName: '[local]___[hash:base64:5]', - }; - - if (options.disable) { - modules = false; - } - - const postCssPlugins = [require('postcss-preset-env')({ stage: 0 })]; - + function generateModuleStyleLoaders() { return [ ...getBaseStyleLoaders(), { loader: 'css-loader', options: { esModule: true, - modules: modules, + modules: { + auto: /(module|m)\.(css|s[ac]ss)$/, + localIdentName: '[local]___[hash:base64:5]', + }, }, }, { loader: 'postcss-loader', options: { postcssOptions: { - plugins: postCssPlugins, + plugins: [require('postcss-preset-env')({ stage: 0 })], }, }, }, @@ -88,8 +125,29 @@ module.exports = (env, argv) => { }; return { + context: resolve(__dirname, '../../../../../'), + experiments: { + layers: true, + }, + entry: { + main: { + import: main, + runtime: 'main-runtime', + layer: 'main', + }, + sso: { + import: sso, + runtime: 'sso-runtime', + layer: 'sso', + }, + }, + output: { + filename: 'js/[name]-[contenthash].js', + chunkFilename: 'js/[name]-[contenthash].js', + pathinfo: false, + }, optimization: { - runtimeChunk: 'single', + runtimeChunk: 'multiple', moduleIds: 'deterministic', usedExports: true, sideEffects: true, @@ -97,26 +155,43 @@ module.exports = (env, argv) => { removeAvailableModules: false, removeEmptyChunks: false, splitChunks: { - chunks: 'async', - minSize: 20000, - minRemainingSize: 0, - minChunks: 1, - maxAsyncRequests: 30, - maxInitialRequests: 30, - enforceSizeThreshold: 50000, cacheGroups: { + styles: { + name: 'styles', + type: 'css/mini-extract', + chunks: 'initial', + reuseExistingChunk: true, + priority: 10, + }, + stylesAsync: { + name: 'styles-async', + type: 'css/mini-extract', + chunks: 'async', + reuseExistingChunk: true, + priority: 20, + }, locale: { + chunks: 'all', test: /[\\/]locales[\\/].*?\.js/, - filename: '[name].[contenthash].js', name(module) { return module.rawRequest.substr(2); }, - priority: -5, + priority: 20, reuseExistingChunk: true, + enforce: true, + layer: 'main', }, packages: { + chunks: 'initial', + test: /[\\/]packages[\\/]((plugin|core)-.*?)[\\/](src|dist)[\\/]/, + name: 'packages', + priority: 10, + reuseExistingChunk: true, + layer: 'main', + }, + packagesAsync: { + chunks: 'async', test: /[\\/]packages[\\/]((plugin|core)-.*?)[\\/](src|dist)[\\/]/, - filename: '[name].[contenthash].js', name(module) { const path = module.context ?? module.resource; const match = /[\\/]packages[\\/]((plugin|core)-.*?)([\\/]|$)/.exec(path); @@ -125,33 +200,91 @@ module.exports = (env, argv) => { } return match[1]; }, + priority: 10, + reuseExistingChunk: true, + layer: 'main', + }, + extendedVendorAsync: { + chunks: 'async', + test: new RegExp(`[\\/]node_modules/(${excludedFromVendor.join('|')}).*?`, ''), + name: 'extended-vendor-async', + priority: -5, + reuseExistingChunk: true, + layer: 'main', + }, + extendedVendor: { + chunks: 'initial', + name: 'extended-vendor', + test: new RegExp(`[\\/]node_modules/(${excludedFromVendor.join('|')}).*?`, ''), + priority: -5, + reuseExistingChunk: true, + layer: 'main', + }, + vendorAsync: { + chunks: 'async', + test: new RegExp(`[\\/]node_modules/(?!:${excludedFromVendor.join('|')}).*?`, ''), + name: 'vendor-async', priority: -10, - enforce: true, + reuseExistingChunk: true, + layer: 'main', }, - defaultVendors: { - chunks: 'all', - name: 'vendors', - test: new RegExp(`[\\\\/]node_modules[\\\\/](?!${excludedFromVendor.join('|')}).*?[\\\\/]`, ''), + vendor: { + chunks: 'initial', + name: 'vendor', + test: new RegExp(`[\\/]node_modules/(?!:${excludedFromVendor.join('|')}).*?`, ''), + priority: -10, + reuseExistingChunk: true, + layer: 'main', + }, + asyncCommons: { + chunks: 'async', + name: 'commons-async', + filename: 'js/[name]-[contenthash].js', + priority: -15, + layer: 'main', + }, + commons: { + chunks: 'initial', + name: 'commons', + filename: 'js/[name]-[contenthash].js', + priority: -15, + layer: 'main', + }, + defaultAsync: { + chunks: 'async', + name: 'bundle-async', + filename: '[name]-[contenthash].js', priority: -20, reuseExistingChunk: true, + layer: 'main', }, default: { - minChunks: 2, - priority: -40, + chunks: 'initial', + name: 'bundle', + filename: '[name]-[contenthash].js', + priority: -20, + reuseExistingChunk: true, + layer: 'main', + }, + defaultAsyncSso: { + chunks: 'async', + name: 'bundle-async', + filename: '[name]-[contenthash].js', + priority: -20, reuseExistingChunk: true, + layer: 'sso', + }, + defaultSso: { + chunks: 'initial', + name: 'bundle', + filename: '[name]-[contenthash].js', + priority: -20, + reuseExistingChunk: true, + layer: 'sso', }, - // styles: { - // name: 'styles', - // type: 'css/mini-extract', - // chunks: 'all', - // enforce: true, - // }, }, }, }, - output: { - pathinfo: false, - }, resolve: { extensions: ['.ts', '.tsx', '.wasm', '.mjs', '.js', '.jsx', '.json', '.json5'], modules: nodeModules, @@ -182,27 +315,7 @@ module.exports = (env, argv) => { { test: /\.(css|s[ac]ss)$/, exclude: /node_modules/, - oneOf: [ - { - test: /\.module\.(css|s[ac]ss)$/, - use: generateStyleLoaders({ hasModule: true }), - }, - { - test: /\.m\.(css|s[ac]ss)$/, - use: generateStyleLoaders({ hasModule: true, pure: true }), - }, - { - include: /node_modules/, - use: [...getBaseStyleLoaders(), 'css-loader', 'sass-loader'], - }, - { - test: /\.(theme|pure)\.(css|s[ac]ss)$/, - use: generateStyleLoaders({ disable: true }), - }, - { - use: generateStyleLoaders(), - }, - ], + use: generateModuleStyleLoaders(), }, { test: /\.(png|jpg|gif)$/i, @@ -211,6 +324,9 @@ module.exports = (env, argv) => { { test: /\.(woff|woff2|eot|ttf|otf)$/i, type: 'asset/resource', + generator: { + filename: 'fonts/[hash][ext][query]', + }, }, ], }, @@ -222,13 +338,14 @@ module.exports = (env, argv) => { }), new IgnoreNotFoundExportPlugin(), new MiniCssExtractPlugin({ - filename: devMode ? 'styles/[name].css' : 'styles/[name].[contenthash].css', - chunkFilename: devMode ? 'styles/[name].bundle.css' : 'styles/[name].[contenthash].css', + filename: devMode ? 'styles/[name].css' : 'styles/[name]-[contenthash].css', + chunkFilename: devMode ? 'styles/[name].bundle.css' : 'styles/[name]-[contenthash].css', ignoreOrder: true, // Enable to remove warnings about conflicting order insert: linkTag => { document.head.appendChild(linkTag); }, }), + ...workboxPlugin, ], }; }; diff --git a/webapp/packages/core-cli/configs/webpack.product.config.js b/webapp/packages/core-cli/configs/webpack.product.config.js index 07de40317d..76839875b0 100644 --- a/webapp/packages/core-cli/configs/webpack.product.config.js +++ b/webapp/packages/core-cli/configs/webpack.product.config.js @@ -10,78 +10,47 @@ const HtmlWebpackPlugin = require('html-webpack-plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin'); const webpack = require('webpack'); -const WorkboxPlugin = require('workbox-webpack-plugin'); const { merge } = require('webpack-merge'); const commonConfig = require('./webpack.config.js'); const { getAssets, withTimestamp } = require('./webpack.product.utils'); const HtmlInjectWebpackPlugin = require('../utils/HtmlInjectWebpackPlugin.js'); +const CssMinimizerPlugin = require('css-minimizer-webpack-plugin'); -const main = resolve('dist/index.js'); -const sso = require.resolve('@cloudbeaver/plugin-sso/dist/index.js'); const ssoHtmlTemplate = require.resolve('@cloudbeaver/plugin-sso/src/index.html.ejs'); const ssoErrorHtmlTemplate = require.resolve('@cloudbeaver/plugin-sso/src/ssoError.html.ejs'); const outputDir = resolve('lib'); const package = require(resolve('package.json')); -const { getServiceWorkerSource } = require('./webpack.product.utils.js'); const timestampVersion = withTimestamp(package.version); module.exports = (env, argv) => { const devMode = argv.mode !== 'production'; - var workboxPlugin = []; - if (devMode) { - // TODO: workbox not working in dev mode - - // workboxPlugin = new WorkboxPlugin.InjectManifest({ - // swSrc: getServiceWorkerSource(), - // swDest: 'service-worker.js', - // }); - // Object.defineProperty(workboxPlugin, 'alreadyCalled', { - // get() { - // return false; - // }, - // set() {}, - // }); - } else { - workboxPlugin = [new WorkboxPlugin.InjectManifest({ - swSrc: getServiceWorkerSource(), - swDest: 'service-worker.js', - maximumFileSizeToCacheInBytes: 20 * 1024 * 1024, - exclude: [ - /\.map$/, - /manifest.*\.js$/, - /\.tsx?$/, - /\.tsbuildinfo$/, - ], - })]; - } - return merge(commonConfig(env, argv), { - entry: { - main, - sso, - }, + mode: 'production', devtool: false, output: { - filename: 'index.[contenthash].js', - chunkFilename: '[name].[contenthash].bundle.js', library: package.name, libraryTarget: 'umd', path: outputDir, - pathinfo: false, }, optimization: { minimize: true, - minimizer: [new TerserPlugin({ - extractComments: /Copyright \(C\)/i, + minimizer: [ + new TerserPlugin({ + extractComments: { + condition: /Copyright \(C\)/i, + filename: 'license.txt', + }, terserOptions: { keep_classnames: true, keep_fnames: true, }, - })], + }), + new CssMinimizerPlugin(), + ], }, plugins: [ new CopyWebpackPlugin({ @@ -117,7 +86,6 @@ module.exports = (env, argv) => { new HtmlInjectWebpackPlugin({ body: [{ attributes: { hidden: true }, tagName: 'object', innerHTML: '{STATIC_CONTENT}', voidTag: false }], }), - ...workboxPlugin, ], }); }; diff --git a/webapp/packages/core-cli/configs/webpack.product.dev.config.js b/webapp/packages/core-cli/configs/webpack.product.dev.config.js index e50348ffc5..9002d59605 100644 --- a/webapp/packages/core-cli/configs/webpack.product.dev.config.js +++ b/webapp/packages/core-cli/configs/webpack.product.dev.config.js @@ -13,8 +13,6 @@ const fs = require('fs'); const { URL } = require('url'); const commonConfig = require('./webpack.config.js'); -const index = resolve('dist/index.js'); -const sso = require.resolve('@cloudbeaver/plugin-sso/dist/index.js'); const ssoHtmlTemplate = require.resolve('@cloudbeaver/plugin-sso/src/index.html.ejs'); const ssoErrorHtmlTemplate = require.resolve('@cloudbeaver/plugin-sso/src/ssoError.html.ejs'); const { getAssets } = require('./webpack.product.utils'); @@ -48,11 +46,6 @@ module.exports = (env, argv) => { return merge(commonConfig(env, argv), { mode: 'development', - context: resolve(__dirname, '../../../../../'), - entry: { - index, - sso, - }, output: { devtoolModuleFilenameTemplate: 'file:///[absolute-resource-path]', }, @@ -62,12 +55,12 @@ module.exports = (env, argv) => { }, optimization: { minimize: false, - moduleIds: 'named', + // moduleIds: 'named', // improve performance removeAvailableModules: false, removeEmptyChunks: false, - splitChunks: false, + // splitChunks: false, }, infrastructureLogging: { level: 'warn', @@ -115,7 +108,7 @@ module.exports = (env, argv) => { new HtmlWebpackPlugin({ template: resolve('src/index.html.ejs'), inject: 'body', - chunks: ['index'], + chunks: ['main'], version: package.version, title: package.product?.name, }), diff --git a/webapp/packages/core-cli/package.json b/webapp/packages/core-cli/package.json index d26f69493c..52619d39de 100644 --- a/webapp/packages/core-cli/package.json +++ b/webapp/packages/core-cli/package.json @@ -39,6 +39,7 @@ "babel-plugin-transform-typescript-metadata": "^0.3.2", "copy-webpack-plugin": "^12.0.2", "css-loader": "^6.10.0", + "css-minimizer-webpack-plugin": "^7.0.0", "declaration-bundler-webpack-plugin": "^1.0.3", "extra-watch-webpack-plugin": "^1.0.3", "html-loader": "^5.0.0", diff --git a/webapp/packages/core-client-activity/src/manifest.ts b/webapp/packages/core-client-activity/src/manifest.ts index 469b923fc3..1eee2a2a97 100644 --- a/webapp/packages/core-client-activity/src/manifest.ts +++ b/webapp/packages/core-client-activity/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ClientActivityService } from './ClientActivityService'; - export const coreClientActivityManifest: PluginManifest = { info: { name: 'Core Client Activity', }, - providers: [ClientActivityService], + providers: [() => import('./ClientActivityService').then(m => m.ClientActivityService)], }; diff --git a/webapp/packages/core-connections/src/manifest.ts b/webapp/packages/core-connections/src/manifest.ts index af6a0b0ac9..e827636cf0 100644 --- a/webapp/packages/core-connections/src/manifest.ts +++ b/webapp/packages/core-connections/src/manifest.ts @@ -7,44 +7,27 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ConnectionDialectResource } from './ConnectionDialectResource'; -import { ConnectionExecutionContextResource } from './ConnectionExecutionContext/ConnectionExecutionContextResource'; -import { ConnectionExecutionContextService } from './ConnectionExecutionContext/ConnectionExecutionContextService'; -import { ConnectionFolderEventHandler } from './ConnectionFolderEventHandler'; -import { ConnectionFolderResource } from './ConnectionFolderResource'; -import { ConnectionInfoEventHandler } from './ConnectionInfoEventHandler'; -import { ConnectionInfoResource } from './ConnectionInfoResource'; -import { ConnectionsLocaleService } from './ConnectionsLocaleService'; -import { ConnectionsManagerService } from './ConnectionsManagerService'; -import { ConnectionsSettingsService } from './ConnectionsSettingsService'; -import { ContainerResource } from './ContainerResource'; -import { DatabaseAuthModelsResource } from './DatabaseAuthModelsResource'; -import { DBDriverResource } from './DBDriverResource'; -import { ConnectionNavNodeService } from './NavTree/ConnectionNavNodeService'; -import { NavNodeExtensionsService } from './NavTree/NavNodeExtensionsService'; -import { NetworkHandlerResource } from './NetworkHandlerResource'; - export const manifest: PluginManifest = { info: { name: 'Core Connections', }, providers: [ - ConnectionFolderResource, - ConnectionExecutionContextResource, - ConnectionExecutionContextService, - ConnectionsManagerService, - ConnectionInfoResource, - ContainerResource, - ConnectionsLocaleService, - DatabaseAuthModelsResource, - DBDriverResource, - NetworkHandlerResource, - ConnectionDialectResource, - ConnectionNavNodeService, - NavNodeExtensionsService, - ConnectionInfoEventHandler, - ConnectionFolderEventHandler, - ConnectionsSettingsService, + () => import('./ConnectionFolderResource').then(m => m.ConnectionFolderResource), + () => import('./ConnectionExecutionContext/ConnectionExecutionContextResource').then(m => m.ConnectionExecutionContextResource), + () => import('./ConnectionExecutionContext/ConnectionExecutionContextService').then(m => m.ConnectionExecutionContextService), + () => import('./ConnectionsManagerService').then(m => m.ConnectionsManagerService), + () => import('./ConnectionInfoResource').then(m => m.ConnectionInfoResource), + () => import('./ContainerResource').then(m => m.ContainerResource), + () => import('./ConnectionsLocaleService').then(m => m.ConnectionsLocaleService), + () => import('./DatabaseAuthModelsResource').then(m => m.DatabaseAuthModelsResource), + () => import('./DBDriverResource').then(m => m.DBDriverResource), + () => import('./NetworkHandlerResource').then(m => m.NetworkHandlerResource), + () => import('./ConnectionDialectResource').then(m => m.ConnectionDialectResource), + () => import('./NavTree/ConnectionNavNodeService').then(m => m.ConnectionNavNodeService), + () => import('./NavTree/NavNodeExtensionsService').then(m => m.NavNodeExtensionsService), + () => import('./ConnectionInfoEventHandler').then(m => m.ConnectionInfoEventHandler), + () => import('./ConnectionFolderEventHandler').then(m => m.ConnectionFolderEventHandler), + () => import('./ConnectionsSettingsService').then(m => m.ConnectionsSettingsService), ], }; diff --git a/webapp/packages/core-di/src/App.ts b/webapp/packages/core-di/src/App.ts index 85a886ab61..7017182538 100644 --- a/webapp/packages/core-di/src/App.ts +++ b/webapp/packages/core-di/src/App.ts @@ -10,29 +10,35 @@ import { Executor, IExecutor } from '@cloudbeaver/core-executor'; import { Bootstrap } from './Bootstrap'; import { Dependency } from './Dependency'; import type { DIContainer } from './DIContainer'; -import { Disposable } from './Disposable'; import type { IServiceCollection, IServiceConstructor, IServiceInjector } from './IApp'; import { IDiWrapper, inversifyWrapper } from './inversifyWrapper'; import type { PluginManifest } from './PluginManifest'; +export interface IStartData { + preload: boolean; +} + export class App { - readonly onStart: IExecutor; + readonly onStart: IExecutor; private readonly plugins: PluginManifest[]; private readonly diWrapper: IDiWrapper = inversifyWrapper; + private isAppServiceBound: boolean; constructor(plugins: PluginManifest[] = []) { this.plugins = plugins; this.onStart = new Executor(); + this.isAppServiceBound = false; - this.onStart.addHandler(async () => { - this.registerServices(); - await this.initializeServices(); - await this.loadServices(); + this.onStart.addHandler(async ({ preload }) => { + await this.registerServices(preload); + await this.initializeServices(preload); + await this.loadServices(preload); }); } async start(): Promise { - await this.onStart.execute(); + await this.onStart.execute({ preload: true }); + await this.onStart.execute({ preload: false }); } async restart(): Promise { @@ -42,14 +48,15 @@ export class App { dispose(): void { this.diWrapper.collection.unbindAll(); + this.isAppServiceBound = false; } getPlugins(): PluginManifest[] { return [...this.plugins]; } - getServices(): IServiceConstructor[] { - return this.plugins.map(plugin => plugin.providers).flat(); + getServices(preload?: boolean): Array<() => Promise>> { + return this.plugins.map(plugin => (preload ? plugin.preload || [] : plugin.providers)).flat(); } registerChildContainer(container: DIContainer): void { @@ -69,17 +76,22 @@ export class App { } // first phase register all dependencies - private registerServices(): void { - this.getServiceCollection().addServiceByClass(App, this); + private async registerServices(preload?: boolean): Promise { + if (!this.isAppServiceBound) { + this.getServiceCollection().addServiceByClass(App, this); + this.isAppServiceBound = true; + } + const services = await Promise.all(this.getServices(preload).map(serviceLoader => serviceLoader())); - for (const service of this.getServices()) { - // console.log('provider', provider.name); + for (const service of services) { this.diWrapper.collection.addServiceByClass(service); } } - private async initializeServices(): Promise { - for (const service of this.getServices()) { + private async initializeServices(preload?: boolean): Promise { + const services = await Promise.all(this.getServices(preload).map(serviceLoader => serviceLoader())); + + for (const service of services) { if (service.prototype instanceof Bootstrap) { const serviceInstance = this.diWrapper.injector.getServiceByClass(service); @@ -92,8 +104,10 @@ export class App { } } - private async loadServices(): Promise { - for (const service of this.getServices()) { + private async loadServices(preload?: boolean): Promise { + const services = await Promise.all(this.getServices(preload).map(serviceLoader => serviceLoader())); + + for (const service of services) { if (service.prototype instanceof Bootstrap) { const serviceInstance = this.diWrapper.injector.getServiceByClass(service); diff --git a/webapp/packages/core-di/src/AppContext.tsx b/webapp/packages/core-di/src/AppContext.tsx index 4580358c23..44f6168b4a 100644 --- a/webapp/packages/core-di/src/AppContext.tsx +++ b/webapp/packages/core-di/src/AppContext.tsx @@ -8,16 +8,14 @@ import { createContext } from 'react'; import type { IServiceInjector } from './IApp'; -import { useAppLoadingScreen } from './useAppLoadingScreen'; export const appContext = createContext(undefined as any); -interface Props { +export interface AppContextProps extends React.PropsWithChildren { app: IServiceInjector; } -export const AppContext: React.FC> = function AppContext({ app, children }) { - useAppLoadingScreen(); +export const AppContext: React.FC = function AppContext({ app, children }) { return ( // // problems with TabState when empty -> displayed state switch {children} diff --git a/webapp/packages/core-di/src/AppContextLazy.ts b/webapp/packages/core-di/src/AppContextLazy.ts new file mode 100644 index 0000000000..786aef2e94 --- /dev/null +++ b/webapp/packages/core-di/src/AppContextLazy.ts @@ -0,0 +1,10 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +import { lazy } from 'react'; + +export const AppContext = lazy(() => import('./AppContext').then(m => ({ default: m.AppContext }))); diff --git a/webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreen.tsx b/webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreen.tsx new file mode 100644 index 0000000000..fd7ae29c92 --- /dev/null +++ b/webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreen.tsx @@ -0,0 +1,13 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +import { useAppLoadingScreen } from './useAppLoadingScreen'; + +export function HideAppLoadingScreen() { + useAppLoadingScreen(); + return null; +} diff --git a/webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreenLazy.ts b/webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreenLazy.ts new file mode 100644 index 0000000000..8c98f78808 --- /dev/null +++ b/webapp/packages/core-di/src/AppLoadingScreen/HideAppLoadingScreenLazy.ts @@ -0,0 +1,10 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +import { lazy } from 'react'; + +export const HideAppLoadingScreen = lazy(() => import('./HideAppLoadingScreen').then(m => ({ default: m.HideAppLoadingScreen }))); diff --git a/webapp/packages/core-di/src/AppLoadingScreen/displayUpdateStatus.ts b/webapp/packages/core-di/src/AppLoadingScreen/displayUpdateStatus.ts new file mode 100644 index 0000000000..de7cbf9936 --- /dev/null +++ b/webapp/packages/core-di/src/AppLoadingScreen/displayUpdateStatus.ts @@ -0,0 +1,19 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +export function displayUpdateStatus(progress: number, message?: string) { + if (message !== undefined) { + const messageElement = document.querySelector('#app-loading-screen .app-loading-screen__status_message'); + if (messageElement) { + messageElement.textContent = message; + } + } + const progressElement = document.querySelector('#app-loading-screen .app-loading-screen__status_percent'); + if (progressElement) { + progressElement.textContent = (progress * 100).toFixed(0) + '%'; + } +} diff --git a/webapp/packages/core-di/src/useAppLoadingScreen.ts b/webapp/packages/core-di/src/AppLoadingScreen/useAppLoadingScreen.ts similarity index 84% rename from webapp/packages/core-di/src/useAppLoadingScreen.ts rename to webapp/packages/core-di/src/AppLoadingScreen/useAppLoadingScreen.ts index 5118d47df0..9989543434 100644 --- a/webapp/packages/core-di/src/useAppLoadingScreen.ts +++ b/webapp/packages/core-di/src/AppLoadingScreen/useAppLoadingScreen.ts @@ -1,3 +1,10 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ import { useLayoutEffect } from 'react'; function onTransitionEnd(this: HTMLElement) { diff --git a/webapp/packages/core-di/src/PluginManifest.ts b/webapp/packages/core-di/src/PluginManifest.ts index 4678d506b3..ab270e039e 100644 --- a/webapp/packages/core-di/src/PluginManifest.ts +++ b/webapp/packages/core-di/src/PluginManifest.ts @@ -13,7 +13,8 @@ export interface PluginManifest { defaultSettings?: Record; }; - providers: Array>; + preload?: Array<() => Promise>>; + providers: Array<() => Promise>>; /** * The list of plugins which your plugin depends on diff --git a/webapp/packages/core-di/src/__tests__/app-init/app-init.test.ts b/webapp/packages/core-di/src/__tests__/app-init/app-init.test.ts index 3f2fe4b194..f05112a4ca 100644 --- a/webapp/packages/core-di/src/__tests__/app-init/app-init.test.ts +++ b/webapp/packages/core-di/src/__tests__/app-init/app-init.test.ts @@ -14,7 +14,7 @@ test('App Initialization', async () => { const app = new App([manifest]); const injector = app.getServiceInjector(); - (app as any).registerServices(); + await (app as any).registerServices(); const service = injector.getServiceByClass(TestService); const bootstrap = injector.getServiceByClass(TestBootstrap); diff --git a/webapp/packages/core-di/src/__tests__/app-init/manifest.ts b/webapp/packages/core-di/src/__tests__/app-init/manifest.ts index dcd632aceb..99066e1f05 100644 --- a/webapp/packages/core-di/src/__tests__/app-init/manifest.ts +++ b/webapp/packages/core-di/src/__tests__/app-init/manifest.ts @@ -6,12 +6,10 @@ * you may not use this file except in compliance with the License. */ import type { PluginManifest } from '../../PluginManifest'; -import { TestBootstrap } from './TestBootstrap'; -import { TestService } from './TestService'; export const manifest: PluginManifest = { info: { name: 'Sample Manifest', }, - providers: [TestService, TestBootstrap], + providers: [() => import('./TestService').then(m => m.TestService), () => import('./TestBootstrap').then(m => m.TestBootstrap)], }; diff --git a/webapp/packages/core-di/src/index.ts b/webapp/packages/core-di/src/index.ts index ef435878ce..a2afd6e788 100644 --- a/webapp/packages/core-di/src/index.ts +++ b/webapp/packages/core-di/src/index.ts @@ -1,7 +1,15 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ export * from './IApp'; export * from './App'; -export * from './AppContext'; +export * from './AppContextLazy'; export * from './Bootstrap'; +export * from './Disposable'; export * from './Dependency'; export * from './dependencyInjectorContext'; export * from './DIService'; @@ -13,4 +21,6 @@ export * from './InjectionToken'; export * from './entities/ServiceInjectorToken'; export * from './ITypedConstructor'; export * from './isConstructor'; +export * from './AppLoadingScreen/HideAppLoadingScreenLazy'; +export * from './AppLoadingScreen/displayUpdateStatus'; export { manifest as coreDIManifest } from './manifest'; diff --git a/webapp/packages/core-di/src/manifest.ts b/webapp/packages/core-di/src/manifest.ts index 24bc39a8ce..5cd25d2386 100644 --- a/webapp/packages/core-di/src/manifest.ts +++ b/webapp/packages/core-di/src/manifest.ts @@ -5,7 +5,6 @@ * Licensed under the Apache License, Version 2.0. * you may not use this file except in compliance with the License. */ -import { DIService } from './DIService'; import type { PluginManifest } from './PluginManifest'; export const manifest: PluginManifest = { @@ -13,5 +12,5 @@ export const manifest: PluginManifest = { name: 'Core DI', }, - providers: [DIService], + providers: [() => import('./DIService').then(m => m.DIService)], }; diff --git a/webapp/packages/core-dialogs/src/manifest.ts b/webapp/packages/core-dialogs/src/manifest.ts index da50bf27ef..c5f6e6c8b7 100644 --- a/webapp/packages/core-dialogs/src/manifest.ts +++ b/webapp/packages/core-dialogs/src/manifest.ts @@ -7,13 +7,13 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { CommonDialogService } from './CommonDialog/CommonDialogService'; -import { ContextMenuService } from './Menu/ContextMenu/ContextMenuService'; - export const coreDialogsManifest: PluginManifest = { info: { name: 'Core Dialogs', }, - providers: [CommonDialogService, ContextMenuService], + providers: [ + () => import('./CommonDialog/CommonDialogService').then(m => m.CommonDialogService), + () => import('./Menu/ContextMenu/ContextMenuService').then(m => m.ContextMenuService), + ], }; diff --git a/webapp/packages/core-events/src/manifest.ts b/webapp/packages/core-events/src/manifest.ts index 92a975713f..8467d88a0f 100644 --- a/webapp/packages/core-events/src/manifest.ts +++ b/webapp/packages/core-events/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { EventsSettingsService } from './EventsSettingsService'; -import { ExceptionsCatcherService } from './ExceptionsCatcherService'; -import { NotificationService } from './NotificationService'; - export const coreEventsManifest: PluginManifest = { info: { name: 'Core Events', }, - providers: [NotificationService, ExceptionsCatcherService, EventsSettingsService], + providers: [ + () => import('./NotificationService').then(m => m.NotificationService), + () => import('./ExceptionsCatcherService').then(m => m.ExceptionsCatcherService), + () => import('./EventsSettingsService').then(m => m.EventsSettingsService), + ], }; diff --git a/webapp/packages/core-localization/src/LocalizationService.ts b/webapp/packages/core-localization/src/LocalizationService.ts index 98679e895f..7d227ddadd 100644 --- a/webapp/packages/core-localization/src/LocalizationService.ts +++ b/webapp/packages/core-localization/src/LocalizationService.ts @@ -35,8 +35,8 @@ export class LocalizationService extends Bootstrap { readonly onChange: IExecutor; private language: string | null; - private readonly localeMap: Map> = new Map(); - private readonly localeProviders: ILocaleProvider[] = []; + private readonly localeMap: Map>; + private readonly localeProviders: ILocaleProvider[]; private reactionDisposer: IReactionDisposer | null; constructor() { @@ -46,6 +46,8 @@ export class LocalizationService extends Bootstrap { this.language = null; this.reactionDisposer = null; this.onChange = new Executor(); + this.localeMap = new Map(); + this.localeProviders = []; makeObservable(this, { language: observable, @@ -125,18 +127,15 @@ export class LocalizationService extends Bootstrap { }, ]); this.addProvider(this.coreProvider.bind(this)); + } + + async load(): Promise { this.reactionDisposer = reaction( () => this.currentLanguage, lang => { this.loadLocale(lang); }, - { - fireImmediately: true, - }, ); - } - - async load(): Promise { await this.loadLocale(DEFAULT_LOCALE.isoCode); await this.loadLocale(this.currentLanguage); } diff --git a/webapp/packages/core-localization/src/manifest.ts b/webapp/packages/core-localization/src/manifest.ts index ad43238050..3f564b8ca5 100644 --- a/webapp/packages/core-localization/src/manifest.ts +++ b/webapp/packages/core-localization/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocalizationService } from './LocalizationService'; - export const coreLocalizationManifest: PluginManifest = { info: { name: 'Core Localization', }, - providers: [LocalizationService], + providers: [() => import('./LocalizationService').then(m => m.LocalizationService)], }; diff --git a/webapp/packages/core-navigation-tree/src/manifest.ts b/webapp/packages/core-navigation-tree/src/manifest.ts index 87daf4a587..1cac7420dc 100644 --- a/webapp/packages/core-navigation-tree/src/manifest.ts +++ b/webapp/packages/core-navigation-tree/src/manifest.ts @@ -7,26 +7,18 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { NavTreeSettingsService } from './NavTreeSettingsService'; -import { DBObjectResource } from './NodesManager/DBObjectResource'; -import { NavNodeInfoResource } from './NodesManager/NavNodeInfoResource'; -import { NavNodeManagerService } from './NodesManager/NavNodeManagerService'; -import { NavTreeResource } from './NodesManager/NavTreeResource'; -import { ProjectsNavNodeService } from './NodesManager/ProjectsNavNodeService'; - export const coreNavigationTree: PluginManifest = { info: { name: 'Core Navigation Tree', }, providers: [ - NavTreeSettingsService, - NavNodeManagerService, - DBObjectResource, - NavNodeInfoResource, - NavTreeResource, - ProjectsNavNodeService, - LocaleService, + () => import('./NavTreeSettingsService').then(m => m.NavTreeSettingsService), + () => import('./NodesManager/NavNodeManagerService').then(m => m.NavNodeManagerService), + () => import('./NodesManager/DBObjectResource').then(m => m.DBObjectResource), + () => import('./NodesManager/NavNodeInfoResource').then(m => m.NavNodeInfoResource), + () => import('./NodesManager/NavTreeResource').then(m => m.NavTreeResource), + () => import('./NodesManager/ProjectsNavNodeService').then(m => m.ProjectsNavNodeService), + () => import('./LocaleService').then(m => m.LocaleService), ], }; diff --git a/webapp/packages/core-product/src/manifest.ts b/webapp/packages/core-product/src/manifest.ts index 2e41f1e753..96101bde5f 100644 --- a/webapp/packages/core-product/src/manifest.ts +++ b/webapp/packages/core-product/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ProductSettingsService } from './ProductSettingsService'; - export const coreProductManifest: PluginManifest = { info: { name: 'Core Product', }, - providers: [ProductSettingsService], + providers: [() => import('./ProductSettingsService').then(m => m.ProductSettingsService)], }; diff --git a/webapp/packages/core-projects/src/manifest.ts b/webapp/packages/core-projects/src/manifest.ts index 24b1d23da0..e859103830 100644 --- a/webapp/packages/core-projects/src/manifest.ts +++ b/webapp/packages/core-projects/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { ProjectInfoEventHandler } from './ProjectInfoEventHandler'; -import { ProjectInfoResource } from './ProjectInfoResource'; -import { ProjectsService } from './ProjectsService'; - export const manifest: PluginManifest = { info: { name: 'Core Projects', }, - providers: [ProjectInfoResource, ProjectsService, LocaleService, ProjectInfoEventHandler], + providers: [ + () => import('./ProjectsService').then(m => m.ProjectsService), + () => import('./ProjectInfoResource').then(m => m.ProjectInfoResource), + () => import('./ProjectInfoEventHandler').then(m => m.ProjectInfoEventHandler), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/core-resource-manager/src/manifest.ts b/webapp/packages/core-resource-manager/src/manifest.ts index 33e5f1c8f5..8d9896d576 100644 --- a/webapp/packages/core-resource-manager/src/manifest.ts +++ b/webapp/packages/core-resource-manager/src/manifest.ts @@ -7,24 +7,17 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { ProjectPermissionsResource } from './ProjectPermissionsResource'; -import { ResourceManagerEventHandler } from './ResourceManagerEventHandler'; -import { ResourceManagerResource } from './ResourceManagerResource'; -import { SharedProjectsResource } from './SharedProjectsResource'; - export const resourceManagerManifest: PluginManifest = { info: { name: 'Resource Manager Core', }, providers: [ - PluginBootstrap, - SharedProjectsResource, - ProjectPermissionsResource, - ResourceManagerEventHandler, - ResourceManagerResource, - LocaleService, + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./SharedProjectsResource').then(m => m.SharedProjectsResource), + () => import('./ProjectPermissionsResource').then(m => m.ProjectPermissionsResource), + () => import('./ResourceManagerEventHandler').then(m => m.ResourceManagerEventHandler), + () => import('./ResourceManagerResource').then(m => m.ResourceManagerResource), + () => import('./LocaleService').then(m => m.LocaleService), ], }; diff --git a/webapp/packages/core-root/src/manifest.ts b/webapp/packages/core-root/src/manifest.ts index 2a3f9ab920..96d3d7e560 100644 --- a/webapp/packages/core-root/src/manifest.ts +++ b/webapp/packages/core-root/src/manifest.ts @@ -7,58 +7,34 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DataSynchronizationService } from './DataSynchronization/DataSynchronizationService'; -import { FeaturesResource } from './FeaturesResource'; -import { NetworkStateService } from './NetworkStateService'; -import { PermissionsService } from './PermissionsService'; -import { QuotasService } from './QuotasService'; -import { RootBootstrap } from './RootBootstrap'; -import { ServerConfigEventHandler } from './ServerConfigEventHandler'; -import { ServerConfigResource } from './ServerConfigResource'; -import { ServerNodeService } from './ServerNodeService'; -import { SessionActionService } from './SessionActionService'; -import { SessionActivityService } from './SessionActivityService'; -import { SessionDataResource } from './SessionDataResource'; -import { SessionEventSource } from './SessionEventSource'; -import { SessionExpireEventService } from './SessionExpireEventService'; -import { SessionExpireService } from './SessionExpireService'; -import { SessionInfoEventHandler } from './SessionInfoEventHandler'; -import { SessionPermissionEventHandler } from './SessionPermissionEventHandler'; -import { SessionPermissionsResource } from './SessionPermissionsResource'; -import { SessionResource } from './SessionResource'; -import { ServerSettingsManagerService } from './Settings/ServerSettingsManagerService'; -import { ServerSettingsResource } from './Settings/ServerSettingsResource'; -import { ServerSettingsService } from './Settings/ServerSettingsService'; -import { WindowEventsService } from './WindowEventsService'; - export const coreRootManifest: PluginManifest = { info: { name: 'Core Root', }, providers: [ - FeaturesResource, - NetworkStateService, - SessionPermissionsResource, - PermissionsService, - ServerConfigResource, - ServerSettingsService, - SessionActionService, - SessionDataResource, - SessionExpireService, - SessionExpireEventService, - ServerNodeService, - SessionResource, - WindowEventsService, - QuotasService, - ServerConfigEventHandler, - SessionEventSource, - SessionInfoEventHandler, - SessionActivityService, - DataSynchronizationService, - SessionPermissionEventHandler, - ServerSettingsResource, - ServerSettingsManagerService, - RootBootstrap, + () => import('./FeaturesResource').then(m => m.FeaturesResource), + () => import('./NetworkStateService').then(m => m.NetworkStateService), + () => import('./SessionPermissionsResource').then(m => m.SessionPermissionsResource), + () => import('./PermissionsService').then(m => m.PermissionsService), + () => import('./ServerConfigResource').then(m => m.ServerConfigResource), + () => import('./Settings/ServerSettingsService').then(m => m.ServerSettingsService), + () => import('./SessionActionService').then(m => m.SessionActionService), + () => import('./SessionDataResource').then(m => m.SessionDataResource), + () => import('./SessionExpireService').then(m => m.SessionExpireService), + () => import('./SessionExpireEventService').then(m => m.SessionExpireEventService), + () => import('./ServerNodeService').then(m => m.ServerNodeService), + () => import('./SessionResource').then(m => m.SessionResource), + () => import('./WindowEventsService').then(m => m.WindowEventsService), + () => import('./QuotasService').then(m => m.QuotasService), + () => import('./ServerConfigEventHandler').then(m => m.ServerConfigEventHandler), + () => import('./SessionEventSource').then(m => m.SessionEventSource), + () => import('./SessionInfoEventHandler').then(m => m.SessionInfoEventHandler), + () => import('./SessionActivityService').then(m => m.SessionActivityService), + () => import('./DataSynchronization/DataSynchronizationService').then(m => m.DataSynchronizationService), + () => import('./SessionPermissionEventHandler').then(m => m.SessionPermissionEventHandler), + () => import('./Settings/ServerSettingsResource').then(m => m.ServerSettingsResource), + () => import('./Settings/ServerSettingsManagerService').then(m => m.ServerSettingsManagerService), + () => import('./RootBootstrap').then(m => m.RootBootstrap), ], }; diff --git a/webapp/packages/core-routing/src/manifest.ts b/webapp/packages/core-routing/src/manifest.ts index 98b7d91306..953fff9f6c 100644 --- a/webapp/packages/core-routing/src/manifest.ts +++ b/webapp/packages/core-routing/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { RouterService } from './RouterService'; -import { ScreenService } from './Screen/ScreenService'; -import { WindowsService } from './WindowsService'; - export const coreRoutingManifest: PluginManifest = { info: { name: 'Core Routing', }, - providers: [ScreenService, RouterService, WindowsService], + providers: [ + () => import('./Screen/ScreenService').then(m => m.ScreenService), + () => import('./RouterService').then(m => m.RouterService), + () => import('./WindowsService').then(m => m.WindowsService), + ], }; diff --git a/webapp/packages/core-sdk/src/manifest.ts b/webapp/packages/core-sdk/src/manifest.ts index da08453c45..a0383668dc 100644 --- a/webapp/packages/core-sdk/src/manifest.ts +++ b/webapp/packages/core-sdk/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { AsyncTaskInfoService } from './AsyncTask/AsyncTaskInfoService'; -import { EnvironmentService } from './EnvironmentService'; -import { GraphQLService } from './GraphQLService'; - export const coreSDKManifest: PluginManifest = { info: { name: 'Core SDK', }, - providers: [AsyncTaskInfoService, EnvironmentService, GraphQLService], + providers: [ + () => import('./AsyncTask/AsyncTaskInfoService').then(m => m.AsyncTaskInfoService), + () => import('./EnvironmentService').then(m => m.EnvironmentService), + () => import('./GraphQLService').then(m => m.GraphQLService), + ], }; diff --git a/webapp/packages/core-server-localization/src/manifest.ts b/webapp/packages/core-server-localization/src/manifest.ts index ab8d10f586..63ca0c4308 100644 --- a/webapp/packages/core-server-localization/src/manifest.ts +++ b/webapp/packages/core-server-localization/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ServerLocalizationService } from './ServerLocalizationService'; - export const coreServerLocalization: PluginManifest = { info: { name: 'Core Server Localization', }, - providers: [ServerLocalizationService], + providers: [() => import('./ServerLocalizationService').then(m => m.ServerLocalizationService)], }; diff --git a/webapp/packages/core-session-localization/src/manifest.ts b/webapp/packages/core-session-localization/src/manifest.ts index 0819481efe..59a07180bf 100644 --- a/webapp/packages/core-session-localization/src/manifest.ts +++ b/webapp/packages/core-session-localization/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { SessionLocalizationService } from './SessionLocalizationService'; - export const coreSessionLocalization: PluginManifest = { info: { name: 'Core Session Localization', }, - providers: [SessionLocalizationService], + providers: [() => import('./SessionLocalizationService').then(m => m.SessionLocalizationService)], }; diff --git a/webapp/packages/core-settings-localization/src/manifest.ts b/webapp/packages/core-settings-localization/src/manifest.ts index 23b9686358..11c67f8017 100644 --- a/webapp/packages/core-settings-localization/src/manifest.ts +++ b/webapp/packages/core-settings-localization/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { LocalizationSettingsManagerService } from './LocalizationSettingsManagerService'; -import { SettingsLocalizationBootstrap } from './SettingsLocalizationBootstrap'; -import { SettingsLocalizationService } from './SettingsLocalizationService'; - export const coreSettingsLocalizationManifest: PluginManifest = { info: { name: 'Core Settings Localization', }, - providers: [SettingsLocalizationService, LocalizationSettingsManagerService, LocaleService, SettingsLocalizationBootstrap], + providers: [ + () => import('./SettingsLocalizationService').then(m => m.SettingsLocalizationService), + () => import('./LocalizationSettingsManagerService').then(m => m.LocalizationSettingsManagerService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./SettingsLocalizationBootstrap').then(m => m.SettingsLocalizationBootstrap), + ], }; diff --git a/webapp/packages/core-settings-user/src/manifest.ts b/webapp/packages/core-settings-user/src/manifest.ts index 98c4b2a92d..73fad21311 100644 --- a/webapp/packages/core-settings-user/src/manifest.ts +++ b/webapp/packages/core-settings-user/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { SettingsUserBootstrap } from './SettingsUserBootstrap'; -import { UserSettingsService } from './UserSettingsService'; - export const coreSettingsUserManifest: PluginManifest = { info: { name: 'Core User Settings', }, - providers: [LocaleService, UserSettingsService, SettingsUserBootstrap], + providers: [ + () => import('./UserSettingsService').then(m => m.UserSettingsService), + () => import('./SettingsUserBootstrap').then(m => m.SettingsUserBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/core-settings/src/manifest.ts b/webapp/packages/core-settings/src/manifest.ts index a20a4d432b..a3260287c9 100644 --- a/webapp/packages/core-settings/src/manifest.ts +++ b/webapp/packages/core-settings/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { SettingsManagerService } from './SettingsManager/SettingsManagerService'; -import { SettingsProviderService } from './SettingsProviderService'; -import { SettingsResolverService } from './SettingsResolverService'; - export const coreSettingsManifest: PluginManifest = { info: { name: 'Core Settings', }, - providers: [SettingsManagerService, SettingsResolverService, LocaleService, SettingsProviderService], + providers: [ + () => import('./SettingsManager/SettingsManagerService').then(m => m.SettingsManagerService), + () => import('./SettingsResolverService').then(m => m.SettingsResolverService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./SettingsProviderService').then(m => m.SettingsProviderService), + ], }; diff --git a/webapp/packages/core-storage/src/manifest.ts b/webapp/packages/core-storage/src/manifest.ts index 704fa753d1..58de03c2e3 100644 --- a/webapp/packages/core-storage/src/manifest.ts +++ b/webapp/packages/core-storage/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { StorageService } from './StorageService'; - export const coreStorageManifest: PluginManifest = { info: { name: 'Core Storage', }, - providers: [StorageService], + providers: [() => import('./StorageService').then(m => m.StorageService)], }; diff --git a/webapp/packages/core-task-manager/src/manifest.ts b/webapp/packages/core-task-manager/src/manifest.ts index a82adecb49..e0484f9b4c 100644 --- a/webapp/packages/core-task-manager/src/manifest.ts +++ b/webapp/packages/core-task-manager/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { TaskManagerService } from './TaskManagerService'; - export const coreTaskManagerManifest: PluginManifest = { info: { name: 'Core Task Manager', }, - providers: [TaskManagerService], + providers: [() => import('./TaskManagerService').then(m => m.TaskManagerService)], }; diff --git a/webapp/packages/core-theming/src/ThemeService.ts b/webapp/packages/core-theming/src/ThemeService.ts index 110258d450..71dee4ec58 100644 --- a/webapp/packages/core-theming/src/ThemeService.ts +++ b/webapp/packages/core-theming/src/ThemeService.ts @@ -12,11 +12,12 @@ import { NotificationService, UIError } from '@cloudbeaver/core-events'; import { ISyncExecutor, SyncExecutor } from '@cloudbeaver/core-executor'; import type { Style } from './ComponentStyle'; +// TODO: important to keep normalize first +import './styles/main/normalize.pure.css'; import './styles/main/base.pure.css'; import './styles/main/color.pure.scss'; import './styles/main/elevation.pure.scss'; import './styles/main/fonts.pure.css'; -import './styles/main/normalize.pure.css'; import './styles/main/typography.pure.scss'; import { DEFAULT_THEME_ID, themes } from './themes'; import { ThemeSettingsService } from './ThemeSettingsService'; diff --git a/webapp/packages/core-theming/src/manifest.ts b/webapp/packages/core-theming/src/manifest.ts index 3a4f99b85b..d3f99bac09 100644 --- a/webapp/packages/core-theming/src/manifest.ts +++ b/webapp/packages/core-theming/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { ThemeService } from './ThemeService'; -import { ThemeSettingsManagementService } from './ThemeSettingsManagementService'; -import { ThemeSettingsService } from './ThemeSettingsService'; - export const coreThemingManifest: PluginManifest = { info: { name: 'Core Theming', }, - providers: [ThemeService, ThemeSettingsService, LocaleService, ThemeSettingsManagementService], + providers: [ + () => import('./ThemeService').then(m => m.ThemeService), + () => import('./ThemeSettingsService').then(m => m.ThemeSettingsService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./ThemeSettingsManagementService').then(m => m.ThemeSettingsManagementService), + ], }; diff --git a/webapp/packages/core-theming/src/styles/main/typography.pure.scss b/webapp/packages/core-theming/src/styles/main/typography.pure.scss index 608a830535..84ad1e83c0 100644 --- a/webapp/packages/core-theming/src/styles/main/typography.pure.scss +++ b/webapp/packages/core-theming/src/styles/main/typography.pure.scss @@ -6,10 +6,9 @@ * you may not use this file except in compliance with the License. */ -@import "@material/typography/mixins"; +@import '@material/typography/mixins'; @mixin typography-core-styles($query: mdc-feature-all()) { - .theme-typography { @include mdc-typography-base($query: $query); } @@ -21,4 +20,4 @@ } } -@include typography-core-styles; \ No newline at end of file +@include typography-core-styles; diff --git a/webapp/packages/core-ui/src/Form/Components/BaseForm.tsx b/webapp/packages/core-ui/src/Form/Components/BaseForm.tsx index 3de5e20538..8af0ba7dba 100644 --- a/webapp/packages/core-ui/src/Form/Components/BaseForm.tsx +++ b/webapp/packages/core-ui/src/Form/Components/BaseForm.tsx @@ -7,10 +7,9 @@ */ import { observer } from 'mobx-react-lite'; -import { Button, Container, Form, s, SContext, StatusMessage, useAutoLoad, useForm, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { Button, Container, Form, s, StatusMessage, useAutoLoad, useForm, useS, useTranslate } from '@cloudbeaver/core-blocks'; import { getFirstException } from '@cloudbeaver/core-utils'; -import { TabBigUnderlineStyleRegistry } from '../../Tabs/Tab/TabStyleRegistries'; import { TabList } from '../../Tabs/TabList'; import { TabPanelList } from '../../Tabs/TabPanelList'; import { TabsState } from '../../Tabs/TabsState'; @@ -46,9 +45,7 @@ export const BaseForm = observer>(function BaseForm({ servic - - - + {onClose && ( diff --git a/webapp/packages/core-ui/src/SideBarPanel/SideBarPanel.tsx b/webapp/packages/core-ui/src/SideBarPanel/SideBarPanel.tsx index 3f462b4229..97f1bbda33 100644 --- a/webapp/packages/core-ui/src/SideBarPanel/SideBarPanel.tsx +++ b/webapp/packages/core-ui/src/SideBarPanel/SideBarPanel.tsx @@ -10,7 +10,6 @@ import { observer } from 'mobx-react-lite'; import { s, SContext, type StyleRegistry, useS } from '@cloudbeaver/core-blocks'; import TabStyles from '../Tabs/Tab/Tab.m.css'; -import { TabUnderlineStyleRegistry } from '../Tabs/Tab/TabStyleRegistries'; import { TabList } from '../Tabs/TabList'; import TabPanelStyles from '../Tabs/TabPanel.m.css'; import { TabPanelList } from '../Tabs/TabPanelList'; @@ -25,7 +24,6 @@ export interface SideBarPanelProps { } const sideBarPanelRegistry: StyleRegistry = [ - ...TabUnderlineStyleRegistry, [ TabStyles, { @@ -49,7 +47,7 @@ export const SideBarPanel = observer(function SideBarPanel({
- +
diff --git a/webapp/packages/core-ui/src/Tabs/Tab/Tab.m.css b/webapp/packages/core-ui/src/Tabs/Tab/Tab.m.css index 3b4b8202c2..a75d5d9e2e 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/Tab.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/Tab.m.css @@ -17,6 +17,7 @@ cursor: pointer; padding: 0; white-space: nowrap; + background: initial; height: 32px; border-top: solid 2px transparent; diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabBigUnderlineStyles.m.css b/webapp/packages/core-ui/src/Tabs/Tab/TabBigUnderlineStyles.m.css index 60009af2b3..1a521d4dc0 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabBigUnderlineStyles.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabBigUnderlineStyles.m.css @@ -6,6 +6,8 @@ * you may not use this file except in compliance with the License. */ -.tab { - font-size: 14px; +.underline.big { + & .tab { + font-size: 14px; + } } diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabIconVerticalRotated.m.css b/webapp/packages/core-ui/src/Tabs/Tab/TabIconVerticalRotated.m.css index 3bfec277c6..2ece3ec081 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabIconVerticalRotated.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabIconVerticalRotated.m.css @@ -6,6 +6,6 @@ * you may not use this file except in compliance with the License. */ -.tabIcon { +.vertical.rotated .tabIcon { padding-left: 6px; } diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabStyleRegistries.ts b/webapp/packages/core-ui/src/Tabs/Tab/TabStyleRegistries.ts index 96423ce322..a2ac1e01fb 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabStyleRegistries.ts +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabStyleRegistries.ts @@ -15,6 +15,6 @@ import TabUnderlineStyles from './TabUnderline.m.css'; export const TabUnderlineStyleRegistry: StyleRegistry = [[TabStyles, { mode: 'append', styles: [TabUnderlineStyles] }]]; export const TabBigUnderlineStyleRegistry: StyleRegistry = [ - [TabStyles, { mode: 'append', styles: [TabUnderlineStyles, TabBigUnderlineStyles] }], + [TabStyles, { mode: 'append', styles: [TabBigUnderlineStyles] }], [TabTitleStyles, { mode: 'append', styles: [TabTitleBigUnderlineStyles] }], ]; diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabTitleBigUnderlineStyles.m.css b/webapp/packages/core-ui/src/Tabs/Tab/TabTitleBigUnderlineStyles.m.css index 2ccc7b9341..64b108aae5 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabTitleBigUnderlineStyles.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabTitleBigUnderlineStyles.m.css @@ -6,6 +6,8 @@ * you may not use this file except in compliance with the License. */ -.tabTitle { - padding: 0 16px; +.underline.big { + & .tabTitle { + padding: 0 16px; + } } diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabTitleVerticalRotated.m.css b/webapp/packages/core-ui/src/Tabs/Tab/TabTitleVerticalRotated.m.css index ab3d34f870..a17096c5b1 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabTitleVerticalRotated.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabTitleVerticalRotated.m.css @@ -6,6 +6,6 @@ * you may not use this file except in compliance with the License. */ -.tabTitle { +.vertical.rotated .tabTitle { padding: 0 6px; } diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabUnderline.m.css b/webapp/packages/core-ui/src/Tabs/Tab/TabUnderline.m.css index 028d625b35..5d4d9703b4 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabUnderline.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabUnderline.m.css @@ -8,26 +8,30 @@ .tab { composes: theme-typography--caption from global; - background: none; - color: inherit; - border: none; - border-bottom: 2px solid var(--theme-primary); - outline: none; - opacity: 1; - border-top: none !important; - font-weight: normal !important; - text-transform: uppercase; +} - &:global([aria-selected='false']) { - opacity: 0.8; - border-bottom: 2px solid transparent !important; - } +.underline { + & .tab { + color: inherit; + border: none; + border-bottom: 2px solid var(--theme-primary); + outline: none; + opacity: 1; + border-top: none; + font-weight: normal; + text-transform: uppercase; - &:global([aria-disabled='true']) { - opacity: 0.5; - } + &:global([aria-selected='false']) { + opacity: 0.8; + border-bottom: 2px solid transparent; + } - &:hover { - opacity: 1; + &:global([aria-disabled='true']) { + opacity: 0.5; + } + + &:hover { + opacity: 1; + } } } diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabVertical.m.css b/webapp/packages/core-ui/src/Tabs/Tab/TabVertical.m.css index d76dc265aa..6708f41114 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabVertical.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabVertical.m.css @@ -6,9 +6,9 @@ * you may not use this file except in compliance with the License. */ -.tab { +.vertical .tab { overflow: auto; - border: none !important; + border: none; flex-shrink: 0; - height: 32px !important; + height: 32px; } diff --git a/webapp/packages/core-ui/src/Tabs/Tab/TabVerticalRotated.m.css b/webapp/packages/core-ui/src/Tabs/Tab/TabVerticalRotated.m.css index 2d8005643b..cf76f87e0a 100644 --- a/webapp/packages/core-ui/src/Tabs/Tab/TabVerticalRotated.m.css +++ b/webapp/packages/core-ui/src/Tabs/Tab/TabVerticalRotated.m.css @@ -6,25 +6,27 @@ * you may not use this file except in compliance with the License. */ -.tabOuter { - display: table; -} -.tabInner { - padding: 50% 0; - height: 0; - - & .tab { - transform-origin: top left; - display: block; - box-sizing: border-box; - transform: rotate(-90deg) translate(-100%); - margin-top: -50%; - height: 32px; - border: none; - border-radius: var(--theme-group-element-radius); +.vertical.rotated { + & .tabOuter { + display: table; + } + & .tabInner { + padding: 50% 0; + height: 0; - &::before { + & .tab { + transform-origin: top left; + display: block; + box-sizing: border-box; + transform: rotate(-90deg) translate(-100%); + margin-top: -50%; + height: 32px; + border: none; border-radius: var(--theme-group-element-radius); + + &::before { + border-radius: var(--theme-group-element-radius); + } } } } diff --git a/webapp/packages/core-ui/src/Tabs/TabList.m.css b/webapp/packages/core-ui/src/Tabs/TabList.m.css index 8ed9f08b95..b17201b3d3 100644 --- a/webapp/packages/core-ui/src/Tabs/TabList.m.css +++ b/webapp/packages/core-ui/src/Tabs/TabList.m.css @@ -11,3 +11,29 @@ box-sizing: border-box; outline: none; } + +.underline { + composes: underline from './Tab/TabUnderline.m.css'; + composes: underline from './Tab/TabBigUnderlineStyles.m.css'; + composes: underline from './Tab/TabTitleBigUnderlineStyles.m.css'; +} + +.big { + composes: big from './Tab/TabBigUnderlineStyles.m.css'; + composes: big from './Tab/TabTitleBigUnderlineStyles.m.css'; +} + +.vertical { + composes: vertical from './Tab/TabVertical.m.css'; + + composes: vertical from './Tab/TabIconVerticalRotated.m.css'; + composes: vertical from './Tab/TabTitleVerticalRotated.m.css'; + composes: vertical from './Tab/TabVerticalRotated.m.css'; + composes: vertical from './TabListVerticalRotated.m.css'; +} + +.rotated { + composes: rotated from './Tab/TabIconVerticalRotated.m.css'; + composes: rotated from './Tab/TabTitleVerticalRotated.m.css'; + composes: rotated from './Tab/TabVerticalRotated.m.css'; +} diff --git a/webapp/packages/core-ui/src/Tabs/TabList.tsx b/webapp/packages/core-ui/src/Tabs/TabList.tsx index 74d2cafd62..3a914639c9 100644 --- a/webapp/packages/core-ui/src/Tabs/TabList.tsx +++ b/webapp/packages/core-ui/src/Tabs/TabList.tsx @@ -6,70 +6,98 @@ * you may not use this file except in compliance with the License. */ import { observer } from 'mobx-react-lite'; -import { useContext } from 'react'; +import { useContext, useMemo } from 'react'; import { TabList as BaseTabList, TabListOptions, TabStateReturn } from 'reakit/Tab'; -import { s, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { s, SContext, StyleRegistry, useS, useTranslate } from '@cloudbeaver/core-blocks'; import { generateTabElement } from './generateTabElement'; import { TabDefault } from './Tab/TabDefault'; +import { TabBigUnderlineStyleRegistry, TabUnderlineStyleRegistry } from './Tab/TabStyleRegistries'; import styles from './TabList.m.css'; +import { TabListVerticalRegistry, TabListVerticalRotatedRegistry } from './TabListStyleRegistries'; +import verticalStyles from './TabListVertical.m.css'; +import verticalRotatedStyles from './TabListVerticalRotated.m.css'; import { TabsContext } from './TabsContext'; export interface TabListProps extends Omit { 'aria-label'?: string; childrenFirst?: boolean; + vertical?: boolean; + rotated?: boolean; + underline?: boolean; + big?: boolean; className?: string; } -export const TabList = observer>(function TabList({ className, children, childrenFirst, ...props }) { +export const TabList = observer>(function TabList({ + className, + children, + vertical, + rotated, + underline, + big, + childrenFirst, + ...props +}) { const state = useContext(TabsContext); const translate = useTranslate(); - const componentStyle = useS(styles); + const componentStyle = useS(styles, !rotated && verticalStyles, verticalRotatedStyles); if (!state) { throw new Error('Tabs context was not provided'); } + const registry = useMemo( + () => [ + ...(vertical && !rotated ? TabListVerticalRegistry : []), + ...(vertical && rotated ? TabListVerticalRotatedRegistry : []), + ...(underline ? TabUnderlineStyleRegistry : []), + ...(underline && big ? TabBigUnderlineStyleRegistry : []), + ], + [vertical, rotated, underline, big], + ); + + className = s(componentStyle, { tabList: true, vertical, rotated, underline, big }, className); + if (state.container) { const displayed = state.container.getDisplayed(state.props); return ( - - {childrenFirst && children} - {displayed - .map( - generateTabElement( - (tabInfo, key) => ( - + + + {childrenFirst && children} + {displayed + .map( + generateTabElement( + (tabInfo, key) => ( + + ), + state.props, ), - state.props, - ), - ) - .flat()} - {!childrenFirst && children} - + ) + .flat()} + {!childrenFirst && children} + + ); } return ( - - {children} - + + + {children} + + ); }); diff --git a/webapp/packages/core-ui/src/Tabs/TabListVertical.m.css b/webapp/packages/core-ui/src/Tabs/TabListVertical.m.css index 7485490073..64e1a102ff 100644 --- a/webapp/packages/core-ui/src/Tabs/TabListVertical.m.css +++ b/webapp/packages/core-ui/src/Tabs/TabListVertical.m.css @@ -6,7 +6,7 @@ * you may not use this file except in compliance with the License. */ -.tabList { +.vertical.tabList { display: flex; flex-direction: column; flex: 0 0 auto; diff --git a/webapp/packages/core-ui/src/Tabs/TabListVerticalRotated.m.css b/webapp/packages/core-ui/src/Tabs/TabListVerticalRotated.m.css index a9050e8ae2..f8ef5e818e 100644 --- a/webapp/packages/core-ui/src/Tabs/TabListVerticalRotated.m.css +++ b/webapp/packages/core-ui/src/Tabs/TabListVerticalRotated.m.css @@ -6,10 +6,11 @@ * you may not use this file except in compliance with the License. */ -.tabList { +.vertical.rotated.tabList { display: flex; gap: 4px; outline: none; max-width: 32px; + overflow: hidden; flex-direction: column; } diff --git a/webapp/packages/core-ui/src/index.ts b/webapp/packages/core-ui/src/index.ts index 0286f52044..b0c76284d5 100644 --- a/webapp/packages/core-ui/src/index.ts +++ b/webapp/packages/core-ui/src/index.ts @@ -68,8 +68,6 @@ export { default as TabUnderlineStyles } from './Tabs/Tab/TabUnderline.m.css'; export { default as TabBigUnderlineStyles } from './Tabs/Tab/TabBigUnderlineStyles.m.css'; export { default as TabTitleBigUnderlineStyles } from './Tabs/Tab/TabTitleBigUnderlineStyles.m.css'; export { default as TabIconStyles } from './Tabs/Tab/TabIcon.m.css'; -export * from './Tabs/Tab/TabStyleRegistries'; -export * from './Tabs/TabListStyleRegistries'; export * from './Tabs/Tab/DATA_CONTEXT_TAB_ID'; export * from './Tabs/Tab/DATA_CONTEXT_TABS_CONTEXT'; diff --git a/webapp/packages/core-ui/src/manifest.ts b/webapp/packages/core-ui/src/manifest.ts index 35c08d98a8..bbfd159be0 100644 --- a/webapp/packages/core-ui/src/manifest.ts +++ b/webapp/packages/core-ui/src/manifest.ts @@ -7,28 +7,19 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ClipboardBootstrap } from './Clipboard/ClipboardBootstrap'; -import { ClipboardService } from './Clipboard/ClipboardService'; -import { LocaleService } from './LocaleService'; -import { NavigationService } from './Screens/AppScreen/NavigationService'; -import { OptionsPanelService } from './Screens/AppScreen/OptionsPanelService'; -import { LeftBarPanelService } from './SideBarPanel/LeftBarPanelService'; -import { SideBarPanelService } from './SideBarPanel/SideBarPanelService'; -import { TabsBootstrap } from './Tabs/TabsBootstrap'; - export const manifest: PluginManifest = { info: { name: 'Core UI', }, providers: [ - NavigationService, - OptionsPanelService, - ClipboardBootstrap, - ClipboardService, - TabsBootstrap, - SideBarPanelService, - LocaleService, - LeftBarPanelService, + () => import('./Screens/AppScreen/NavigationService').then(m => m.NavigationService), + () => import('./Screens/AppScreen/OptionsPanelService').then(m => m.OptionsPanelService), + () => import('./Clipboard/ClipboardBootstrap').then(m => m.ClipboardBootstrap), + () => import('./Clipboard/ClipboardService').then(m => m.ClipboardService), + () => import('./Tabs/TabsBootstrap').then(m => m.TabsBootstrap), + () => import('./SideBarPanel/SideBarPanelService').then(m => m.SideBarPanelService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./SideBarPanel/LeftBarPanelService').then(m => m.LeftBarPanelService), ], }; diff --git a/webapp/packages/core-version-update/src/manifest.ts b/webapp/packages/core-version-update/src/manifest.ts index 90581f2072..51b0d1929b 100644 --- a/webapp/packages/core-version-update/src/manifest.ts +++ b/webapp/packages/core-version-update/src/manifest.ts @@ -7,13 +7,13 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { VersionUpdateLocaleService } from './LocaleService'; -import { VersionUpdateService } from './VersionUpdateService'; - export const manifest: PluginManifest = { info: { name: 'Version update', }, - providers: [VersionUpdateService, VersionUpdateLocaleService], + providers: [ + () => import('./VersionUpdateService').then(m => m.VersionUpdateService), + () => import('./LocaleService').then(m => m.VersionUpdateLocaleService), + ], }; diff --git a/webapp/packages/core-version/src/manifest.ts b/webapp/packages/core-version/src/manifest.ts index 52311af446..c092433a8e 100644 --- a/webapp/packages/core-version/src/manifest.ts +++ b/webapp/packages/core-version/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { VersionLocaleService } from './VersionLocaleService'; -import { VersionResource } from './VersionResource'; -import { VersionService } from './VersionService'; - export const manifest: PluginManifest = { info: { name: 'App version', }, - providers: [VersionService, VersionResource, VersionLocaleService], + providers: [ + () => import('./VersionService').then(m => m.VersionService), + () => import('./VersionResource').then(m => m.VersionResource), + () => import('./VersionLocaleService').then(m => m.VersionLocaleService), + ], }; diff --git a/webapp/packages/core-view/src/manifest.ts b/webapp/packages/core-view/src/manifest.ts index ad085e19ca..6bd84add71 100644 --- a/webapp/packages/core-view/src/manifest.ts +++ b/webapp/packages/core-view/src/manifest.ts @@ -7,16 +7,16 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ActionService } from './Action/ActionService'; -import { KeyBindingService } from './Action/KeyBinding/KeyBindingService'; -import { LocaleService } from './LocaleService'; -import { MenuService } from './Menu/MenuService'; -import { ViewService } from './View/ViewService'; - export const manifest: PluginManifest = { info: { name: 'Core View', }, - providers: [ActionService, KeyBindingService, MenuService, ViewService, LocaleService], + providers: [ + () => import('./Action/ActionService').then(m => m.ActionService), + () => import('./Action/KeyBinding/KeyBindingService').then(m => m.KeyBindingService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./Menu/MenuService').then(m => m.MenuService), + () => import('./View/ViewService').then(m => m.ViewService), + ], }; diff --git a/webapp/packages/plugin-administration/src/Administration/Administration.tsx b/webapp/packages/plugin-administration/src/Administration/Administration.tsx index 0a453addc2..9a0f2627d9 100644 --- a/webapp/packages/plugin-administration/src/Administration/Administration.tsx +++ b/webapp/packages/plugin-administration/src/Administration/Administration.tsx @@ -22,7 +22,7 @@ import { useS, } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; -import { OptionsPanelService, TabList, TabListStyles, TabListVerticalRegistry, TabsState, TabStyles } from '@cloudbeaver/core-ui'; +import { OptionsPanelService, TabList, TabListStyles, TabsState, TabStyles } from '@cloudbeaver/core-ui'; import { CaptureView } from '@cloudbeaver/core-view'; import { AdministrationCaptureViewContext } from './AdministrationCaptureViewContext'; @@ -58,7 +58,6 @@ const adminPageRegistry: StyleRegistry = [ ]; const tabsRegistry: StyleRegistry = [ - ...TabListVerticalRegistry, [ TabStyles, { @@ -101,7 +100,7 @@ export const Administration = observer>(function - + {items.map(item => ( import('./LocaleService').then(m => m.LocaleService), + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./ConfigurationWizard/ServerConfiguration/ServerConfigurationService').then(m => m.ServerConfigurationService), + () => import('./ConfigurationWizard/ServerConfigurationAdministrationNavService').then(m => m.ServerConfigurationAdministrationNavService), + () => import('./ConfigurationWizard/ConfigurationWizardPagesBootstrapService').then(m => m.ConfigurationWizardPagesBootstrapService), + () => import('./AdministrationScreen/AdministrationScreenServiceBootstrap').then(m => m.AdministrationScreenServiceBootstrap), + () => import('./AdministrationScreen/AdministrationTopAppBar/AdministrationTopAppBarService').then(m => m.AdministrationTopAppBarService), + () => import('./AdministrationScreen/ConfigurationWizard/WizardTopAppBar/WizardTopAppBarService').then(m => m.WizardTopAppBarService), + () => import('./Administration/AdministrationViewService').then(m => m.AdministrationViewService), ], }; diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx index ba90aaa56e..88c57fc443 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamForm.tsx @@ -15,7 +15,6 @@ import { Loader, Placeholder, s, - SContext, StatusMessage, useExecutor, useForm, @@ -25,7 +24,7 @@ import { } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { ENotificationType } from '@cloudbeaver/core-events'; -import { TabBigUnderlineStyleRegistry, TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; +import { TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; import { teamContext } from './Contexts/teamContext'; import type { ITeamFormState } from './ITeamFormProps'; @@ -78,9 +77,7 @@ export const TeamForm = observer(function TeamForm({ state, onCancel, onS - - - + diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx index f6710afbe3..0babe5e59f 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/AdministrationUserForm.tsx @@ -7,10 +7,10 @@ */ import { observer } from 'mobx-react-lite'; -import { Button, Container, Form, s, SContext, StatusMessage, useAutoLoad, useForm, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { Button, Container, Form, s, StatusMessage, useAutoLoad, useForm, useS, useTranslate } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { NotificationService } from '@cloudbeaver/core-events'; -import { FormMode, IFormState, TabBigUnderlineStyleRegistry, TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; +import { FormMode, IFormState, TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; import { getFirstException } from '@cloudbeaver/core-utils'; import style from './AdministrationUserForm.m.css'; @@ -73,9 +73,7 @@ export const AdministrationUserForm = observer(function AdministrationUse type={state.statusType} message={state.statusMessage} /> - - - + {editing && ( diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersAdministration.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersAdministration.tsx index 1c1851430c..ba2d906679 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersAdministration.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersAdministration.tsx @@ -10,18 +10,7 @@ import { observer } from 'mobx-react-lite'; import type { AdministrationItemContentComponent } from '@cloudbeaver/core-administration'; import { s, SContext, StyleRegistry, ToolsPanel, useS, useTranslate } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; -import { - ITabData, - Tab, - TabList, - TabPanel, - TabPanelStyles, - TabsState, - TabStyles, - TabTitle, - TabTitleStyles, - TabUnderlineStyleRegistry, -} from '@cloudbeaver/core-ui'; +import { ITabData, Tab, TabList, TabPanel, TabPanelStyles, TabsState, TabStyles, TabTitle, TabTitleStyles } from '@cloudbeaver/core-ui'; import style from './shared/UsersAdministration.m.css'; import tabStyle from './shared/UsersAdministrationTab.m.css'; @@ -34,7 +23,6 @@ import { UsersPage } from './UsersTable/UsersPage'; const tabPanelRegistry: StyleRegistry = [[TabPanelStyles, { mode: 'append', styles: [tabPanelStyle] }]]; const mainTabsRegistry: StyleRegistry = [ - ...TabUnderlineStyleRegistry, [TabStyles, { mode: 'append', styles: [tabStyle] }], [TabTitleStyles, { mode: 'append', styles: [TabTitleModuleStyles] }], ]; @@ -43,7 +31,7 @@ export const UsersAdministration: AdministrationItemContentComponent = observer( const translate = useTranslate(); const usersAdministrationNavigationService = useService(UsersAdministrationNavigationService); const subName = sub?.name || EUsersAdministrationSub.Users; - const styles = useS(style); + const styles = useS(style, tabStyle); function openSub({ tabId }: ITabData) { if (subName === tabId) { @@ -58,7 +46,7 @@ export const UsersAdministration: AdministrationItemContentComponent = observer( return ( - + {translate('authentication_administration_item_users')} diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/shared/UsersAdministrationTab.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/shared/UsersAdministrationTab.m.css index b2851f1ae2..06c379c5fa 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/shared/UsersAdministrationTab.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/shared/UsersAdministrationTab.m.css @@ -6,17 +6,19 @@ * you may not use this file except in compliance with the License. */ -.tab { - height: 100%; - font-size: 14px; - font-weight: 700; - padding: 0 4px; -} +.administrationTabs { + & .tab { + height: 100%; + font-size: 14px; + font-weight: 700; + padding: 0 4px; + } -.tabInner { - height: 100%; -} + & .tabInner { + height: 100%; + } -.tabOuter { - height: 100%; + & .tabOuter { + height: 100%; + } } diff --git a/webapp/packages/plugin-authentication-administration/src/manifest.ts b/webapp/packages/plugin-authentication-administration/src/manifest.ts index 0f1433cdf0..ebcfb4962a 100644 --- a/webapp/packages/plugin-authentication-administration/src/manifest.ts +++ b/webapp/packages/plugin-authentication-administration/src/manifest.ts @@ -7,54 +7,38 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ServerConfigurationAuthenticationBootstrap } from './Administration/ServerConfiguration/ServerConfigurationAuthenticationBootstrap'; -import { CreateTeamService } from './Administration/Users/Teams/CreateTeamService'; -import { GrantedConnectionsTabService } from './Administration/Users/Teams/GrantedConnections/GrantedConnectionsTabService'; -import { GrantedUsersTabService } from './Administration/Users/Teams/GrantedUsers/GrantedUsersTabService'; -import { TeamOptionsTabService } from './Administration/Users/Teams/Options/TeamOptionsTabService'; -import { TeamFormService } from './Administration/Users/Teams/TeamFormService'; -import { TeamsAdministrationNavService } from './Administration/Users/Teams/TeamsAdministrationNavService'; -import { TeamsAdministrationService } from './Administration/Users/Teams/TeamsAdministrationService'; -import { AdministrationUserFormService } from './Administration/Users/UserForm/AdministrationUserFormService'; -import { UserFormConnectionAccessPartBootstrap } from './Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccessPartBootstrap'; -import { UserFormInfoPartBootstrap } from './Administration/Users/UserForm/Info/UserFormInfoPartBootstrap'; -import { UserFormInfoPartService } from './Administration/Users/UserForm/Info/UserFormInfoPartService'; -import { UserFormOriginPartBootstrap } from './Administration/Users/UserForm/Origin/UserFormOriginPartBootstrap'; -import { UserFormBaseBootstrap } from './Administration/Users/UserForm/UserFormBaseBootstrap'; -import { UsersAdministrationNavigationService } from './Administration/Users/UsersAdministrationNavigationService'; -import { UsersAdministrationService } from './Administration/Users/UsersAdministrationService'; -import { CreateUserBootstrap } from './Administration/Users/UsersTable/CreateUserBootstrap'; -import { CreateUserService } from './Administration/Users/UsersTable/CreateUserService'; -import { AdministrationUsersManagementService } from './AdministrationUsersManagementService'; -import { AuthenticationLocaleService } from './AuthenticationLocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const manifest: PluginManifest = { info: { name: 'Authentication Administration', }, providers: [ - PluginBootstrap, - UsersAdministrationService, - AuthenticationLocaleService, - CreateUserService, - UsersAdministrationNavigationService, - ServerConfigurationAuthenticationBootstrap, - AdministrationUserFormService, - TeamsAdministrationService, - CreateTeamService, - TeamsAdministrationNavService, - TeamFormService, - TeamOptionsTabService, - GrantedUsersTabService, - GrantedConnectionsTabService, - CreateUserBootstrap, - UserFormBaseBootstrap, - UserFormInfoPartBootstrap, - UserFormOriginPartBootstrap, - UserFormConnectionAccessPartBootstrap, - UserFormInfoPartService, - AdministrationUsersManagementService, + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./Administration/Users/UsersAdministrationService').then(m => m.UsersAdministrationService), + () => import('./AuthenticationLocaleService').then(m => m.AuthenticationLocaleService), + () => import('./Administration/Users/UsersTable/CreateUserService').then(m => m.CreateUserService), + () => import('./Administration/Users/UsersAdministrationNavigationService').then(m => m.UsersAdministrationNavigationService), + () => + import('./Administration/ServerConfiguration/ServerConfigurationAuthenticationBootstrap').then( + m => m.ServerConfigurationAuthenticationBootstrap, + ), + () => import('./Administration/Users/UserForm/AdministrationUserFormService').then(m => m.AdministrationUserFormService), + () => import('./Administration/Users/Teams/TeamsAdministrationService').then(m => m.TeamsAdministrationService), + () => import('./Administration/Users/Teams/CreateTeamService').then(m => m.CreateTeamService), + () => import('./Administration/Users/Teams/TeamsAdministrationNavService').then(m => m.TeamsAdministrationNavService), + () => import('./Administration/Users/Teams/TeamFormService').then(m => m.TeamFormService), + () => import('./Administration/Users/Teams/Options/TeamOptionsTabService').then(m => m.TeamOptionsTabService), + () => import('./Administration/Users/Teams/GrantedUsers/GrantedUsersTabService').then(m => m.GrantedUsersTabService), + () => import('./Administration/Users/Teams/GrantedConnections/GrantedConnectionsTabService').then(m => m.GrantedConnectionsTabService), + () => import('./Administration/Users/UsersTable/CreateUserBootstrap').then(m => m.CreateUserBootstrap), + () => import('./Administration/Users/UserForm/UserFormBaseBootstrap').then(m => m.UserFormBaseBootstrap), + () => import('./Administration/Users/UserForm/Info/UserFormInfoPartBootstrap').then(m => m.UserFormInfoPartBootstrap), + () => import('./Administration/Users/UserForm/Origin/UserFormOriginPartBootstrap').then(m => m.UserFormOriginPartBootstrap), + () => + import('./Administration/Users/UserForm/ConnectionAccess/UserFormConnectionAccessPartBootstrap').then( + m => m.UserFormConnectionAccessPartBootstrap, + ), + () => import('./Administration/Users/UserForm/Info/UserFormInfoPartService').then(m => m.UserFormInfoPartService), + () => import('./AdministrationUsersManagementService').then(m => m.AdministrationUsersManagementService), ], }; diff --git a/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.m.css b/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.m.css index badf546143..c125d609b9 100644 --- a/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.m.css +++ b/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.m.css @@ -7,7 +7,19 @@ */ .wrapper { min-height: 520px !important; - max-height: max(var(--app-height) - 48px, 520px) !important; + max-height: max(var(--app-height, 100vh) - 48px, 520px) !important; + + & .tabList { + justify-content: center; + position: sticky; + top: 0; + z-index: 1; + & .tab { + &:global([aria-selected='true']) { + font-weight: 500; + } + } + } } .submittingForm { overflow: auto; @@ -19,18 +31,6 @@ display: flex; flex-direction: column; } -.tabList { - composes: theme-background-surface theme-text-on-surface from global; - justify-content: center; - position: sticky; - top: 0; - z-index: 1; -} -.tab { - &:global([aria-selected='true']) { - font-weight: 500 !important; - } -} .authProviderForm { flex-direction: column; padding: 18px 24px; diff --git a/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx b/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx index 0a764ef827..9013b7501d 100644 --- a/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx +++ b/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx @@ -20,7 +20,6 @@ import { getComputed, Link, s, - SContext, TextPlaceholder, useErrorDetails, useS, @@ -28,7 +27,7 @@ import { } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { CommonDialogService, DialogComponent } from '@cloudbeaver/core-dialogs'; -import { Tab, TabBigUnderlineStyleRegistry, TabList, TabsState, TabTitle } from '@cloudbeaver/core-ui'; +import { Tab, TabList, TabsState, TabTitle } from '@cloudbeaver/core-ui'; import { AuthenticationService } from '../AuthenticationService'; import type { IAuthOptions } from '../IAuthOptions'; @@ -158,64 +157,62 @@ export const AuthDialog: DialogComponent = observer(function onReject={options?.persistent ? undefined : rejectDialog} /> - - {showTabs && ( - - {dialogData.providers - .map(provider => { - if (provider.configurable) { - return provider.configurations?.map(configuration => { - const tabId = getAuthProviderTabId(provider, configuration); - return ( - { - state.setActiveProvider(provider, configuration); - }} - > - {configuration.displayName} - - ); - }); - } - return ( - { - state.setActiveProvider(provider, null); - }} - > - {provider.label} - - ); - }) - .flat()} - {dialogData.federatedProviders.length > 0 && ( - { - state.setActiveProvider(null, null); - state.switchAuthMode(FEDERATED_AUTH); - }} - > - {translate('authentication_auth_federated')} - - )} - - )} - + {showTabs && ( + + {dialogData.providers + .map(provider => { + if (provider.configurable) { + return provider.configurations?.map(configuration => { + const tabId = getAuthProviderTabId(provider, configuration); + return ( + { + state.setActiveProvider(provider, configuration); + }} + > + {configuration.displayName} + + ); + }); + } + return ( + { + state.setActiveProvider(provider, null); + }} + > + {provider.label} + + ); + }) + .flat()} + {dialogData.federatedProviders.length > 0 && ( + { + state.setActiveProvider(null, null); + state.switchAuthMode(FEDERATED_AUTH); + }} + > + {translate('authentication_auth_federated')} + + )} + + )} {federate ? ( import('./AuthenticationService').then(m => m.AuthenticationService), + () => import('./Dialog/AuthDialogService').then(m => m.AuthDialogService), + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./AuthenticationLocaleService').then(m => m.AuthenticationLocaleService), + () => import('./UserLoadingErrorDialogBootstrap').then(m => m.UserLoadingErrorDialogBootstrap), + ], }; diff --git a/webapp/packages/plugin-browser/src/PluginBrowserBootstrap.ts b/webapp/packages/plugin-browser/src/PluginBrowserBootstrap.ts index 07e1a5a4d6..1b66b7d24f 100644 --- a/webapp/packages/plugin-browser/src/PluginBrowserBootstrap.ts +++ b/webapp/packages/plugin-browser/src/PluginBrowserBootstrap.ts @@ -5,21 +5,51 @@ * Licensed under the Apache License, Version 2.0. * you may not use this file except in compliance with the License. */ -import { ProcessSnackbar } from '@cloudbeaver/core-blocks'; +import type { ProcessSnackbarProps } from '@cloudbeaver/core-blocks'; import { ServiceWorkerService } from '@cloudbeaver/core-browser'; import { Bootstrap, injectable } from '@cloudbeaver/core-di'; -import { NotificationService } from '@cloudbeaver/core-events'; +import { IProcessNotificationContainer, NotificationService } from '@cloudbeaver/core-events'; +import { LocalizationService } from '@cloudbeaver/core-localization'; @injectable() export class PluginBrowserBootstrap extends Bootstrap { - constructor(private readonly serviceWorkerService: ServiceWorkerService, private readonly notificationService: NotificationService) { + private notification: IProcessNotificationContainer | null; + + constructor( + private readonly serviceWorkerService: ServiceWorkerService, + private readonly notificationService: NotificationService, + private readonly localizationService: LocalizationService, + ) { super(); + this.notification = null; } - register(): void | Promise { - this.serviceWorkerService.onUpdate.addHandler(() => { - this.notificationService.processNotification(() => ProcessSnackbar, {}, { title: 'plugin_browser_update_dialog_title' }); - }); + register(): void { + // TODO: notification appears in unexpected moment + // this.serviceWorkerService.onUpdate.addHandler(({ type, progress }) => { + // progress = progress || 0; + // switch (type) { + // case 'installing': + // break; + // case 'updating': + // if (!this.notification) { + // this.notification = this.notificationService.processNotification( + // () => ProcessSnackbar, + // {}, + // { + // title: 'plugin_browser_update_dialog_title', + // message: this.localizationService.translate('plugin_browser_update_dialog_message', undefined, { progress: '0%' }), + // }, + // ); + // } + // this.notification.controller.setMessage( + // this.localizationService.translate('plugin_browser_update_dialog_message', undefined, { progress: (progress * 100).toFixed(0) + '%' }), + // ); + // break; + // case 'finished': + // this.notification?.notification.close(); + // this.notification = null; + // break; + // } + // }); } - - load(): void | Promise {} } diff --git a/webapp/packages/plugin-browser/src/PluginBrowserPreloadingBootstrap.ts b/webapp/packages/plugin-browser/src/PluginBrowserPreloadingBootstrap.ts new file mode 100644 index 0000000000..7f0e12580d --- /dev/null +++ b/webapp/packages/plugin-browser/src/PluginBrowserPreloadingBootstrap.ts @@ -0,0 +1,32 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +import { ServiceWorkerService } from '@cloudbeaver/core-browser'; +import { Bootstrap, displayUpdateStatus, injectable } from '@cloudbeaver/core-di'; + +@injectable() +export class PluginBrowserPreloadingBootstrap extends Bootstrap { + constructor(private readonly serviceWorkerService: ServiceWorkerService) { + super(); + } + register(): void { + this.serviceWorkerService.onUpdate.addHandler(({ type, progress }) => { + progress = progress || 0; + + switch (type) { + case 'installing': + displayUpdateStatus(progress, 'Installing...'); + break; + case 'updating': + displayUpdateStatus(progress, 'Updating...'); + break; + case 'finished': + break; + } + }); + } +} diff --git a/webapp/packages/plugin-browser/src/locales/en.ts b/webapp/packages/plugin-browser/src/locales/en.ts index 55296a1ec3..fb0a5b94d5 100644 --- a/webapp/packages/plugin-browser/src/locales/en.ts +++ b/webapp/packages/plugin-browser/src/locales/en.ts @@ -1,4 +1,12 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ export default [ - ['plugin_browser_update_dialog_title', 'Application is updating...'], - ['plugin_browser_update_dialog_message', 'New version of CloudBeaver is available. Do you want to update?'], + ['plugin_browser_update_dialog_title', 'Installing application...'], + ['plugin_browser_update_dialog_title', 'Installing an update...'], + ['plugin_browser_update_dialog_message', 'Application will be restarted automatically \n{arg:progress}'], ]; diff --git a/webapp/packages/plugin-browser/src/locales/it.ts b/webapp/packages/plugin-browser/src/locales/it.ts index d6d1738de6..0c7ce89638 100644 --- a/webapp/packages/plugin-browser/src/locales/it.ts +++ b/webapp/packages/plugin-browser/src/locales/it.ts @@ -1 +1,11 @@ -export default []; +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +export default [ + ['plugin_browser_update_dialog_title', 'Update in progress...'], + ['plugin_browser_update_dialog_message', 'New version of CloudBeaver is available. Do you want to update?'], +]; diff --git a/webapp/packages/plugin-browser/src/locales/ru.ts b/webapp/packages/plugin-browser/src/locales/ru.ts index 0fe6a0a853..2c2b63232a 100644 --- a/webapp/packages/plugin-browser/src/locales/ru.ts +++ b/webapp/packages/plugin-browser/src/locales/ru.ts @@ -1,4 +1,11 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ export default [ - ['plugin_browser_update_dialog_title', 'Приложение обновляется...'], + ['plugin_browser_update_dialog_title', 'Производится обновление...'], ['plugin_browser_update_dialog_message', 'Новая версия CloudBeaver доступна. Хотите обновить?'], ]; diff --git a/webapp/packages/plugin-browser/src/locales/zh.ts b/webapp/packages/plugin-browser/src/locales/zh.ts index d6d1738de6..0c7ce89638 100644 --- a/webapp/packages/plugin-browser/src/locales/zh.ts +++ b/webapp/packages/plugin-browser/src/locales/zh.ts @@ -1 +1,11 @@ -export default []; +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +export default [ + ['plugin_browser_update_dialog_title', 'Update in progress...'], + ['plugin_browser_update_dialog_message', 'New version of CloudBeaver is available. Do you want to update?'], +]; diff --git a/webapp/packages/plugin-browser/src/manifest.ts b/webapp/packages/plugin-browser/src/manifest.ts index 31757e305f..81cfb2ab6a 100644 --- a/webapp/packages/plugin-browser/src/manifest.ts +++ b/webapp/packages/plugin-browser/src/manifest.ts @@ -7,10 +7,11 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBrowserBootstrap } from './PluginBrowserBootstrap'; - export const browserPlugin: PluginManifest = { info: { name: 'Browser plugin' }, - providers: [PluginBrowserBootstrap, LocaleService], + preload: [() => import('./PluginBrowserPreloadingBootstrap').then(m => m.PluginBrowserPreloadingBootstrap)], + providers: [ + () => import('./PluginBrowserBootstrap').then(m => m.PluginBrowserBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-connection-custom/src/manifest.ts b/webapp/packages/plugin-connection-custom/src/manifest.ts index e4a5095428..8c8ca61be0 100644 --- a/webapp/packages/plugin-connection-custom/src/manifest.ts +++ b/webapp/packages/plugin-connection-custom/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { CustomConnectionPluginBootstrap } from './CustomConnectionPluginBootstrap'; -import { CustomConnectionSettingsService } from './CustomConnectionSettingsService'; -import { LocaleService } from './LocaleService'; - export const customConnectionPluginManifest: PluginManifest = { info: { name: 'Custom connection plugin', }, - providers: [LocaleService, CustomConnectionPluginBootstrap, CustomConnectionSettingsService], + providers: [ + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./CustomConnectionPluginBootstrap').then(m => m.CustomConnectionPluginBootstrap), + () => import('./CustomConnectionSettingsService').then(m => m.CustomConnectionSettingsService), + ], }; diff --git a/webapp/packages/plugin-connection-search/src/manifest.ts b/webapp/packages/plugin-connection-search/src/manifest.ts index 481cb74b90..8384ead4e7 100644 --- a/webapp/packages/plugin-connection-search/src/manifest.ts +++ b/webapp/packages/plugin-connection-search/src/manifest.ts @@ -1,13 +1,20 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ConnectionSearchSettingsService } from './ConnectionSearchSettingsService'; -import { LocaleService } from './LocaleService'; -import { ConnectionSearchService } from './Search/ConnectionSearchService'; -import { SearchConnectionPluginBootstrap } from './SearchConnectionPluginBootstrap'; - export const connectionSearchPlugin: PluginManifest = { info: { name: 'Search connection plugin', }, - providers: [SearchConnectionPluginBootstrap, ConnectionSearchService, LocaleService, ConnectionSearchSettingsService], + providers: [ + () => import('./SearchConnectionPluginBootstrap').then(m => m.SearchConnectionPluginBootstrap), + () => import('./Search/ConnectionSearchService').then(m => m.ConnectionSearchService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./ConnectionSearchSettingsService').then(m => m.ConnectionSearchSettingsService), + ], }; diff --git a/webapp/packages/plugin-connection-template/src/manifest.ts b/webapp/packages/plugin-connection-template/src/manifest.ts index 289a7e622c..bb7f565c03 100644 --- a/webapp/packages/plugin-connection-template/src/manifest.ts +++ b/webapp/packages/plugin-connection-template/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { TemplateConnectionPluginBootstrap } from './TemplateConnectionPluginBootstrap'; -import { TemplateConnectionsResource } from './TemplateConnectionsResource'; -import { TemplateConnectionsService } from './TemplateConnectionsService'; - export const connectionTemplate: PluginManifest = { info: { name: 'Template Connections plugin', }, - providers: [TemplateConnectionsResource, LocaleService, TemplateConnectionPluginBootstrap, TemplateConnectionsService], + providers: [ + () => import('./TemplateConnectionsResource').then(m => m.TemplateConnectionsResource), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./TemplateConnectionPluginBootstrap').then(m => m.TemplateConnectionPluginBootstrap), + () => import('./TemplateConnectionsService').then(m => m.TemplateConnectionsService), + ], }; diff --git a/webapp/packages/plugin-connections-administration/src/Administration/Connections/CreateConnection/CreateConnection.tsx b/webapp/packages/plugin-connections-administration/src/Administration/Connections/CreateConnection/CreateConnection.tsx index 3d22e03630..a401fa397f 100644 --- a/webapp/packages/plugin-connections-administration/src/Administration/Connections/CreateConnection/CreateConnection.tsx +++ b/webapp/packages/plugin-connections-administration/src/Administration/Connections/CreateConnection/CreateConnection.tsx @@ -24,7 +24,7 @@ import { } from '@cloudbeaver/core-blocks'; import { DBDriverResource } from '@cloudbeaver/core-connections'; import { useService } from '@cloudbeaver/core-di'; -import { TabListStyles, TabPanelList, TabPanelStyles, TabsState, TabStyles, TabUnderlineStyleRegistry } from '@cloudbeaver/core-ui'; +import { TabListStyles, TabPanelList, TabPanelStyles, TabsState, TabStyles } from '@cloudbeaver/core-ui'; import { ConnectionFormLoader } from '@cloudbeaver/plugin-connections'; import { CreateConnectionService } from '../CreateConnectionService'; @@ -39,7 +39,6 @@ interface Props { } const tabsRegistry: StyleRegistry = [ - ...TabUnderlineStyleRegistry, [TabStyles, { mode: 'append', styles: [CreateConnectionTab] }], [TabPanelStyles, { mode: 'append', styles: [CreateConnectionTabPanel] }], [TabListStyles, { mode: 'append', styles: [CreateConnectionTabList] }], diff --git a/webapp/packages/plugin-connections-administration/src/manifest.ts b/webapp/packages/plugin-connections-administration/src/manifest.ts index 5c9ca95b0d..1258c1c3d4 100644 --- a/webapp/packages/plugin-connections-administration/src/manifest.ts +++ b/webapp/packages/plugin-connections-administration/src/manifest.ts @@ -7,26 +7,18 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ConnectionsAdministrationNavService } from './Administration/Connections/ConnectionsAdministrationNavService'; -import { ConnectionsAdministrationService } from './Administration/Connections/ConnectionsAdministrationService'; -import { CreateConnectionBaseBootstrap } from './Administration/Connections/CreateConnection/CreateConnectionBaseBootstrap'; -import { ConnectionManualService } from './Administration/Connections/CreateConnection/Manual/ConnectionManualService'; -import { CreateConnectionService } from './Administration/Connections/CreateConnectionService'; -import { ConnectionAccessTabService } from './ConnectionForm/ConnectionAccess/ConnectionAccessTabService'; -import { LocaleService } from './LocaleService'; - export const connectionPlugin: PluginManifest = { info: { name: 'Connections Administration plugin', }, providers: [ - LocaleService, - ConnectionsAdministrationService, - ConnectionsAdministrationNavService, - CreateConnectionService, - ConnectionManualService, - CreateConnectionBaseBootstrap, - ConnectionAccessTabService, + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./Administration/Connections/ConnectionsAdministrationService').then(m => m.ConnectionsAdministrationService), + () => import('./Administration/Connections/ConnectionsAdministrationNavService').then(m => m.ConnectionsAdministrationNavService), + () => import('./Administration/Connections/CreateConnectionService').then(m => m.CreateConnectionService), + () => import('./Administration/Connections/CreateConnection/Manual/ConnectionManualService').then(m => m.ConnectionManualService), + () => import('./Administration/Connections/CreateConnection/CreateConnectionBaseBootstrap').then(m => m.CreateConnectionBaseBootstrap), + () => import('./ConnectionForm/ConnectionAccess/ConnectionAccessTabService').then(m => m.ConnectionAccessTabService), ], }; diff --git a/webapp/packages/plugin-connections/src/ConnectionForm/ConnectionForm.tsx b/webapp/packages/plugin-connections/src/ConnectionForm/ConnectionForm.tsx index a7f768aaa1..dbe5d7d18a 100644 --- a/webapp/packages/plugin-connections/src/ConnectionForm/ConnectionForm.tsx +++ b/webapp/packages/plugin-connections/src/ConnectionForm/ConnectionForm.tsx @@ -8,23 +8,11 @@ import { observer } from 'mobx-react-lite'; import { useEffect } from 'react'; -import { - ExceptionMessage, - Form, - Loader, - Placeholder, - s, - SContext, - StatusMessage, - useExecutor, - useForm, - useObjectRef, - useS, -} from '@cloudbeaver/core-blocks'; +import { ExceptionMessage, Form, Loader, Placeholder, s, StatusMessage, useExecutor, useForm, useObjectRef, useS } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { ENotificationType } from '@cloudbeaver/core-events'; import type { ConnectionConfig } from '@cloudbeaver/core-sdk'; -import { TabBigUnderlineStyleRegistry, TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; +import { TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; import { ConnectionFormActionsContext, IConnectionFormActionsContext } from './ConnectFormActionsContext'; import style from './ConnectionForm.m.css'; @@ -99,9 +87,7 @@ export const ConnectionForm = observer(function ConnectionF
- - - +
diff --git a/webapp/packages/plugin-connections/src/manifest.ts b/webapp/packages/plugin-connections/src/manifest.ts index ccdfe2fe77..1dcc87c848 100644 --- a/webapp/packages/plugin-connections/src/manifest.ts +++ b/webapp/packages/plugin-connections/src/manifest.ts @@ -7,38 +7,24 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ConnectionAuthService } from './ConnectionAuthService'; -import { ConnectionFormService } from './ConnectionForm/ConnectionFormService'; -import { ConnectionDriverPropertiesTabService } from './ConnectionForm/DriverProperties/ConnectionDriverPropertiesTabService'; -import { ConnectionOptionsTabService } from './ConnectionForm/Options/ConnectionOptionsTabService'; -import { ConnectionOriginInfoTabService } from './ConnectionForm/OriginInfo/ConnectionOriginInfoTabService'; -import { ConnectionSSHTabService } from './ConnectionForm/SSH/ConnectionSSHTabService'; -import { ConnectionSSLTabService } from './ConnectionForm/SSL/ConnectionSSLTabService'; -import { ConnectionMenuBootstrap } from './ContextMenu/ConnectionMenuBootstrap'; -import { LocaleService } from './LocaleService'; -import { ConnectionFoldersBootstrap } from './NavNodes/ConnectionFoldersBootstrap'; -import { PluginBootstrap } from './PluginBootstrap'; -import { PluginConnectionsSettingsService } from './PluginConnectionsSettingsService'; -import { PublicConnectionFormService } from './PublicConnectionForm/PublicConnectionFormService'; - export const connectionPlugin: PluginManifest = { info: { name: 'Connections plugin', }, providers: [ - PluginBootstrap, - ConnectionMenuBootstrap, - PublicConnectionFormService, - LocaleService, - ConnectionAuthService, - ConnectionFormService, - ConnectionOptionsTabService, - ConnectionDriverPropertiesTabService, - ConnectionSSHTabService, - ConnectionOriginInfoTabService, - ConnectionFoldersBootstrap, - ConnectionSSLTabService, - PluginConnectionsSettingsService, + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./ContextMenu/ConnectionMenuBootstrap').then(m => m.ConnectionMenuBootstrap), + () => import('./PublicConnectionForm/PublicConnectionFormService').then(m => m.PublicConnectionFormService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./ConnectionAuthService').then(m => m.ConnectionAuthService), + () => import('./ConnectionForm/ConnectionFormService').then(m => m.ConnectionFormService), + () => import('./ConnectionForm/Options/ConnectionOptionsTabService').then(m => m.ConnectionOptionsTabService), + () => import('./ConnectionForm/DriverProperties/ConnectionDriverPropertiesTabService').then(m => m.ConnectionDriverPropertiesTabService), + () => import('./ConnectionForm/SSH/ConnectionSSHTabService').then(m => m.ConnectionSSHTabService), + () => import('./ConnectionForm/OriginInfo/ConnectionOriginInfoTabService').then(m => m.ConnectionOriginInfoTabService), + () => import('./NavNodes/ConnectionFoldersBootstrap').then(m => m.ConnectionFoldersBootstrap), + () => import('./ConnectionForm/SSL/ConnectionSSLTabService').then(m => m.ConnectionSSLTabService), + () => import('./PluginConnectionsSettingsService').then(m => m.PluginConnectionsSettingsService), ], }; diff --git a/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx b/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx index 43504f39e1..93f6512622 100644 --- a/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx +++ b/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx @@ -17,13 +17,12 @@ import { IProperty, PropertiesTable, s, - SContext, useErrorDetails, useS, useTranslate, } from '@cloudbeaver/core-blocks'; import type { DataTransferOutputSettings, DataTransferProcessorInfo } from '@cloudbeaver/core-sdk'; -import { ITabData, Tab, TabList, TabsState, TabTitle, TabUnderlineStyleRegistry } from '@cloudbeaver/core-ui'; +import { ITabData, Tab, TabList, TabsState, TabTitle } from '@cloudbeaver/core-ui'; import { OutputOptionsForm } from './OutputOptionsForm'; import style from './ProcessorConfigureDialog.m.css'; @@ -86,16 +85,14 @@ export const ProcessorConfigureDialog = observer(function ProcessorConfig {!processor.isBinary ? ( - - - - {translate('data_transfer_format_settings')} - - - {translate('data_transfer_output_settings')} - - - + + + {translate('data_transfer_format_settings')} + + + {translate('data_transfer_output_settings')} + + ) : null} {currentTabId === SETTINGS_TABS.EXTRACTION ? ( diff --git a/webapp/packages/plugin-data-export/src/manifest.ts b/webapp/packages/plugin-data-export/src/manifest.ts index 9d992a5f41..2c58f37f4f 100644 --- a/webapp/packages/plugin-data-export/src/manifest.ts +++ b/webapp/packages/plugin-data-export/src/manifest.ts @@ -7,28 +7,19 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { Bootstrap } from './Bootstrap'; -import { DataExportMenuService } from './DataExportMenuService'; -import { DataExportProcessService } from './DataExportProcessService'; -import { DataExportService } from './DataExportService'; -import { DataExportSettingsService } from './DataExportSettingsService'; -import { DataTransferProcessorsResource } from './DataTransferProcessorsResource'; -import { DefaultExportOutputSettingsResource } from './Dialog/DefaultExportOutputSettingsResource'; -import { LocaleService } from './LocaleService'; - export const dataExportManifest: PluginManifest = { info: { name: 'Data Export Plugin', }, providers: [ - Bootstrap, - DataExportMenuService, - DataExportSettingsService, - DataExportService, - DataExportProcessService, - DataTransferProcessorsResource, - LocaleService, - DefaultExportOutputSettingsResource, + () => import('./Bootstrap').then(m => m.Bootstrap), + () => import('./DataExportMenuService').then(m => m.DataExportMenuService), + () => import('./DataExportSettingsService').then(m => m.DataExportSettingsService), + () => import('./DataExportService').then(m => m.DataExportService), + () => import('./DataExportProcessService').then(m => m.DataExportProcessService), + () => import('./DataTransferProcessorsResource').then(m => m.DataTransferProcessorsResource), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./Dialog/DefaultExportOutputSettingsResource').then(m => m.DefaultExportOutputSettingsResource), ], }; diff --git a/webapp/packages/plugin-data-import/src/manifest.ts b/webapp/packages/plugin-data-import/src/manifest.ts index 72d8c6a278..c1ca6a5c29 100644 --- a/webapp/packages/plugin-data-import/src/manifest.ts +++ b/webapp/packages/plugin-data-import/src/manifest.ts @@ -7,16 +7,16 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DataImportBootstrap } from './DataImportBootstrap'; -import { DataImportProcessorsResource } from './DataImportProcessorsResource'; -import { DataImportService } from './DataImportService'; -import { DataImportSettingsService } from './DataImportSettingsService'; -import { LocaleService } from './LocaleService'; - export const dataImportPluginManifest: PluginManifest = { info: { name: 'Data Import Plugin', }, - providers: [LocaleService, DataImportSettingsService, DataImportBootstrap, DataImportService, DataImportProcessorsResource], + providers: [ + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./DataImportSettingsService').then(m => m.DataImportSettingsService), + () => import('./DataImportBootstrap').then(m => m.DataImportBootstrap), + () => import('./DataImportService').then(m => m.DataImportService), + () => import('./DataImportProcessorsResource').then(m => m.DataImportProcessorsResource), + ], }; diff --git a/webapp/packages/plugin-data-spreadsheet-new/src/manifest.ts b/webapp/packages/plugin-data-spreadsheet-new/src/manifest.ts index 7c04364241..a1d6a1e2d5 100644 --- a/webapp/packages/plugin-data-spreadsheet-new/src/manifest.ts +++ b/webapp/packages/plugin-data-spreadsheet-new/src/manifest.ts @@ -7,25 +7,19 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DataGridContextMenuCellEditingService } from './DataGrid/DataGridContextMenu/DataGridContextMenuCellEditingService'; -import { DataGridContextMenuFilterService } from './DataGrid/DataGridContextMenu/DataGridContextMenuFilter/DataGridContextMenuFilterService'; -import { DataGridContextMenuOrderService } from './DataGrid/DataGridContextMenu/DataGridContextMenuOrderService'; -import { DataGridContextMenuSaveContentService } from './DataGrid/DataGridContextMenu/DataGridContextMenuSaveContentService'; -import { DataGridContextMenuService } from './DataGrid/DataGridContextMenu/DataGridContextMenuService'; -import { DataGridSettingsService } from './DataGridSettingsService'; -import { LocaleService } from './LocaleService'; -import { SpreadsheetBootstrap } from './SpreadsheetBootstrap'; - export const dataSpreadsheetNewManifest: PluginManifest = { info: { name: 'New spreadsheet implementation' }, providers: [ - SpreadsheetBootstrap, - DataGridSettingsService, - LocaleService, - DataGridContextMenuService, - DataGridContextMenuOrderService, - DataGridContextMenuFilterService, - DataGridContextMenuCellEditingService, - DataGridContextMenuSaveContentService, + () => import('./SpreadsheetBootstrap').then(m => m.SpreadsheetBootstrap), + () => import('./DataGridSettingsService').then(m => m.DataGridSettingsService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./DataGrid/DataGridContextMenu/DataGridContextMenuService').then(m => m.DataGridContextMenuService), + () => import('./DataGrid/DataGridContextMenu/DataGridContextMenuOrderService').then(m => m.DataGridContextMenuOrderService), + () => + import('./DataGrid/DataGridContextMenu/DataGridContextMenuFilter/DataGridContextMenuFilterService').then( + m => m.DataGridContextMenuFilterService, + ), + () => import('./DataGrid/DataGridContextMenu/DataGridContextMenuCellEditingService').then(m => m.DataGridContextMenuCellEditingService), + () => import('./DataGrid/DataGridContextMenu/DataGridContextMenuSaveContentService').then(m => m.DataGridContextMenuSaveContentService), ], }; diff --git a/webapp/packages/plugin-data-viewer-result-set-grouping/src/manifest.ts b/webapp/packages/plugin-data-viewer-result-set-grouping/src/manifest.ts index 0c38f870e6..99caba3e54 100644 --- a/webapp/packages/plugin-data-viewer-result-set-grouping/src/manifest.ts +++ b/webapp/packages/plugin-data-viewer-result-set-grouping/src/manifest.ts @@ -7,10 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DVResultSetGroupingPluginBootstrap } from './DVResultSetGroupingPluginBootstrap'; -import { LocaleService } from './LocaleService'; - export const dvResultSetGroupingPlugin: PluginManifest = { info: { name: 'Result Set Grouping plugin' }, - providers: [DVResultSetGroupingPluginBootstrap, LocaleService], + providers: [ + () => import('./DVResultSetGroupingPluginBootstrap').then(m => m.DVResultSetGroupingPluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx index e465d3e747..44a1261333 100644 --- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx +++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx @@ -56,7 +56,7 @@ export const TableFooter = observer(function TableFooter({ resultIndex, m const constraint = model.getResult(resultIndex) ? model.source.getAction(resultIndex, ResultSetConstraintAction) : null; return ( - +
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.m.css b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.m.css index aeb1b70853..a48decf5e2 100644 --- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.m.css +++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.m.css @@ -8,6 +8,9 @@ .inlineEditor { composes: theme-background-surface theme-text-on-surface from global; +} + +.imbeddedEditor .inlineEditor { flex: 1; height: 24px; } diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx index f817dc26c7..1cfaf3cf25 100644 --- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx +++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx @@ -7,7 +7,7 @@ */ import { observer } from 'mobx-react-lite'; -import { PlaceholderComponent, useTranslate } from '@cloudbeaver/core-blocks'; +import { Container, PlaceholderComponent, useTranslate } from '@cloudbeaver/core-blocks'; import { InlineEditor } from '@cloudbeaver/core-ui'; import type { ITableHeaderPlaceholderProps } from './TableHeaderService'; @@ -19,18 +19,20 @@ export const TableWhereFilter: PlaceholderComponent + + + ); }); diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/TablePresentationBar.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/TablePresentationBar.tsx index ea00545d01..fb6a55144f 100644 --- a/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/TablePresentationBar.tsx +++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/TablePresentationBar.tsx @@ -10,7 +10,7 @@ import { observer } from 'mobx-react-lite'; import { s, SContext, StyleRegistry, useS } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import type { ResultDataFormat } from '@cloudbeaver/core-sdk'; -import { TabList, TabListStyles, TabListVerticalRotatedRegistry, TabsState, TabStyles } from '@cloudbeaver/core-ui'; +import { TabList, TabListStyles, TabsState, TabStyles } from '@cloudbeaver/core-ui'; import type { IDatabaseDataModel } from '../../DatabaseDataModel/IDatabaseDataModel'; import { DataPresentationService, DataPresentationType } from '../../DataPresentationService'; @@ -32,7 +32,6 @@ interface Props { } const tablePresentationBarRegistry: StyleRegistry = [ - ...TabListVerticalRotatedRegistry, [TabListStyles, { mode: 'append', styles: [TablePresentationBarTabList] }], [TabStyles, { mode: 'append', styles: [TablePresentationBarTab] }], ]; @@ -70,7 +69,7 @@ export const TablePresentationBar = observer(function TablePresentationBa
- + {presentations.map(presentation => ( ))} diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/shared/TablePresentationBar.m.css b/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/shared/TablePresentationBar.m.css index 740eb13d7a..a20e8a4ba4 100644 --- a/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/shared/TablePresentationBar.m.css +++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TablePresentationBar/shared/TablePresentationBar.m.css @@ -7,7 +7,7 @@ */ .tableLeftBar { - display: flex; + overflow: auto; } .tabListFlexible .tabOuter:only-child { diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/ValuePanel/ValuePanel.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/ValuePanel/ValuePanel.tsx index 5815512a8f..c298d2b058 100644 --- a/webapp/packages/plugin-data-viewer/src/TableViewer/ValuePanel/ValuePanel.tsx +++ b/webapp/packages/plugin-data-viewer/src/TableViewer/ValuePanel/ValuePanel.tsx @@ -10,7 +10,7 @@ import { observer } from 'mobx-react-lite'; import { s, SContext, type StyleRegistry, useS } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; -import { TabList, TabPanelList, TabPanelStyles, TabsState, TabStyles, TabUnderlineStyleRegistry } from '@cloudbeaver/core-ui'; +import { TabList, TabPanelList, TabPanelStyles, TabsState, TabStyles } from '@cloudbeaver/core-ui'; import { MetadataMap } from '@cloudbeaver/core-utils'; import { DatabaseDataResultAction } from '../../DatabaseDataModel/Actions/DatabaseDataResultAction'; @@ -24,10 +24,9 @@ import ValuePanelEditorTabPanel from './shared/ValuePanelEditorTabPanel.m.css'; import ValuePanelEditorTabs from './shared/ValuePanelEditorTabs.m.css'; import ValuePanelTab from './shared/ValuePanelTab.m.css'; -const tabListRegistry: StyleRegistry = [...TabUnderlineStyleRegistry, [TabStyles, { mode: 'append', styles: [ValuePanelTab] }]]; +const tabListRegistry: StyleRegistry = [[TabStyles, { mode: 'append', styles: [ValuePanelTab] }]]; const tabPanelListRegistry: StyleRegistry = [ - ...TabUnderlineStyleRegistry, [TabStyles, { mode: 'append', styles: [ValuePanelEditorTabs] }], [TabPanelStyles, { mode: 'append', styles: [ValuePanelEditorTabPanel] }], ]; @@ -80,7 +79,7 @@ export const ValuePanel: DataPresentationComponent = ob onChange={tab => state.setCurrentTabId(tab.tabId)} > - + diff --git a/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx b/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx index e78bb739e9..a6ae86cbff 100644 --- a/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx +++ b/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/TextValuePresentation.tsx @@ -8,10 +8,10 @@ import { observable } from 'mobx'; import { observer } from 'mobx-react-lite'; -import { ActionIconButton, Container, Fill, Group, Loader, s, SContext, StyleRegistry, useS, useTranslate } from '@cloudbeaver/core-blocks'; +import { ActionIconButton, Container, Group, Loader, s, SContext, StyleRegistry, useS, useTranslate } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { NotificationService } from '@cloudbeaver/core-events'; -import { TabContainerPanelComponent, TabList, TabsState, TabStyles, TabUnderlineStyleRegistry, useTabLocalState } from '@cloudbeaver/core-ui'; +import { TabContainerPanelComponent, TabList, TabsState, TabStyles, useTabLocalState } from '@cloudbeaver/core-ui'; import { ResultSetSelectAction } from '../../DatabaseDataModel/Actions/ResultSet/ResultSetSelectAction'; import { useResultSetActions } from '../../DatabaseDataModel/Actions/ResultSet/useResultSetActions'; @@ -25,14 +25,14 @@ import { TextValuePresentationService } from './TextValuePresentationService'; import { TextValueTruncatedMessage } from './TextValueTruncatedMessage'; import { useTextValue } from './useTextValue'; -const tabRegistry: StyleRegistry = [...TabUnderlineStyleRegistry, [TabStyles, { mode: 'append', styles: [TextValuePresentationTab] }]]; +const tabRegistry: StyleRegistry = [[TabStyles, { mode: 'append', styles: [TextValuePresentationTab] }]]; export const TextValuePresentation: TabContainerPanelComponent> = observer( function TextValuePresentation({ model, resultIndex, dataFormat }) { const translate = useTranslate(); const notificationService = useService(NotificationService); const textValuePresentationService = useService(TextValuePresentationService); - const style = useS(styles); + const style = useS(styles, TextValuePresentationTab); const selection = model.source.getAction(resultIndex, ResultSetSelectAction); const activeElements = selection.getActiveElements(); const firstSelectedCell = activeElements.length ? activeElements[0] : undefined; @@ -117,7 +117,7 @@ export const TextValuePresentation: TabContainerPanelComponent selectTabHandler(tab.tabId)} > - + diff --git a/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/shared/TextValuePresentationTab.m.css b/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/shared/TextValuePresentationTab.m.css index 378d4d71b5..e473724bad 100644 --- a/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/shared/TextValuePresentationTab.m.css +++ b/webapp/packages/plugin-data-viewer/src/ValuePanelPresentation/TextValue/shared/TextValuePresentationTab.m.css @@ -7,6 +7,9 @@ */ .tab { composes: theme-ripple theme-background-surface theme-text-text-primary-on-light from global; +} + +.textValuePresentationTab.underline .tab { border-bottom: 0; &:global([aria-selected='false']) { diff --git a/webapp/packages/plugin-data-viewer/src/manifest.ts b/webapp/packages/plugin-data-viewer/src/manifest.ts index edc6a19cd8..4421c69e9f 100644 --- a/webapp/packages/plugin-data-viewer/src/manifest.ts +++ b/webapp/packages/plugin-data-viewer/src/manifest.ts @@ -7,46 +7,28 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DataPresentationService } from './DataPresentationService'; -import { DataViewerBootstrap } from './DataViewerBootstrap'; -import { DataViewerDataChangeConfirmationService } from './DataViewerDataChangeConfirmationService'; -import { DataViewerService } from './DataViewerService'; -import { DataViewerSettingsService } from './DataViewerSettingsService'; -import { DataViewerTableService } from './DataViewerTableService'; -import { DataViewerTabService } from './DataViewerTabService'; -import { LocaleService } from './LocaleService'; -import { TableFooterMenuService } from './TableViewer/TableFooter/TableFooterMenu/TableFooterMenuService'; -import { TableHeaderService } from './TableViewer/TableHeader/TableHeaderService'; -import { TableViewerStorageService } from './TableViewer/TableViewerStorageService'; -import { DataValuePanelBootstrap } from './TableViewer/ValuePanel/DataValuePanelBootstrap'; -import { DataValuePanelService } from './TableViewer/ValuePanel/DataValuePanelService'; -import { BooleanValuePresentationBootstrap } from './ValuePanelPresentation/BooleanValue/BooleanValuePresentationBootstrap'; -import { ImageValuePresentationBootstrap } from './ValuePanelPresentation/ImageValue/ImageValuePresentationBootstrap'; -import { TextValuePresentationBootstrap } from './ValuePanelPresentation/TextValue/TextValuePresentationBootstrap'; -import { TextValuePresentationService } from './ValuePanelPresentation/TextValue/TextValuePresentationService'; - export const dataViewerManifest: PluginManifest = { info: { name: 'Data Viewer Plugin', }, providers: [ - DataViewerBootstrap, - DataViewerTabService, - DataViewerTableService, - DataPresentationService, - TableViewerStorageService, - TableFooterMenuService, - TableHeaderService, - LocaleService, - DataValuePanelService, - TextValuePresentationService, - DataViewerDataChangeConfirmationService, - TextValuePresentationBootstrap, - ImageValuePresentationBootstrap, - BooleanValuePresentationBootstrap, - DataValuePanelBootstrap, - DataViewerSettingsService, - DataViewerService, + () => import('./DataViewerBootstrap').then(m => m.DataViewerBootstrap), + () => import('./DataViewerTabService').then(m => m.DataViewerTabService), + () => import('./DataViewerTableService').then(m => m.DataViewerTableService), + () => import('./DataPresentationService').then(m => m.DataPresentationService), + () => import('./TableViewer/TableViewerStorageService').then(m => m.TableViewerStorageService), + () => import('./TableViewer/TableFooter/TableFooterMenu/TableFooterMenuService').then(m => m.TableFooterMenuService), + () => import('./TableViewer/TableHeader/TableHeaderService').then(m => m.TableHeaderService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./TableViewer/ValuePanel/DataValuePanelService').then(m => m.DataValuePanelService), + () => import('./ValuePanelPresentation/TextValue/TextValuePresentationService').then(m => m.TextValuePresentationService), + () => import('./DataViewerDataChangeConfirmationService').then(m => m.DataViewerDataChangeConfirmationService), + () => import('./ValuePanelPresentation/TextValue/TextValuePresentationBootstrap').then(m => m.TextValuePresentationBootstrap), + () => import('./ValuePanelPresentation/ImageValue/ImageValuePresentationBootstrap').then(m => m.ImageValuePresentationBootstrap), + () => import('./ValuePanelPresentation/BooleanValue/BooleanValuePresentationBootstrap').then(m => m.BooleanValuePresentationBootstrap), + () => import('./TableViewer/ValuePanel/DataValuePanelBootstrap').then(m => m.DataValuePanelBootstrap), + () => import('./DataViewerSettingsService').then(m => m.DataViewerSettingsService), + () => import('./DataViewerService').then(m => m.DataViewerService), ], }; diff --git a/webapp/packages/plugin-datasource-context-switch/src/manifest.ts b/webapp/packages/plugin-datasource-context-switch/src/manifest.ts index 297a5bb298..660e8af895 100644 --- a/webapp/packages/plugin-datasource-context-switch/src/manifest.ts +++ b/webapp/packages/plugin-datasource-context-switch/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { ConnectionSchemaManagerBootstrap } from './ConnectionSchemaManager/ConnectionSchemaManagerBootstrap'; -import { ConnectionSchemaManagerService } from './ConnectionSchemaManager/ConnectionSchemaManagerService'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const datasourceContextSwitchPluginManifest: PluginManifest = { info: { name: 'Datasource context switch plugin', }, - providers: [PluginBootstrap, ConnectionSchemaManagerService, ConnectionSchemaManagerBootstrap, LocaleService], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./ConnectionSchemaManager/ConnectionSchemaManagerService').then(m => m.ConnectionSchemaManagerService), + () => import('./ConnectionSchemaManager/ConnectionSchemaManagerBootstrap').then(m => m.ConnectionSchemaManagerBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-datasource-transaction-manager/src/manifest.ts b/webapp/packages/plugin-datasource-transaction-manager/src/manifest.ts index d078f4db84..3a0f225920 100644 --- a/webapp/packages/plugin-datasource-transaction-manager/src/manifest.ts +++ b/webapp/packages/plugin-datasource-transaction-manager/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { TransactionManagerBootstrap } from './TransactionManagerBootstrap'; -import { TransactionManagerSettingsService } from './TransactionManagerSettingsService'; - export const datasourceTransactionManagerPlugin: PluginManifest = { info: { name: 'Datasource transaction manager plugin', }, - providers: [TransactionManagerBootstrap, TransactionManagerSettingsService, LocaleService], + providers: [ + () => import('./TransactionManagerBootstrap').then(m => m.TransactionManagerBootstrap), + () => import('./TransactionManagerSettingsService').then(m => m.TransactionManagerSettingsService), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-ddl-viewer/src/manifest.ts b/webapp/packages/plugin-ddl-viewer/src/manifest.ts index 3bd916a258..be83beacdd 100644 --- a/webapp/packages/plugin-ddl-viewer/src/manifest.ts +++ b/webapp/packages/plugin-ddl-viewer/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DdlResource } from './DdlViewer/DdlResource'; -import { DDLViewerFooterService } from './DdlViewer/DDLViewerFooterService'; -import { DdlViewerBootstrap } from './DdlViewerBootstrap'; -import { ExtendedDDLResource } from './ExtendedDDLViewer/ExtendedDDLResource'; - export const manifest: PluginManifest = { info: { name: 'DDL Viewer Plugin', }, - providers: [DdlViewerBootstrap, DDLViewerFooterService, ExtendedDDLResource, DdlResource], + providers: [ + () => import('./DdlViewerBootstrap').then(m => m.DdlViewerBootstrap), + () => import('./DdlViewer/DDLViewerFooterService').then(m => m.DDLViewerFooterService), + () => import('./ExtendedDDLViewer/ExtendedDDLResource').then(m => m.ExtendedDDLResource), + () => import('./DdlViewer/DdlResource').then(m => m.DdlResource), + ], }; diff --git a/webapp/packages/plugin-devtools/src/PluginBootstrap.ts b/webapp/packages/plugin-devtools/src/PluginBootstrap.ts index 25b32164a2..ccb2983e38 100644 --- a/webapp/packages/plugin-devtools/src/PluginBootstrap.ts +++ b/webapp/packages/plugin-devtools/src/PluginBootstrap.ts @@ -85,7 +85,7 @@ export class PluginBootstrap extends Bootstrap { if (search) { return [ new SearchResourceMenuItem(), - ...this.getResources(this.app.getServices().filter(service => service.name.toLocaleLowerCase().includes(search.toLocaleLowerCase()))), + // ...this.getResources(this.app.services.filter(service => service.name.toLocaleLowerCase().includes(search.toLocaleLowerCase()))), ]; } @@ -152,7 +152,7 @@ export class PluginBootstrap extends Bootstrap { return items; } - return [...this.getResources(plugin.providers), ...items]; + return [/*...this.getResources(plugin.providers),*/ ...items]; }, }); diff --git a/webapp/packages/plugin-devtools/src/manifest.ts b/webapp/packages/plugin-devtools/src/manifest.ts index a4acc1022a..a185c4766f 100644 --- a/webapp/packages/plugin-devtools/src/manifest.ts +++ b/webapp/packages/plugin-devtools/src/manifest.ts @@ -7,12 +7,9 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DevToolsService } from './DevToolsService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const devToolsPlugin: PluginManifest = { info: { name: 'DevTools plugin', }, - providers: [PluginBootstrap, DevToolsService], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap), () => import('./DevToolsService').then(m => m.DevToolsService)], }; diff --git a/webapp/packages/plugin-gis-viewer/src/manifest.ts b/webapp/packages/plugin-gis-viewer/src/manifest.ts index 7346bbfbce..9ecdd388b2 100644 --- a/webapp/packages/plugin-gis-viewer/src/manifest.ts +++ b/webapp/packages/plugin-gis-viewer/src/manifest.ts @@ -1,11 +1,15 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { GISViewerBootstrap } from './GISViewerBootstrap'; -import { LocaleService } from './LocaleService'; - export const manifest: PluginManifest = { info: { name: 'GIS Viewer plugin', }, - providers: [GISViewerBootstrap, LocaleService], + providers: [() => import('./GISViewerBootstrap').then(m => m.GISViewerBootstrap), () => import('./LocaleService').then(m => m.LocaleService)], }; diff --git a/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.m.css b/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.m.css index 8115916480..0cded155ee 100644 --- a/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.m.css +++ b/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.m.css @@ -11,6 +11,3 @@ .container { composes: theme-typography--body2 from global; } -.groupTitle { - font-weight: bold; -} diff --git a/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.tsx b/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.tsx index f12bbbf762..5653079808 100644 --- a/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.tsx +++ b/webapp/packages/plugin-help/src/Shortcuts/ShortcutsDialog.tsx @@ -35,7 +35,7 @@ export const ShortcutsDialog: DialogComponent = function ShortcutsDialog({ - + Data Viewer @@ -45,7 +45,7 @@ export const ShortcutsDialog: DialogComponent = function ShortcutsDialog({ ))} - + SQL Editor @@ -55,7 +55,7 @@ export const ShortcutsDialog: DialogComponent = function ShortcutsDialog({ ))} - + Navigation Tree diff --git a/webapp/packages/plugin-help/src/manifest.ts b/webapp/packages/plugin-help/src/manifest.ts index 0fd95561f6..c05806ff01 100644 --- a/webapp/packages/plugin-help/src/manifest.ts +++ b/webapp/packages/plugin-help/src/manifest.ts @@ -7,13 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const manifest: PluginManifest = { info: { name: 'Help plugin', }, - providers: [PluginBootstrap, LocaleService], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap), () => import('./LocaleService').then(m => m.LocaleService)], }; diff --git a/webapp/packages/plugin-localization/src/manifest.ts b/webapp/packages/plugin-localization/src/manifest.ts index 1ce8b96111..fa6eeec745 100644 --- a/webapp/packages/plugin-localization/src/manifest.ts +++ b/webapp/packages/plugin-localization/src/manifest.ts @@ -7,9 +7,7 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; - export const localizationPlugin: PluginManifest = { info: { name: 'Localization plugin' }, - providers: [PluginBootstrap], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap)], }; diff --git a/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.m.css b/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.m.css index 24dd7a70dc..697218a078 100644 --- a/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.m.css +++ b/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.m.css @@ -40,6 +40,10 @@ overflow: auto; min-height: 40px; max-height: 96px; + + &:empty { + display: none; + } } .type, diff --git a/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.tsx b/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.tsx index 5f94e8f603..c6db042742 100644 --- a/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.tsx +++ b/webapp/packages/plugin-log-viewer/src/LogViewer/LogViewerInfoPanel.tsx @@ -32,13 +32,15 @@ export const LogViewerInfoPanel = observer(function LogViewerInfoPanel({ return ( - - - {translate('ui_copy_to_clipboard')} - - - {translate('ui_close')} - + + + + {translate('ui_copy_to_clipboard')} + + + {translate('ui_close')} + +

{typeInfo}

diff --git a/webapp/packages/plugin-log-viewer/src/manifest.ts b/webapp/packages/plugin-log-viewer/src/manifest.ts index eea90c59f1..2ae61c1086 100644 --- a/webapp/packages/plugin-log-viewer/src/manifest.ts +++ b/webapp/packages/plugin-log-viewer/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { LogViewerBootstrap } from './LogViewer/LogViewerBootstrap'; -import { LogViewerService } from './LogViewer/LogViewerService'; -import { LogViewerSettingsService } from './LogViewer/LogViewerSettingsService'; -import { SessionLogsEventHandler } from './SessionLogsEventHandler'; -import { SessionLogsResource } from './SessionLogsResource'; - export const logViewerPlugin: PluginManifest = { info: { name: 'Log viewer plugin' }, - providers: [LogViewerBootstrap, LogViewerService, LocaleService, LogViewerSettingsService, SessionLogsResource, SessionLogsEventHandler], + providers: [ + () => import('./LogViewer/LogViewerBootstrap').then(m => m.LogViewerBootstrap), + () => import('./LogViewer/LogViewerService').then(m => m.LogViewerService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./LogViewer/LogViewerSettingsService').then(m => m.LogViewerSettingsService), + () => import('./SessionLogsResource').then(m => m.SessionLogsResource), + () => import('./SessionLogsEventHandler').then(m => m.SessionLogsEventHandler), + ], }; diff --git a/webapp/packages/plugin-navigation-tabs/src/manifest.ts b/webapp/packages/plugin-navigation-tabs/src/manifest.ts index c0674797de..758c609db7 100644 --- a/webapp/packages/plugin-navigation-tabs/src/manifest.ts +++ b/webapp/packages/plugin-navigation-tabs/src/manifest.ts @@ -7,10 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { NavigationTabsService } from './NavigationTabs/NavigationTabsService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const navigationTabsPlugin: PluginManifest = { info: { name: 'Navigation tabs plugin' }, - providers: [PluginBootstrap, NavigationTabsService], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./NavigationTabs/NavigationTabsService').then(m => m.NavigationTabsService), + ], }; diff --git a/webapp/packages/plugin-navigation-tree-filters/src/manifest.ts b/webapp/packages/plugin-navigation-tree-filters/src/manifest.ts index d8156c341a..7ffe3332ec 100644 --- a/webapp/packages/plugin-navigation-tree-filters/src/manifest.ts +++ b/webapp/packages/plugin-navigation-tree-filters/src/manifest.ts @@ -7,13 +7,13 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { NavigationTreeFiltersBootstrap } from './NavigationTreeFiltersBootstrap'; - export const navigationTreeFiltersPlugin: PluginManifest = { info: { name: 'Navigation tree filters plugin', }, - providers: [LocaleService, NavigationTreeFiltersBootstrap], + providers: [ + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./NavigationTreeFiltersBootstrap').then(m => m.NavigationTreeFiltersBootstrap), + ], }; diff --git a/webapp/packages/plugin-navigation-tree-rm/src/manifest.ts b/webapp/packages/plugin-navigation-tree-rm/src/manifest.ts index 6a789d88e0..5e2d1e229d 100644 --- a/webapp/packages/plugin-navigation-tree-rm/src/manifest.ts +++ b/webapp/packages/plugin-navigation-tree-rm/src/manifest.ts @@ -7,12 +7,12 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { ResourceFoldersBootstrap } from './NavNodes/ResourceFoldersBootstrap'; -import { NavResourceNodeService } from './NavResourceNodeService'; -import { NavTreeRMContextMenuService } from './NavTreeRMContextMenuService'; - export const navigationTreeRMPlugin: PluginManifest = { info: { name: 'Navigation Tree RM plugin' }, - providers: [LocaleService, NavResourceNodeService, ResourceFoldersBootstrap, NavTreeRMContextMenuService], + providers: [ + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./NavResourceNodeService').then(m => m.NavResourceNodeService), + () => import('./NavNodes/ResourceFoldersBootstrap').then(m => m.ResourceFoldersBootstrap), + () => import('./NavTreeRMContextMenuService').then(m => m.NavTreeRMContextMenuService), + ], }; diff --git a/webapp/packages/plugin-navigation-tree/src/manifest.ts b/webapp/packages/plugin-navigation-tree/src/manifest.ts index 8ad1f11f80..2d1a656346 100644 --- a/webapp/packages/plugin-navigation-tree/src/manifest.ts +++ b/webapp/packages/plugin-navigation-tree/src/manifest.ts @@ -7,27 +7,20 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { ElementsTreeService } from './NavigationTree/ElementsTree/ElementsTreeService'; -import { ElementsTreeToolsMenuService } from './NavigationTree/ElementsTree/ElementsTreeTools/ElementsTreeToolsMenuService'; -import { ElementsTreeSettingsService } from './NavigationTree/ElementsTree/ElementsTreeTools/NavigationTreeSettings/ElementsTreeSettingsService'; -import { NavigationTreeBootstrap } from './NavigationTree/NavigationTreeBootstrap'; -import { NavigationTreeService } from './NavigationTree/NavigationTreeService'; -import { NavigationTreeSettingsService } from './NavigationTreeSettingsService'; -import { NavNodeContextMenuService } from './NodesManager/NavNodeContextMenuService'; -import { NavNodeViewService } from './NodesManager/NavNodeView/NavNodeViewService'; - export const navigationTreePlugin: PluginManifest = { info: { name: 'Navigation Tree plugin' }, providers: [ - LocaleService, - NavigationTreeService, - ElementsTreeToolsMenuService, - NavigationTreeBootstrap, - NavNodeContextMenuService, - NavNodeViewService, - ElementsTreeSettingsService, - NavigationTreeSettingsService, - ElementsTreeService, + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./NavigationTree/NavigationTreeService').then(m => m.NavigationTreeService), + () => import('./NavigationTree/ElementsTree/ElementsTreeTools/ElementsTreeToolsMenuService').then(m => m.ElementsTreeToolsMenuService), + () => import('./NavigationTree/NavigationTreeBootstrap').then(m => m.NavigationTreeBootstrap), + () => import('./NodesManager/NavNodeContextMenuService').then(m => m.NavNodeContextMenuService), + () => import('./NodesManager/NavNodeView/NavNodeViewService').then(m => m.NavNodeViewService), + () => + import('./NavigationTree/ElementsTree/ElementsTreeTools/NavigationTreeSettings/ElementsTreeSettingsService').then( + m => m.ElementsTreeSettingsService, + ), + () => import('./NavigationTreeSettingsService').then(m => m.NavigationTreeSettingsService), + () => import('./NavigationTree/ElementsTree/ElementsTreeService').then(m => m.ElementsTreeService), ], }; diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx index c267c5fc24..18dacdf2f4 100644 --- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx +++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx @@ -15,7 +15,6 @@ import { ITabData, TabList, TabListStyles, - TabListVerticalRegistry, TabPanel, TabPanelStyles, TabsState, @@ -42,7 +41,6 @@ interface IProps { } const objectFoldersRegistry: StyleRegistry = [ - ...TabListVerticalRegistry, [ NavNodeTabStyle, { @@ -117,7 +115,7 @@ export const ObjectFolders = observer(function ObjectFolders({ tab }) { return folders.length > 0 ? ( - + {folders.map(folderId => ( ))} diff --git a/webapp/packages/plugin-object-viewer/src/manifest.ts b/webapp/packages/plugin-object-viewer/src/manifest.ts index db2fc1a3d6..63d902dd87 100644 --- a/webapp/packages/plugin-object-viewer/src/manifest.ts +++ b/webapp/packages/plugin-object-viewer/src/manifest.ts @@ -7,26 +7,17 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { DBObjectPageService } from './ObjectPage/DBObjectPageService'; -import { NavNodeMetadataViewBootstrap } from './ObjectPropertiesPage/NavNodeView/NavNodeMetadata/NavNodeMetadataViewBootstrap'; -import { VirtualFolderViewBootstrap } from './ObjectPropertiesPage/NavNodeView/VirtualFolder/VirtualFolderViewBootstrap'; -import { ObjectPropertiesPageService } from './ObjectPropertiesPage/ObjectPropertiesPageService'; -import { ObjectPropertyTableFooterService } from './ObjectPropertiesPage/ObjectPropertyTable/ObjectPropertyTableFooterService'; -import { ObjectViewerBootstrap } from './ObjectViewerBootstrap'; -import { ObjectViewerTabService } from './ObjectViewerTabService'; - export const objectViewerManifest: PluginManifest = { info: { name: 'Object Viewer Plugin' }, providers: [ - ObjectViewerBootstrap, - NavNodeMetadataViewBootstrap, - VirtualFolderViewBootstrap, - ObjectPropertiesPageService, - ObjectViewerTabService, - DBObjectPageService, - LocaleService, - ObjectPropertyTableFooterService, + () => import('./ObjectViewerBootstrap').then(m => m.ObjectViewerBootstrap), + () => import('./ObjectPropertiesPage/NavNodeView/NavNodeMetadata/NavNodeMetadataViewBootstrap').then(m => m.NavNodeMetadataViewBootstrap), + () => import('./ObjectPropertiesPage/NavNodeView/VirtualFolder/VirtualFolderViewBootstrap').then(m => m.VirtualFolderViewBootstrap), + () => import('./ObjectPropertiesPage/ObjectPropertiesPageService').then(m => m.ObjectPropertiesPageService), + () => import('./ObjectViewerTabService').then(m => m.ObjectViewerTabService), + () => import('./ObjectPage/DBObjectPageService').then(m => m.DBObjectPageService), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./ObjectPropertiesPage/ObjectPropertyTable/ObjectPropertyTableFooterService').then(m => m.ObjectPropertyTableFooterService), ], }; diff --git a/webapp/packages/plugin-product/src/manifest.ts b/webapp/packages/plugin-product/src/manifest.ts index 42015d2c7d..98ed0acf1d 100644 --- a/webapp/packages/plugin-product/src/manifest.ts +++ b/webapp/packages/plugin-product/src/manifest.ts @@ -7,10 +7,7 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { ProductBootstrap } from './ProductBootstrap'; - export const productPlugin: PluginManifest = { info: { name: 'Product plugin' }, - providers: [ProductBootstrap, LocaleService], + providers: [() => import('./ProductBootstrap').then(m => m.ProductBootstrap), () => import('./LocaleService').then(m => m.LocaleService)], }; diff --git a/webapp/packages/plugin-projects/src/manifest.ts b/webapp/packages/plugin-projects/src/manifest.ts index 690af14ee2..594fc0cdcf 100644 --- a/webapp/packages/plugin-projects/src/manifest.ts +++ b/webapp/packages/plugin-projects/src/manifest.ts @@ -7,13 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const manifest: PluginManifest = { info: { name: 'Projects plugin', }, - providers: [PluginBootstrap, LocaleService], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap), () => import('./LocaleService').then(m => m.LocaleService)], }; diff --git a/webapp/packages/plugin-resource-manager-administration/src/manifest.ts b/webapp/packages/plugin-resource-manager-administration/src/manifest.ts index c17d94af58..7b6c9a33a0 100644 --- a/webapp/packages/plugin-resource-manager-administration/src/manifest.ts +++ b/webapp/packages/plugin-resource-manager-administration/src/manifest.ts @@ -7,10 +7,7 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const resourceManagerAdministrationPlugin: PluginManifest = { info: { name: 'Resource manager administration plugin' }, - providers: [PluginBootstrap, LocaleService], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap), () => import('./LocaleService').then(m => m.LocaleService)], }; diff --git a/webapp/packages/plugin-resource-manager-scripts/src/manifest.ts b/webapp/packages/plugin-resource-manager-scripts/src/manifest.ts index 1698f5ab17..8ca4df9515 100644 --- a/webapp/packages/plugin-resource-manager-scripts/src/manifest.ts +++ b/webapp/packages/plugin-resource-manager-scripts/src/manifest.ts @@ -7,12 +7,12 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { ResourceManagerScriptsService } from './ResourceManagerScriptsService'; -import { ResourceManagerScriptsSettingsService } from './ResourceManagerScriptsSettingsService'; - export const resourceManagerScriptsPlugin: PluginManifest = { info: { name: 'Resource manager scripts plugin' }, - providers: [PluginBootstrap, LocaleService, ResourceManagerScriptsService, ResourceManagerScriptsSettingsService], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./ResourceManagerScriptsService').then(m => m.ResourceManagerScriptsService), + () => import('./ResourceManagerScriptsSettingsService').then(m => m.ResourceManagerScriptsSettingsService), + ], }; diff --git a/webapp/packages/plugin-resource-manager/src/manifest.ts b/webapp/packages/plugin-resource-manager/src/manifest.ts index 2fd4e7b385..30f9f26b07 100644 --- a/webapp/packages/plugin-resource-manager/src/manifest.ts +++ b/webapp/packages/plugin-resource-manager/src/manifest.ts @@ -7,20 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { ResourceManagerService } from './ResourceManagerService'; -import { ResourceManagerSettingsService } from './ResourceManagerSettingsService'; - -// import { ResourceProjectsResource } from './ResourceProjectsResource'; - +// export const resourceManagerPlugin: PluginManifest = { info: { name: 'Resource manager plugin' }, providers: [ - ResourceManagerSettingsService, - PluginBootstrap, - LocaleService, - ResourceManagerService, - // ResourceProjectsResource, + () => import('./ResourceManagerSettingsService').then(m => m.ResourceManagerSettingsService), + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./ResourceManagerService').then(m => m.ResourceManagerService), + // () => import('./ResourceProjectsResource').then(m => m.ResourceProjectsResource), ], }; diff --git a/webapp/packages/plugin-root/src/manifest.ts b/webapp/packages/plugin-root/src/manifest.ts index 589c4152b1..28ed5bfbd5 100644 --- a/webapp/packages/plugin-root/src/manifest.ts +++ b/webapp/packages/plugin-root/src/manifest.ts @@ -7,13 +7,13 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { DataSynchronizationResolverBootstrap } from './DataSynchronization/DataSynchronizationResolverBootstrap'; -import { LocaleService } from './LocaleService'; -import { NetworkStateNotificationService } from './NetworkStateNotification/NetworkStateNotificationService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { ServerNodeChangedDialogService } from './ServerNodeChangedDialog/ServerNodeChangedDialogService'; - export const rootPlugin: PluginManifest = { info: { name: 'Root plugin' }, - providers: [LocaleService, PluginBootstrap, ServerNodeChangedDialogService, NetworkStateNotificationService, DataSynchronizationResolverBootstrap], + providers: [ + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./ServerNodeChangedDialog/ServerNodeChangedDialogService').then(m => m.ServerNodeChangedDialogService), + () => import('./NetworkStateNotification/NetworkStateNotificationService').then(m => m.NetworkStateNotificationService), + () => import('./DataSynchronization/DataSynchronizationResolverBootstrap').then(m => m.DataSynchronizationResolverBootstrap), + ], }; diff --git a/webapp/packages/plugin-session-expiration/src/manifest.ts b/webapp/packages/plugin-session-expiration/src/manifest.ts index e625ebfafd..ef3b4a1d63 100644 --- a/webapp/packages/plugin-session-expiration/src/manifest.ts +++ b/webapp/packages/plugin-session-expiration/src/manifest.ts @@ -7,12 +7,12 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { SessionExpiredDialogBootstrap } from './SessionExpireDialog/SessionExpiredDialogBootstrap'; -import { SessionExpireWarningDialogBootstrap } from './SessionExpireWarningDialog/SessionExpireWarningDialogBootstrap'; - export const sessionExpirationPlugin: PluginManifest = { info: { name: 'Session Expiration plugin' }, - providers: [PluginBootstrap, SessionExpiredDialogBootstrap, SessionExpireWarningDialogBootstrap, LocaleService], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./SessionExpireDialog/SessionExpiredDialogBootstrap').then(m => m.SessionExpiredDialogBootstrap), + () => import('./SessionExpireWarningDialog/SessionExpireWarningDialogBootstrap').then(m => m.SessionExpireWarningDialogBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-settings-administration/src/manifest.ts b/webapp/packages/plugin-settings-administration/src/manifest.ts index 1c4a5f7965..f5a0129988 100644 --- a/webapp/packages/plugin-settings-administration/src/manifest.ts +++ b/webapp/packages/plugin-settings-administration/src/manifest.ts @@ -7,10 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { SettingsAdministrationPluginBootstrap } from './SettingsAdministrationPluginBootstrap'; - export const settingsAdministrationPlugin: PluginManifest = { info: { name: 'Settings Administration plugin' }, - providers: [SettingsAdministrationPluginBootstrap, LocaleService], + providers: [ + () => import('./SettingsAdministrationPluginBootstrap').then(m => m.SettingsAdministrationPluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-settings-menu-administration/src/manifest.ts b/webapp/packages/plugin-settings-menu-administration/src/manifest.ts index 6fc4e5fcc5..e47dd1d327 100644 --- a/webapp/packages/plugin-settings-menu-administration/src/manifest.ts +++ b/webapp/packages/plugin-settings-menu-administration/src/manifest.ts @@ -7,9 +7,7 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; - export const settingsMenuAdministrationPlugin: PluginManifest = { info: { name: 'Settings menu administration plugin' }, - providers: [PluginBootstrap], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap)], }; diff --git a/webapp/packages/plugin-settings-menu/src/manifest.ts b/webapp/packages/plugin-settings-menu/src/manifest.ts index ef7b99e9af..abfc5e425b 100644 --- a/webapp/packages/plugin-settings-menu/src/manifest.ts +++ b/webapp/packages/plugin-settings-menu/src/manifest.ts @@ -7,9 +7,7 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; - export const settingsMenuPlugin: PluginManifest = { info: { name: 'Settings menu plugin' }, - providers: [PluginBootstrap], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap)], }; diff --git a/webapp/packages/plugin-settings-panel/src/manifest.ts b/webapp/packages/plugin-settings-panel/src/manifest.ts index 3101dd4be3..c73ba24508 100644 --- a/webapp/packages/plugin-settings-panel/src/manifest.ts +++ b/webapp/packages/plugin-settings-panel/src/manifest.ts @@ -7,10 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { SettingsPanelPluginBootstrap } from './SettingsPanelPluginBootstrap'; - export const settingsPanelPlugin: PluginManifest = { info: { name: 'Settings panel plugin' }, - providers: [SettingsPanelPluginBootstrap, LocaleService], + providers: [ + () => import('./SettingsPanelPluginBootstrap').then(m => m.SettingsPanelPluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-sql-editor-navigation-tab-script/src/manifest.ts b/webapp/packages/plugin-sql-editor-navigation-tab-script/src/manifest.ts index e2cc3c4b83..c948d8307b 100644 --- a/webapp/packages/plugin-sql-editor-navigation-tab-script/src/manifest.ts +++ b/webapp/packages/plugin-sql-editor-navigation-tab-script/src/manifest.ts @@ -7,12 +7,12 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { ResourceSqlDataSourceBootstrap } from './ResourceSqlDataSourceBootstrap'; -import { SqlEditorTabResourceService } from './SqlEditorTabResourceService'; - export const manifest: PluginManifest = { info: { name: 'Sql Editor Script plugin' }, - providers: [PluginBootstrap, LocaleService, SqlEditorTabResourceService, ResourceSqlDataSourceBootstrap], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./SqlEditorTabResourceService').then(m => m.SqlEditorTabResourceService), + () => import('./ResourceSqlDataSourceBootstrap').then(m => m.ResourceSqlDataSourceBootstrap), + ], }; diff --git a/webapp/packages/plugin-sql-editor-navigation-tab/src/manifest.ts b/webapp/packages/plugin-sql-editor-navigation-tab/src/manifest.ts index d4eeca941b..c41b6b32c1 100644 --- a/webapp/packages/plugin-sql-editor-navigation-tab/src/manifest.ts +++ b/webapp/packages/plugin-sql-editor-navigation-tab/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { SqlEditorBootstrap } from './SqlEditorBootstrap'; -import { SqlEditorNavigatorService } from './SqlEditorNavigatorService'; -import { SqlEditorTabService } from './SqlEditorTabService'; - export const sqlEditorTabPluginManifest: PluginManifest = { info: { name: 'Sql Editor Navigation Tab Plugin', }, - providers: [SqlEditorBootstrap, SqlEditorTabService, SqlEditorNavigatorService, LocaleService], + providers: [ + () => import('./SqlEditorBootstrap').then(m => m.SqlEditorBootstrap), + () => import('./SqlEditorTabService').then(m => m.SqlEditorTabService), + () => import('./SqlEditorNavigatorService').then(m => m.SqlEditorNavigatorService), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-sql-editor-new/src/manifest.ts b/webapp/packages/plugin-sql-editor-new/src/manifest.ts index 72e00dc38b..ec6340211c 100644 --- a/webapp/packages/plugin-sql-editor-new/src/manifest.ts +++ b/webapp/packages/plugin-sql-editor-new/src/manifest.ts @@ -7,14 +7,14 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { SQLCodeEditorPanelService } from './SQLEditor/SQLCodeEditorPanel/SQLCodeEditorPanelService'; - export const sqlEditorNewPlugin: PluginManifest = { info: { name: 'Sql Editor New Plugin', }, - providers: [PluginBootstrap, SQLCodeEditorPanelService, LocaleService], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./SQLEditor/SQLCodeEditorPanel/SQLCodeEditorPanelService').then(m => m.SQLCodeEditorPanelService), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-sql-editor-screen/src/manifest.ts b/webapp/packages/plugin-sql-editor-screen/src/manifest.ts index 67a0287be2..e8693522bf 100644 --- a/webapp/packages/plugin-sql-editor-screen/src/manifest.ts +++ b/webapp/packages/plugin-sql-editor-screen/src/manifest.ts @@ -7,15 +7,15 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { SqlEditorScreenBootstrap } from './Screen/SqlEditorScreenBootstrap'; -import { SqlEditorScreenService } from './Screen/SqlEditorScreenService'; - export const sqlEditorPagePluginManifest: PluginManifest = { info: { name: 'Sql Editor Page plugin', }, - providers: [PluginBootstrap, LocaleService, SqlEditorScreenBootstrap, SqlEditorScreenService], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./Screen/SqlEditorScreenBootstrap').then(m => m.SqlEditorScreenBootstrap), + () => import('./Screen/SqlEditorScreenService').then(m => m.SqlEditorScreenService), + ], }; diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx b/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx index dc558ebabc..b40dbd78fe 100644 --- a/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx +++ b/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx @@ -10,7 +10,7 @@ import { useEffect, useMemo, useState } from 'react'; import { getComputed, s, SContext, StyleRegistry, useS, useSplit } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; -import { ITabData, TabList, TabListStyles, TabListVerticalRotatedRegistry, TabPanelList, TabsState, TabStyles } from '@cloudbeaver/core-ui'; +import { ITabData, TabList, TabListStyles, TabPanelList, TabsState, TabStyles } from '@cloudbeaver/core-ui'; import { MetadataMap } from '@cloudbeaver/core-utils'; import { useCaptureViewContext } from '@cloudbeaver/core-view'; @@ -24,14 +24,13 @@ import { SQLEditorActions } from './SQLEditorActions'; import { useSqlEditor } from './useSqlEditor'; const sqlEditorRegistry: StyleRegistry = [ - ...TabListVerticalRotatedRegistry, [TabListStyles, { mode: 'append', styles: [SqlEditorTabList] }], [TabStyles, { mode: 'append', styles: [SqlEditorTab] }], ]; export const SqlEditor = observer(function SqlEditor({ state, className }) { const split = useSplit(); - const style = useS(styles); + const style = useS(styles, SqlEditorTab); const sqlEditorModeService = useService(SqlEditorModeService); const data = useSqlEditor(state); const [modesState] = useState(() => new MetadataMap()); @@ -75,7 +74,7 @@ export const SqlEditor = observer(function SqlEditor({ state, c {displayedEditors > 1 ? (
- +
) : null}
diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditor/shared/SqlEditorTab.m.css b/webapp/packages/plugin-sql-editor/src/SqlEditor/shared/SqlEditorTab.m.css index b9475c5b41..eb9675cace 100644 --- a/webapp/packages/plugin-sql-editor/src/SqlEditor/shared/SqlEditorTab.m.css +++ b/webapp/packages/plugin-sql-editor/src/SqlEditor/shared/SqlEditorTab.m.css @@ -5,9 +5,10 @@ * Licensed under the Apache License, Version 2.0. * you may not use this file except in compliance with the License. */ - .tab { composes: theme-ripple theme-background-background theme-text-text-primary-on-light theme-typography--body2 from global; +} +.sqlEditor .tab { text-transform: uppercase; font-weight: normal; diff --git a/webapp/packages/plugin-sql-editor/src/manifest.ts b/webapp/packages/plugin-sql-editor/src/manifest.ts index 2e08e5e942..7ef0be0d88 100644 --- a/webapp/packages/plugin-sql-editor/src/manifest.ts +++ b/webapp/packages/plugin-sql-editor/src/manifest.ts @@ -7,48 +7,29 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { MenuBootstrap } from './MenuBootstrap'; -import { LocalStorageSqlDataSourceBootstrap } from './SqlDataSource/LocalStorage/LocalStorageSqlDataSourceBootstrap'; -import { SqlDataSourceService } from './SqlDataSource/SqlDataSourceService'; -import { SqlDialectInfoService } from './SqlDialectInfoService'; -import { SqlEditorGroupTabsBootstrap } from './SqlEditorGroupTabsBootstrap'; -import { SqlEditorModeService } from './SqlEditorModeService'; -import { SqlEditorService } from './SqlEditorService'; -import { SqlEditorSettingsService } from './SqlEditorSettingsService'; -import { SqlEditorView } from './SqlEditorView'; -import { SqlExecutionPlanService } from './SqlResultTabs/ExecutionPlan/SqlExecutionPlanService'; -import { OutputLogsEventHandler } from './SqlResultTabs/OutputLogs/OutputLogsEventHandler'; -import { OutputLogsResource } from './SqlResultTabs/OutputLogs/OutputLogsResource'; -import { OutputLogsService } from './SqlResultTabs/OutputLogs/OutputLogsService'; -import { OutputMenuBootstrap } from './SqlResultTabs/OutputLogs/OutputMenuBootstrap'; -import { SqlQueryResultService } from './SqlResultTabs/SqlQueryResultService'; -import { SqlQueryService } from './SqlResultTabs/SqlQueryService'; -import { SqlResultTabsService } from './SqlResultTabs/SqlResultTabsService'; - export const sqlEditorPluginManifest: PluginManifest = { info: { name: 'Sql Editor Plugin', }, providers: [ - LocaleService, - SqlEditorService, - SqlDialectInfoService, - SqlQueryResultService, - SqlQueryService, - SqlExecutionPlanService, - SqlResultTabsService, - SqlEditorSettingsService, - SqlEditorModeService, - SqlEditorView, - MenuBootstrap, - SqlDataSourceService, - LocalStorageSqlDataSourceBootstrap, - OutputLogsEventHandler, - OutputLogsResource, - OutputLogsService, - OutputMenuBootstrap, - SqlEditorGroupTabsBootstrap, + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./SqlEditorService').then(m => m.SqlEditorService), + () => import('./SqlDialectInfoService').then(m => m.SqlDialectInfoService), + () => import('./SqlResultTabs/SqlQueryResultService').then(m => m.SqlQueryResultService), + () => import('./SqlResultTabs/SqlQueryService').then(m => m.SqlQueryService), + () => import('./SqlResultTabs/ExecutionPlan/SqlExecutionPlanService').then(m => m.SqlExecutionPlanService), + () => import('./SqlResultTabs/SqlResultTabsService').then(m => m.SqlResultTabsService), + () => import('./SqlEditorSettingsService').then(m => m.SqlEditorSettingsService), + () => import('./SqlEditorModeService').then(m => m.SqlEditorModeService), + () => import('./SqlEditorView').then(m => m.SqlEditorView), + () => import('./MenuBootstrap').then(m => m.MenuBootstrap), + () => import('./SqlDataSource/SqlDataSourceService').then(m => m.SqlDataSourceService), + () => import('./SqlDataSource/LocalStorage/LocalStorageSqlDataSourceBootstrap').then(m => m.LocalStorageSqlDataSourceBootstrap), + () => import('./SqlResultTabs/OutputLogs/OutputLogsEventHandler').then(m => m.OutputLogsEventHandler), + () => import('./SqlResultTabs/OutputLogs/OutputLogsResource').then(m => m.OutputLogsResource), + () => import('./SqlResultTabs/OutputLogs/OutputLogsService').then(m => m.OutputLogsService), + () => import('./SqlResultTabs/OutputLogs/OutputMenuBootstrap').then(m => m.OutputMenuBootstrap), + () => import('./SqlEditorGroupTabsBootstrap').then(m => m.SqlEditorGroupTabsBootstrap), ], }; diff --git a/webapp/packages/plugin-sql-generator/src/manifest.ts b/webapp/packages/plugin-sql-generator/src/manifest.ts index d7e7fdb0c4..f498066091 100644 --- a/webapp/packages/plugin-sql-generator/src/manifest.ts +++ b/webapp/packages/plugin-sql-generator/src/manifest.ts @@ -7,16 +7,16 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { GeneratorMenuBootstrap } from './GeneratorMenuBootstrap'; -import { LocaleService } from './LocaleService'; -import { ScriptPreviewService } from './ScriptPreview/ScriptPreviewService'; -import { SqlGeneratorsBootstrap } from './SqlGenerators/SqlGeneratorsBootstrap'; -import { SqlGeneratorsResource } from './SqlGenerators/SqlGeneratorsResource'; - export const sqlGeneratorPlugin: PluginManifest = { info: { name: 'Sql Editor Generator plugin', }, - providers: [LocaleService, SqlGeneratorsBootstrap, SqlGeneratorsResource, ScriptPreviewService, GeneratorMenuBootstrap], + providers: [ + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./SqlGenerators/SqlGeneratorsBootstrap').then(m => m.SqlGeneratorsBootstrap), + () => import('./SqlGenerators/SqlGeneratorsResource').then(m => m.SqlGeneratorsResource), + () => import('./ScriptPreview/ScriptPreviewService').then(m => m.ScriptPreviewService), + () => import('./GeneratorMenuBootstrap').then(m => m.GeneratorMenuBootstrap), + ], }; diff --git a/webapp/packages/plugin-task-manager/src/manifest.ts b/webapp/packages/plugin-task-manager/src/manifest.ts index 1c9fb1e31d..cc16b186c7 100644 --- a/webapp/packages/plugin-task-manager/src/manifest.ts +++ b/webapp/packages/plugin-task-manager/src/manifest.ts @@ -7,10 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { TaskManagerPluginBootstrap } from './TaskManagerPluginBootstrap'; - export const taskManagerPluginManifest: PluginManifest = { info: { name: 'Task Manager plugin' }, - providers: [TaskManagerPluginBootstrap, LocaleService], + providers: [ + () => import('./TaskManagerPluginBootstrap').then(m => m.TaskManagerPluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + ], }; diff --git a/webapp/packages/plugin-theme/src/manifest.ts b/webapp/packages/plugin-theme/src/manifest.ts index 4ef1c826a6..791b280596 100644 --- a/webapp/packages/plugin-theme/src/manifest.ts +++ b/webapp/packages/plugin-theme/src/manifest.ts @@ -7,9 +7,7 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; - export const themePlugin: PluginManifest = { info: { name: 'Theme plugin' }, - providers: [PluginBootstrap], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap)], }; diff --git a/webapp/packages/plugin-tools-panel/src/ToolsPanel/ToolsPanel.tsx b/webapp/packages/plugin-tools-panel/src/ToolsPanel/ToolsPanel.tsx index 796c7a8527..5441a95891 100644 --- a/webapp/packages/plugin-tools-panel/src/ToolsPanel/ToolsPanel.tsx +++ b/webapp/packages/plugin-tools-panel/src/ToolsPanel/ToolsPanel.tsx @@ -9,9 +9,9 @@ import { action, untracked } from 'mobx'; import { observer } from 'mobx-react-lite'; import { useRef } from 'react'; -import { s, SContext, useS, useUserData } from '@cloudbeaver/core-blocks'; +import { s, useS, useUserData } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; -import { ITabData, TabList, TabPanelList, TabsState, TabUnderlineStyleRegistry } from '@cloudbeaver/core-ui'; +import { ITabData, TabList, TabPanelList, TabsState } from '@cloudbeaver/core-ui'; import { isArraysEqual } from '@cloudbeaver/core-utils'; import styles from './ToolsPanel.m.css'; @@ -61,14 +61,12 @@ export const ToolsPanel = observer(function ToolsPanel() { return ( - -
- -
- -
+
+ +
+
- +
); }); diff --git a/webapp/packages/plugin-tools-panel/src/manifest.ts b/webapp/packages/plugin-tools-panel/src/manifest.ts index b9557c4a5b..bc303471d9 100644 --- a/webapp/packages/plugin-tools-panel/src/manifest.ts +++ b/webapp/packages/plugin-tools-panel/src/manifest.ts @@ -7,12 +7,12 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { ToolsPanelService } from './ToolsPanel/ToolsPanelService'; -import { ToolsPanelSettingsService } from './ToolsPanelSettingsService'; - export const toolsPanelPlugin: PluginManifest = { info: { name: 'Tools panel plugin' }, - providers: [ToolsPanelService, PluginBootstrap, LocaleService, ToolsPanelSettingsService], + providers: [ + () => import('./ToolsPanel/ToolsPanelService').then(m => m.ToolsPanelService), + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./ToolsPanelSettingsService').then(m => m.ToolsPanelSettingsService), + ], }; diff --git a/webapp/packages/plugin-top-app-bar-administration/src/manifest.ts b/webapp/packages/plugin-top-app-bar-administration/src/manifest.ts index ebfe7c3519..26b804bac2 100644 --- a/webapp/packages/plugin-top-app-bar-administration/src/manifest.ts +++ b/webapp/packages/plugin-top-app-bar-administration/src/manifest.ts @@ -7,12 +7,12 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; -import { AdministrationTopAppBarBootstrap } from './TopNavBar/AdministrationTopAppBarBootstrap'; - export const administrationTopAppBarPlugin: PluginManifest = { info: { name: 'Administration Top App Bar plugin', }, - providers: [PluginBootstrap, AdministrationTopAppBarBootstrap], + providers: [ + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./TopNavBar/AdministrationTopAppBarBootstrap').then(m => m.AdministrationTopAppBarBootstrap), + ], }; diff --git a/webapp/packages/plugin-top-app-bar/src/TopNavBar/AppStateMenu/AppStateMenu.m.css b/webapp/packages/plugin-top-app-bar/src/TopNavBar/AppStateMenu/AppStateMenu.m.css index 989419e427..64375e8752 100644 --- a/webapp/packages/plugin-top-app-bar/src/TopNavBar/AppStateMenu/AppStateMenu.m.css +++ b/webapp/packages/plugin-top-app-bar/src/TopNavBar/AppStateMenu/AppStateMenu.m.css @@ -1,4 +1,11 @@ -.appStateMenu .menuBarItem { +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +.appStateMenu > .menuBar .menuBarItem { & .menuBarItemIcon { margin-right: 0; } diff --git a/webapp/packages/plugin-top-app-bar/src/manifest.ts b/webapp/packages/plugin-top-app-bar/src/manifest.ts index 1bee5e5215..436da49ea2 100644 --- a/webapp/packages/plugin-top-app-bar/src/manifest.ts +++ b/webapp/packages/plugin-top-app-bar/src/manifest.ts @@ -7,12 +7,9 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; -import { TopNavService } from './TopNavBar/TopNavService'; - export const topAppBarPlugin: PluginManifest = { info: { name: 'Top App Bar plugin', }, - providers: [PluginBootstrap, TopNavService], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap), () => import('./TopNavBar/TopNavService').then(m => m.TopNavService)], }; diff --git a/webapp/packages/plugin-user-profile-administration/src/manifest.ts b/webapp/packages/plugin-user-profile-administration/src/manifest.ts index 425534dc3c..7bf6b9642f 100644 --- a/webapp/packages/plugin-user-profile-administration/src/manifest.ts +++ b/webapp/packages/plugin-user-profile-administration/src/manifest.ts @@ -7,12 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; - export const userProfileAdministrationPlugin: PluginManifest = { info: { name: 'User profile administration plugin', }, - providers: [PluginBootstrap], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap)], }; diff --git a/webapp/packages/plugin-user-profile-settings/src/UserProfileSettings.tsx b/webapp/packages/plugin-user-profile-settings/src/UserProfileSettings.tsx index fdfb49a52d..a9230a0ab8 100644 --- a/webapp/packages/plugin-user-profile-settings/src/UserProfileSettings.tsx +++ b/webapp/packages/plugin-user-profile-settings/src/UserProfileSettings.tsx @@ -52,7 +52,7 @@ export const UserProfileSettings = observer(function UserProfileSettings() { - + form.submit()}> {translate('ui_processing_save')} diff --git a/webapp/packages/plugin-user-profile-settings/src/manifest.ts b/webapp/packages/plugin-user-profile-settings/src/manifest.ts index e4c119f45c..a39bd295ae 100644 --- a/webapp/packages/plugin-user-profile-settings/src/manifest.ts +++ b/webapp/packages/plugin-user-profile-settings/src/manifest.ts @@ -7,16 +7,13 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { UserProfileSettingsPluginBootstrap } from './UserProfileSettingsPluginBootstrap'; - export const userProfileSettingsPlugin: PluginManifest = { info: { name: 'User profile settings plugin', }, providers: [ - LocaleService, - UserProfileSettingsPluginBootstrap, + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./UserProfileSettingsPluginBootstrap').then(m => m.UserProfileSettingsPluginBootstrap), ], }; diff --git a/webapp/packages/plugin-user-profile/src/UserProfileOptionsPanel.tsx b/webapp/packages/plugin-user-profile/src/UserProfileOptionsPanel.tsx index edd586754a..ec36248eaf 100644 --- a/webapp/packages/plugin-user-profile/src/UserProfileOptionsPanel.tsx +++ b/webapp/packages/plugin-user-profile/src/UserProfileOptionsPanel.tsx @@ -7,25 +7,25 @@ */ import { observer } from 'mobx-react-lite'; -import { ColoredContainer, Container, Group, SContext, StyleRegistry, useS } from '@cloudbeaver/core-blocks'; +import { ColoredContainer, Container, Group, s, SContext, StyleRegistry, useS } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; -import { TabList, TabPanelList, TabsState, TabStyles, TabUnderlineStyleRegistry } from '@cloudbeaver/core-ui'; +import { TabList, TabPanelList, TabsState, TabStyles } from '@cloudbeaver/core-ui'; import style from './UserProfileOptionsPanel.m.css'; import UserProfileTabStyles from './UserProfileTab.m.css'; import { UserProfileTabsService } from './UserProfileTabsService'; -export const tabsStyleRegistry: StyleRegistry = [...TabUnderlineStyleRegistry, [TabStyles, { mode: 'append', styles: [UserProfileTabStyles] }]]; +export const tabsStyleRegistry: StyleRegistry = [[TabStyles, { mode: 'append', styles: [UserProfileTabStyles] }]]; export const UserProfileOptionsPanel = observer(function UserProfileOptionsPanel() { const styles = useS(style); const userProfileTabsService = useService(UserProfileTabsService); return ( - + - + diff --git a/webapp/packages/plugin-user-profile/src/manifest.ts b/webapp/packages/plugin-user-profile/src/manifest.ts index e21efa5f0f..bdd8936232 100644 --- a/webapp/packages/plugin-user-profile/src/manifest.ts +++ b/webapp/packages/plugin-user-profile/src/manifest.ts @@ -7,32 +7,27 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; -import { UserProfileFormAuthenticationPartBootstrap } from './UserProfileForm/UserAuthenticationPart/UserProfileFormAuthenticationPartBootstrap'; -import { UserProfileFormAuthenticationPartService } from './UserProfileForm/UserAuthenticationPart/UserProfileFormAuthenticationPartService'; -import { UserProfileFormInfoPartBootstrap } from './UserProfileForm/UserInfoPart/UserProfileFormInfoPartBootstrap'; -import { UserProfileFormInfoPartService } from './UserProfileForm/UserInfoPart/UserProfileFormInfoPartService'; -import { UserProfileFormBootstrap } from './UserProfileForm/UserProfileFormBootstrap'; -import { UserProfileFormService } from './UserProfileForm/UserProfileFormService'; -import { UserProfileOptionsPanelService } from './UserProfileOptionsPanelService'; -import { UserProfileTabsService } from './UserProfileTabsService'; - export const userProfilePlugin: PluginManifest = { info: { name: 'User profile plugin', }, providers: [ - PluginBootstrap, - LocaleService, - UserProfileTabsService, - UserProfileOptionsPanelService, - UserProfileFormBootstrap, - UserProfileFormService, - UserProfileFormInfoPartBootstrap, - UserProfileFormInfoPartService, - UserProfileFormAuthenticationPartBootstrap, - UserProfileFormAuthenticationPartService, + () => import('./PluginBootstrap').then(m => m.PluginBootstrap), + () => import('./LocaleService').then(m => m.LocaleService), + () => import('./UserProfileTabsService').then(m => m.UserProfileTabsService), + () => import('./UserProfileOptionsPanelService').then(m => m.UserProfileOptionsPanelService), + () => import('./UserProfileForm/UserProfileFormBootstrap').then(m => m.UserProfileFormBootstrap), + () => import('./UserProfileForm/UserProfileFormService').then(m => m.UserProfileFormService), + () => import('./UserProfileForm/UserInfoPart/UserProfileFormInfoPartBootstrap').then(m => m.UserProfileFormInfoPartBootstrap), + () => import('./UserProfileForm/UserInfoPart/UserProfileFormInfoPartService').then(m => m.UserProfileFormInfoPartService), + () => + import('./UserProfileForm/UserAuthenticationPart/UserProfileFormAuthenticationPartBootstrap').then( + m => m.UserProfileFormAuthenticationPartBootstrap, + ), + () => + import('./UserProfileForm/UserAuthenticationPart/UserProfileFormAuthenticationPartService').then( + m => m.UserProfileFormAuthenticationPartService, + ), ], }; diff --git a/webapp/packages/plugin-version-update-administration/src/VersionChecker.tsx b/webapp/packages/plugin-version-update-administration/src/VersionChecker.tsx index 0c5b1795b3..949a9f77dd 100644 --- a/webapp/packages/plugin-version-update-administration/src/VersionChecker.tsx +++ b/webapp/packages/plugin-version-update-administration/src/VersionChecker.tsx @@ -39,7 +39,12 @@ export const VersionChecker = observer(function VersionChecker() { return ( - } description={versionUpdateService.newVersionAvailable ? description : undefined} ripple={false}> + } + description={versionUpdateService.newVersionAvailable ? description : undefined} + ripple={false} + big + > {translate(text)} diff --git a/webapp/packages/plugin-version-update-administration/src/manifest.ts b/webapp/packages/plugin-version-update-administration/src/manifest.ts index d0d945d0e3..818a809420 100644 --- a/webapp/packages/plugin-version-update-administration/src/manifest.ts +++ b/webapp/packages/plugin-version-update-administration/src/manifest.ts @@ -7,13 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { PluginBootstrap } from './PluginBootstrap'; - export const versionUpdatePlugin: PluginManifest = { info: { name: 'Version update plugin', }, - providers: [PluginBootstrap, LocaleService], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap), () => import('./LocaleService').then(m => m.LocaleService)], }; diff --git a/webapp/packages/plugin-version/src/manifest.ts b/webapp/packages/plugin-version/src/manifest.ts index 990744d2c6..8614238469 100644 --- a/webapp/packages/plugin-version/src/manifest.ts +++ b/webapp/packages/plugin-version/src/manifest.ts @@ -7,9 +7,7 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { PluginBootstrap } from './PluginBootstrap'; - export const versionPlugin: PluginManifest = { info: { name: 'Version plugin' }, - providers: [PluginBootstrap], + providers: [() => import('./PluginBootstrap').then(m => m.PluginBootstrap)], }; diff --git a/webapp/packages/product-default/src/manifest.ts b/webapp/packages/product-default/src/manifest.ts index ce8aecb861..6a13c63b7b 100644 --- a/webapp/packages/product-default/src/manifest.ts +++ b/webapp/packages/product-default/src/manifest.ts @@ -7,13 +7,10 @@ */ import type { PluginManifest } from '@cloudbeaver/core-di'; -import { LocaleService } from './LocaleService'; -import { ProductBootstrap } from './ProductBootstrap'; - export const defaultProductManifest: PluginManifest = { info: { name: 'Default Product', }, - providers: [ProductBootstrap, LocaleService], + providers: [() => import('./ProductBootstrap').then(m => m.ProductBootstrap), () => import('./LocaleService').then(m => m.LocaleService)], }; diff --git a/webapp/packages/tests-runner/src/renderInApp.tsx b/webapp/packages/tests-runner/src/renderInApp.tsx index 541005ee4c..7f2815115c 100644 --- a/webapp/packages/tests-runner/src/renderInApp.tsx +++ b/webapp/packages/tests-runner/src/renderInApp.tsx @@ -6,6 +6,7 @@ * you may not use this file except in compliance with the License. */ import { queries, Queries, render, RenderOptions, RenderResult } from '@testing-library/react'; +import { Suspense } from 'react'; import { AppContext, IServiceInjector } from '@cloudbeaver/core-di'; @@ -13,7 +14,11 @@ import type { IApplication } from './createApp'; function ApplicationWrapper(serviceInjector: IServiceInjector): React.FC { return function render({ children }) { - return {children}; + return ( + + {children} + + ); }; } diff --git a/webapp/yarn.lock b/webapp/yarn.lock index 547e74aa70..e0988ab9ab 100644 --- a/webapp/yarn.lock +++ b/webapp/yarn.lock @@ -2568,7 +2568,7 @@ resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz#d7c6e6755c78567a951e04ab52ef0fd26de59f32" integrity sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg== -"@jridgewell/trace-mapping@^0.3.12", "@jridgewell/trace-mapping@^0.3.17", "@jridgewell/trace-mapping@^0.3.18", "@jridgewell/trace-mapping@^0.3.20", "@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.9": +"@jridgewell/trace-mapping@^0.3.12", "@jridgewell/trace-mapping@^0.3.17", "@jridgewell/trace-mapping@^0.3.18", "@jridgewell/trace-mapping@^0.3.20", "@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.25", "@jridgewell/trace-mapping@^0.3.9": version "0.3.25" resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz#15f190e98895f3fc23276ee14bc76b675c2e50f0" integrity sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ== @@ -4167,6 +4167,11 @@ javascript-natural-sort "0.7.1" lodash "^4.17.21" +"@trysound/sax@0.2.0": + version "0.2.0" + resolved "https://registry.yarnpkg.com/@trysound/sax/-/sax-0.2.0.tgz#cccaab758af56761eb7bf37af6f03f326dd798ad" + integrity sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA== + "@types/allure-js-commons@^0.0.0": version "0.0.0" resolved "https://registry.yarnpkg.com/@types/allure-js-commons/-/allure-js-commons-0.0.0.tgz#accf21f2fa69b3c494adc3bba5ce240c0d7c159c" @@ -6020,7 +6025,7 @@ braces@^3.0.2, braces@~3.0.2: dependencies: fill-range "^7.0.1" -browserslist@^4.21.10, browserslist@^4.22.2, browserslist@^4.22.3, browserslist@^4.23.0: +browserslist@^4.0.0, browserslist@^4.21.10, browserslist@^4.22.2, browserslist@^4.22.3, browserslist@^4.23.0: version "4.23.0" resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.23.0.tgz#8f3acc2bbe73af7213399430890f86c63a5674ab" integrity sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ== @@ -6163,6 +6168,21 @@ camelcase@^6.2.0: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a" integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA== +caniuse-api@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0" + integrity sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw== + dependencies: + browserslist "^4.0.0" + caniuse-lite "^1.0.0" + lodash.memoize "^4.1.2" + lodash.uniq "^4.5.0" + +caniuse-lite@^1.0.0: + version "1.0.30001617" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001617.tgz#809bc25f3f5027ceb33142a7d6c40759d7a901eb" + integrity sha512-mLyjzNI9I+Pix8zwcrpxEbGlfqOkF9kM3ptzmKNw5tizSyYwMe+nGLTqMK9cO+0E+Bh6TsBxNAaHWEM8xwSsmA== + caniuse-lite@^1.0.30001587, caniuse-lite@^1.0.30001591: version "1.0.30001594" resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001594.tgz#bea552414cd52c2d0c985ed9206314a696e685f5" @@ -6471,6 +6491,11 @@ color-support@^1.1.3: resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2" integrity sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg== +colord@^2.9.3: + version "2.9.3" + resolved "https://registry.yarnpkg.com/colord/-/colord-2.9.3.tgz#4f8ce919de456f1d5c1c368c307fe20f3e59fb43" + integrity sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw== + colorette@^2.0.10, colorette@^2.0.14, colorette@^2.0.16: version "2.0.20" resolved "https://registry.yarnpkg.com/colorette/-/colorette-2.0.20.tgz#9eb793e6833067f7235902fcd3b09917a000a95a" @@ -6902,6 +6927,11 @@ css-blank-pseudo@^6.0.1: dependencies: postcss-selector-parser "^6.0.13" +css-declaration-sorter@^7.2.0: + version "7.2.0" + resolved "https://registry.yarnpkg.com/css-declaration-sorter/-/css-declaration-sorter-7.2.0.tgz#6dec1c9523bc4a643e088aab8f09e67a54961024" + integrity sha512-h70rUM+3PNFuaBDTLe8wF/cdWu+dOZmb7pJt8Z2sedYbAcQVQV/tEchueg3GWxwqS0cxtbxmaHEdkNACqcvsow== + css-has-pseudo@^6.0.2: version "6.0.2" resolved "https://registry.yarnpkg.com/css-has-pseudo/-/css-has-pseudo-6.0.2.tgz#a1a15ee7082d72a23ed1d810220ba384da867d15" @@ -6925,6 +6955,18 @@ css-loader@^6.10.0: postcss-value-parser "^4.2.0" semver "^7.5.4" +css-minimizer-webpack-plugin@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/css-minimizer-webpack-plugin/-/css-minimizer-webpack-plugin-7.0.0.tgz#b77a3d2f7c0fd02d3ac250dcc2f79065363f3cd3" + integrity sha512-niy66jxsQHqO+EYbhPuIhqRQ1mNcNVUHrMnkzzir9kFOERJUaQDDRhh7dKDz33kBpkWMF9M8Vx0QlDbc5AHOsw== + dependencies: + "@jridgewell/trace-mapping" "^0.3.25" + cssnano "^7.0.1" + jest-worker "^29.7.0" + postcss "^8.4.38" + schema-utils "^4.2.0" + serialize-javascript "^6.0.2" + css-prefers-color-scheme@^9.0.1: version "9.0.1" resolved "https://registry.yarnpkg.com/css-prefers-color-scheme/-/css-prefers-color-scheme-9.0.1.tgz#30fcb94cc38b639b66fb99e1882ffd97f741feaa" @@ -6941,7 +6983,34 @@ css-select@^4.1.3: domutils "^2.8.0" nth-check "^2.0.1" -css-what@^6.0.1: +css-select@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/css-select/-/css-select-5.1.0.tgz#b8ebd6554c3637ccc76688804ad3f6a6fdaea8a6" + integrity sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg== + dependencies: + boolbase "^1.0.0" + css-what "^6.1.0" + domhandler "^5.0.2" + domutils "^3.0.1" + nth-check "^2.0.1" + +css-tree@^2.3.1: + version "2.3.1" + resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.3.1.tgz#10264ce1e5442e8572fc82fbe490644ff54b5c20" + integrity sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw== + dependencies: + mdn-data "2.0.30" + source-map-js "^1.0.1" + +css-tree@~2.2.0: + version "2.2.1" + resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.2.1.tgz#36115d382d60afd271e377f9c5f67d02bd48c032" + integrity sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA== + dependencies: + mdn-data "2.0.28" + source-map-js "^1.0.1" + +css-what@^6.0.1, css-what@^6.1.0: version "6.1.0" resolved "https://registry.yarnpkg.com/css-what/-/css-what-6.1.0.tgz#fb5effcf76f1ddea2c81bdfaa4de44e79bac70f4" integrity sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw== @@ -6961,6 +7030,62 @@ cssesc@^3.0.0: resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee" integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg== +cssnano-preset-default@^7.0.1: + version "7.0.1" + resolved "https://registry.yarnpkg.com/cssnano-preset-default/-/cssnano-preset-default-7.0.1.tgz#b05c93a29868dd7bd810fa8bbf89f482804da922" + integrity sha512-Fumyr+uZMcjYQeuHssAZxn0cKj3cdQc5GcxkBcmEzISGB+UW9CLNlU4tBOJbJGcPukFDlicG32eFbrc8K9V5pw== + dependencies: + browserslist "^4.23.0" + css-declaration-sorter "^7.2.0" + cssnano-utils "^5.0.0" + postcss-calc "^10.0.0" + postcss-colormin "^7.0.0" + postcss-convert-values "^7.0.0" + postcss-discard-comments "^7.0.0" + postcss-discard-duplicates "^7.0.0" + postcss-discard-empty "^7.0.0" + postcss-discard-overridden "^7.0.0" + postcss-merge-longhand "^7.0.0" + postcss-merge-rules "^7.0.0" + postcss-minify-font-values "^7.0.0" + postcss-minify-gradients "^7.0.0" + postcss-minify-params "^7.0.0" + postcss-minify-selectors "^7.0.0" + postcss-normalize-charset "^7.0.0" + postcss-normalize-display-values "^7.0.0" + postcss-normalize-positions "^7.0.0" + postcss-normalize-repeat-style "^7.0.0" + postcss-normalize-string "^7.0.0" + postcss-normalize-timing-functions "^7.0.0" + postcss-normalize-unicode "^7.0.0" + postcss-normalize-url "^7.0.0" + postcss-normalize-whitespace "^7.0.0" + postcss-ordered-values "^7.0.0" + postcss-reduce-initial "^7.0.0" + postcss-reduce-transforms "^7.0.0" + postcss-svgo "^7.0.0" + postcss-unique-selectors "^7.0.0" + +cssnano-utils@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/cssnano-utils/-/cssnano-utils-5.0.0.tgz#b53a0343dd5d21012911882db6ae7d2eae0e3687" + integrity sha512-Uij0Xdxc24L6SirFr25MlwC2rCFX6scyUmuKpzI+JQ7cyqDEwD42fJ0xfB3yLfOnRDU5LKGgjQ9FA6LYh76GWQ== + +cssnano@^7.0.1: + version "7.0.1" + resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-7.0.1.tgz#a62675fc17f9a26d8560d3e61d79228b628dbb63" + integrity sha512-917Mej/4SdI7b55atsli3sU4MOJ9XDoKgnlCtQtXYj8XUFcM3riTuYHyqBBnnskawW+zWwp0KxJzpEUodlpqUg== + dependencies: + cssnano-preset-default "^7.0.1" + lilconfig "^3.1.1" + +csso@^5.0.5: + version "5.0.5" + resolved "https://registry.yarnpkg.com/csso/-/csso-5.0.5.tgz#f9b7fe6cc6ac0b7d90781bb16d5e9874303e2ca6" + integrity sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ== + dependencies: + css-tree "~2.2.0" + cssom@^0.5.0: version "0.5.0" resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.5.0.tgz#d254fa92cd8b6fbd83811b9fbaed34663cc17c36" @@ -7771,7 +7896,16 @@ dom-serializer@^1.0.1: domhandler "^4.2.0" entities "^2.0.0" -domelementtype@^2.0.1, domelementtype@^2.2.0: +dom-serializer@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-2.0.0.tgz#e41b802e1eedf9f6cae183ce5e622d789d7d8e53" + integrity sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg== + dependencies: + domelementtype "^2.3.0" + domhandler "^5.0.2" + entities "^4.2.0" + +domelementtype@^2.0.1, domelementtype@^2.2.0, domelementtype@^2.3.0: version "2.3.0" resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d" integrity sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw== @@ -7790,6 +7924,13 @@ domhandler@^4.0.0, domhandler@^4.2.0, domhandler@^4.3.1: dependencies: domelementtype "^2.2.0" +domhandler@^5.0.2, domhandler@^5.0.3: + version "5.0.3" + resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-5.0.3.tgz#cc385f7f751f1d1fc650c21374804254538c7d31" + integrity sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w== + dependencies: + domelementtype "^2.3.0" + domutils@^2.5.2, domutils@^2.8.0: version "2.8.0" resolved "https://registry.yarnpkg.com/domutils/-/domutils-2.8.0.tgz#4437def5db6e2d1f5d6ee859bd95ca7d02048135" @@ -7799,6 +7940,15 @@ domutils@^2.5.2, domutils@^2.8.0: domelementtype "^2.2.0" domhandler "^4.2.0" +domutils@^3.0.1: + version "3.1.0" + resolved "https://registry.yarnpkg.com/domutils/-/domutils-3.1.0.tgz#c47f551278d3dc4b0b1ab8cbb42d751a6f0d824e" + integrity sha512-H78uMmQtI2AhgDJjWeQmHwJJ2bLPD3GMmO7Zja/ZZh84wkm+4ut+IUnUdRa8uCGX88DiVx1j6FRe1XfxEgjEZA== + dependencies: + dom-serializer "^2.0.0" + domelementtype "^2.3.0" + domhandler "^5.0.3" + dot-case@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.4.tgz#9b2b670d00a431667a8a75ba29cd1b98809ce751" @@ -7948,7 +8098,7 @@ entities@^2.0.0: resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55" integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A== -entities@^4.4.0: +entities@^4.2.0, entities@^4.4.0: version "4.5.0" resolved "https://registry.yarnpkg.com/entities/-/entities-4.5.0.tgz#5d268ea5e7113ec74c4d033b79ea5a35a488fb48" integrity sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw== @@ -11229,6 +11379,11 @@ lilconfig@^2.0.5: resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.1.0.tgz#78e23ac89ebb7e1bfbf25b18043de756548e7f52" integrity sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ== +lilconfig@^3.1.1: + version "3.1.1" + resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-3.1.1.tgz#9d8a246fa753106cfc205fd2d77042faca56e5e3" + integrity sha512-O18pf7nyvHTckunPWCV1XUNXU1piu01y2b7ATJ0ppkUkk8ocqVWBrYjJBCwHDjD/ZWcfyrA0P4gKhzWGi5EINQ== + lines-and-columns@^1.1.6: version "1.2.4" resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632" @@ -11339,6 +11494,11 @@ lodash.ismatch@^4.4.0: resolved "https://registry.yarnpkg.com/lodash.ismatch/-/lodash.ismatch-4.4.0.tgz#756cb5150ca3ba6f11085a78849645f188f85f37" integrity sha512-fPMfXjGQEV9Xsq/8MTSgUf255gawYRbjwMyDbcvDhXgV7enSZA0hynz6vMPnpAb5iONEzBHBPsT+0zes5Z301g== +lodash.memoize@^4.1.2: + version "4.1.2" + resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe" + integrity sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag== + lodash.merge@^4.6.2: version "4.6.2" resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a" @@ -11658,6 +11818,16 @@ mdast-util-to-string@^4.0.0: dependencies: "@types/mdast" "^4.0.0" +mdn-data@2.0.28: + version "2.0.28" + resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.28.tgz#5ec48e7bef120654539069e1ae4ddc81ca490eba" + integrity sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g== + +mdn-data@2.0.30: + version "2.0.30" + resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.30.tgz#ce4df6f80af6cfbe218ecd5c552ba13c4dfa08cc" + integrity sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA== + media-typer@0.3.0: version "0.3.0" resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748" @@ -13183,6 +13353,14 @@ postcss-attribute-case-insensitive@^6.0.3: dependencies: postcss-selector-parser "^6.0.13" +postcss-calc@^10.0.0: + version "10.0.0" + resolved "https://registry.yarnpkg.com/postcss-calc/-/postcss-calc-10.0.0.tgz#aca29a1c66dd481ca30d08f6932b1274a1003716" + integrity sha512-OmjhudoNTP0QleZCwl1i6NeBwN+5MZbY5ersLZz69mjJiDVv/p57RjRuKDkHeDWr4T+S97wQfsqRTNoDHB2e3g== + dependencies: + postcss-selector-parser "^6.0.16" + postcss-value-parser "^4.2.0" + postcss-clamp@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/postcss-clamp/-/postcss-clamp-4.1.0.tgz#7263e95abadd8c2ba1bd911b0b5a5c9c93e02363" @@ -13217,6 +13395,24 @@ postcss-color-rebeccapurple@^9.0.3: "@csstools/utilities" "^1.0.0" postcss-value-parser "^4.2.0" +postcss-colormin@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-colormin/-/postcss-colormin-7.0.0.tgz#76b9e40eff69a363c1fc5ce2f0ece1d4a01d1de8" + integrity sha512-5CN6fqtsEtEtwf3mFV3B4UaZnlYljPpzmGeDB4yCK067PnAtfLe9uX2aFZaEwxHE7HopG5rUkW8gyHrNAesHEg== + dependencies: + browserslist "^4.23.0" + caniuse-api "^3.0.0" + colord "^2.9.3" + postcss-value-parser "^4.2.0" + +postcss-convert-values@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-convert-values/-/postcss-convert-values-7.0.0.tgz#4a53e79c4bd81cfed8a7ed3fffb7b255a2f5f300" + integrity sha512-bMuzDgXBbFbByPgj+/r6va8zNuIDUaIIbvAFgdO1t3zdgJZ77BZvu6dfWyd6gHEJnYzmeVr9ayUsAQL3/qLJ0w== + dependencies: + browserslist "^4.23.0" + postcss-value-parser "^4.2.0" + postcss-custom-media@^10.0.3: version "10.0.3" resolved "https://registry.yarnpkg.com/postcss-custom-media/-/postcss-custom-media-10.0.3.tgz#7131ee7f6e55cbb0423dcfca37c8946539f1b214" @@ -13260,6 +13456,26 @@ postcss-discard-comments@^6.0.1: resolved "https://registry.yarnpkg.com/postcss-discard-comments/-/postcss-discard-comments-6.0.1.tgz#46176212bd9c3e5f48aa4b8b4868786726c41d36" integrity sha512-f1KYNPtqYLUeZGCHQPKzzFtsHaRuECe6jLakf/RjSRqvF5XHLZnM2+fXLhb8Qh/HBFHs3M4cSLb1k3B899RYIg== +postcss-discard-comments@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-discard-comments/-/postcss-discard-comments-7.0.0.tgz#3919e4237630f74927f3976ac5789cfc26731494" + integrity sha512-xpSdzRqYmy4YIVmjfGyYXKaI1SRnK6CTr+4Zmvyof8ANwvgfZgGdVtmgAvzh59gJm808mJCWQC9tFN0KF5dEXA== + +postcss-discard-duplicates@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-discard-duplicates/-/postcss-discard-duplicates-7.0.0.tgz#47ae1154cc89ad0a50099fbac1f74c942214c961" + integrity sha512-bAnSuBop5LpAIUmmOSsuvtKAAKREB6BBIYStWUTGq8oG5q9fClDMMuY8i4UPI/cEcDx2TN+7PMnXYIId20UVDw== + +postcss-discard-empty@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-discard-empty/-/postcss-discard-empty-7.0.0.tgz#218829d1ef0a5d5142dd62f0aa60e00e599d2033" + integrity sha512-e+QzoReTZ8IAwhnSdp/++7gBZ/F+nBq9y6PomfwORfP7q9nBpK5AMP64kOt0bA+lShBFbBDcgpJ3X4etHg4lzA== + +postcss-discard-overridden@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-discard-overridden/-/postcss-discard-overridden-7.0.0.tgz#b123ea51e3d4e1d0a254cf71eaff1201926d319c" + integrity sha512-GmNAzx88u3k2+sBTZrJSDauR0ccpE24omTQCVmaTTZFz1du6AasspjaUPMJ2ud4RslZpoFKyf+6MSPETLojc6w== + postcss-double-position-gradients@^5.0.4: version "5.0.4" resolved "https://registry.yarnpkg.com/postcss-double-position-gradients/-/postcss-double-position-gradients-5.0.4.tgz#294787043e5e6187b5489ee52950ecfb303f9ea9" @@ -13336,6 +13552,56 @@ postcss-logical@^7.0.1: dependencies: postcss-value-parser "^4.2.0" +postcss-merge-longhand@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-merge-longhand/-/postcss-merge-longhand-7.0.0.tgz#aabfae74428a5506c4d50842445845c1cc10c9c6" + integrity sha512-0X8I4/9+G03X5/5NnrfopG/YEln2XU8heDh7YqBaiq2SeaKIG3n66ShZPjIolmVuLBQ0BEm3yS8o1mlCLHdW7A== + dependencies: + postcss-value-parser "^4.2.0" + stylehacks "^7.0.0" + +postcss-merge-rules@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-7.0.0.tgz#069a427807fdb1e2dcca3bf218d0a9f70103526a" + integrity sha512-Zty3VlOsD6VSjBMu6PiHCVpLegtBT/qtZRVBcSeyEZ6q1iU5qTYT0WtEoLRV+YubZZguS5/ycfP+NRiKfjv6aw== + dependencies: + browserslist "^4.23.0" + caniuse-api "^3.0.0" + cssnano-utils "^5.0.0" + postcss-selector-parser "^6.0.16" + +postcss-minify-font-values@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-minify-font-values/-/postcss-minify-font-values-7.0.0.tgz#d16a75a2548e000779566b3568fc874ee5d0aa17" + integrity sha512-2ckkZtgT0zG8SMc5aoNwtm5234eUx1GGFJKf2b1bSp8UflqaeFzR50lid4PfqVI9NtGqJ2J4Y7fwvnP/u1cQog== + dependencies: + postcss-value-parser "^4.2.0" + +postcss-minify-gradients@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-minify-gradients/-/postcss-minify-gradients-7.0.0.tgz#f6d84456e6d49164a55d0e45bb1b1809c6cf0959" + integrity sha512-pdUIIdj/C93ryCHew0UgBnL2DtUS3hfFa5XtERrs4x+hmpMYGhbzo6l/Ir5de41O0GaKVpK1ZbDNXSY6GkXvtg== + dependencies: + colord "^2.9.3" + cssnano-utils "^5.0.0" + postcss-value-parser "^4.2.0" + +postcss-minify-params@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-minify-params/-/postcss-minify-params-7.0.0.tgz#dfa8263d38570b1116da2c72f69190ea665b17aa" + integrity sha512-XOJAuX8Q/9GT1sGxlUvaFEe2H9n50bniLZblXXsAT/BwSfFYvzSZeFG7uupwc0KbKpTnflnQ7aMwGzX6JUWliQ== + dependencies: + browserslist "^4.23.0" + cssnano-utils "^5.0.0" + postcss-value-parser "^4.2.0" + +postcss-minify-selectors@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-minify-selectors/-/postcss-minify-selectors-7.0.0.tgz#5dedb26806f58d683a3bb362e095ad5aa24f1bf6" + integrity sha512-f00CExZhD6lNw2vTZbcnmfxVgaVKzUw6IRsIFX3JTT8GdsoABc1WnhhGwL1i8YPJ3sSWw39fv7XPtvLb+3Uitw== + dependencies: + postcss-selector-parser "^6.0.16" + postcss-modules-extract-imports@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d" @@ -13372,11 +13638,81 @@ postcss-nesting@^12.0.3: "@csstools/selector-specificity" "^3.0.2" postcss-selector-parser "^6.0.13" +postcss-normalize-charset@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-7.0.0.tgz#92244ae73c31bf8f8885d5f16ff69e857ac6c001" + integrity sha512-ABisNUXMeZeDNzCQxPxBCkXexvBrUHV+p7/BXOY+ulxkcjUZO0cp8ekGBwvIh2LbCwnWbyMPNJVtBSdyhM2zYQ== + +postcss-normalize-display-values@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-display-values/-/postcss-normalize-display-values-7.0.0.tgz#01fb50e5e97ef8935363629bea5a6d3b3aac1342" + integrity sha512-lnFZzNPeDf5uGMPYgGOw7v0BfB45+irSRz9gHQStdkkhiM0gTfvWkWB5BMxpn0OqgOQuZG/mRlZyJxp0EImr2Q== + dependencies: + postcss-value-parser "^4.2.0" + +postcss-normalize-positions@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-positions/-/postcss-normalize-positions-7.0.0.tgz#4eebd7c9d3dde40c97b8047cad38124fc844c463" + integrity sha512-I0yt8wX529UKIGs2y/9Ybs2CelSvItfmvg/DBIjTnoUSrPxSV7Z0yZ8ShSVtKNaV/wAY+m7bgtyVQLhB00A1NQ== + dependencies: + postcss-value-parser "^4.2.0" + +postcss-normalize-repeat-style@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-repeat-style/-/postcss-normalize-repeat-style-7.0.0.tgz#0cb784655d5714d29bd3bda6dee2fb628aa7227b" + integrity sha512-o3uSGYH+2q30ieM3ppu9GTjSXIzOrRdCUn8UOMGNw7Af61bmurHTWI87hRybrP6xDHvOe5WlAj3XzN6vEO8jLw== + dependencies: + postcss-value-parser "^4.2.0" + +postcss-normalize-string@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-string/-/postcss-normalize-string-7.0.0.tgz#a119d3e63a9614570d8413d572fb9fc8c6a64e8c" + integrity sha512-w/qzL212DFVOpMy3UGyxrND+Kb0fvCiBBujiaONIihq7VvtC7bswjWgKQU/w4VcRyDD8gpfqUiBQ4DUOwEJ6Qg== + dependencies: + postcss-value-parser "^4.2.0" + +postcss-normalize-timing-functions@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-timing-functions/-/postcss-normalize-timing-functions-7.0.0.tgz#99d0ee8c4b23b7f4355fafb91385833b9b07108b" + integrity sha512-tNgw3YV0LYoRwg43N3lTe3AEWZ66W7Dh7lVEpJbHoKOuHc1sLrzMLMFjP8SNULHaykzsonUEDbKedv8C+7ej6g== + dependencies: + postcss-value-parser "^4.2.0" + +postcss-normalize-unicode@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-unicode/-/postcss-normalize-unicode-7.0.0.tgz#bd66bfc238bf4d1eaea356639260c04fce408476" + integrity sha512-OnKV52/VFFDAim4n0pdI+JAhsolLBdnCKxE6VV5lW5Q/JeVGFN8UM8ur6/A3EAMLsT1ZRm3fDHh/rBoBQpqi2w== + dependencies: + browserslist "^4.23.0" + postcss-value-parser "^4.2.0" + +postcss-normalize-url@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-url/-/postcss-normalize-url-7.0.0.tgz#c88cb7cf8952d3ff631e4eba924e7b060ca802f6" + integrity sha512-+d7+PpE+jyPX1hDQZYG+NaFD+Nd2ris6r8fPTBAjE8z/U41n/bib3vze8x7rKs5H1uEw5ppe9IojewouHk0klQ== + dependencies: + postcss-value-parser "^4.2.0" + +postcss-normalize-whitespace@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-normalize-whitespace/-/postcss-normalize-whitespace-7.0.0.tgz#46b025f0bea72139ddee63015619b0c21cebd845" + integrity sha512-37/toN4wwZErqohedXYqWgvcHUGlT8O/m2jVkAfAe9Bd4MzRqlBmXrJRePH0e9Wgnz2X7KymTgTOaaFizQe3AQ== + dependencies: + postcss-value-parser "^4.2.0" + postcss-opacity-percentage@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/postcss-opacity-percentage/-/postcss-opacity-percentage-2.0.0.tgz#c0a56060cd4586e3f954dbde1efffc2deed53002" integrity sha512-lyDrCOtntq5Y1JZpBFzIWm2wG9kbEdujpNt4NLannF+J9c8CgFIzPa80YQfdza+Y+yFfzbYj/rfoOsYsooUWTQ== +postcss-ordered-values@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-ordered-values/-/postcss-ordered-values-7.0.0.tgz#cea4e2a140ed1c7b055e0ab967b82a36b584debf" + integrity sha512-KROvC63A8UQW1eYDljQe1dtwc1E/M+mMwDT6z7khV/weHYLWTghaLRLunU7x1xw85lWFwVZOAGakxekYvKV+0w== + dependencies: + cssnano-utils "^5.0.0" + postcss-value-parser "^4.2.0" + postcss-overflow-shorthand@^5.0.1: version "5.0.1" resolved "https://registry.yarnpkg.com/postcss-overflow-shorthand/-/postcss-overflow-shorthand-5.0.1.tgz#c0a124edad4f7ad88109275a60510e1fb07ab833" @@ -13469,6 +13805,21 @@ postcss-pseudo-class-any-link@^9.0.1: dependencies: postcss-selector-parser "^6.0.13" +postcss-reduce-initial@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-reduce-initial/-/postcss-reduce-initial-7.0.0.tgz#a9e64778dd44604c2bda109e2fd14b99ab0d1416" + integrity sha512-iqGgmBxY9LrblZ0BKLjmrA1mC/cf9A/wYCCqSmD6tMi+xAyVl0+DfixZIHSVDMbCPRPjNmVF0DFGth/IDGelFQ== + dependencies: + browserslist "^4.23.0" + caniuse-api "^3.0.0" + +postcss-reduce-transforms@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-reduce-transforms/-/postcss-reduce-transforms-7.0.0.tgz#0386080a14e5faad9f8eda33375b79fe7c4f9677" + integrity sha512-pnt1HKKZ07/idH8cpATX/ujMbtOGhUfE+m8gbqwJE05aTaNw8gbo34a2e3if0xc0dlu75sUOiqvwCGY3fzOHew== + dependencies: + postcss-value-parser "^4.2.0" + postcss-replace-overflow-wrap@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/postcss-replace-overflow-wrap/-/postcss-replace-overflow-wrap-4.0.0.tgz#d2df6bed10b477bf9c52fab28c568b4b29ca4319" @@ -13489,6 +13840,29 @@ postcss-selector-parser@^6.0.13, postcss-selector-parser@^6.0.2, postcss-selecto cssesc "^3.0.0" util-deprecate "^1.0.2" +postcss-selector-parser@^6.0.16: + version "6.0.16" + resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.16.tgz#3b88b9f5c5abd989ef4e2fc9ec8eedd34b20fb04" + integrity sha512-A0RVJrX+IUkVZbW3ClroRWurercFhieevHB38sr2+l9eUClMqome3LmEmnhlNy+5Mr2EYN6B2Kaw9wYdd+VHiw== + dependencies: + cssesc "^3.0.0" + util-deprecate "^1.0.2" + +postcss-svgo@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-svgo/-/postcss-svgo-7.0.0.tgz#2f11b45c6fa42da155fd7c16c44e69bf086c5992" + integrity sha512-Xj5DRdvA97yRy3wjbCH2NKXtDUwEnph6EHr5ZXszsBVKCNrKXYBjzAXqav7/Afz5WwJ/1peZoTguCEJIg7ytmA== + dependencies: + postcss-value-parser "^4.2.0" + svgo "^3.2.0" + +postcss-unique-selectors@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/postcss-unique-selectors/-/postcss-unique-selectors-7.0.0.tgz#8cc2f919bce33c429cce93624f2b8f9bbd4bd882" + integrity sha512-NYFqcft7vVQMZlQPsMdMPy+qU/zDpy95Malpw4GeA9ZZjM6dVXDshXtDmLc0m4WCD6XeZCJqjTfPT1USsdt+rA== + dependencies: + postcss-selector-parser "^6.0.16" + postcss-value-parser@^4.1.0, postcss-value-parser@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514" @@ -13521,6 +13895,15 @@ postcss@^8.0.0, postcss@^8.1.7, postcss@^8.4.23, postcss@^8.4.33, postcss@^8.4.3 picocolors "^1.0.0" source-map-js "^1.0.2" +postcss@^8.4.38: + version "8.4.38" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.38.tgz#b387d533baf2054288e337066d81c6bee9db9e0e" + integrity sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A== + dependencies: + nanoid "^3.3.7" + picocolors "^1.0.0" + source-map-js "^1.2.0" + precinct@^8.1.0: version "8.3.1" resolved "https://registry.yarnpkg.com/precinct/-/precinct-8.3.1.tgz#94b99b623df144eed1ce40e0801c86078466f0dc" @@ -14881,6 +15264,11 @@ source-list-map@^2.0.0: resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c" integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw== +source-map-js@^1.0.1, source-map-js@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.0.tgz#16b809c162517b5b8c3e7dcd315a2a5c2612b2af" + integrity sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg== + source-map-loader@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/source-map-loader/-/source-map-loader-5.0.0.tgz#f593a916e1cc54471cfc8851b905c8a845fc7e38" @@ -15277,6 +15665,14 @@ style-to-object@^1.0.0: dependencies: inline-style-parser "0.2.2" +stylehacks@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-7.0.0.tgz#68e8ee54724671c0c698be82e1299c6548c31921" + integrity sha512-47Nw4pQ6QJb4CA6dzF2m9810sjQik4dfk4UwAm5wlwhrW3syzZKF8AR4/cfO3Cr6lsFgAoznQq0Wg57qhjTA2A== + dependencies: + browserslist "^4.23.0" + postcss-selector-parser "^6.0.16" + stylus-lookup@^3.0.1: version "3.0.2" resolved "https://registry.yarnpkg.com/stylus-lookup/-/stylus-lookup-3.0.2.tgz#c9eca3ff799691020f30b382260a67355fefdddd" @@ -15322,6 +15718,19 @@ supports-preserve-symlinks-flag@^1.0.0: resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09" integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w== +svgo@^3.2.0: + version "3.2.0" + resolved "https://registry.yarnpkg.com/svgo/-/svgo-3.2.0.tgz#7a5dff2938d8c6096e00295c2390e8e652fa805d" + integrity sha512-4PP6CMW/V7l/GmKRKzsLR8xxjdHTV4IMvhTnpuHwwBazSIlw5W/5SmPjN8Dwyt7lKbSJrRDgp4t9ph0HgChFBQ== + dependencies: + "@trysound/sax" "0.2.0" + commander "^7.2.0" + css-select "^5.1.0" + css-tree "^2.3.1" + css-what "^6.1.0" + csso "^5.0.5" + picocolors "^1.0.0" + swap-case@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/swap-case/-/swap-case-2.0.2.tgz#671aedb3c9c137e2985ef51c51f9e98445bf70d9" @@ -16586,11 +16995,23 @@ workbox-cacheable-response@7.0.0: dependencies: workbox-core "7.0.0" -workbox-core@7.0.0, workbox-core@^7.0.0: +workbox-cacheable-response@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/workbox-cacheable-response/-/workbox-cacheable-response-7.1.0.tgz#d138cc8ef2c32a9f28f29c5b2b0a8681da846c33" + integrity sha512-iwsLBll8Hvua3xCuBB9h92+/e0wdsmSVgR2ZlvcfjepZWwhd3osumQB3x9o7flj+FehtWM2VHbZn8UJeBXXo6Q== + dependencies: + workbox-core "7.1.0" + +workbox-core@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-core/-/workbox-core-7.0.0.tgz#dec114ec923cc2adc967dd9be1b8a0bed50a3545" integrity sha512-81JkAAZtfVP8darBpfRTovHg8DGAVrKFgHpOArZbdFd78VqHr5Iw65f2guwjE2NlCFbPFDoez3D3/6ZvhI/rwQ== +workbox-core@7.1.0, workbox-core@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/workbox-core/-/workbox-core-7.1.0.tgz#1867576f994f20d9991b71a7d0b2581af22db170" + integrity sha512-5KB4KOY8rtL31nEF7BfvU7FMzKT4B5TkbYa2tzkS+Peqj0gayMT9SytSFtNzlrvMaWgv6y/yvP9C0IbpFjV30Q== + workbox-expiration@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-expiration/-/workbox-expiration-7.0.0.tgz#3d90bcf2a7577241de950f89784f6546b66c2baa" @@ -16599,6 +17020,14 @@ workbox-expiration@7.0.0: idb "^7.0.1" workbox-core "7.0.0" +workbox-expiration@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/workbox-expiration/-/workbox-expiration-7.1.0.tgz#c9d348ffc8c3d1ffdddaf6c37bf5be830a69073e" + integrity sha512-m5DcMY+A63rJlPTbbBNtpJ20i3enkyOtSgYfv/l8h+D6YbbNiA0zKEkCUaMsdDlxggla1oOfRkyqTvl5Ni5KQQ== + dependencies: + idb "^7.0.1" + workbox-core "7.1.0" + workbox-google-analytics@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-google-analytics/-/workbox-google-analytics-7.0.0.tgz#603b2c4244af1e85de0fb26287d4e17d3293452a" @@ -16616,7 +17045,7 @@ workbox-navigation-preload@7.0.0: dependencies: workbox-core "7.0.0" -workbox-precaching@7.0.0, workbox-precaching@^7.0.0: +workbox-precaching@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-precaching/-/workbox-precaching-7.0.0.tgz#3979ba8033aadf3144b70e9fe631d870d5fbaa03" integrity sha512-EC0vol623LJqTJo1mkhD9DZmMP604vHqni3EohhQVwhJlTgyKyOkMrZNy5/QHfOby+39xqC01gv4LjOm4HSfnA== @@ -16625,6 +17054,15 @@ workbox-precaching@7.0.0, workbox-precaching@^7.0.0: workbox-routing "7.0.0" workbox-strategies "7.0.0" +workbox-precaching@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/workbox-precaching/-/workbox-precaching-7.1.0.tgz#71e27ec2e85661a41b48dec0c92dae707c429eaa" + integrity sha512-LyxzQts+UEpgtmfnolo0hHdNjoB7EoRWcF7EDslt+lQGd0lW4iTvvSe3v5JiIckQSB5KTW5xiCqjFviRKPj1zA== + dependencies: + workbox-core "7.1.0" + workbox-routing "7.1.0" + workbox-strategies "7.1.0" + workbox-range-requests@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-range-requests/-/workbox-range-requests-7.0.0.tgz#97511901e043df27c1aa422adcc999a7751f52ed" @@ -16651,6 +17089,13 @@ workbox-routing@7.0.0: dependencies: workbox-core "7.0.0" +workbox-routing@7.1.0, workbox-routing@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/workbox-routing/-/workbox-routing-7.1.0.tgz#c44bda350d1c5eb633ee97a660e64ce5473250c4" + integrity sha512-oOYk+kLriUY2QyHkIilxUlVcFqwduLJB7oRZIENbqPGeBP/3TWHYNNdmGNhz1dvKuw7aqvJ7CQxn27/jprlTdg== + dependencies: + workbox-core "7.1.0" + workbox-strategies@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-strategies/-/workbox-strategies-7.0.0.tgz#dcba32b3f3074476019049cc490fe1a60ea73382" @@ -16658,6 +17103,13 @@ workbox-strategies@7.0.0: dependencies: workbox-core "7.0.0" +workbox-strategies@7.1.0, workbox-strategies@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/workbox-strategies/-/workbox-strategies-7.1.0.tgz#a589f2adc0df8f33049c7f4d4cdf4c9556715918" + integrity sha512-/UracPiGhUNehGjRm/tLUQ+9PtWmCbRufWtV0tNrALuf+HZ4F7cmObSEK+E4/Bx1p8Syx2tM+pkIrvtyetdlew== + dependencies: + workbox-core "7.1.0" + workbox-streams@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-streams/-/workbox-streams-7.0.0.tgz#36722aecd04785f88b6f709e541c094fc658c0f9" @@ -16682,7 +17134,7 @@ workbox-webpack-plugin@^7.0.0: webpack-sources "^1.4.3" workbox-build "7.0.0" -workbox-window@7.0.0, workbox-window@^7.0.0: +workbox-window@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/workbox-window/-/workbox-window-7.0.0.tgz#a683ab33c896e4f16786794eac7978fc98a25d08" integrity sha512-j7P/bsAWE/a7sxqTzXo3P2ALb1reTfZdvVp6OJ/uLr/C2kZAMvjeWGm8V4htQhor7DOvYg0sSbFN2+flT5U0qA== @@ -16690,6 +17142,14 @@ workbox-window@7.0.0, workbox-window@^7.0.0: "@types/trusted-types" "^2.0.2" workbox-core "7.0.0" +workbox-window@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/workbox-window/-/workbox-window-7.1.0.tgz#58a90ba89ca35d26f2b322223ee575c750bac7a1" + integrity sha512-ZHeROyqR+AS5UPzholQRDttLFqGMwP0Np8MKWAdyxsDETxq3qOAyXvqessc3GniohG6e0mAqSQyKOHmT8zPF7g== + dependencies: + "@types/trusted-types" "^2.0.2" + workbox-core "7.1.0" + "wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" From 399c9b9bec77f7e7c1ef2f3a3a79dd1265c4ff7c Mon Sep 17 00:00:00 2001 From: Aleksei Potsetsuev Date: Tue, 14 May 2024 13:37:32 +0700 Subject: [PATCH 3/5] CB-5070 fix: html semantics --- .../packages/core-blocks/src/Containers/Container.tsx | 11 ++++++++--- .../GrantedConnectionsTableHeader.tsx | 2 +- .../GrantedUsersTableHeader.tsx | 2 +- .../ConnectionAccessTableHeader.tsx | 4 ++-- .../src/TableViewer/TableHeader/TableHeader.tsx | 4 ++-- 5 files changed, 14 insertions(+), 9 deletions(-) diff --git a/webapp/packages/core-blocks/src/Containers/Container.tsx b/webapp/packages/core-blocks/src/Containers/Container.tsx index af6ebe228b..f6e4c5b4e1 100644 --- a/webapp/packages/core-blocks/src/Containers/Container.tsx +++ b/webapp/packages/core-blocks/src/Containers/Container.tsx @@ -14,16 +14,21 @@ import { filterContainerFakeProps, getContainerProps } from './filterContainerFa import type { IContainerProps } from './IContainerProps'; import elementsSizeStyle from './shared/ElementsSize.m.css'; -export const Container = forwardRef>(function Container( - { className, ...rest }, +interface Props { + as?: 'div' | 'header' | 'footer' | 'section' | 'aside' | 'main' | 'nav'; +} + +export const Container = forwardRef>(function Container( + { as = 'div', className, ...rest }, ref, ) { const styles = useS(style, elementsSizeStyle); const divProps = filterContainerFakeProps(rest); const containerProps = getContainerProps(rest); + const Element = as; return ( -
(function GrantedCon const translate = useTranslate(); return ( - + (function GrantedUsersTabl const translate = useTranslate(); return ( - + +
{children}
-
+ ); }); diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx index d735164dce..5dc5a1e36e 100644 --- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx +++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx @@ -26,8 +26,8 @@ export const TableHeader = observer(function TableHeader({ model, resultI const service = useService(TableHeaderService); return ( -
+
-
+ ); }); From c3fc17b79fc7f5ec1d79d3b661507ccfbb381952 Mon Sep 17 00:00:00 2001 From: Aleksei Potsetsuev Date: Tue, 14 May 2024 19:42:38 +0700 Subject: [PATCH 4/5] CB-5070 fix: table header styles --- .../Users/Teams/GrantedConnections/ConnectionList.m.css | 7 ++++--- .../Teams/GrantedConnections/GrantedConnectionsList.m.css | 8 +++++--- .../Users/Teams/GrantedUsers/GrantedUserList.m.css | 7 ++++--- 3 files changed, 13 insertions(+), 9 deletions(-) diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css index 7f6dfcf099..b808a2abc2 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/ConnectionList.m.css @@ -8,7 +8,8 @@ .group { height: 100%; -} -.header { - flex: 0 0 auto; + + & .header { + flex: 0 0 auto; + } } diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css index 0d475761e0..b808a2abc2 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedConnections/GrantedConnectionsList.m.css @@ -5,9 +5,11 @@ * Licensed under the Apache License, Version 2.0. * you may not use this file except in compliance with the License. */ + .group { height: 100%; -} -.header { - flex: 0 0 auto; + + & .header { + flex: 0 0 auto; + } } diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css index 692f3ead06..b808a2abc2 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/GrantedUsers/GrantedUserList.m.css @@ -5,10 +5,11 @@ * Licensed under the Apache License, Version 2.0. * you may not use this file except in compliance with the License. */ + .group { height: 100%; -} -.header { - flex: 0 0 auto; + & .header { + flex: 0 0 auto; + } } From f799f31dc628e6c4fff3a1055a007ce94e964d90 Mon Sep 17 00:00:00 2001 From: Aleksei Potsetsuev Date: Tue, 14 May 2024 20:18:50 +0700 Subject: [PATCH 5/5] CB-5070 fix: table header styles --- .../Origin/UserFormOriginInfoPanel.tsx | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx index faa1f6bb2e..67c344ecd5 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UserForm/Origin/UserFormOriginInfoPanel.tsx @@ -86,7 +86,7 @@ export const UserFormOriginInfoPanel: TabContainerPanelComponent } return ( - + {origin && ( - + + +