Nikolas/feature/598 implement new ethical ethical guidelines page

frontend-next-migration/src/app/[lng]/(helper)/ethical-guidelines/_getPage.ts

@@ -0,0 +1,31 @@
+import { createPage } from '@/app/_helpers';
+import { EthicalGuidelinesPageProps } from '@/preparedPages/EthicalGuidelinesPage';
+import { makeEthicalGuidelinesSectionsWithI18n } from '@/entities/PresentationPackages';
+import { getServerTranslation } from '@/shared/i18n';
+import { getRouteEthicalGuidelinesPage } from '@/shared/appLinks/RoutePaths';
+import { defaultOpenGraph } from '@/shared/seoConstants';
+
+export async function _getPage(lng: string) {
+    const { t } = await getServerTranslation(lng, 'ethics');
+
+    return createPage<EthicalGuidelinesPageProps>({
+        buildPage: () => ({
+            sections: makeEthicalGuidelinesSectionsWithI18n(t),
+            title: t('main-title'),
+        }),
+        buildSeo: () => ({
+            title: t('main-title'),
+            description: t('head-description'),
+            keywords: t('head-keywords'),
+            openGraph: {
+                ...defaultOpenGraph,
+                title: t('og-title'),
+                description: t('og-description'),
+                url: `/${lng}${getRouteEthicalGuidelinesPage()}`,
+            },
+            alternates: {
+                canonical: `/${lng}${getRouteEthicalGuidelinesPage()}`,
+            },
+        }),
+    });
+}

frontend-next-migration/src/app/[lng]/(helper)/ethical-guidelines/loading.tsx

@@ -0,0 +1 @@
+export { PageLoader as default } from '@/widgets/PageLoader';

frontend-next-migration/src/app/[lng]/(helper)/ethical-guidelines/page.tsx

@@ -0,0 +1,6 @@
+import { EthicalGuidelinesPage } from '@/preparedPages/EthicalGuidelinesPage';
+import { withPageData, withMetadataGenerator } from '@/app/_helpers';
+import { _getPage } from './_getPage';
+
+export const generateMetadata = withMetadataGenerator(_getPage);
+export default withPageData(EthicalGuidelinesPage, _getPage);

frontend-next-migration/src/entities/PresentationPackages/index.ts

@@ -9,3 +9,6 @@ export { makeCookiesSectionsWithI18n } from '@/entities/PresentationPackages/mod
 
 export { PrivacySections } from '@/entities/PresentationPackages/model/data/privacySections';
 export { makePrivacySectionsWithI18n } from '@/entities/PresentationPackages/model/makeSectionsWithI18n';
+
+export { EthicalGuidelinesSections } from '@/entities/PresentationPackages/model/data/ethicalGuidelinesSections';
+export { makeEthicalGuidelinesSectionsWithI18n } from '@/entities/PresentationPackages/model/makeSectionsWithI18n';

frontend-next-migration/src/entities/PresentationPackages/model/data/ethicalGuidelinesSections.ts

@@ -0,0 +1,21 @@
+import { createSection } from '../createSection';
+
+const i18nKeyPrefixes = ['intro', 'players', 'employees', 'business', 'society', 'law'];
+
+const imageSrcs = [''];
+const logoSrc = '';
+
+export const EthicalGuidelinesSections = i18nKeyPrefixes.map((key, index) =>
+    createSection({
+        prefix: key,
+        index,
+        image: {
+            src: imageSrcs[index],
+            alt: `${key}-image`,
+        },
+        logo: {
+            src: logoSrc,
+            alt: `${key}-logo`,
+        },
+    }),
+);

frontend-next-migration/src/entities/PresentationPackages/model/makeSectionsWithI18n.ts

@@ -2,6 +2,7 @@ import { PresentationSection } from '@/entities/PresentationPackages/types';
 import { ArtGameSections } from './data/artGameSections';
 import { CookiesSections } from './data/cookiesSections';
 import { PrivacySections } from './data/privacySections';
+import { EthicalGuidelinesSections } from './data/ethicalGuidelinesSections';
 
 /**
  * Takes an array of PresentationSections and returns a higher-order function that takes a translation function
@@ -58,3 +59,12 @@ export const makeCookiesSectionsWithI18n = makeSectionsWithI18n(CookiesSections)
  * @returns {Array} - The array of art game sections with internationalization support.
  */
 export const makePrivacySectionsWithI18n = makeSectionsWithI18n(PrivacySections);
+
+/**
+ * Creates ethical guidelines sections with internationalization support.
+ *
+ * @param {Array} EthicalGuidelinesSections - The array of art game sections.
+ * @returns {Array} - The array of art game sections with internationalization support.
+ */
+export const makeEthicalGuidelinesSectionsWithI18n =
+    makeSectionsWithI18n(EthicalGuidelinesSections);

frontend-next-migration/src/preparedPages/EthicalGuidelinesPage/index.ts

@@ -0,0 +1,3 @@
+export { EthicalGuidelinesPageAsync as EthicalGuidelinesPage } from './ui/EthicalGuidelinesPage.async';
+
+export type { Props as EthicalGuidelinesPageProps } from './ui/EthicalGuidelinesPage';

frontend-next-migration/src/preparedPages/EthicalGuidelinesPage/ui/EthicalGuidelinesPage.async.tsx

@@ -0,0 +1,4 @@
+import dynamic from 'next/dynamic';
+import { Props } from './EthicalGuidelinesPage';
+
+export const EthicalGuidelinesPageAsync = dynamic<Props>(() => import('./EthicalGuidelinesPage'));

frontend-next-migration/src/preparedPages/EthicalGuidelinesPage/ui/EthicalGuidelinesPage.tsx

@@ -0,0 +1,37 @@
+'use client';
+import { ScrollTop } from '@/features/ScrollTop';
+import { classNames } from '@/shared/lib/classNames/classNames';
+import { WikiContentWithSidebar } from '@/shared/ui/v2/WikiContentWithSidebar';
+import cls from './EthicalGuidelinesPage.module.scss';
+
+interface Section {
+    id: string;
+    navMenuTitle: string;
+    label: string;
+    description: string;
+    image: string;
+    imageAlt: string;
+    sidebarLogo: string;
+    sidebarLogoAlt: string;
+}
+
+export type Props = {
+    sections: Section[];
+    title: string;
+};
+
+const EthicalGuidelinesPage = (props: Props) => {
+    const { sections = [], title } = props;
+
+    return (
+        <div className={classNames(cls.pageContainer)}>
+            <WikiContentWithSidebar
+                sections={sections}
+                title={title}
+            />
+            <ScrollTop />
+        </div>
+    );
+};
+
+export default EthicalGuidelinesPage;

frontend-next-migration/src/shared/appLinks/RoutePaths.ts

@@ -21,6 +21,7 @@ export enum AppRoutesLinks {
     ABOUT = 'ABOUT',
     PRIVACY = 'privacy',
     COOKIES = 'cookies',
+    ETHICAL_GUIDELINES = 'ETHICAL_GUIDELINES',
     FORUM = 'FORUM',
     GAME_ART = 'GAME_ART',
 
@@ -72,6 +73,7 @@ export const RoutePaths: Record<AppRoutesLinks, string> = {
     [AppRoutesLinks.ABOUT]: '/about',
     [AppRoutesLinks.PRIVACY]: '/privacy',
     [AppRoutesLinks.COOKIES]: '/cookies',
+    [AppRoutesLinks.ETHICAL_GUIDELINES]: '/ethical-guidelines',
     [AppRoutesLinks.GAME_ART]: '/artGame',
 
     [AppRoutesLinks.HEROES]: '/heroes',
@@ -130,6 +132,7 @@ export const getRouteJoinUsPage = () => '/join-us';
 export const getRoutePrivacyPage = () => '/privacy';
 export const getRouteCookiesPage = () => '/cookies';
 export const getRouteDataPolicyPage = () => '/data-policy';
+export const getRouteEthicalGuidelinesPage = () => '/ethical-guidelines';
 export const getRouteAboutPage = () => '/about';
 export const getRouteComingSoonPage = () => '/coming';
 export const getRouteForumPage = () => '/forum';

frontend-next-migration/src/shared/i18n/locales/en/ethics.json

@@ -0,0 +1,32 @@
+{
+  "main-title": "Ethical Guidelines",
+
+  "head-description": "We aim to build a game industry that is fair, responsible and humane – a place where creativity and ethics go hand in hand.",
+  "head-keywords": "ethical guidelines, ethics, game community, alt zone",
+  "og-title": "Ethical Guidelines - ALT Zone",
+  "og-description": "Read Psyche's Royale Gaming's ethical principles for players, team members and partners.",
+
+  "intro-nav-menu-title": "Ethical Guidelines",
+  "intro-label": "",
+  "intro-description": "We aim to build a game industry that is fair, responsible and humane – a place where creativity and ethics go hand in hand. We want our players, creators and partners to trust that we act transparently, responsibly and with respect for one another.",
+
+  "players-nav-menu-title": "Players",
+  "players-label": "Respecting players",
+  "players-description": "• We develop games that provide a fair, fun and meaningful experience for all players.<br> • We respect player privacy and handle personal data responsibly and in accordance with data protection laws.<br> • We strive to create content that is appropriate for our audience and respects different backgrounds, cultures and values.<br> • We promote accessibility so that as many people as possible can enjoy our games.",
+
+  "employees-nav-menu-title": "Developers",
+  "employees-label": "Team members and developers",
+  "employees-description": "• We support a healthy and sustainable work culture, avoiding overload and respecting individual well-being.<br> • We value diversity and equality in all our activities.<br> • We respect copyrights and give recognition to the contributions of every team member and volunteer.",
+
+  "business-nav-menu-title": "Marketing",
+  "business-label": "Business and marketing ethics",
+  "business-description": "• We act openly and honestly in marketing and communication.<br> • Microtransactions and paid content are always presented clearly and transparently.<br> • We do not exploit player vulnerability or use manipulative game mechanics to drive spending.",
+
+  "society-nav-menu-title": "Responsibility",
+  "society-label": "Social responsibility",
+  "society-description": "• We avoid stereotypical, discriminatory or offensive portrayals and aim to reinforce positive values.<br> • We consider environmental impact when developing and maintaining our games, as far as reasonably possible.<br> • We believe in the power of games to support learning, community and positive interaction.",
+
+  "law-nav-menu-title": "Legal Compliance",
+  "law-label": "Law and accountability",
+  "law-description": "• We comply with all applicable laws and regulations, including data protection, copyright and consumer protection legislation.<br> • We are committed to transparency and taking responsibility for our actions.<br> • We actively listen to feedback from players, team members and partners to continuously improve our work."
+}

frontend-next-migration/src/shared/i18n/locales/en/footer.json

@@ -2,5 +2,6 @@
     "FooterTitle": "Be part of our community",
     "FooterPrivacy": "Privacy",
     "FooterCookies": "Cookies",
-    "FooterConsent": "Consent"
+    "FooterConsent": "Consent",
+    "FooterEthics": "Ethical guidelines"
 }

frontend-next-migration/src/shared/i18n/locales/fi/ethics.json

@@ -0,0 +1,31 @@
+{
+    "main-title": "Eettiset ohjeet",
+
+    "head-description": "Pyrimme rakentamaan pelialaa, joka on reilu, vastuullinen ja inhimillinen – paikka, jossa luovuus ja etiikka kulkevat käsi kädessä.",
+    "og-title": "Eettiset ohjeet - ALT Zone",
+    "og-description": "Tutustu Psyche's Royale Gamingin eettisiin ohjeisiin pelaajille, työntekijöille ja yhteistyökumppaneille.",
+
+    "intro-nav-menu-title": "Eettiset ohjeet",
+    "intro-label": "",
+    "intro-description": "Pyrimme rakentamaan pelialaa, joka on reilu, vastuullinen ja inhimillinen – paikka, jossa luovuus ja etiikka kulkevat käsi kädessä. Haluamme, että pelaajamme, tekijämme ja yhteistyökumppanimme voivat luottaa siihen, että toimimme läpinäkyvästi, vastuullisesti ja toisiamme kunnioittaen.",
+
+    "players-nav-menu-title": "Pelaajat",
+    "players-label": "Pelaajien kunnioittaminen",
+    "players-description": "• Kehitämme pelejä, jotka tarjoavat reilun, hauskan ja merkityksellisen kokemuksen kaikille pelaajille.<br> • Kunnioitamme pelaajien yksityisyyttä ja käsittelemme henkilötietoja vastuullisesti ja tietosuojalainsäädännön mukaisesti.<br> • Pyrimme luomaan sisältöä, joka on sopivaa kohdeyleisölle ja huomioi erilaiset taustat, kulttuurit ja arvot.<br> • Edistämme saavutettavuutta, jotta mahdollisimman moni voi nauttia peleistämme.",
+
+    "employees-nav-menu-title": "Kehittäjät",
+    "employees-label": "Työntekijöiden ja kehittäjien oikeudet",
+    "employees-description": "• Tuemme terveellistä ja kestävää työkulttuuria, jossa vältetään ylikuormitusta ja kunnioitetaan yksilön hyvinvointia.<br> • Arvostamme monimuotoisuutta ja yhdenvertaisuutta kaikessa toiminnassamme.<br> • Kunnioitamme tekijänoikeuksia ja annamme tunnustusta jokaisen työntekijän ja vapaaehtoisen panokselle.",
+
+    "business-nav-menu-title": "Markkinointi",
+    "business-label": "Liiketoiminnan ja markkinoinnin eettisyys",
+    "business-description": "• Toimimme avoimesti ja rehellisesti markkinoinnissa ja viestinnässä.<br> • Mikrotransaktiot ja maksullinen sisältö esitetään aina selkeästi ja läpinäkyvästi.<br> • Emme hyödynnä pelaajien haavoittuvuutta tai käytä manipuloivia pelimekaniikkoja kulutuksen lisäämiseksi.",
+
+    "society-nav-menu-title": "Vastuu",
+    "society-label": "Yhteiskunnallinen vastuu",
+    "society-description": "• Vältämme stereotyyppisiä, syrjiviä tai loukkaavia kuvauksia ja pyrimme vahvistamaan positiivisia arvoja.<br> • Huomioimme ympäristövaikutukset pelien kehityksessä ja ylläpidossa mahdollisuuksiemme mukaan.<br> • Uskomme pelien voimaan edistää oppimista, yhteisöllisyyttä ja myönteistä vuorovaikutusta.",
+
+    "law-nav-menu-title": "Lainsäädäntö",
+    "law-label": "Lainsäädäntö ja vastuullisuus",
+    "law-description": "• Noudatamme kaikkia sovellettavia lakeja ja viranomaismääräyksiä, mukaan lukien tietosuoja-, tekijänoikeus- ja kuluttajansuojalait.<br> • Sitoudumme toimimaan läpinäkyvästi ja ottamaan vastuun toiminnastamme.<br> • Kuuntelemme aktiivisesti pelaajien, työntekijöiden ja yhteistyökumppaneiden palautetta kehittääksemme toimintaamme jatkuvasti."
+}

frontend-next-migration/src/shared/i18n/locales/fi/footer.json

@@ -2,5 +2,6 @@
     "FooterTitle": "Ole osa yhteisöämme",
     "FooterPrivacy": "Yksityisyys",
     "FooterCookies": "Evästeet",
-    "FooterConsent": "Suostumus"
+    "FooterConsent": "Suostumus",
+    "FooterEthics": "Eettiset ohjeet"
 }

frontend-next-migration/src/shared/ui/v2/Footer/ui/FooterDesktop/FooterDesktop.test.tsx

@@ -15,6 +15,7 @@ const mockTexts: Texts = {
     consent: 'Reset Cookies',
     currentYear: 2024,
     privacy: 'Privacy Policy',
+    ethics: 'Ethical Guidelines',
     companyName: 'My Company',
 };
 

frontend-next-migration/src/shared/ui/v2/Footer/ui/FooterMobile/FooterMobile.test.tsx

@@ -30,6 +30,7 @@ const mockTexts: Texts = {
     consent: 'Reset Cookies',
     currentYear: 2025,
     privacy: 'Privacy Policy',
+    ethics: 'Ethical Guidelines',
     companyName: 'My Company',
 };
 

frontend-next-migration/src/widgets/Footer/model/types/types.ts

@@ -8,6 +8,7 @@ export interface Texts {
     cookies: string;
     privacy: string;
     consent: string;
+    ethics: string;
     companyName: string;
     currentYear: number;
 }

frontend-next-migration/src/widgets/Footer/ui/FooterDesktop/FooterDesktop.stories.tsx

@@ -44,6 +44,7 @@ export const Default: Story = {
             consent: 'Consent',
             cookies: 'Cookies',
             privacy: 'Privacy',
+            ethics: 'Ethical Guidelines',
             currentYear: new Date().getFullYear(),
             companyName: "Psyche's Royale Gaming ry",
         },

frontend-next-migration/src/widgets/Footer/ui/FooterMain/FooterMain.tsx

@@ -25,6 +25,7 @@ export const Footer = (props: Props) => {
                 privacy: t('FooterPrivacy'),
                 cookies: t('FooterCookies'),
                 consent: t('FooterConsent'),
+                ethics: t('FooterEthics'),
                 companyName: envHelper.companyName,
             }}
             socialIconLinks={socialIconLinks}
@@ -39,6 +40,7 @@ export const Footer = (props: Props) => {
                 privacy: t('FooterPrivacy'),
                 cookies: t('FooterCookies'),
                 consent: t('FooterConsent'),
+                ethics: t('FooterEthics'),
                 companyName: envHelper.companyName,
             }}
             socialIconLinks={socialIconLinks}

frontend-next-migration/src/widgets/Footer/ui/Rights/Rights.module.scss

@@ -28,6 +28,13 @@
   text-decoration: underline;
   color: orange;
 }
+.ethics {
+  white-space: nowrap;
+}
+.ethics:hover {
+  text-decoration: underline;
+  color: orange;
+}
 
 .RightContainer {
   display: flex;

frontend-next-migration/src/widgets/Footer/ui/Rights/Rights.stories.tsx

@@ -20,6 +20,7 @@ export const Default: Story = {
             consent: 'Click here to reset cookies',
             currentYear: 2024,
             privacy: 'Read our Privacy Policy',
+            ethics: 'Read our Ethical Guidelines',
             companyName: "Psyche's Royale Gaming ry",
         },
     },

frontend-next-migration/src/widgets/Footer/ui/Rights/Rights.test.tsx

@@ -21,6 +21,7 @@ describe('Rights', () => {
         consent: 'Reset Cookies',
         currentYear: 2024, // Change currentYear to number
         privacy: 'Privacy Policy',
+        ethics: 'Ethical Guidelines',
         companyName: 'My Company',
     };
 
@@ -30,6 +31,7 @@ describe('Rights', () => {
         expect(screen.getByText('Cookie Policy')).toBeInTheDocument();
         expect(screen.getByText('Privacy Policy')).toBeInTheDocument();
         expect(screen.getByText('Reset Cookies')).toBeInTheDocument();
+        expect(screen.getByText('Ethical Guidelines')).toBeInTheDocument();
         expect(screen.getByText('2024 My Company')).toBeInTheDocument();
     });
 

frontend-next-migration/src/widgets/Footer/ui/Rights/Rights.tsx

@@ -1,6 +1,10 @@
 import { memo } from 'react';
 import { classNames } from '@/shared/lib/classNames/classNames';
-import { getRouteCookiesPage, getRoutePrivacyPage } from '@/shared/appLinks/RoutePaths';
+import {
+    getRouteCookiesPage,
+    getRoutePrivacyPage,
+    getRouteEthicalGuidelinesPage,
+} from '@/shared/appLinks/RoutePaths';
 import { AppLink } from '@/shared/ui/AppLink/AppLink';
 import { useResetCookies } from '@/shared/lib/hooks/useResetCookies';
 import { Texts } from '../../model/types/types';
@@ -14,7 +18,7 @@ interface RightsProps {
 export const Rights = memo((props: RightsProps) => {
     const { className = '', texts } = props;
 
-    const { cookies, consent, currentYear, privacy, companyName } = texts;
+    const { cookies, consent, currentYear, privacy, ethics, companyName } = texts;
 
     const handleResetCookies = useResetCookies();
 
@@ -40,6 +44,12 @@ export const Rights = memo((props: RightsProps) => {
                     >
                         {consent}
                     </span>
+                    <AppLink
+                        className={cls.ethics}
+                        to={getRouteEthicalGuidelinesPage()}
+                    >
+                        {ethics}
+                    </AppLink>
                 </p>
             </div>
             <p>