[master] fix: fix missing introduction and image in app template (#4396)

* fix: fix missing introduction and image in app template Signed-off-by: ROOMrepair <[email protected]> * remove redundant comment Signed-off-by: ROOMrepair <[email protected]> --------- Signed-off-by: ROOMrepair <[email protected]> Co-authored-by: ROOMrepair <[email protected]>
kubesphere · Dec 25, 2024 · bc7d578 · bc7d578
1 parent a8e2884
commit bc7d578
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 5 deletions.
diff --git a/packages/shared/src/components/Apps/AppInformation/AppInfo/index.tsx b/packages/shared/src/components/Apps/AppInformation/AppInfo/index.tsx
@@ -14,7 +14,7 @@ import { request } from '../../../../utils';
 import { AppDetailWrapper, LabelText, ImageWrapper, ImageItem } from './styles';
 
 type Props = {
-  appDetail: AppDetail;
+  appDetail: AppDetail | null;
   versionDetail: AppVersion[];
 };
 
@@ -36,6 +36,7 @@ export function AppInfo({ appDetail, versionDetail }: Props): JSX.Element {
   const [filterImages, setFilterImages] = useState<string[]>([]);
 
   async function getList() {
+    if (!appDetail) return;
     const { workspace } = appDetail;
     // @ts-ignore
     const list: string[] = await Promise.all(screenshots?.map(item => getImage(item, workspace)));

diff --git a/packages/shared/src/components/Apps/AppInformation/index.tsx b/packages/shared/src/components/Apps/AppInformation/index.tsx
@@ -3,29 +3,41 @@
  * https://github.com/kubesphere/console/blob/master/LICENSE
  */
 
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { Card } from '@kubed/components';
 import { useParams } from 'react-router-dom';
 
 import { useCacheStore as useStore } from '../../../index';
 import { AppInfo, LabelText } from './AppInfo';
 import type { AppDetail } from '../../../types';
-import { useAppVersionList } from '../../../stores/openpitrix';
 
+import { isRadonDB } from '../../../utils';
+import { openpitrixStore } from '../../../stores';
+
+const { useAppVersionList, fetchAppDetail, fetchDMPDetail } = openpitrixStore;
 export { AppInfo, LabelText };
 
 export function AppInformation(): JSX.Element {
   const { appName, workspace } = useParams();
-  const [selectedApp] = useStore<AppDetail>('selectedApp');
+  // const [selectedApp, setSelectedApp] = useStore<AppDetail>('selectedApp');
+  const [selectedAppState, setSelectedAppState] = useState<AppDetail | null>(null);
+
   const { data: versions = [] } = useAppVersionList(
     { appName: appName, workspace },
     { status: 'active' },
     { autoFetch: !!appName },
   );
 
+  useEffect(() => {
+    if (!appName) return;
+    (isRadonDB(appName) ? fetchDMPDetail : fetchAppDetail)({ appName, app_id: appName }).then(
+      setSelectedAppState,
+    );
+  }, [appName]);
+
   return (
     <Card sectionTitle={t('APP_INFORMATION')}>
-      <AppInfo appDetail={selectedApp} versionDetail={versions} />
+      <AppInfo appDetail={selectedAppState} versionDetail={versions} />
     </Card>
   );
 }