From f79dc072bbc6d1778c2566610a195aabeafab9e8 Mon Sep 17 00:00:00 2001 From: yomybaby <621215+yomybaby@users.noreply.github.com> Date: Wed, 4 Sep 2024 04:48:49 +0000 Subject: [PATCH] chore: remove unused backend-ai-agent-list (#2683) **Checklist:** (if applicable) - [ ] Mention to the original issue - [ ] Documentation - [ ] Minium required manager version - [ ] Specific setting for review (eg., KB link, endpoint or how to setup) - [ ] Minimum requirements to check during review - [ ] Test case(s) to demonstrate the difference of before/after --- manifest/backend.ai-white-text.svg | 24 ++ react/src/App.tsx | 24 +- react/src/components/BAIMenu.tsx | 28 +- .../src/components/BAINotificationButton.tsx | 6 +- react/src/components/BAISider.tsx | 9 +- react/src/components/BAIStartBasicCard.tsx | 127 ++++++++ react/src/components/BAIStartSimpleCard.tsx | 111 +++++++ react/src/components/DefaultProviders.tsx | 1 + .../src/components/MainLayout/MainLayout.tsx | 78 +++-- .../src/components/MainLayout/WebUIHeader.tsx | 126 +++++--- .../src/components/MainLayout/WebUISider.tsx | 183 +++++++---- react/src/components/NeoSessionList.tsx | 283 ++++++++++++++++++ react/src/components/ResourceUnit.tsx | 70 +++++ react/src/components/UserDropdownMenu.tsx | 22 +- react/src/components/WEBUIHelpButton.tsx | 10 +- .../components/WEBUINotificationDrawer.tsx | 2 +- .../src/components/WebUIThemeToggleButton.tsx | 12 +- react/src/components/icons/BatchSession.svg | 5 + .../src/components/icons/BatchSessionIcon.tsx | 12 + react/src/components/icons/Endpoints.svg | 6 + react/src/components/icons/EndpointsIcon.tsx | 12 + react/src/components/icons/ExampleStart.svg | 6 + react/src/components/icons/ExampleStart.tsx | 12 + react/src/components/icons/Examples.svg | 6 + react/src/components/icons/ExamplesIcon.tsx | 12 + .../components/icons/InteractiveSession.svg | 4 + .../components/icons/InteractiveSession.tsx | 14 + react/src/components/icons/ModelService.svg | 3 + .../src/components/icons/ModelServiceIcon.tsx | 12 + react/src/components/icons/Models.svg | 5 + react/src/components/icons/ModelsIcon.tsx | 12 + react/src/components/icons/Pipelines.svg | 5 + react/src/components/icons/PipelinesIcon.tsx | 12 + react/src/components/icons/Sessions.svg | 10 + react/src/components/icons/SessionsIcon.tsx | 12 + react/src/components/icons/Trails.svg | 10 + react/src/components/icons/TrailsIcon.tsx | 12 + react/src/components/icons/URLStart.svg | 7 + react/src/components/icons/URLStartIcon.tsx | 12 + react/src/components/icons/UserOutlined.svg | 11 + .../src/components/icons/UserOutlinedIcon.tsx | 12 + react/src/icons/session.svg | 3 + react/src/pages/NeoSessionPage.tsx | 89 ++++++ react/src/pages/StartPage.tsx | 139 +++++++++ resources/icons/URLStart.svg | 7 + resources/icons/session.svg | 3 + resources/theme.json | 161 ++++++---- src/backend-ai-app.ts | 4 +- src/components/backend-ai-error-view.ts | 6 +- .../backend-ai-permission-denied-view.ts | 4 +- src/components/backend-ai-storage-list.ts | 2 +- .../backend-ai-storage-proxy-list.ts | 2 +- src/components/backend-ai-summary-view.ts | 2 +- src/components/backend-ai-webui.ts | 9 +- 54 files changed, 1518 insertions(+), 253 deletions(-) create mode 100644 manifest/backend.ai-white-text.svg create mode 100644 react/src/components/BAIStartBasicCard.tsx create mode 100644 react/src/components/BAIStartSimpleCard.tsx create mode 100644 react/src/components/NeoSessionList.tsx create mode 100644 react/src/components/ResourceUnit.tsx create mode 100644 react/src/components/icons/BatchSession.svg create mode 100644 react/src/components/icons/BatchSessionIcon.tsx create mode 100644 react/src/components/icons/Endpoints.svg create mode 100644 react/src/components/icons/EndpointsIcon.tsx create mode 100644 react/src/components/icons/ExampleStart.svg create mode 100644 react/src/components/icons/ExampleStart.tsx create mode 100644 react/src/components/icons/Examples.svg create mode 100644 react/src/components/icons/ExamplesIcon.tsx create mode 100644 react/src/components/icons/InteractiveSession.svg create mode 100644 react/src/components/icons/InteractiveSession.tsx create mode 100644 react/src/components/icons/ModelService.svg create mode 100644 react/src/components/icons/ModelServiceIcon.tsx create mode 100644 react/src/components/icons/Models.svg create mode 100644 react/src/components/icons/ModelsIcon.tsx create mode 100644 react/src/components/icons/Pipelines.svg create mode 100644 react/src/components/icons/PipelinesIcon.tsx create mode 100644 react/src/components/icons/Sessions.svg create mode 100644 react/src/components/icons/SessionsIcon.tsx create mode 100644 react/src/components/icons/Trails.svg create mode 100644 react/src/components/icons/TrailsIcon.tsx create mode 100644 react/src/components/icons/URLStart.svg create mode 100644 react/src/components/icons/URLStartIcon.tsx create mode 100644 react/src/components/icons/UserOutlined.svg create mode 100644 react/src/components/icons/UserOutlinedIcon.tsx create mode 100644 react/src/icons/session.svg create mode 100644 react/src/pages/NeoSessionPage.tsx create mode 100644 react/src/pages/StartPage.tsx create mode 100644 resources/icons/URLStart.svg create mode 100644 resources/icons/session.svg diff --git a/manifest/backend.ai-white-text.svg b/manifest/backend.ai-white-text.svg new file mode 100644 index 0000000000..431c69c6d6 --- /dev/null +++ b/manifest/backend.ai-white-text.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/react/src/App.tsx b/react/src/App.tsx index b9a9e006cb..b6c14e54b0 100644 --- a/react/src/App.tsx +++ b/react/src/App.tsx @@ -29,13 +29,15 @@ const EndpointDetailPage = React.lazy( () => import('./pages/EndpointDetailPage'), ); // const SummaryPage = React.lazy(() => import('./pages/SummaryPage')); +const StartPage = React.lazy(() => import('./pages/StartPage')); const EnvironmentPage = React.lazy(() => import('./pages/EnvironmentPage')); const MyEnvironmentPage = React.lazy(() => import('./pages/MyEnvironmentPage')); const StorageHostSettingPage = React.lazy( () => import('./pages/StorageHostSettingPage'), ); const UserSettingsPage = React.lazy(() => import('./pages/UserSettingsPage')); -const SessionListPage = React.lazy(() => import('./pages/SessionListPage')); +// const SessionListPage = React.lazy(() => import('./pages/SessionListPage')); +const NeoSessionPage = React.lazy(() => import('./pages/NeoSessionPage')); const SessionLauncherPage = React.lazy( () => import('./pages/SessionLauncherPage'), ); @@ -57,9 +59,9 @@ const InteractiveLoginPage = React.lazy( ); const ImportAndRunPage = React.lazy(() => import('./pages/ImportAndRunPage')); -const RedirectToSummary = () => { +const RedirectToStart = () => { useSuspendedBackendaiClient(); - const pathName = '/summary'; + const pathName = '/start'; document.dispatchEvent( new CustomEvent('move-to-from-react', { detail: { @@ -68,7 +70,7 @@ const RedirectToSummary = () => { }, }), ); - return ; + return ; }; const router = createBrowserRouter([ @@ -105,20 +107,20 @@ const router = createBrowserRouter([ children: [ { path: '/', - element: , + element: , }, { //for electron dev mode path: '/build/electron-app/app/index.html', - element: , + element: , }, { //for electron prod mode path: '/app/index.html', - element: , + element: , }, { - path: '/summary', + path: '/start', Component: () => { const { token } = theme.useToken(); return ( @@ -131,10 +133,11 @@ const router = createBrowserRouter([ closable /> {/* */} + ); }, - handle: { labelKey: 'webui.menu.Summary' }, + handle: { labelKey: 'start' }, }, { path: '/job', @@ -299,7 +302,8 @@ const router = createBrowserRouter([ { path: '/session', handle: { labelKey: 'webui.menu.Sessions' }, - Component: SessionListPage, + Component: NeoSessionPage, + // Component: SessionListPage, }, { path: '/session/start', diff --git a/react/src/components/BAIMenu.tsx b/react/src/components/BAIMenu.tsx index 397124b750..e91fea70a6 100644 --- a/react/src/components/BAIMenu.tsx +++ b/react/src/components/BAIMenu.tsx @@ -1,11 +1,10 @@ import { ConfigProvider, Menu, MenuProps, theme } from 'antd'; import React from 'react'; -// interface BAIMenuProps extends MenuProps { - -// } - -const BAIMenu: React.FC = ({ ...props }) => { +interface BAIMenuProps extends MenuProps { + isAdminMenu?: boolean; +} +const BAIMenu: React.FC = ({ ...props }) => { const { token } = theme.useToken(); return ( <> @@ -13,7 +12,6 @@ const BAIMenu: React.FC = ({ ...props }) => { {` .bai-menu li.ant-menu-item.ant-menu-item-selected { overflow: visible; - font-weight: 600; } .bai-menu li.ant-menu-item.ant-menu-item-selected::before { @@ -22,7 +20,6 @@ const BAIMenu: React.FC = ({ ...props }) => { bottom: 0; position: absolute; right: auto; - border-right: 3px solid ${token.colorPrimary}; transform: scaleY(1); opacity: 1; content: ""; @@ -33,8 +30,23 @@ const BAIMenu: React.FC = ({ ...props }) => { theme={{ components: { Menu: { - itemBorderRadius: 2, + itemBorderRadius: 20, itemMarginInline: 0, + colorPrimaryBorder: props.isAdminMenu + ? token.colorSuccess + : token.colorInfoHover, + itemHoverBg: props.isAdminMenu + ? token.colorSuccessBgHover + : token.colorInfoHover, + itemHoverColor: props.isAdminMenu + ? token.colorSuccessHover + : token.colorPrimaryBg, + itemSelectedBg: props.isAdminMenu + ? token.colorSuccessBgHover + : token.colorInfoHover, + itemSelectedColor: props.isAdminMenu + ? token.colorSuccessHover + : token.colorPrimaryBg, }, }, }} diff --git a/react/src/components/BAINotificationButton.tsx b/react/src/components/BAINotificationButton.tsx index 453c10efcb..92d63a636a 100644 --- a/react/src/components/BAINotificationButton.tsx +++ b/react/src/components/BAINotificationButton.tsx @@ -10,7 +10,9 @@ import { atom, useAtom } from 'jotai'; import _ from 'lodash'; import React, { useEffect } from 'react'; -interface Props extends ButtonProps {} +interface Props extends ButtonProps { + iconColor?: string; +} export const isOpenDrawerState = atom(false); const BAINotificationButton: React.FC = ({ ...props }) => { @@ -37,7 +39,7 @@ const BAINotificationButton: React.FC = ({ ...props }) => { size="large" icon={ - + } type="text" diff --git a/react/src/components/BAISider.tsx b/react/src/components/BAISider.tsx index 568a899a62..3ff7b890fb 100644 --- a/react/src/components/BAISider.tsx +++ b/react/src/components/BAISider.tsx @@ -1,4 +1,5 @@ import Flex from './Flex'; +import { DRAWER_WIDTH } from './WEBUINotificationDrawer'; import { ConfigProvider, Grid, SiderProps, Typography, theme } from 'antd'; import Sider from 'antd/es/layout/Sider'; import _ from 'lodash'; @@ -56,7 +57,7 @@ const BAISider: React.FC = ({ `} = ({ position: 'sticky', top: 0, left: 0, - borderRight: '1px solid', + background: '#FFF', borderColor: token.colorBorder, paddingTop: token.paddingContentVerticalSM, scrollbarColor: 'auto', @@ -86,7 +87,7 @@ const BAISider: React.FC = ({ algorithm: siderTheme === 'dark' ? theme.darkAlgorithm : undefined, }} > - = ({ {otherProps.collapsed ? logoTitleCollapsed : logoTitle} - + */} {children} {bottomText && ( <> diff --git a/react/src/components/BAIStartBasicCard.tsx b/react/src/components/BAIStartBasicCard.tsx new file mode 100644 index 0000000000..73a2048dc6 --- /dev/null +++ b/react/src/components/BAIStartBasicCard.tsx @@ -0,0 +1,127 @@ +import Flex from './Flex'; +import { + Button, + ButtonProps, + Card, + CardProps, + ConfigProvider, + Divider, + theme, + Typography, +} from 'antd'; + +export interface BAIStartBasicCardProps extends CardProps { + icon: React.ReactNode; + title: React.ReactNode; + footerButtonProps: ButtonProps; + description?: string; + secondary?: Boolean; +} + +const BAIStartBasicCard: React.FC = ({ + icon, + title, + footerButtonProps, + description, + secondary, + ...cardProps +}) => { + const { token } = theme.useToken(); + + return ( + + + + + + {icon} + + + {title} + + {description && ( + + {description} + + )} + + + +