Add configure environments link to project settings (#8391)

Unleash · Oct 9, 2024 · eb2d1fb · eb2d1fb
1 parent f23ba70
commit eb2d1fb
Showing 1 changed file with 17 additions and 8 deletions.
diff --git a/frontend/src/component/project/ProjectEnvironment/ProjectEnvironment.tsx b/frontend/src/component/project/ProjectEnvironment/ProjectEnvironment.tsx
@@ -1,14 +1,14 @@
 import { useMemo, useState } from 'react';
+import { Link as RouterLink } from 'react-router-dom';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 import { PageContent } from 'component/common/PageContent/PageContent';
 import { PageHeader } from 'component/common/PageHeader/PageHeader';
 import { UPDATE_PROJECT } from 'component/providers/AccessProvider/permissions';
 import ApiError from 'component/common/ApiError/ApiError';
 import useToast from 'hooks/useToast';
 import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
-import { Alert, styled, TableBody, TableRow } from '@mui/material';
+import { Alert, styled, TableBody, TableRow, Link } from '@mui/material';
 import useProjectApi from 'hooks/api/actions/useProjectApi/useProjectApi';
-import { Link } from 'react-router-dom';
 import PermissionSwitch from 'component/common/PermissionSwitch/PermissionSwitch';
 import type { IProjectEnvironment } from 'interfaces/environments';
 import { getEnabledEnvs } from './helpers';
@@ -225,10 +225,16 @@ const ProjectEnvironmentList = () => {
         <PageHeader
             title={`Environments (${rows.length})`}
             actions={
-                <Search
-                    initialValue={globalFilter}
-                    onChange={setGlobalFilter}
-                />
+                <>
+                    <Search
+                        initialValue={globalFilter}
+                        onChange={setGlobalFilter}
+                    />
+                    <PageHeader.Divider />
+                    <Link component={RouterLink} to='/environments'>
+                        Configure environments
+                    </Link>
+                </>
             }
         />
     );
@@ -245,12 +251,15 @@ const ProjectEnvironmentList = () => {
                     retrieve configured activation strategies for a specific
                     environment, the application must use an environment
                     specific API token. You can look up the environment-specific{' '}
-                    <Link to='/admin/api'>API tokens here</Link>.
+                    <RouterLink to='/admin/api'>API tokens here</RouterLink>.
                     <br />
                     <br />
                     Your administrator can configure an environment-specific API
                     token to be used in the SDK. If you are an administrator you
-                    can <Link to='/admin/api'>create a new API token here</Link>
+                    can{' '}
+                    <RouterLink to='/admin/api'>
+                        create a new API token here
+                    </RouterLink>
                     .
                 </StyledAlert>
                 <SearchHighlightProvider value={globalFilter}>