[master] refactor: modify the path of the extension center (#4414)

refactor: change extensions management path

Signed-off-by: donniean <donniean1@gmail.com>
Co-authored-by: donniean <donniean1@gmail.com>

Author: ks-ci-bot

packages/console/src/pages/platform/containers/Dashboard/DashboardCard/index.tsx

@@ -76,7 +76,7 @@ const DashboardCard = () => {
       title: 'EXTENSIONS_CENTER',
       desc: 'EXTENSION_DESC',
       name: 'INSTALLED_COMPONENT',
-      link: '/extensions/manager',
+      link: '/extensions/management',
       metric: 'platform_installplan_count',
       label: 'Powered by LuBan',
       hide: hideExtensions,

packages/core/src/constants/extension.ts

@@ -43,7 +43,7 @@ function getDetail({
 }
 
 const EXTENSIONS_MARKETPLACE_PATH = `/extensions/marketplace`;
-const EXTENSIONS_MANAGER_PATH = `/extensions/manager`;
+const EXTENSIONS_MANAGEMENT_PATH = `/extensions/management`;
 const EXTENSIONS_PAGE_PATHS = {
   marketplace: {
     index: EXTENSIONS_MARKETPLACE_PATH,
@@ -54,11 +54,11 @@ const EXTENSIONS_PAGE_PATHS = {
         version: options?.version,
       }),
   },
-  manager: {
-    index: EXTENSIONS_MANAGER_PATH,
+  management: {
+    index: EXTENSIONS_MANAGEMENT_PATH,
     getDetail: (extensionName: string, options?: { version?: string }) =>
       getDetail({
-        basePath: EXTENSIONS_MANAGER_PATH,
+        basePath: EXTENSIONS_MANAGEMENT_PATH,
         extensionName,
         version: options?.version,
       }),

packages/core/src/containers/Extensions/Manager/Detail/index.tsx renamed to packages/core/src/containers/Extensions/Management/Detail/index.tsx

@@ -30,7 +30,7 @@ import { DetailActionButtons } from '../components/DetailActionButtons';
 import { InstalledVersionWrapper } from './styles';
 import { useMarketplaceConfigQuery } from '../../../../stores/marketplace';
 
-export default function ExtensionsManagerDetail() {
+export function ExtensionsManagementDetail() {
   const navigate = useNavigate();
   const { name: extensionName = '', version: pathVersion } = useParams();
   const {
@@ -257,11 +257,11 @@ export default function ExtensionsManagerDetail() {
       isShowInstalledClusters={Boolean(isInstalled && isMultiClusterInstallation)}
       onVersionChange={(selectedVersion: string) =>
         navigate(
-          EXTENSIONS_PAGE_PATHS.manager.getDetail(extensionName, { version: selectedVersion }),
+          EXTENSIONS_PAGE_PATHS.management.getDetail(extensionName, { version: selectedVersion }),
           { replace: true },
         )
       }
-      onBackButtonClick={() => navigate(EXTENSIONS_PAGE_PATHS.manager.index)}
+      onBackButtonClick={() => navigate(EXTENSIONS_PAGE_PATHS.management.index)}
     />
   );
 }

packages/core/src/containers/Extensions/Manager/Detail/styles.ts renamed to packages/core/src/containers/Extensions/Management/Detail/styles.ts

@@ -209,7 +209,9 @@ function Extensions() {
           return (
             <ExtensionField
               value={
-                <Link to={EXTENSIONS_PAGE_PATHS.manager.getDetail(name)}>{localeDisplayName}</Link>
+                <Link to={EXTENSIONS_PAGE_PATHS.management.getDetail(name)}>
+                  {localeDisplayName}
+                </Link>
               }
               label={localeDescription}
               avatar={<Icon src={displayIcon} alt={localeDisplayName} />}

packages/core/src/containers/Extensions/Manager/actions/index.ts renamed to packages/core/src/containers/Extensions/Management/actions/index.ts

@@ -40,7 +40,7 @@ function ExternalDependency({
   const localeDescription = dependencyFormattedExtension?.localeDescription;
 
   const nameContent = isExtensionExists ? (
-    <Link to={EXTENSIONS_PAGE_PATHS.manager.getDetail(name)}>{dependencyLocaleDisplayName}</Link>
+    <Link to={EXTENSIONS_PAGE_PATHS.management.getDetail(name)}>{dependencyLocaleDisplayName}</Link>
   ) : (
     <ExtensionNotExistsNameWrapper>
       <span>{dependencyLocaleDisplayName}</span>

packages/core/src/containers/Extensions/Manager/components/ClusterLogsModal/ClusterLog.styles.ts renamed to packages/core/src/containers/Extensions/Management/components/ClusterLogsModal/ClusterLog.styles.ts

@@ -10,7 +10,7 @@ import { PlugCircle } from '@kubed/icons';
 import { Extensions } from './components/Extensions';
 import { Wrapper } from './styles';
 
-export default function ExtensionsManager() {
+export function ExtensionsManagement() {
   return (
     <Wrapper>
       <Banner

packages/core/src/containers/Extensions/Manager/components/ClusterLogsModal/ClusterLog.tsx renamed to packages/core/src/containers/Extensions/Management/components/ClusterLogsModal/ClusterLog.tsx

@@ -58,7 +58,7 @@ function ActionButtons({ page, formattedExtension, formattedMarketplaceConfig }:
     }
   };
 
-  const handleManageButtonClick = () => navigate(EXTENSIONS_PAGE_PATHS.manager.getDetail(name));
+  const handleManageButtonClick = () => navigate(EXTENSIONS_PAGE_PATHS.management.getDetail(name));
 
   if (actionType === 'subscribe') {
     return (
@@ -82,7 +82,7 @@ function ActionButtons({ page, formattedExtension, formattedMarketplaceConfig }:
           visible={modal.isOpen}
           title={t('BIND_MARKETPLACE_ACCOUNT')}
           okText={t('GO')}
-          onOk={() => navigate(EXTENSIONS_PAGE_PATHS.manager.index)}
+          onOk={() => navigate(EXTENSIONS_PAGE_PATHS.management.index)}
           onCancel={modal.close}
         >
           <ConfirmModalContent>{t('BIND_MARKETPLACE_ACCOUNT_DESCRIPTION')}</ConfirmModalContent>

packages/core/src/containers/Extensions/Manager/components/ClusterLogsModal/ClusterLogsModal.styles.ts renamed to packages/core/src/containers/Extensions/Management/components/ClusterLogsModal/ClusterLogsModal.styles.ts

@@ -39,7 +39,7 @@ function Extension({ formattedExtension, formattedMarketplaceConfig }: Extension
   const localeProviderName = localeProvider?.name;
   // const isSubscribed = marketplace?.isSubscribed;
   // const detailPath =
-  // EXTENSIONS_PAGE_PATHS[isSubscribed ? 'manager' : 'marketplace'].getDetail(name);
+  // EXTENSIONS_PAGE_PATHS[isSubscribed ? 'management' : 'marketplace'].getDetail(name);
   const detailPath = EXTENSIONS_PAGE_PATHS.marketplace.getDetail(name);
 
   const ref = useRef<HTMLParagraphElement>(null);

packages/core/src/containers/Extensions/Manager/components/ClusterLogsModal/ClusterLogsModal.tsx renamed to packages/core/src/containers/Extensions/Management/components/ClusterLogsModal/ClusterLogsModal.tsx

@@ -9,8 +9,8 @@ import type { RouteObject } from 'react-router-dom';
 import { EXTENSIONS_PAGE_PATHS } from '../../../constants/extension';
 import ExtensionsMarketplace from '../Marketplace';
 import ExtensionsMarketplaceDetail from '../Marketplace/Detail';
-import ExtensionsManager from '../Manager';
-import ExtensionsManagerDetail from '../Manager/Detail';
+import { ExtensionsManagement } from '../Management';
+import { ExtensionsManagementDetail } from '../Management/Detail';
 
 const routes: RouteObject[] = [
   {
@@ -26,16 +26,16 @@ const routes: RouteObject[] = [
     element: <ExtensionsMarketplaceDetail />,
   },
   {
-    path: EXTENSIONS_PAGE_PATHS.manager.index,
-    element: <ExtensionsManager />,
+    path: EXTENSIONS_PAGE_PATHS.management.index,
+    element: <ExtensionsManagement />,
   },
   {
-    path: EXTENSIONS_PAGE_PATHS.manager.getDetail(':name'),
-    element: <ExtensionsManagerDetail />,
+    path: EXTENSIONS_PAGE_PATHS.management.getDetail(':name'),
+    element: <ExtensionsManagementDetail />,
   },
   {
-    path: EXTENSIONS_PAGE_PATHS.manager.getDetail(':name', { version: ':version' }),
-    element: <ExtensionsManagerDetail />,
+    path: EXTENSIONS_PAGE_PATHS.management.getDetail(':name', { version: ':version' }),
+    element: <ExtensionsManagementDetail />,
   },
 ];
 

packages/core/src/containers/Extensions/Manager/components/ClusterLogsModal/ClusterTabLabel.styles.ts renamed to packages/core/src/containers/Extensions/Management/components/ClusterLogsModal/ClusterTabLabel.styles.ts

@@ -62,8 +62,8 @@ export const isExtensionsMarketplacePage = (path = location.pathname, isIndex?:
   return path === indexPage || path.startsWith(`${indexPage}/`);
 };
 
-const isExtensionsManagerDetailPage = (path = location.pathname) => {
-  const indexPage = '/extensions/manager';
+const isExtensionsManagementDetailPage = (path = location.pathname) => {
+  const indexPage = '/extensions/management';
 
   return path.startsWith(`${indexPage}/`);
 };
@@ -73,7 +73,7 @@ export const isDarkHeader = (path = location.pathname) => {
 };
 
 export const isTransparentHeader = (path = location.pathname) => {
-  return isExtensionsMarketplacePage(path) || isExtensionsManagerDetailPage(path);
+  return isExtensionsMarketplacePage(path) || isExtensionsManagementDetailPage(path);
 };
 
 export const isMemberClusterPage = (path = location.pathname, message: string) => {