From 980461ef18bf634ff79bd418dfe5a9c38254dc4e Mon Sep 17 00:00:00 2001
From: Jaanus Sellin <sellinjaanus@gmail.com>
Date: Tue, 12 Sep 2023 09:39:55 +0300
Subject: [PATCH] feat: hide project settings for OSS (#4662)

---
 .../ProjectSelector/ProjectSelector.tsx          |  4 ++--
 .../common/PremiumFeature/PremiumFeature.tsx     |  5 +++++
 .../src/component/project/Project/Project.tsx    |  2 +-
 .../Project/ProjectSettings/ProjectSettings.tsx  | 16 ++++++++--------
 .../ProjectSettings/Settings/Settings.tsx        | 14 ++++++++++++++
 5 files changed, 30 insertions(+), 11 deletions(-)

diff --git a/frontend/src/component/admin/apiToken/ApiTokenForm/ProjectSelector/ProjectSelector.tsx b/frontend/src/component/admin/apiToken/ApiTokenForm/ProjectSelector/ProjectSelector.tsx
index 7e78e35649..18162609fd 100644
--- a/frontend/src/component/admin/apiToken/ApiTokenForm/ProjectSelector/ProjectSelector.tsx
+++ b/frontend/src/component/admin/apiToken/ApiTokenForm/ProjectSelector/ProjectSelector.tsx
@@ -2,9 +2,9 @@ import { SelectProjectInput } from './SelectProjectInput/SelectProjectInput';
 import { TokenType } from '../../../../../interfaces/token';
 import React from 'react';
 import { StyledInputDescription } from '../ApiTokenForm.styles';
-import useProjects from '../../../../../hooks/api/getters/useProjects/useProjects';
+import useProjects from 'hooks/api/getters/useProjects/useProjects';
 import { ApiTokenFormErrorType } from '../useApiTokenForm';
-import { useOptionalPathParam } from '../../../../../hooks/useOptionalPathParam';
+import { useOptionalPathParam } from 'hooks/useOptionalPathParam';
 
 interface IProjectSelectorProps {
     type: string;
diff --git a/frontend/src/component/common/PremiumFeature/PremiumFeature.tsx b/frontend/src/component/common/PremiumFeature/PremiumFeature.tsx
index 2c969e7717..04ff9ec6cd 100644
--- a/frontend/src/component/common/PremiumFeature/PremiumFeature.tsx
+++ b/frontend/src/component/common/PremiumFeature/PremiumFeature.tsx
@@ -98,6 +98,11 @@ const PremiumFeatures = {
         url: 'https://docs.getunleash.io/reference/rbac#user-group-sso-integration',
         label: 'Single Sign-On',
     },
+    'project-settings': {
+        plan: FeaturePlan.PRO,
+        url: 'https://docs.getunleash.io/reference/projects',
+        label: 'Project settings',
+    },
 };
 
 type PremiumFeatureType = keyof typeof PremiumFeatures;
diff --git a/frontend/src/component/project/Project/Project.tsx b/frontend/src/component/project/Project/Project.tsx
index 0b5c272737..7158e29919 100644
--- a/frontend/src/component/project/Project/Project.tsx
+++ b/frontend/src/component/project/Project/Project.tsx
@@ -102,7 +102,7 @@ export const Project = () => {
         },
         {
             title: 'Project settings',
-            path: `${basePath}/settings`,
+            path: `${basePath}/settings${isOss() ? '/environments' : ''}`,
             name: 'settings',
             flag: undefined,
             new: false,
diff --git a/frontend/src/component/project/Project/ProjectSettings/ProjectSettings.tsx b/frontend/src/component/project/Project/ProjectSettings/ProjectSettings.tsx
index 2ba419dd9c..a090456f95 100644
--- a/frontend/src/component/project/Project/ProjectSettings/ProjectSettings.tsx
+++ b/frontend/src/component/project/Project/ProjectSettings/ProjectSettings.tsx
@@ -23,16 +23,12 @@ export const ProjectSettings = () => {
     const navigate = useNavigate();
 
     const tabs: ITab[] = [
-        {
-            id: '',
-            label: 'Settings',
-        },
-        {
-            id: 'environments',
-            label: 'Environments',
-        },
         ...(isPro() || isEnterprise()
             ? [
+                  {
+                      id: '',
+                      label: 'Settings',
+                  },
                   {
                       id: 'access',
                       label: 'Access',
@@ -52,6 +48,10 @@ export const ProjectSettings = () => {
                   },
               ]
             : []),
+        {
+            id: 'environments',
+            label: 'Environments',
+        },
         {
             id: 'api-access',
             label: 'API access',
diff --git a/frontend/src/component/project/Project/ProjectSettings/Settings/Settings.tsx b/frontend/src/component/project/Project/ProjectSettings/Settings/Settings.tsx
index ef03772234..88b16892b5 100644
--- a/frontend/src/component/project/Project/ProjectSettings/Settings/Settings.tsx
+++ b/frontend/src/component/project/Project/ProjectSettings/Settings/Settings.tsx
@@ -8,13 +8,27 @@ import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
 import { usePageTitle } from 'hooks/usePageTitle';
 import { useProjectNameOrId } from 'hooks/api/getters/useProject/useProject';
 import EditProject from './EditProject';
+import { PremiumFeature } from 'component/common/PremiumFeature/PremiumFeature';
+import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 
 export const Settings = () => {
     const projectId = useRequiredPathParam('projectId');
     const projectName = useProjectNameOrId(projectId);
     const { hasAccess } = useContext(AccessContext);
+    const { isOss } = useUiConfig();
     usePageTitle(`Project configuration – ${projectName}`);
 
+    if (isOss()) {
+        return (
+            <PageContent
+                header={<PageHeader title="Access" />}
+                sx={{ justifyContent: 'center' }}
+            >
+                <PremiumFeature feature="project-settings" />
+            </PageContent>
+        );
+    }
+
     if (!hasAccess(UPDATE_PROJECT, projectId)) {
         return (
             <PageContent header={<PageHeader title="Access" />}>