link to contact admin email address

src/components/FunctionalArea/Modal/AccessDeniedModal/AccessDeniedModal.component.tsx

@@ -5,13 +5,18 @@ import { loginUserSelector } from '@/redux/user/user.selectors';
 import { openLoginModal } from '@/redux/modal/modal.slice';
 import { MINUS_ONE } from '@/constants/common';
 import { Button } from '@/shared/Button';
+import { adminEmailValSelector } from '@/redux/configuration/configuration.selectors';
 
 export const AccessDeniedModal: React.FC = () => {
   const dispatch = useAppDispatch();
   const login = useAppSelector(loginUserSelector);
 
+  const adminEmail = useAppSelector(adminEmailValSelector);
+
   const isAnonymousLogin = !login;
 
+  const isAdminEmail = adminEmail !== '' && adminEmail !== undefined;
+
   const handleGoBack = async (e: React.FormEvent<HTMLButtonElement>): Promise<void> => {
     e.preventDefault();
     window.history.go(MINUS_ONE);
@@ -22,6 +27,11 @@ export const AccessDeniedModal: React.FC = () => {
     dispatch(openLoginModal());
   };
 
+  const handleContactdAmin = async (e: React.FormEvent<HTMLButtonElement>): Promise<void> => {
+    e.preventDefault();
+    window.location.href = `mailto:${adminEmail}`;
+  };
+
   return (
     <div className="w-[400px] border border-t-[#E1E0E6] bg-white p-[24px]">
       {isAnonymousLogin && (
@@ -42,6 +52,17 @@ export const AccessDeniedModal: React.FC = () => {
           </div>
         </div>
       )}
+      {isAdminEmail && (
+        <div className="mt-1 text-center">
+          <Button
+            className="block w-full ring-transparent hover:ring-transparent"
+            variantStyles="secondary"
+            onClick={handleContactdAmin}
+          >
+            Contact admin
+          </Button>
+        </div>
+      )}
     </div>
   );
 };

src/redux/configuration/configuration.constants.ts

@@ -4,6 +4,7 @@ export const SIMPLE_COLOR_VAL_NAME_ID = 'SIMPLE_COLOR_VAL';
 export const NEUTRAL_COLOR_VAL_NAME_ID = 'NEUTRAL_COLOR_VAL';
 export const OVERLAY_OPACITY_NAME_ID = 'OVERLAY_OPACITY';
 export const SEARCH_DISTANCE_NAME_ID = 'SEARCH_DISTANCE';
+export const REQUEST_ACCOUNT_EMAIL = 'REQUEST_ACCOUNT_EMAIL';
 
 export const LEGEND_FILE_NAMES_IDS = [
   'LEGEND_FILE_1',

src/redux/configuration/configuration.selectors.ts

@@ -17,7 +17,9 @@ import {
   SIMPLE_COLOR_VAL_NAME_ID,
   SVG_IMAGE_HANDLER_NAME_ID,
   SEARCH_DISTANCE_NAME_ID,
+  REQUEST_ACCOUNT_EMAIL,
 } from './configuration.constants';
+
 import { ConfigurationHandlersIds, ConfigurationImageHandlersIds } from './configuration.types';
 
 const configurationSelector = createSelector(rootSelector, state => state.configuration);
@@ -56,6 +58,11 @@ export const searchDistanceValSelector = createSelector(
   state => configurationAdapterSelectors.selectById(state, SEARCH_DISTANCE_NAME_ID)?.value,
 );
 
+export const adminEmailValSelector = createSelector(
+  configurationOptionsSelector,
+  state => configurationAdapterSelectors.selectById(state, REQUEST_ACCOUNT_EMAIL)?.value,
+);
+
 export const defaultLegendImagesSelector = createSelector(configurationOptionsSelector, state =>
   LEGEND_FILE_NAMES_IDS.map(
     legendNameId => configurationAdapterSelectors.selectById(state, legendNameId)?.value,