diff --git a/frontend/public/images/project-templates/project-templates-new-location.png b/frontend/public/images/project-templates/project-templates-new-location.png deleted file mode 100644 index dd08f19a6..000000000 Binary files a/frontend/public/images/project-templates/project-templates-new-location.png and /dev/null differ diff --git a/frontend/src/components/projects/ProjectSettings/components/ProjectTemplatesTab/components/ProjectTemplatesTable.tsx b/frontend/src/components/projects/ProjectSettings/components/ProjectTemplatesTab/components/ProjectTemplatesTable.tsx index 7448249ec..0465973e2 100644 --- a/frontend/src/components/projects/ProjectSettings/components/ProjectTemplatesTab/components/ProjectTemplatesTable.tsx +++ b/frontend/src/components/projects/ProjectSettings/components/ProjectTemplatesTab/components/ProjectTemplatesTable.tsx @@ -25,6 +25,7 @@ import { import { OrgPermissionActions, OrgPermissionSubjects, useSubscription } from "@app/context"; import { useGetProjectTypeFromRoute, usePopUp } from "@app/hooks"; import { TProjectTemplate, useListProjectTemplates } from "@app/hooks/api/projectTemplates"; +import { ProjectType } from "@app/hooks/api/workspace/types"; import { DeleteProjectTemplateModal } from "./DeleteProjectTemplateModal"; @@ -40,6 +41,7 @@ export const ProjectTemplatesTable = ({ onEdit }: Props) => { const { isPending, data: projectTemplates = [] } = useListProjectTemplates(projectType, { enabled: subscription?.projectTemplates && Boolean(projectType) }); + const [search, setSearch] = useState(""); const { popUp, handlePopUpOpen, handlePopUpToggle } = usePopUp(["deleteTemplate"] as const); @@ -52,7 +54,9 @@ export const ProjectTemplatesTable = ({ onEdit }: Props) => { [search, projectTemplates] ); - const isSecretManagerTemplates = projectType === "secret-manager"; + const isSecretManagerTemplates = projectType === ProjectType.SecretManager; + + const colSpan = isSecretManagerTemplates ? 4 : 3; return (
@@ -73,10 +77,10 @@ export const ProjectTemplatesTable = ({ onEdit }: Props) => { - {isPending && ( + {subscription?.projectTemplates && isPending && ( )} @@ -170,9 +174,10 @@ export const ProjectTemplatesTable = ({ onEdit }: Props) => { ); })} - {!isPending && filteredTemplates?.length === 0 && ( + {(!subscription?.projectTemplates || + (!isPending && filteredTemplates?.length === 0)) && ( - + { +export const NoticeBannerV2 = ({ title, children, className, titleClassName }: Props) => { return (
{ className )} > -
+
{title}
diff --git a/frontend/src/pages/organization/SettingsPage/components/OrgTabGroup/OrgTabGroup.tsx b/frontend/src/pages/organization/SettingsPage/components/OrgTabGroup/OrgTabGroup.tsx index bb2afdcc5..92979d5f7 100644 --- a/frontend/src/pages/organization/SettingsPage/components/OrgTabGroup/OrgTabGroup.tsx +++ b/frontend/src/pages/organization/SettingsPage/components/OrgTabGroup/OrgTabGroup.tsx @@ -1,9 +1,11 @@ import { useState } from "react"; -import { useSearch } from "@tanstack/react-router"; +import { DotLottieReact } from "@lottiefiles/dotlottie-react"; +import { Link, useSearch } from "@tanstack/react-router"; import { Tab, TabList, TabPanel, Tabs } from "@app/components/v2"; import { NoticeBannerV2 } from "@app/components/v2/NoticeBannerV2/NoticeBannerV2"; import { ROUTE_PATHS } from "@app/const/routes"; +import { ProjectType } from "@app/hooks/api/workspace/types"; import { AuditLogStreamsTab } from "../AuditLogStreamTab"; import { ImportTab } from "../ImportTab"; @@ -36,22 +38,52 @@ export const OrgTabGroup = () => { component: () => (
-

- Project templates have been moved to the Feature Settings page, under the "Project - Templates" tab. +

+ Project templates have been relocated and are now product specific:

-

- Project templates are now product-specific, and can be configured for each project - type. -

- Project Templates New Location +
    + {[ + { + type: ProjectType.SecretManager, + label: "Secret Management", + icon: "sliding-carousel" + }, + { + type: ProjectType.CertificateManager, + label: "Certificate Management", + icon: "note" + }, + { + type: ProjectType.KMS, + label: "KMS", + icon: "unlock" + }, + { + type: ProjectType.SSH, + label: "SSH", + icon: "verified" + } + ].map(({ label, type, icon }, index) => ( +
  • + + {index !== 0 && •} + {" "} + {label} + +
  • + ))} +
)