From c57a81bde1d20c623a21256572c9637ced79ee9d Mon Sep 17 00:00:00 2001
From: Tymoteusz Czech <2625371+Tymek@users.noreply.github.com>
Date: Tue, 8 Oct 2024 15:23:24 +0200
Subject: [PATCH] feat($env): add configure environments link t oproject
 settings

---
 .../ProjectEnvironment/ProjectEnvironment.tsx | 25 +++++++++++++------
 1 file changed, 17 insertions(+), 8 deletions(-)

diff --git a/frontend/src/component/project/ProjectEnvironment/ProjectEnvironment.tsx b/frontend/src/component/project/ProjectEnvironment/ProjectEnvironment.tsx
index 5cb2338b6101..96ce97f9f466 100644
--- a/frontend/src/component/project/ProjectEnvironment/ProjectEnvironment.tsx
+++ b/frontend/src/component/project/ProjectEnvironment/ProjectEnvironment.tsx
@@ -1,4 +1,5 @@
 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';
@@ -6,9 +7,8 @@ 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}>