add privacy policy and translate license text

src/App.tsx

@@ -19,6 +19,7 @@ import ContentWrapper from './components/ContentWrapper/ContentWrapper';
 import AdminAuthWrapper from './components/AdminAuthWrapper/AdminAuthWrapper';
 import LangProvider from './components/LangProvider/LangProvider';
 import AuthProvider from './components/AuthProvider/AuthProvider';
+import PrivacyPolicy from './components/ContentWrapper/PrivacyPolicy/PrivacyPolicy';
 
 /**
  * Root Component
@@ -146,6 +147,14 @@ export default function App() {
                                 </ContentWrapper>
                             }
                         />
+                        <Route
+                            path="/privacy-policy"
+                            element={
+                                <ContentWrapper>
+                                    <PrivacyPolicy />
+                                </ContentWrapper>
+                            }
+                        />
                     </Routes>
                 </Router>
             </AuthProvider>

src/components/ContentWrapper/Footer/Footer.css

@@ -25,8 +25,4 @@
 
 .footer-link:hover {
     color: #06f87f;
-}
-
-.datenschutzerklaerung {
-    display: none;
 }

src/components/ContentWrapper/Footer/Footer.scss

@@ -29,7 +29,3 @@
 .footer-link:hover {
     color: $amplimind-accent-green;
 }
-
-.datenschutzerklaerung {
-    display: none;
-}

src/components/ContentWrapper/Footer/Footer.tsx

@@ -1,5 +1,6 @@
 import './Footer.css';
 import { useTranslation } from 'react-i18next';
+import { Link } from 'react-router-dom';
 
 /**
  * Footer component that displays the footer of the application.
@@ -34,11 +35,11 @@ export default function Footer() {
                 >
                     GitHub
                 </a>
-                <a className="footer-link datenschutzerklaerung" href="">
-                    GitHub
-                </a>
+                <Link to="/privacy-policy" className="footer-link datenschutzerklaerung">
+                    {t('privacyPolicy', {ns: "privacyPolicy"})}
+                </Link>
             </div>
-            <p data-testid="license-text">License Text</p>
+            <p data-testid="license-text">{t('licenseText', {ns: "license"})}</p>
         </div>
     );
 }

src/components/ContentWrapper/PrivacyPolicy/PrivacyPolicy.scss

@@ -0,0 +1,9 @@
+@import '../../../theme/theme.scss';
+
+.privacy-policy-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    padding: 20px;
+}

src/components/ContentWrapper/PrivacyPolicy/PrivacyPolicy.tsx

@@ -0,0 +1,12 @@
+import './PrivacyPolicy.css';
+import { useTranslation } from 'react-i18next';
+
+export default function PrivacyPolicy() {
+    const { t } = useTranslation('privacyPolicy');
+    return (
+        <div className="privacy-policy-container">
+            <h1>{t('privacyPolicy')}</h1>
+            your content here
+        </div>
+    );
+}

src/i18n.ts

@@ -10,6 +10,8 @@ import enInvite from './locales/en/invite.json';
 import enResetPassword from './locales/en/resetPassword.json';
 import enAdmin from './locales/en/admin.json';
 import enPasswordStrength from './locales/en/passwordStrength.json';
+import enLicense from './locales/en/license.json';
+import enPrivacyPolicy from './locales/en/privacyPolicy.json';
 
 // Deutsch / German
 import deMain from './locales/de/main.json';
@@ -19,6 +21,8 @@ import deInvite from './locales/de/invite.json';
 import deResetPassword from './locales/de/resetPassword.json';
 import deAdmin from './locales/de/admin.json';
 import dePasswordStrength from './locales/de/passwordStrength.json';
+import deLicense from './locales/de/license.json';
+import dePrivacyPolicy from './locales/de/privacyPolicy.json';
 
 const resources = {
     en: {
@@ -29,6 +33,8 @@ const resources = {
         resetPassword: enResetPassword,
         admin: enAdmin,
         passwordStrength: enPasswordStrength,
+        license: enLicense,
+        privacyPolicy: enPrivacyPolicy,
     },
     de: {
         main: deMain,
@@ -38,6 +44,8 @@ const resources = {
         resetPassword: deResetPassword,
         admin: deAdmin,
         passwordStrength: dePasswordStrength,
+        license: deLicense,
+        privacyPolicy: dePrivacyPolicy,
     },
 };
 

src/locales/de/license.json

@@ -0,0 +1,3 @@
+{
+    "licenseText": "Lizenztext"
+}

src/locales/de/privacyPolicy.json

@@ -0,0 +1,3 @@
+{
+    "privacyPolicy": "Datenschutzerklärung"
+}

src/locales/en/license.json

@@ -0,0 +1,3 @@
+{
+    "licenseText": "License Text"
+}

src/locales/en/privacyPolicy.json

@@ -0,0 +1,3 @@
+{
+    "privacyPolicy": "Privacy Policy"
+}