From 969e1f903f5bd38e763be3c68677af6a15035494 Mon Sep 17 00:00:00 2001 From: james-tran-3005 Date: Thu, 14 Nov 2024 14:59:03 +0700 Subject: [PATCH] fix(portal): fix bug regression test --- .../src/components/APIServerDrawer/index.tsx | 3 +- .../src/components/Method/index.module.scss | 12 +- .../src/components/Method/index.tsx | 3 +- .../components/APIServerCard.tsx | 181 +++++++++--------- .../src/pages/APIServerList/index.tsx | 2 +- .../VersionDetail/index.module.scss | 7 + .../components/VersionDetail/index.tsx | 111 ++++++----- .../components/VersionSelect/index.tsx | 12 +- .../src/pages/MappingTemplate/index.tsx | 8 +- .../components/HeaderMapping/index.tsx | 1 + .../src/pages/NewAPIMapping/index.tsx | 2 + .../src/utils/types/common.type.ts | 21 +- 12 files changed, 180 insertions(+), 183 deletions(-) diff --git a/kraken-app/kraken-app-portal/src/components/APIServerDrawer/index.tsx b/kraken-app/kraken-app-portal/src/components/APIServerDrawer/index.tsx index 50f26f0d..3d04adf6 100644 --- a/kraken-app/kraken-app-portal/src/components/APIServerDrawer/index.tsx +++ b/kraken-app/kraken-app-portal/src/components/APIServerDrawer/index.tsx @@ -59,7 +59,7 @@ const APIServerDrawer = ({ item, isOpen, onClose }: Props) => { render: (item: Record) => { const linkKey = findLinkedComponent(item.metadata.key); return ( - + @@ -130,6 +130,7 @@ const APIServerDrawer = ({ item, isOpen, onClose }: Props) => { ].length > 0 ? ( { const methodColor = useMemo(() => { @@ -21,7 +22,7 @@ const RequestMethod = ({ method = "", noSpace = false, disabled = false }) => { return ( { title={ - - - {get(item, "metadata.name", "")} - - + + {get(item, "metadata.name", "")} +
{isHover && isApiInUse ? ( @@ -112,7 +108,7 @@ const APIServerCard = ({ item, refetchList }: Props) => { )}
- + @@ -127,98 +123,79 @@ const APIServerCard = ({ item, refetchList }: Props) => { } > - - - - - Seller API Server basics - - - - - Application name - - - {get(item, "metadata.name")} - - - - - - Online API document link - - - {get(item, "facets.baseSpec.path", "-")} - - - - - Description - - - {get(item, "metadata.description", "description")} - - - - - - - - - Base URL for environment variables - + + + + + Application name + + + {get(item, "metadata.name")} + - - {environmentData?.map((e) => ( - - - {e.name} - - - URL: {e.url} - - - ))} + + + Online API document link + + + {get(item, "facets.baseSpec.path", "-")} + - - - - - API spec + + + Description + + + {get(item, "metadata.description", "description")} + - - - - API spec in yaml format - - - - - - {fileName} + + + + {environmentData?.map((e) => ( + + + {e.name} + + URL: {e.url} + + ))} + + + + + + API spec in yaml format + - + + + + {fileName} + + + @@ -226,3 +203,17 @@ const APIServerCard = ({ item, refetchList }: Props) => { }; export default APIServerCard; + +function Group({ title, children }: Readonly>) { + return ( + + + + {title} + + + {children} + + + ) +} diff --git a/kraken-app/kraken-app-portal/src/pages/APIServerList/index.tsx b/kraken-app/kraken-app-portal/src/pages/APIServerList/index.tsx index 77d27437..a978b40e 100644 --- a/kraken-app/kraken-app-portal/src/pages/APIServerList/index.tsx +++ b/kraken-app/kraken-app-portal/src/pages/APIServerList/index.tsx @@ -39,7 +39,7 @@ const APIServerList = () => { {dataList?.data?.map((item: IComponent) => ( diff --git a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.module.scss b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.module.scss index bae6e547..2ee9ba7f 100644 --- a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.module.scss +++ b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.module.scss @@ -11,6 +11,13 @@ display: flex; flex: 1; + .blank { + flex: 1; + display: flex; + justify-content: center; + align-items: center; + } + .flexOne { flex: 1; } diff --git a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.tsx b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.tsx index 19a2570a..7dbe2d77 100644 --- a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.tsx +++ b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionDetail/index.tsx @@ -1,19 +1,16 @@ import RichTextViewer from "@/components/RichTextViewer"; -import { Text } from "@/components/Text"; +import { SecondaryText, Text } from "@/components/Text"; import { IReleaseHistory } from "@/utils/types/product.type"; import { Flex, Tag } from "antd"; -import { isEmpty } from "lodash"; import { useState } from "react"; import { DetailDrawer } from "../VersionSelect/DetailDrawer"; import { UpgradeProcess } from "./UpgradeProcess"; import styles from "./index.module.scss"; import { useGetSystemInfo } from "@/hooks/user"; -type Props = { - data: IReleaseHistory; -}; - -const VersionDetail = ({ data }: Props) => { +export function VersionDetail({ data }: Readonly<{ + data?: IReleaseHistory; +}>) { const { data: info } = useGetSystemInfo(); // To view details of upgrade history @@ -22,50 +19,54 @@ const VersionDetail = ({ data }: Props) => { return ( <>
- {!isEmpty(data) && ( - <> - - - {data.productVersion} - + + + {data?.productVersion} + - - - Current version - - Control plane - - {info?.controlProductVersion ?? 'N/A'} - - Stage - - {info?.stageProductVersion ?? 'N/A'} - - - Production - - - {info?.productionProductVersion ?? 'N/A'} - - - + + + Current version + + Control plane + + {info?.controlProductVersion ?? 'N/A'} + + Stage + + {info?.stageProductVersion ?? 'N/A'} + + + Production + + + {info?.productionProductVersion ?? 'N/A'} + + + -
+
+ {!data ? ( +
+ No release selected +
+ ) : ( + <> { -
- - )} + + )} +
setDeploymentId(null)} /> ); }; - -export default VersionDetail; diff --git a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionSelect/index.tsx b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionSelect/index.tsx index ccc9be76..50ba4193 100644 --- a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionSelect/index.tsx +++ b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/components/VersionSelect/index.tsx @@ -67,7 +67,7 @@ function LoadMoreContent({ return "Nothing more to load"; } -const VersionSelect = ({ +export const VersionSelect = ({ isFetchingNextPage, hasNextPage, data, @@ -77,8 +77,8 @@ const VersionSelect = ({ onFetchNext, }: Readonly<{ data: IReleaseHistory[]; - selectedVersion: string; - setSelectedVersion: (version: string) => void; + selectedVersion: string | null | undefined; + setSelectedVersion: (templateUpgradeId: string) => void; // Inifinite scroll loading?: boolean; isFetchingNextPage?: boolean; @@ -120,6 +120,10 @@ const VersionSelect = ({ const listRelease = filterBy === "All" ? data : data.filter((item) => item.status === filterBy); + useEffect(() => { + setSelectedVersion(listRelease[0]?.templateUpgradeId ?? null) + }, [filterBy]) + return (
@@ -216,5 +220,3 @@ const VersionSelect = ({
); }; - -export default VersionSelect; diff --git a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/index.tsx b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/index.tsx index a6fa105d..f915ed51 100644 --- a/kraken-app/kraken-app-portal/src/pages/MappingTemplate/index.tsx +++ b/kraken-app/kraken-app-portal/src/pages/MappingTemplate/index.tsx @@ -7,8 +7,8 @@ import { IReleaseHistory } from "@/utils/types/product.type"; import { RightOutlined } from "@ant-design/icons"; import { Flex, Tag, Empty } from "antd"; import { omit } from "lodash"; -import VersionDetail from "./components/VersionDetail"; -import VersionSelect from "./components/VersionSelect"; +import { VersionDetail } from "./components/VersionDetail"; +import { VersionSelect } from "./components/VersionSelect"; import { Text } from "@/components/Text"; import DoneIcon from "@/assets/icon/upgrade-done.svg"; import ReleaseIcon from "@/assets/release-bg.svg"; @@ -39,12 +39,12 @@ export default function MappingTemplate() { }) ); - const [selectedVersion, setSelectedVersion] = useState(""); + const [selectedVersion, setSelectedVersion] = useState(undefined); const releases = releaseData?.pages?.flatMap((page) => page.data.data); useEffect(() => { - if (releases?.length && !selectedVersion) { + if (releases?.length && selectedVersion === undefined) { // Select latest version as default setSelectedVersion(releases[0].templateUpgradeId); } diff --git a/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/components/HeaderMapping/index.tsx b/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/components/HeaderMapping/index.tsx index 92ab96c4..384f7750 100644 --- a/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/components/HeaderMapping/index.tsx +++ b/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/components/HeaderMapping/index.tsx @@ -106,6 +106,7 @@ const HeaderMapping = ({ const handleClick = () => { Modal.confirm({ className: styles.confirm, + centered: true, content: "Are you sure to remove this API? All the related properties will be removed as well. Continue?", okButtonProps: { diff --git a/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/index.tsx b/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/index.tsx index c6034821..dd8abed4 100644 --- a/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/index.tsx +++ b/kraken-app/kraken-app-portal/src/pages/NewAPIMapping/index.tsx @@ -414,6 +414,8 @@ const NewAPIMapping = ({ setListMappingStateResponse( buildInitListMapping(mappers?.response as any, "response") ); + // Store to default seller api? + setSellerApi(defaultSellerApi); setActiveTab("request"); }; diff --git a/kraken-app/kraken-app-portal/src/utils/types/common.type.ts b/kraken-app/kraken-app-portal/src/utils/types/common.type.ts index b29069a4..e1934408 100644 --- a/kraken-app/kraken-app-portal/src/utils/types/common.type.ts +++ b/kraken-app/kraken-app-portal/src/utils/types/common.type.ts @@ -1,3 +1,5 @@ +import { IComponent } from "./component.type"; + export interface IPagingData { data: T[]; total: number; @@ -54,24 +56,11 @@ export interface IUnifiedAsset { syncMetadata: ISyncMetadata; } -interface ControlPlane { - kind: string; - apiVersion: string; - metadata: IMetadata; - facets: Record; - links: any[]; - id: string; - parentId: string; - createdAt: string; - updatedAt: string; - syncMetadata: ISyncMetadata; -} - export interface IEndpointUsageAsset { endpointUsage: { - controlPlane: ControlPlane[]; - dataPlaneProduction: any[]; - dataPlaneStage: any[]; + controlPlane: IComponent[]; + dataPlaneProduction: IComponent[]; + dataPlaneStage: IComponent[]; }; }