From 8faffc9497333d065a093eadf057f94c80f3b6eb Mon Sep 17 00:00:00 2001 From: Lynwee <1507509064@qq.com> Date: Tue, 10 Sep 2024 11:01:48 +0800 Subject: [PATCH 1/3] feat(circleci): restranformate without api client (#8019) --- backend/plugins/circleci/impl/impl.go | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/backend/plugins/circleci/impl/impl.go b/backend/plugins/circleci/impl/impl.go index d9a1bd86516..8e052711a97 100644 --- a/backend/plugins/circleci/impl/impl.go +++ b/backend/plugins/circleci/impl/impl.go @@ -110,9 +110,14 @@ func (p Circleci) PrepareTaskData(taskCtx plugin.TaskContext, options map[string return nil, errors.Default.Wrap(err, "unable to get Circleci connection by the given connection ID") } - apiClient, err := tasks.NewCircleciApiClient(taskCtx, connection) - if err != nil { - return nil, errors.Default.Wrap(err, "unable to get Circleci API client instance") + var apiClient *helper.ApiAsyncClient + syncPolicy := taskCtx.SyncPolicy() + if !syncPolicy.SkipCollectors { + newApiClient, err := tasks.NewCircleciApiClient(taskCtx, connection) + if err != nil { + return nil, errors.Default.Wrap(err, "unable to get Circleci API client instance") + } + apiClient = newApiClient } project := &models.CircleciProject{} err = taskCtx.GetDal().First(project, dal.Where("slug = ?", op.ProjectSlug)) From 100a2a6a802dcb3d39f932588760209bec731ccf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=9D=92=E6=B9=9B?= <0x1304570@gmail.com> Date: Tue, 10 Sep 2024 15:35:41 +1200 Subject: [PATCH 2/3] refactor: use basename to replace configuration PATHS (#8021) --- config-ui/src/api/project/index.ts | 11 +- config-ui/src/app/routrer.tsx | 205 +++++++++--------- config-ui/src/config/index.ts | 1 - config-ui/src/config/paths.ts | 37 ---- .../components/connection-list/index.tsx | 3 +- .../components/data-scope-select/index.tsx | 3 +- .../plugins/components/scope-config/index.tsx | 3 +- config-ui/src/routes/api-keys/api-keys.tsx | 3 +- .../blueprint/connection-detail/index.tsx | 17 +- .../detail/blueprint-detail-page.tsx | 7 +- .../add-connection-dialog/index.tsx | 3 +- .../blueprint/detail/configuration-panel.tsx | 12 +- .../routes/blueprint/detail/status-panel.tsx | 4 +- config-ui/src/routes/blueprint/home/index.tsx | 16 +- .../src/routes/connection/connection.tsx | 8 +- .../src/routes/connection/connections.tsx | 3 +- config-ui/src/routes/db-migrate/index.tsx | 3 +- config-ui/src/routes/error/index.tsx | 3 +- config-ui/src/routes/layout/config.tsx | 14 +- config-ui/src/routes/onboard/index.tsx | 3 +- config-ui/src/routes/onboard/step-0.tsx | 3 +- config-ui/src/routes/onboard/step-1.tsx | 3 +- config-ui/src/routes/onboard/step-2.tsx | 3 +- config-ui/src/routes/pipeline/pipeline.tsx | 5 +- config-ui/src/routes/pipeline/pipelines.tsx | 5 +- .../project/additional-settings/index.tsx | 5 +- config-ui/src/routes/project/home/index.tsx | 8 +- config-ui/src/routes/project/index.ts | 1 - config-ui/src/routes/project/layout/index.tsx | 5 +- .../project/layout/project-selector.tsx | 3 +- config-ui/src/routes/project/utils.ts | 21 -- 31 files changed, 174 insertions(+), 247 deletions(-) delete mode 100644 config-ui/src/config/paths.ts delete mode 100644 config-ui/src/routes/project/utils.ts diff --git a/config-ui/src/api/project/index.ts b/config-ui/src/api/project/index.ts index 6023ad8da24..ca008480a56 100644 --- a/config-ui/src/api/project/index.ts +++ b/config-ui/src/api/project/index.ts @@ -17,15 +17,14 @@ */ import type { IProject } from '@/types'; -import { encodeName } from '@/routes'; import { request } from '@/utils'; export const list = (data: Pagination & { keyword?: string }): Promise<{ count: number; projects: IProject[] }> => request('/projects', { data }); -export const get = (name: string): Promise => request(`/projects/${encodeName(name)}`); +export const get = (name: string): Promise => request(`/projects/${encodeURIComponent(name)}`); -export const checkName = (name: string) => request(`/projects/${encodeName(name)}/check`); +export const checkName = (name: string) => request(`/projects/${encodeURIComponent(name)}/check`); export const create = (data: Pick) => request('/projects', { @@ -34,15 +33,15 @@ export const create = (data: Pick) }); export const remove = (name: string) => - request(`/projects/${encodeName(name)}`, { + request(`/projects/${encodeURIComponent(name)}`, { method: 'delete', }); export const update = (name: string, data: Pick) => - request(`/projects/${encodeName(name)}`, { + request(`/projects/${encodeURIComponent(name)}`, { method: 'patch', data: { ...data, - name: encodeName(data.name), + name: encodeURIComponent(data.name), }, }); diff --git a/config-ui/src/app/routrer.tsx b/config-ui/src/app/routrer.tsx index e40c8308402..ccb5ef1646f 100644 --- a/config-ui/src/app/routrer.tsx +++ b/config-ui/src/app/routrer.tsx @@ -43,105 +43,110 @@ import { App } from '../App'; const PATH_PREFIX = import.meta.env.DEVLAKE_PATH_PREFIX ?? '/'; -export const router = createBrowserRouter([ +export const router = createBrowserRouter( + [ + { + path: '/', + element: , + errorElement: , + children: [ + { + index: true, + element: , + }, + { + path: 'db-migrate', + element: , + }, + { + path: 'onboard', + element: , + }, + { + path: 'projects/:pname', + element: , + children: [ + { + index: true, + element: , + }, + { + path: 'general-settings', + element: , + }, + { + path: 'general-settings/:unique', + element: , + }, + { + path: 'webhooks', + element: , + }, + { + path: 'additional-settings', + element: , + }, + ], + }, + { + path: '', + element: , + children: [ + { + index: true, + element: , + }, + { + path: 'projects', + element: , + }, + { + path: 'connections', + element: , + }, + { + path: 'connections/:plugin/:id', + element: , + }, + { + path: 'advanced', + children: [ + { + path: 'blueprints', + element: , + }, + { + path: 'blueprints/:id', + element: , + }, + { + path: 'blueprints/:bid/:unique', + element: , + }, + { + path: 'pipelines', + element: , + }, + { + path: 'pipeline/:id', + element: , + }, + ], + }, + { + path: 'keys', + element: , + }, + ], + }, + ], + }, + { + path: '*', + element: , + }, + ], { - path: PATH_PREFIX, - element: , - errorElement: , - children: [ - { - index: true, - element: , - }, - { - path: 'db-migrate', - element: , - }, - { - path: 'onboard', - element: , - }, - { - path: 'projects/:pname', - element: , - children: [ - { - index: true, - element: , - }, - { - path: 'general-settings', - element: , - }, - { - path: 'general-settings/:unique', - element: , - }, - { - path: 'webhooks', - element: , - }, - { - path: 'additional-settings', - element: , - }, - ], - }, - { - path: '', - element: , - children: [ - { - index: true, - element: , - }, - { - path: 'projects', - element: , - }, - { - path: 'connections', - element: , - }, - { - path: 'connections/:plugin/:id', - element: , - }, - { - path: 'advanced', - children: [ - { - path: 'blueprints', - element: , - }, - { - path: 'blueprints/:id', - element: , - }, - { - path: 'blueprints/:bid/:unique', - element: , - }, - { - path: 'pipelines', - element: , - }, - { - path: 'pipeline/:id', - element: , - }, - ], - }, - { - path: 'keys', - element: , - }, - ], - }, - ], + basename: PATH_PREFIX, }, - { - path: '*', - element: , - }, -]); +); diff --git a/config-ui/src/config/index.ts b/config-ui/src/config/index.ts index 0b9e98ea309..31a275c919c 100644 --- a/config-ui/src/config/index.ts +++ b/config-ui/src/config/index.ts @@ -19,4 +19,3 @@ export * from './cron'; export * from './endpoint'; export * from './entities'; -export * from './paths'; diff --git a/config-ui/src/config/paths.ts b/config-ui/src/config/paths.ts deleted file mode 100644 index e3fdff3c5e6..00000000000 --- a/config-ui/src/config/paths.ts +++ /dev/null @@ -1,37 +0,0 @@ -/* - * Licensed to the Apache Software Foundation (ASF) under one or more - * contributor license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright ownership. - * The ASF licenses this file to You under the Apache License, Version 2.0 - * (the "License"); you may not use this file except in compliance with - * the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * - */ - -import { encodeName } from '@/routes'; - -const PATH_PREFIX = import.meta.env.DEVLAKE_PATH_PREFIX ?? ''; - -export const PATHS = { - ROOT: () => `${PATH_PREFIX}/`, - CONNECTIONS: () => `${PATH_PREFIX}/connections`, - CONNECTION: (plugin: string, connectionId: ID) => `${PATH_PREFIX}/connections/${plugin}/${connectionId}`, - PROJECTS: () => `${PATH_PREFIX}/projects`, - PROJECT: (pname: string) => `${PATH_PREFIX}/projects/${encodeName(pname)}`, - PROJECT_CONNECTION: (pname: string, plugin: string, connectionId: ID) => - `${PATH_PREFIX}/projects/${encodeName(pname)}/general-settings/${plugin}-${connectionId}`, - BLUEPRINTS: () => `${PATH_PREFIX}/advanced/blueprints`, - BLUEPRINT: (bid: ID) => `${PATH_PREFIX}/advanced/blueprints/${bid}`, - BLUEPRINT_CONNECTION: (bid: ID, plugin: string, connectionId: ID) => - `${PATH_PREFIX}/advanced/blueprints/${bid}/${plugin}-${connectionId}`, - PIPELINES: () => `${PATH_PREFIX}/advanced/pipelines`, - APIKEYS: () => `${PATH_PREFIX}/keys`, -}; diff --git a/config-ui/src/plugins/components/connection-list/index.tsx b/config-ui/src/plugins/components/connection-list/index.tsx index 9817058337c..4f06306397b 100644 --- a/config-ui/src/plugins/components/connection-list/index.tsx +++ b/config-ui/src/plugins/components/connection-list/index.tsx @@ -24,7 +24,6 @@ import styled from 'styled-components'; import { selectConnections, removeConnection } from '@/features/connections'; import { Message } from '@/components'; -import { PATHS } from '@/config'; import { useAppDispatch, useAppSelector } from '@/hooks'; import { getPluginConfig, ConnectionStatus, ConnectionForm } from '@/plugins'; import { WebHookConnection } from '@/plugins/register/webhook'; @@ -140,7 +139,7 @@ export const ConnectionList = ({ plugin, onCreate }: Props) => { width: 300, render: (_, { plugin, id }) => ( <> - diff --git a/config-ui/src/plugins/components/scope-config/index.tsx b/config-ui/src/plugins/components/scope-config/index.tsx index 50756a4b33c..db25c43d7b9 100644 --- a/config-ui/src/plugins/components/scope-config/index.tsx +++ b/config-ui/src/plugins/components/scope-config/index.tsx @@ -23,7 +23,6 @@ import styled from 'styled-components'; import API from '@/api'; import { IconButton, Message } from '@/components'; -import { PATHS } from '@/config'; import { getPluginConfig } from '@/plugins'; import { operator } from '@/utils'; @@ -94,7 +93,7 @@ export const ScopeConfig = ({ }); if (success) { - window.open(PATHS.PROJECT(pname)); + window.open(`/projects/${pname}`); } }; diff --git a/config-ui/src/routes/api-keys/api-keys.tsx b/config-ui/src/routes/api-keys/api-keys.tsx index 78bba07d3d3..d97fbe2f3c3 100644 --- a/config-ui/src/routes/api-keys/api-keys.tsx +++ b/config-ui/src/routes/api-keys/api-keys.tsx @@ -23,7 +23,6 @@ import dayjs from 'dayjs'; import API from '@/api'; import { PageHeader, Block, ExternalLink, CopyText, Message } from '@/components'; -import { PATHS } from '@/config'; import { useRefreshData } from '@/hooks'; import { operator, formatTime } from '@/utils'; @@ -93,7 +92,7 @@ export const ApiKeys = () => { return ( diff --git a/config-ui/src/routes/blueprint/connection-detail/index.tsx b/config-ui/src/routes/blueprint/connection-detail/index.tsx index 555691116e0..8483051aef7 100644 --- a/config-ui/src/routes/blueprint/connection-detail/index.tsx +++ b/config-ui/src/routes/blueprint/connection-detail/index.tsx @@ -24,7 +24,6 @@ import { Flex, Popconfirm, Modal, Button } from 'antd'; import API from '@/api'; import { PageLoading, PageHeader, ExternalLink } from '@/components'; -import { PATHS } from '@/config'; import { useRefreshData } from '@/hooks'; import { DataScopeSelect } from '@/plugins'; import { operator } from '@/utils'; @@ -92,7 +91,7 @@ export const BlueprintConnectionDetailPage = () => { }); if (success) { - navigate(pname ? PATHS.PROJECT(pname) : PATHS.BLUEPRINT(blueprint.id), { + navigate(pname ? `/projects/${pname}` : `/advanced/blueprints/${blueprint.id}`, { state: { activeKey: 'status', }, @@ -125,7 +124,7 @@ export const BlueprintConnectionDetailPage = () => { ), onCancel: () => { - navigate(pname ? PATHS.PROJECT(pname) : PATHS.BLUEPRINT(blueprint.id), { + navigate(pname ? `/projects/${pname}` : `/advanced/blueprints/${blueprint.id}`, { state: { tab: 'configuration', }, @@ -182,14 +181,14 @@ export const BlueprintConnectionDetailPage = () => { breadcrumbs={ pname ? [ - { name: 'Projects', path: PATHS.PROJECTS() }, - { name: pname, path: PATHS.PROJECT(pname) }, + { name: 'Projects', path: '/projects' }, + { name: pname, path: `/projects/${pname}` }, { name: `Connection - ${connection.name}`, path: '' }, ] : [ - { name: 'Advanced', path: PATHS.BLUEPRINTS() }, - { name: 'Blueprints', path: PATHS.BLUEPRINTS() }, - { name: bid as any, path: PATHS.BLUEPRINT(bid as any) }, + { name: 'Advanced', path: '/advanced/blueprints' }, + { name: 'Blueprints', path: '/advanced/blueprints' }, + { name: bid as any, path: `/advanced/blueprints/${bid}` }, { name: `Connection - ${connection.name}`, path: '' }, ] } @@ -202,7 +201,7 @@ export const BlueprintConnectionDetailPage = () => { To manage the complete data scope and scope config for this connection, please{' '} - + go to the connection detail page . diff --git a/config-ui/src/routes/blueprint/detail/blueprint-detail-page.tsx b/config-ui/src/routes/blueprint/detail/blueprint-detail-page.tsx index 012c04c1810..7e7a49ff5ac 100644 --- a/config-ui/src/routes/blueprint/detail/blueprint-detail-page.tsx +++ b/config-ui/src/routes/blueprint/detail/blueprint-detail-page.tsx @@ -20,7 +20,6 @@ import { useParams } from 'react-router-dom'; import { Helmet } from 'react-helmet'; import { PageHeader } from '@/components'; -import { PATHS } from '@/config'; import { FromEnum } from '../types'; @@ -34,9 +33,9 @@ export const BlueprintDetailPage = () => { return ( diff --git a/config-ui/src/routes/blueprint/detail/components/add-connection-dialog/index.tsx b/config-ui/src/routes/blueprint/detail/components/add-connection-dialog/index.tsx index 938df24bc00..34d6a834c77 100644 --- a/config-ui/src/routes/blueprint/detail/components/add-connection-dialog/index.tsx +++ b/config-ui/src/routes/blueprint/detail/components/add-connection-dialog/index.tsx @@ -22,7 +22,6 @@ import { PlusOutlined } from '@ant-design/icons'; import { Modal, Select, Space, Button } from 'antd'; import styled from 'styled-components'; -import { PATHS } from '@/config'; import { Block } from '@/components'; import { selectAllConnections } from '@/features/connections'; import { useAppSelector } from '@/hooks'; @@ -124,7 +123,7 @@ export const AddConnectionDialog = ({ disabled = [], onCancel, onSubmit }: Props }} onChange={(value) => { if (!value) { - navigate(PATHS.CONNECTIONS()); + navigate('/connections'); } setSelectedValue(value); }} diff --git a/config-ui/src/routes/blueprint/detail/configuration-panel.tsx b/config-ui/src/routes/blueprint/detail/configuration-panel.tsx index 2262545f0f4..66399f82cad 100644 --- a/config-ui/src/routes/blueprint/detail/configuration-panel.tsx +++ b/config-ui/src/routes/blueprint/detail/configuration-panel.tsx @@ -23,7 +23,7 @@ import { Flex, Table, Button } from 'antd'; import API from '@/api'; import { NoData } from '@/components'; -import { getCron, PATHS } from '@/config'; +import { getCron } from '@/config'; import { ConnectionName } from '@/features/connections'; import { getPluginConfig } from '@/plugins'; import { IBlueprint, IBPMode } from '@/types'; @@ -177,8 +177,8 @@ export const ConfigurationPanel = ({ from, blueprint, onRefresh, onChangeTab }: - If you have not created data connections yet, please{' '} - create connections first and then add them to the project. + If you have not created data connections yet, please create connections{' '} + first and then add them to the project. } action={ @@ -205,8 +205,10 @@ export const ConfigurationPanel = ({ from, blueprint, onRefresh, onChangeTab }: Edit Data Scope and Scope Config diff --git a/config-ui/src/routes/blueprint/detail/status-panel.tsx b/config-ui/src/routes/blueprint/detail/status-panel.tsx index 7f0f02c33c8..a4feee6dfc3 100644 --- a/config-ui/src/routes/blueprint/detail/status-panel.tsx +++ b/config-ui/src/routes/blueprint/detail/status-panel.tsx @@ -23,7 +23,7 @@ import { Card, Modal, Switch, Button, Tooltip, Dropdown, Flex, Space } from 'ant import API from '@/api'; import { Message } from '@/components'; -import { getCron, PATHS } from '@/config'; +import { getCron } from '@/config'; import { useAutoRefresh } from '@/hooks'; import { PipelineInfo, PipelineTasks, PipelineTable } from '@/routes/pipeline'; import { IBlueprint, IPipeline, IPipelineStatus } from '@/types'; @@ -114,7 +114,7 @@ export const StatusPanel = ({ from, blueprint, pipelineId, onRefresh }: Props) = }); if (success) { - navigate(PATHS.BLUEPRINTS()); + navigate('/advanced/blueprints'); } }; diff --git a/config-ui/src/routes/blueprint/home/index.tsx b/config-ui/src/routes/blueprint/home/index.tsx index f8a860a04c3..96c5ab0c8ea 100644 --- a/config-ui/src/routes/blueprint/home/index.tsx +++ b/config-ui/src/routes/blueprint/home/index.tsx @@ -24,7 +24,7 @@ import dayjs from 'dayjs'; import API from '@/api'; import { PageHeader, Block, TextTooltip, IconButton } from '@/components'; -import { getCronOptions, cronPresets, getCron, PATHS } from '@/config'; +import { getCronOptions, cronPresets, getCron } from '@/config'; import { ConnectionName } from '@/features/connections'; import { useRefreshData } from '@/hooks'; import { IBlueprint, IBPMode } from '@/types'; @@ -93,8 +93,8 @@ export const BlueprintHomePage = () => { return ( @@ -121,7 +121,11 @@ export const BlueprintHomePage = () => { title: 'Blueprint Name', key: 'name', render: (_, { id, name }) => ( - + {name} ), @@ -171,7 +175,7 @@ export const BlueprintHomePage = () => { key: 'project', render: (val) => val ? ( - + {val} ) : ( @@ -197,7 +201,7 @@ export const BlueprintHomePage = () => { icon={} helptip="Blueprint Configuration" onClick={() => - navigate(PATHS.BLUEPRINT(val), { + navigate(`/advanced/blueprints/${val}`, { state: { activeKey: 'configuration', }, diff --git a/config-ui/src/routes/connection/connection.tsx b/config-ui/src/routes/connection/connection.tsx index 8092e4a88fa..4670a1839a1 100644 --- a/config-ui/src/routes/connection/connection.tsx +++ b/config-ui/src/routes/connection/connection.tsx @@ -24,10 +24,8 @@ import { theme, Space, Table, Button, Modal, message } from 'antd'; import API from '@/api'; import { PageHeader, Message, IconButton } from '@/components'; -import { PATHS } from '@/config'; -import { useAppSelector } from '@/hooks'; import { selectConnection } from '@/features/connections'; -import { useRefreshData } from '@/hooks'; +import { useAppSelector, useRefreshData } from '@/hooks'; import { ConnectionStatus, DataScopeRemote, @@ -188,7 +186,7 @@ export const Connection = () => { return ( @@ -239,7 +237,7 @@ export const Connection = () => {
    {projects.map((it: string) => (
  • - {it} + {it}
    • ))}
diff --git a/config-ui/src/routes/connection/connections.tsx b/config-ui/src/routes/connection/connections.tsx index 776089b0a80..1148d994a9d 100644 --- a/config-ui/src/routes/connection/connections.tsx +++ b/config-ui/src/routes/connection/connections.tsx @@ -22,7 +22,6 @@ import { theme, Badge, Modal } from 'antd'; import { chunk } from 'lodash'; import { selectPlugins, selectAllConnections, selectWebhooks } from '@/features/connections'; -import { PATHS } from '@/config'; import { useAppSelector } from '@/hooks'; import { getPluginConfig, ConnectionList, ConnectionForm } from '@/plugins'; @@ -71,7 +70,7 @@ export const Connections = () => { }; const handleSuccessAfter = async (plugin: string, id: ID) => { - navigate(PATHS.CONNECTION(plugin, id)); + navigate(`/connections/${plugin}/${id}`); }; return ( diff --git a/config-ui/src/routes/db-migrate/index.tsx b/config-ui/src/routes/db-migrate/index.tsx index 7a83b91b535..1c664fcbd4d 100644 --- a/config-ui/src/routes/db-migrate/index.tsx +++ b/config-ui/src/routes/db-migrate/index.tsx @@ -23,7 +23,6 @@ import { useNavigate } from 'react-router-dom'; import API from '@/api'; import { TipLayout } from '@/components'; -import { PATHS } from '@/config'; import { operator } from '@/utils'; export const DBMigrate = () => { @@ -37,7 +36,7 @@ export const DBMigrate = () => { }); if (success) { - navigate(PATHS.ROOT()); + navigate('/'); } }; diff --git a/config-ui/src/routes/error/index.tsx b/config-ui/src/routes/error/index.tsx index 3e1b1dd50c4..f6d057933b2 100644 --- a/config-ui/src/routes/error/index.tsx +++ b/config-ui/src/routes/error/index.tsx @@ -21,13 +21,12 @@ import { CloseCircleOutlined } from '@ant-design/icons'; import { Card, Space, Flex, Button } from 'antd'; import { TipLayout } from '@/components'; -import { PATHS } from '@/config'; export const Error = () => { const error = useRouteError() as Error; const navigate = useNavigate(); - const handleResetError = () => navigate(PATHS.ROOT()); + const handleResetError = () => navigate('/'); return ( diff --git a/config-ui/src/routes/layout/config.tsx b/config-ui/src/routes/layout/config.tsx index 48cf8159522..8e2b9a6d247 100644 --- a/config-ui/src/routes/layout/config.tsx +++ b/config-ui/src/routes/layout/config.tsx @@ -30,8 +30,6 @@ import { import { DOC_URL } from '@/release'; -const PATH_PREFIX = import.meta.env.DEVLAKE_PATH_PREFIX ?? ''; - type MenuItem = { key: string; label: string; @@ -41,32 +39,32 @@ type MenuItem = { export const menuItems: MenuItem[] = [ { - key: `${PATH_PREFIX}/projects`, + key: '/projects', label: 'Projects', icon: , }, { - key: `${PATH_PREFIX}/connections`, + key: '/connections', label: 'Connections', icon: , }, { - key: `${PATH_PREFIX}/advanced`, + key: '/advanced', label: 'Advanced', icon: , children: [ { - key: `${PATH_PREFIX}/advanced/blueprints`, + key: '/advanced/blueprints', label: 'Blueprints', }, { - key: `${PATH_PREFIX}/advanced/pipelines`, + key: '/advanced/pipelines', label: 'Pipelines', }, ], }, { - key: `${PATH_PREFIX}/keys`, + key: '/keys', label: 'API Keys', icon: , }, diff --git a/config-ui/src/routes/onboard/index.tsx b/config-ui/src/routes/onboard/index.tsx index 239a4b973e8..c2265a1f3b5 100644 --- a/config-ui/src/routes/onboard/index.tsx +++ b/config-ui/src/routes/onboard/index.tsx @@ -22,7 +22,6 @@ import { CloseOutlined, ExclamationCircleOutlined } from '@ant-design/icons'; import { theme, Layout, Modal } from 'antd'; import { selectOnboard } from '@/features/onboard'; -import { PATHS } from '@/config'; import { useAppSelector } from '@/hooks'; import { Step0 } from './step-0'; @@ -72,7 +71,7 @@ export const Onboard = ({ logo, title }: Props) => { content: 'You can get back to this session via the card on top of the Projects page.', icon: , okText: 'Confirm', - onOk: () => navigate(PATHS.ROOT()), + onOk: () => navigate('/'), }); }; diff --git a/config-ui/src/routes/onboard/step-0.tsx b/config-ui/src/routes/onboard/step-0.tsx index c015515f2b5..37c725559d4 100644 --- a/config-ui/src/routes/onboard/step-0.tsx +++ b/config-ui/src/routes/onboard/step-0.tsx @@ -22,7 +22,6 @@ import { Modal, Flex, Button } from 'antd'; import styled from 'styled-components'; import { Logo } from '@/components'; -import { PATHS } from '@/config'; import { update } from '@/features/onboard'; import { useAppDispatch } from '@/hooks'; import { operator } from '@/utils'; @@ -80,7 +79,7 @@ export const Step0 = ({ logo = , title = 'DevLake hideToast: true, }); if (success) { - navigate(PATHS.ROOT()); + navigate('/'); } }, }); diff --git a/config-ui/src/routes/onboard/step-1.tsx b/config-ui/src/routes/onboard/step-1.tsx index a6582c4469d..0862b00ad93 100644 --- a/config-ui/src/routes/onboard/step-1.tsx +++ b/config-ui/src/routes/onboard/step-1.tsx @@ -22,7 +22,6 @@ import { Input, Flex, Button, message } from 'antd'; import API from '@/api'; import { Block, Markdown } from '@/components'; -import { PATHS } from '@/config'; import { selectOnboard, update, previous, changeProjectName, changePlugin } from '@/features/onboard'; import { useAppDispatch, useAppSelector } from '@/hooks'; import { ConnectionSelect } from '@/plugins'; @@ -82,7 +81,7 @@ export const Step1 = () => { description={ <> For self-managed GitLab/GitHub/Bitbucket, please skip the onboarding and configure via{' '} - Data Connections. + Data Connections. } required diff --git a/config-ui/src/routes/onboard/step-2.tsx b/config-ui/src/routes/onboard/step-2.tsx index c306e026c93..9460c6a47f1 100644 --- a/config-ui/src/routes/onboard/step-2.tsx +++ b/config-ui/src/routes/onboard/step-2.tsx @@ -22,7 +22,6 @@ import { Flex, Button, Tooltip } from 'antd'; import API from '@/api'; import { Markdown } from '@/components'; -import { PATHS } from '@/config'; import { selectOnboard, previous, update } from '@/features/onboard'; import { useAppDispatch, useAppSelector } from '@/hooks'; import { getPluginConfig } from '@/plugins'; @@ -120,7 +119,7 @@ export const Step2 = () => { subLabel={

Create a personal access token in GitHub. For self-managed {config.name}, please skip the onboarding - and configure via Data Connections. + and configure via Data Connections.

} initialValue="" diff --git a/config-ui/src/routes/pipeline/pipeline.tsx b/config-ui/src/routes/pipeline/pipeline.tsx index 9e142388565..b02551f2f9a 100644 --- a/config-ui/src/routes/pipeline/pipeline.tsx +++ b/config-ui/src/routes/pipeline/pipeline.tsx @@ -19,7 +19,6 @@ import { useParams } from 'react-router-dom'; import { Card } from 'antd'; import { PageHeader } from '@/components'; -import { PATHS } from '@/config'; import { PipelineInfo, PipelineTasks } from './components'; @@ -29,8 +28,8 @@ export const Pipeline = () => { return ( { return ( { if (success) { setVersion((v) => v + 1); - navigate(PATHS.PROJECT(name), { + navigate(`/projects/${encodeURIComponent(pname)}`, { state: { tabId: 'settings', }, @@ -136,7 +135,7 @@ export const ProjectAdditionalSettings = () => { }); if (success) { - navigate(PATHS.PROJECTS()); + navigate('/projects'); } }; diff --git a/config-ui/src/routes/project/home/index.tsx b/config-ui/src/routes/project/home/index.tsx index a84dd6506bb..75cf7b264e3 100644 --- a/config-ui/src/routes/project/home/index.tsx +++ b/config-ui/src/routes/project/home/index.tsx @@ -23,7 +23,7 @@ import { Flex, Table, Button, Modal, Input } from 'antd'; import API from '@/api'; import { PageHeader, Block, IconButton } from '@/components'; -import { getCron, PATHS } from '@/config'; +import { getCron } from '@/config'; import { ConnectionName } from '@/features/connections'; import { useRefreshData } from '@/hooks'; import { OnboardTour } from '@/routes/onboard/components'; @@ -102,7 +102,7 @@ export const ProjectHomePage = () => { }; return ( - + + + + + Add New Connection + + ); } return ( @@ -123,7 +126,7 @@ export const AddConnectionDialog = ({ disabled = [], onCancel, onSubmit }: Props }} onChange={(value) => { if (!value) { - navigate('/connections'); + return; } setSelectedValue(value); }} diff --git a/config-ui/src/routes/blueprint/detail/components/index.ts b/config-ui/src/routes/blueprint/detail/components/index.ts index 3d9b2044e8f..ab8f3f607d0 100644 --- a/config-ui/src/routes/blueprint/detail/components/index.ts +++ b/config-ui/src/routes/blueprint/detail/components/index.ts @@ -18,5 +18,4 @@ export * from './add-connection-dialog'; export * from './advanced-editor'; -export * from './update-name-dialog'; export * from './update-policy-dialog'; diff --git a/config-ui/src/routes/blueprint/detail/components/update-name-dialog/index.tsx b/config-ui/src/routes/blueprint/detail/components/update-name-dialog/index.tsx deleted file mode 100644 index 8914ed12edd..00000000000 --- a/config-ui/src/routes/blueprint/detail/components/update-name-dialog/index.tsx +++ /dev/null @@ -1,53 +0,0 @@ -/* - * Licensed to the Apache Software Foundation (ASF) under one or more - * contributor license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright ownership. - * The ASF licenses this file to You under the Apache License, Version 2.0 - * (the "License"); you may not use this file except in compliance with - * the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * - */ - -import { useState, useEffect } from 'react'; -import { Modal, Input } from 'antd'; - -interface Props { - name: string; - operating: boolean; - onCancel: () => void; - onSubmit: (name: string) => void; -} - -export const UpdateNameDialog = ({ operating, onCancel, onSubmit, ...props }: Props) => { - const [name, setName] = useState(''); - - useEffect(() => { - setName(props.name); - }, [props.name]); - - return ( - onSubmit(name)} - > -

Blueprint Name

-

Give your Blueprint a unique name to help you identify it in the future.

- setName(e.target.value)} /> - - ); -}; diff --git a/config-ui/src/routes/blueprint/detail/configuration-panel.tsx b/config-ui/src/routes/blueprint/detail/configuration-panel.tsx index 66399f82cad..cd1dd8ae8f9 100644 --- a/config-ui/src/routes/blueprint/detail/configuration-panel.tsx +++ b/config-ui/src/routes/blueprint/detail/configuration-panel.tsx @@ -32,7 +32,7 @@ import { formatTime, operator } from '@/utils'; import { FromEnum } from '../types'; import { validRawPlan } from '../utils'; -import { AdvancedEditor, UpdateNameDialog, UpdatePolicyDialog, AddConnectionDialog } from './components'; +import { AdvancedEditor, UpdatePolicyDialog, AddConnectionDialog } from './components'; import * as S from './styled'; interface Props { @@ -43,7 +43,7 @@ interface Props { } export const ConfigurationPanel = ({ from, blueprint, onRefresh, onChangeTab }: Props) => { - const [type, setType] = useState<'name' | 'policy' | 'add-connection'>(); + const [type, setType] = useState<'policy' | 'add-connection'>(); const [rawPlan, setRawPlan] = useState(''); const [operating, setOperating] = useState(false); @@ -72,10 +72,6 @@ export const ConfigurationPanel = ({ from, blueprint, onRefresh, onChangeTab }: setType(undefined); }; - const handleShowNameDialog = () => { - setType('name'); - }; - const handleShowPolicyDialog = () => { setType('policy'); }; @@ -120,11 +116,6 @@ export const ConfigurationPanel = ({ from, blueprint, onRefresh, onChangeTab }: return ( -
-

Blueprint Name

- {blueprint.name} -

Sync Policy @@ -244,14 +235,6 @@ export const ConfigurationPanel = ({ from, blueprint, onRefresh, onChangeTab }:

)} - {type === 'name' && ( - handleUpdate({ name })} - /> - )} {type === 'policy' && ( { key: 'name', render: (name: string) => ( { ref={configRef} type="primary" icon={} - helptip="Project Configuration" + helptip="Project Settings" onClick={() => - navigate(`/projects/${encodeURIComponent(name)}`, { + navigate(`/projects/${encodeURIComponent(name)}/general-settings`, { state: { activeKey: 'configuration' }, }) } diff --git a/config-ui/src/routes/project/layout/index.tsx b/config-ui/src/routes/project/layout/index.tsx index f2fc08d520d..fe504e32547 100644 --- a/config-ui/src/routes/project/layout/index.tsx +++ b/config-ui/src/routes/project/layout/index.tsx @@ -17,7 +17,7 @@ */ import { useMemo } from 'react'; -import { useParams, useNavigate, useLocation, Outlet } from 'react-router-dom'; +import { useParams, useNavigate, useLocation, Link, Outlet } from 'react-router-dom'; import { RollbackOutlined } from '@ant-design/icons'; import { Layout, Menu } from 'antd'; @@ -52,18 +52,49 @@ const items = [ }, ]; +const breadcrumbs = (paths: string[]) => { + const map: Record< + string, + { + path: string; + name: string; + } + > = { + '/config': { + path: '/', + name: 'Configurations', + }, + projects: { + path: '/projects', + name: 'Projects', + }, + }; + + return paths + .filter((p) => p) + .map( + (p) => + map[p] ?? { + path: `/projects/${p}`, + name: p, + }, + ); +}; + export const ProjectLayout = () => { const { pname } = useParams() as { pname: string }; const navigate = useNavigate(); const { pathname } = useLocation(); - const { selectedKeys, breadcrumbs } = useMemo(() => { - const key = pathname.split('/').pop(); + const { paths, selectedKeys, title } = useMemo(() => { + const paths = pathname.split('/'); + const key = paths.pop(); const item = items.find((i) => i.key === key); return { + paths, selectedKeys: key ? [key] : [], - breadcrumbs: [ + title: [ { name: item?.label ?? '', path: '', @@ -90,8 +121,15 @@ export const ProjectLayout = () => { -

Configurations / Projects / {pname} /

- +

+ {breadcrumbs(paths).map((b) => ( + + {b.name} + / + + ))} +

+ diff --git a/config-ui/src/routes/project/webhook/index.tsx b/config-ui/src/routes/project/webhook/index.tsx index 9d267b243f6..20e828f714f 100644 --- a/config-ui/src/routes/project/webhook/index.tsx +++ b/config-ui/src/routes/project/webhook/index.tsx @@ -135,7 +135,7 @@ export const ProjectWebhook = () => {
To calculate DORA after receiving Webhook data immediately, you can visit the{' '} - Status tab + Status tab {' '} of the Blueprint page and click on Run Now.