diff --git a/src/components/FunctionalArea/Modal/AccessDeniedModal/AccessDeniedModal.component.tsx b/src/components/FunctionalArea/Modal/AccessDeniedModal/AccessDeniedModal.component.tsx index 130b5e97c1dd1eb85c8e6b93313d3a32d463bd4a..970ca5d6aadb815a9ab5ed2e29cc948508fcaaf6 100644 --- a/src/components/FunctionalArea/Modal/AccessDeniedModal/AccessDeniedModal.component.tsx +++ b/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> ); }; diff --git a/src/redux/configuration/configuration.constants.ts b/src/redux/configuration/configuration.constants.ts index a03edc92e3b60554196a00115bc246453a7eef83..59ef10da2e7defa1753613d5b185ad0d6d454439 100644 --- a/src/redux/configuration/configuration.constants.ts +++ b/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', diff --git a/src/redux/configuration/configuration.selectors.ts b/src/redux/configuration/configuration.selectors.ts index 00683ccb082b98e28df71b0fc95a3e4f88ef5518..ae5b97b7bc077a3f8316f26faf57e32ce2f8a5bf 100644 --- a/src/redux/configuration/configuration.selectors.ts +++ b/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,