diff --git a/frontend/benefit/applicant/public/locales/en/common.json b/frontend/benefit/applicant/public/locales/en/common.json index a1fd600f8f..b075dd781d 100644 --- a/frontend/benefit/applicant/public/locales/en/common.json +++ b/frontend/benefit/applicant/public/locales/en/common.json @@ -431,7 +431,8 @@ "accessibilityStatement": "Accessibility statement", "aboutTheService": "About the service", "accessibilityStatementLink": "https://www.hel.fi/helsinki/en/administration/information/information/accessibility", - "aboutTheServiceLink": "https://www.hel.fi/en/business-and-work/employers/helsinki-benefit-for-employers" + "aboutTheServiceLink": "https://www.hel.fi/en/business-and-work/employers/helsinki-benefit-for-employers", + "cookieSettings": "Cookie settings" }, "notifications": { "applicationSubmitted": { @@ -617,7 +618,8 @@ "createApplication": "Helsinki benefit - Application - Create", "editApplication": "Helsinki benefit - Application - Edit", "viewApplication": "Helsinki benefit - Application - View", - "accessibilityStatement": "Helsinki benefit - Accessibility statement" + "accessibilityStatement": "Helsinki benefit - Accessibility statement", + "cookieSettings": "Helsinki benefit - Cookie settings" }, "accessibilityStatement": { "h1": "Accessibility statement", diff --git a/frontend/benefit/applicant/public/locales/fi/common.json b/frontend/benefit/applicant/public/locales/fi/common.json index c48babbbe0..4cc4dc13f2 100644 --- a/frontend/benefit/applicant/public/locales/fi/common.json +++ b/frontend/benefit/applicant/public/locales/fi/common.json @@ -431,7 +431,8 @@ "accessibilityStatement": "Saavutettavuusseloste", "aboutTheService": "Tietoa palvelusta", "accessibilityStatementLink": "https://www.hel.fi/helsinki/fi/kaupunki-ja-hallinto/tietoa-helsingista/tietoa-hel-fista/saavutettavuus/saavutettavuusselosteet", - "aboutTheServiceLink": "https://www.hel.fi/fi/yritykset-ja-tyo/tyonantajat/taloudelliset-tuet/tyonantajan-helsinki-lisa" + "aboutTheServiceLink": "https://www.hel.fi/fi/yritykset-ja-tyo/tyonantajat/taloudelliset-tuet/tyonantajan-helsinki-lisa", + "cookieSettings": "Evästeasetukset" }, "notifications": { "applicationSubmitted": { @@ -617,7 +618,8 @@ "createApplication": "Helsinki-lisä - Hakemus - Luo uusi", "editApplication": "Helsinki-lisä - Hakemus - Muokkaa hakemusta", "viewApplication": "Helsinki-lisä - Hakemus - Tarkastele hakemusta", - "accessibilityStatement": "Helsinki-lisä - Saavutettavuusseloste" + "accessibilityStatement": "Helsinki-lisä - Saavutettavuusseloste", + "cookieSettings": "Helsinki-lisä - Evästeasetukset" }, "accessibilityStatement": { "h1": "Saavutettavuusseloste", diff --git a/frontend/benefit/applicant/public/locales/sv/common.json b/frontend/benefit/applicant/public/locales/sv/common.json index 62eb38c609..99eb0f06b6 100644 --- a/frontend/benefit/applicant/public/locales/sv/common.json +++ b/frontend/benefit/applicant/public/locales/sv/common.json @@ -431,7 +431,8 @@ "accessibilityStatement": "Tillgänglighetsutlåtande", "aboutTheService": "Information om tjänsten", "accessibilityStatementLink": "https://www.hel.fi/helsinki/sv/stad-och-forvaltning/information/information/tillganglighet", - "aboutTheServiceLink": "https://www.hel.fi/sv/foretag-och-arbete/arbetsgivare/arbetsgivarens-helsingforstillagg" + "aboutTheServiceLink": "https://www.hel.fi/sv/foretag-och-arbete/arbetsgivare/arbetsgivarens-helsingforstillagg", + "cookieSettings": "Cookie -inställningar" }, "notifications": { "applicationSubmitted": { @@ -617,7 +618,8 @@ "createApplication": "Helsingforstillägg - Ansökan - Skapa", "editApplication": "Helsingforstillägg - Ansökan - Redigera", "viewApplication": "Helsingforstillägg - Ansökan - Granska", - "accessibilityStatement": "Helsingforstillägg - Tillgänglighetsförklaring" + "accessibilityStatement": "Helsingforstillägg - Tillgänglighetsförklaring", + "cookieSettings": "Helsingforstillägg - Cookie -inställningar" }, "accessibilityStatement": { "h1": "Tillgänglighetsutlåtande", diff --git a/frontend/benefit/applicant/src/components/cookieConsent/CookieConsent.tsx b/frontend/benefit/applicant/src/components/cookieConsent/CookieConsent.tsx index 85c0beae1e..d64e713d22 100644 --- a/frontend/benefit/applicant/src/components/cookieConsent/CookieConsent.tsx +++ b/frontend/benefit/applicant/src/components/cookieConsent/CookieConsent.tsx @@ -4,12 +4,12 @@ import { } from 'benefit/applicant/constants'; import useLocale from 'benefit/applicant/hooks/useLocale'; import { BackendEndpoint } from 'benefit-shared/backend-api/backend-api'; -import { CookieModal } from 'hds-react'; +import { CookieModal, CookiePage } from 'hds-react'; import { useRouter } from 'next/router'; import React from 'react'; import useBackendAPI from 'shared/hooks/useBackendAPI'; -const CookieConsent: React.FC = () => { +const CookieConsent: React.FC<{ asPage?: boolean }> = ({ asPage = false }) => { const locale = useLocale(); const router = useRouter(); const { axios } = useBackendAPI(); @@ -84,7 +84,11 @@ const CookieConsent: React.FC = () => { focusTargetSelector: '#main_content', }; - return ; + return asPage ? ( + + ) : ( + + ); }; export default CookieConsent; diff --git a/frontend/benefit/applicant/src/components/footer/Footer.tsx b/frontend/benefit/applicant/src/components/footer/Footer.tsx index d071a29bca..9204483b4b 100644 --- a/frontend/benefit/applicant/src/components/footer/Footer.tsx +++ b/frontend/benefit/applicant/src/components/footer/Footer.tsx @@ -23,6 +23,11 @@ const FooterSection: React.FC = () => { href={`/${locale}/accessibility-statement`} label={t('common:footer.accessibilityStatement')} /> + = ({ children, ...rest }) => { const bgColor = selectBgColor(router.pathname); - const isAccessibilityStatement = - router.pathname === ROUTES.ACCESSIBILITY_STATEMENT; + const isTermsRoute = ![ + ROUTES.ACCESSIBILITY_STATEMENT, + ROUTES.COOKIE_SETTINGS, + ].includes(router.pathname as ROUTES); React.useEffect(() => { if (IS_CLIENT) { @@ -56,9 +58,7 @@ const Layout: React.FC = ({ children, ...rest }) => { return ( <$Main $backgroundColor={bgColor} {...rest}>
- {isAuthenticated && - !isAccessibilityStatement && - !isTermsOfServiceApproved ? ( + {isAuthenticated && isTermsRoute && !isTermsOfServiceApproved ? ( diff --git a/frontend/benefit/applicant/src/constants.ts b/frontend/benefit/applicant/src/constants.ts index 45098760a8..29da06a39c 100644 --- a/frontend/benefit/applicant/src/constants.ts +++ b/frontend/benefit/applicant/src/constants.ts @@ -13,6 +13,7 @@ export enum ROUTES { LOGIN = '/login', TERMS_OF_SERVICE = '/terms-of-service', ACCESSIBILITY_STATEMENT = '/accessibility-statement', + COOKIE_SETTINGS = '/cookie-settings', } export const MAX_DEMINIMIS_AID_TOTAL_AMOUNT = 200_000; diff --git a/frontend/benefit/applicant/src/hooks/useUserQuery.ts b/frontend/benefit/applicant/src/hooks/useUserQuery.ts index 9d0b591b89..0835c87cce 100644 --- a/frontend/benefit/applicant/src/hooks/useUserQuery.ts +++ b/frontend/benefit/applicant/src/hooks/useUserQuery.ts @@ -12,12 +12,16 @@ import { setLocalStorageItem, } from 'shared/utils/localstorage.utils'; -import { LOCAL_STORAGE_KEYS } from '../constants'; +import { LOCAL_STORAGE_KEYS, ROUTES } from '../constants'; // check that authentication is still alive in every 5 minutes const FIVE_MINUTES = 5 * 60 * 1000; -const UNAUTHORIZER_ROUTES = new Set(['/login', '/accessibility-statement']); +const UNAUTHORIZER_ROUTES = new Set([ + ROUTES.LOGIN, + ROUTES.ACCESSIBILITY_STATEMENT, + ROUTES.COOKIE_SETTINGS, +]); const useUserQuery = ( queryKeys?: string | unknown[] @@ -33,7 +37,7 @@ const useUserQuery = ( if (logout) { void router.push(`${locale}/login?logout=true`); } else if (/40[13]/.test(error.message)) { - if (UNAUTHORIZER_ROUTES.has(router.route)) { + if (UNAUTHORIZER_ROUTES.has(router.route as ROUTES)) { return; } void router.push(`${locale}/login`); diff --git a/frontend/benefit/applicant/src/pages/_app.tsx b/frontend/benefit/applicant/src/pages/_app.tsx index 9622d51a33..208767e489 100644 --- a/frontend/benefit/applicant/src/pages/_app.tsx +++ b/frontend/benefit/applicant/src/pages/_app.tsx @@ -33,7 +33,9 @@ const App: React.FC = (appProps) => { const { t } = useTranslation(); - const showCookieBanner = process.env.NEXT_PUBLIC_SHOW_COOKIE_BANNER === '1'; + const showCookieBanner = + process.env.NEXT_PUBLIC_SHOW_COOKIE_BANNER === '1' && + router.route !== ROUTES.COOKIE_SETTINGS; useEffect(() => { setAppLoaded(); @@ -50,6 +52,10 @@ const App: React.FC = (appProps) => { document.title = t('common:pageTitles.accessibilityStatement'); break; + case ROUTES.COOKIE_SETTINGS: + document.title = t('common:pageTitles.cookieSettings'); + break; + default: document.title = t('common:pageTitles.home'); break; diff --git a/frontend/benefit/applicant/src/pages/cookie-settings.tsx b/frontend/benefit/applicant/src/pages/cookie-settings.tsx new file mode 100644 index 0000000000..0ea885cd86 --- /dev/null +++ b/frontend/benefit/applicant/src/pages/cookie-settings.tsx @@ -0,0 +1,28 @@ +import CookieConsent from 'benefit/applicant/components/cookieConsent/CookieConsent'; +import { useTranslation } from 'benefit/applicant/i18n'; +import { GetStaticProps, NextPage } from 'next'; +import Head from 'next/head'; +import * as React from 'react'; +import Container from 'shared/components/container/Container'; +import getServerSideTranslations from 'shared/i18n/get-server-side-translations'; + +const CookieSettings: NextPage = () => { + const { t } = useTranslation(); + + return ( + <> + + {t('common:pageTitles.cookieSettings')} + + + + + + + ); +}; + +export const getStaticProps: GetStaticProps = + getServerSideTranslations('common'); + +export default CookieSettings;