diff --git a/frontend/src/component/project/Project/Project.tsx b/frontend/src/component/project/Project/Project.tsx index f42922a6e7..8bb4b71bdd 100644 --- a/frontend/src/component/project/Project/Project.tsx +++ b/frontend/src/component/project/Project/Project.tsx @@ -39,6 +39,7 @@ import { IMPORT_BUTTON } from 'utils/testIds'; import { EnterpriseBadge } from 'component/common/EnterpriseBadge/EnterpriseBadge'; import { Badge } from 'component/common/Badge/Badge'; import { ProjectDoraMetrics } from './ProjectDoraMetrics/ProjectDoraMetrics'; +import { UiFlags } from 'interfaces/uiConfig'; const StyledBadge = styled(Badge)(({ theme }) => ({ position: 'absolute', @@ -49,6 +50,15 @@ const StyledBadge = styled(Badge)(({ theme }) => ({ }, })); +interface ITab { + title: string; + path: string; + name: string; + flag?: keyof UiFlags; + new?: boolean; + isEnterprise?: boolean; +} + export const Project = () => { const projectId = useRequiredPathParam('projectId'); const params = useQueryParams(); @@ -65,35 +75,27 @@ export const Project = () => { const [showDelDialog, setShowDelDialog] = useState(false); - const tabs = [ + const tabs: ITab[] = [ { title: 'Overview', path: basePath, name: 'overview', - flag: undefined, - new: false, }, { title: 'Health', path: `${basePath}/health`, name: 'health', - flag: undefined, - new: false, }, { title: 'Archive', path: `${basePath}/archive`, name: 'archive', - flag: undefined, - new: false, }, { title: 'Change requests', path: `${basePath}/change-requests`, name: 'change-request', isEnterprise: true, - flag: undefined, - new: false, }, { title: 'Metrics', @@ -106,17 +108,15 @@ export const Project = () => { title: 'Event log', path: `${basePath}/logs`, name: 'logs', - flag: undefined, - new: false, }, { title: 'Project settings', path: `${basePath}/settings${isOss() ? '/environments' : ''}`, name: 'settings', - flag: undefined, - new: false, }, - ] + ]; + + const filteredTabs = tabs .filter((tab) => { if (tab.flag) { return uiConfig.flags[tab.flag]; @@ -125,7 +125,7 @@ export const Project = () => { }) .filter((tab) => !(isOss() && tab.isEnterprise)); - const activeTab = [...tabs] + const activeTab = [...filteredTabs] .reverse() .find((tab) => pathname.startsWith(tab.path)); @@ -221,7 +221,7 @@ export const Project = () => { variant='scrollable' allowScrollButtonsMobile > - {tabs.map((tab) => { + {filteredTabs.map((tab) => { return ( { icon={ <> New diff --git a/frontend/src/interfaces/uiConfig.ts b/frontend/src/interfaces/uiConfig.ts index 0ae5061a3e..40debd2eea 100644 --- a/frontend/src/interfaces/uiConfig.ts +++ b/frontend/src/interfaces/uiConfig.ts @@ -40,6 +40,7 @@ export type UiFlags = { P: boolean; RE: boolean; EEA?: boolean; + SE?: boolean; T?: boolean; UNLEASH_CLOUD?: boolean; UG?: boolean; @@ -65,9 +66,9 @@ export type UiFlags = { variantTypeNumber?: boolean; privateProjects?: boolean; accessOverview?: boolean; + datadogJsonTemplate?: boolean; dependentFeatures?: boolean; internalMessageBanners?: boolean; - [key: string]: boolean | Variant | undefined; }; export interface IVersionInfo {