Plant-for-the-Planet-org · mariahosfeld · Feb 28, 2023 · Nov 17, 2022 · Nov 17, 2022 · Nov 17, 2022
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -28,7 +28,7 @@
     "errorMsg": "Invalid branch name. \n 1.Branch names can contain lowercase characters, numbers, hyphen and underscore. \n 2.Except for 'main' and 'develop', branch names must begin with 'feature/' or 'hotfix/' "
   },
   "engines": {
-    "node": "14.x",
+    "node": "16.x",
     "npm": "8.x"
   },
   "next-unused": {
@@ -59,6 +59,7 @@
     "@sentry/webpack-plugin": "^1.18.3",
     "@turf/turf": "^5.1.6",
     "@types/papaparse": "^5.3.2",
+    "@types/qrcode": "^1.5.0",
     "@types/react-gtm-module": "^2.0.1",
     "@types/react-lazyload": "^2.6.0",
     "d3-ease": "^2.0.0",
@@ -81,6 +82,7 @@
     "papaparse": "^5.3.1",
     "path-browserify": "^1.0.1",
     "prop-types": "^15.7.2",
+    "qrcode": "^1.5.1",
     "react": "^17.0.2",
     "react-content-loader": "^5.1.4",
     "react-dom": "^17.0.2",
@@ -91,7 +93,7 @@
     "react-insta-stories": "^2.2.5",
     "react-json-editor-ajrm": "^2.5.13",
     "react-lazyload": "^3.2.0",
-    "react-map-gl": "5.3.19",
+    "react-map-gl": "5.3.20",
     "react-mapbox-gl": "^5.1.0",
     "react-mapbox-gl-draw": "^2.0.4",
     "react-player": "^2.8.2",
@@ -105,7 +107,7 @@
   "devDependencies": {
     "@emotion/babel-plugin": "^11.9.2",
     "@emotion/eslint-plugin": "^11.7.0",
-    "@netlify/plugin-nextjs": "^4.28.6",
+    "@netlify/plugin-nextjs": "^4.30.0",
     "@storybook/addon-actions": "^6.5.14",
     "@storybook/addon-essentials": "^6.5.14",
     "@storybook/addon-interactions": "^6.5.14",

diff --git a/pages/[p].tsx b/pages/[p].tsx
@@ -64,19 +64,22 @@ export default function Donate({
         setInternalCurrencyCode(currency);
         setInternalLanguage(i18n.language);
         setCurrencyCode(currency);
-        const project = await getRequest(
-          `/app/projects/${router.query.p}`,
-          handleError,
-          '/',
-          {
-            _scope: 'extended',
-            currency: currency,
-            locale: i18n.language,
-          }
-        );
-        setProject(project);
-        setShowSingleProject(true);
-        setZoomLevel(2);
+        const _project = router.query.p?.toString();
+        if (_project) {
+          const project = await getRequest(
+            `/app/projects/${_project}`,
+            handleError,
+            '/',
+            {
+              _scope: 'extended',
+              currency: currency,
+              locale: i18n.language,
+            }
+          );
+          setProject(project);
+          setShowSingleProject(true);
+          setZoomLevel(2);
+        }
       }
     }
     if (router.query.p) {

diff --git a/pages/profile/payouts/add-bank-details.tsx b/pages/profile/payouts/add-bank-details.tsx
@@ -1,20 +1,27 @@
-import React, { ReactElement } from 'react';
+import React, { ReactElement, useContext } from 'react';
 import UserLayout from '../../../src/features/common/Layout/UserLayout/UserLayout';
 import Head from 'next/head';
 import ManagePayouts, {
   ManagePayoutTabs,
 } from '../../../src/features/user/ManagePayouts';
 import { useTranslation } from 'next-i18next';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
+import { UserPropsContext } from '../../../src/features/common/Layout/UserPropsContext';
+import AccessDeniedLoader from '../../../src/features/common/ContentLoaders/Projects/AccessDeniedLoader';
 
 export default function AddBankDetailsPage(): ReactElement {
   const { t, ready } = useTranslation('me');
+  const { user } = useContext(UserPropsContext);
   return (
     <UserLayout>
       <Head>
         <title>{ready ? t('managePayouts.titleAddBankDetails') : ''}</title>
       </Head>
-      <ManagePayouts step={ManagePayoutTabs.ADD_BANK_DETAILS} />
+      {user.type === 'tpo' ? (
+        <ManagePayouts step={ManagePayoutTabs.ADD_BANK_DETAILS} />
+      ) : (
+        <AccessDeniedLoader />
+      )}
     </UserLayout>
   );
 }

diff --git a/pages/profile/payouts/index.tsx b/pages/profile/payouts/index.tsx
@@ -1,4 +1,4 @@
-import React, { ReactElement, useState } from 'react';
+import React, { ReactElement, useContext, useState } from 'react';
 import TopProgressBar from '../../../src/features/common/ContentLoaders/TopProgressBar';
 import UserLayout from '../../../src/features/common/Layout/UserLayout/UserLayout';
 import Head from 'next/head';
@@ -7,10 +7,13 @@ import ManagePayouts, {
 } from '../../../src/features/user/ManagePayouts';
 import { useTranslation } from 'next-i18next';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
+import { UserPropsContext } from '../../../src/features/common/Layout/UserPropsContext';
+import AccessDeniedLoader from '../../../src/features/common/ContentLoaders/Projects/AccessDeniedLoader';
 
 export default function OverviewPage(): ReactElement {
   const { t, ready } = useTranslation('me');
   const [progress, setProgress] = useState(0);
+  const { user } = useContext(UserPropsContext);
 
   return (
     <>
@@ -23,10 +26,14 @@ export default function OverviewPage(): ReactElement {
         <Head>
           <title>{ready ? t('managePayouts.titleOverview') : ''}</title>
         </Head>
-        <ManagePayouts
-          step={ManagePayoutTabs.OVERVIEW}
-          setProgress={setProgress}
-        />
+        {user?.type === 'tpo' ? (
+          <ManagePayouts
+            step={ManagePayoutTabs.OVERVIEW}
+            setProgress={setProgress}
+          />
+        ) : (
+          <AccessDeniedLoader />
+        )}
       </UserLayout>
     </>
   );

diff --git a/pages/profile/payouts/schedule.tsx b/pages/profile/payouts/schedule.tsx
@@ -1,20 +1,26 @@
-import React, { ReactElement } from 'react';
+import React, { ReactElement, useContext } from 'react';
 import UserLayout from '../../../src/features/common/Layout/UserLayout/UserLayout';
 import Head from 'next/head';
 import ManagePayouts, {
   ManagePayoutTabs,
 } from '../../../src/features/user/ManagePayouts';
 import { useTranslation } from 'next-i18next';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
-
+import { UserPropsContext } from '../../../src/features/common/Layout/UserPropsContext';
+import AccessDeniedLoader from '../../../src/features/common/ContentLoaders/Projects/AccessDeniedLoader';
 export default function PayoutSchedulePage(): ReactElement {
   const { t, ready } = useTranslation('me');
+  const { user } = useContext(UserPropsContext);
   return (
     <UserLayout>
       <Head>
         <title>{ready ? t('managePayouts.titlePayoutSchedule') : ''}</title>
       </Head>
-      <ManagePayouts step={ManagePayoutTabs.PAYOUT_SCHEDULE} />
+      {user?.type === 'tpo' ? (
+        <ManagePayouts step={ManagePayoutTabs.PAYOUT_SCHEDULE} />
+      ) : (
+        <AccessDeniedLoader />
+      )}
     </UserLayout>
   );
 }

diff --git a/pages/profile/projects/index.tsx b/pages/profile/projects/index.tsx
@@ -1,20 +1,22 @@
-import React, { ReactElement } from 'react';
+import React, { ReactElement, useContext } from 'react';
 import ProjectsContainer from '../../../src/features/user/ManageProjects/ProjectsContainer';
 import UserLayout from '../../../src/features/common/Layout/UserLayout/UserLayout';
 import Head from 'next/head';
 import { useTranslation } from 'next-i18next';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
-
+import { UserPropsContext } from '../../../src/features/common/Layout/UserPropsContext';
+import AccessDeniedLoader from '../../../src/features/common/ContentLoaders/Projects/AccessDeniedLoader';
 interface Props {}
 export default function Register({}: Props): ReactElement {
   const { t } = useTranslation('me');
+  const { user } = useContext(UserPropsContext);
 
   return (
     <UserLayout>
       <Head>
         <title>{t('projects')}</title>
       </Head>
-      <ProjectsContainer />
+      {user.type === 'tpo' ? <ProjectsContainer /> : <AccessDeniedLoader />}
     </UserLayout>
   );
 }

diff --git a/pages/profile/projects/new-project.tsx b/pages/profile/projects/new-project.tsx
@@ -115,8 +115,11 @@ export default function AddProjectType(): ReactElement {
                     )
                     :
                     null} */}
-
-        <ManageProjects token={token} />
+        {user.type === 'tpo' ? (
+          <ManageProjects token={token} />
+        ) : (
+          <AccessDeniedLoader />
+        )}
       </UserLayout>
     </div>
   );

diff --git a/pages/profile/treemapper/import.tsx b/pages/profile/treemapper/import.tsx
@@ -1,20 +1,22 @@
 import Head from 'next/head';
-import React, { ReactElement } from 'react';
+import React, { ReactElement, useContext } from 'react';
 import UserLayout from '../../../src/features/common/Layout/UserLayout/UserLayout';
 import { useTranslation } from 'next-i18next';
 import ImportData from '../../../src/features/user/TreeMapper/Import';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
-
+import { UserPropsContext } from '../../../src/features/common/Layout/UserPropsContext';
+import AccessDeniedLoader from '../../../src/features/common/ContentLoaders/Projects/AccessDeniedLoader';
 interface Props {}
 
 export default function Import({}: Props): ReactElement {
   const { t } = useTranslation('treemapper');
+  const { user } = useContext(UserPropsContext);
   return (
     <UserLayout>
       <Head>
         <title>{t('treemapper:importData')}</title>
       </Head>
-      <ImportData />
+      {user.type === 'tpo' ? <ImportData /> : <AccessDeniedLoader />}
     </UserLayout>
   );
 }

diff --git a/pages/profile/treemapper/my-species.tsx b/pages/profile/treemapper/my-species.tsx
@@ -1,20 +1,23 @@
 import Head from 'next/head';
-import React, { ReactElement } from 'react';
+import React, { ReactElement, useContext } from 'react';
 import UserLayout from '../../../src/features/common/Layout/UserLayout/UserLayout';
 import MySpecies from '../../../src/features/user/TreeMapper/MySpecies';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
 import { useTranslation } from 'next-i18next';
+import { UserPropsContext } from '../../../src/features/common/Layout/UserPropsContext';
+import AccessDeniedLoader from '../../../src/features/common/ContentLoaders/Projects/AccessDeniedLoader';
 
 interface Props {}
 
 export default function MySpeciesPage({}: Props): ReactElement {
   const { t } = useTranslation('me');
+  const { user } = useContext(UserPropsContext);
   return (
     <UserLayout>
       <Head>
         <title>{t('mySpecies')}</title>
       </Head>
-      <MySpecies />
+      {user.type === 'tpo' ? <MySpecies /> : <AccessDeniedLoader />}
     </UserLayout>
   );
 }

diff --git a/public/static/locales/de/bulkCodes.json b/public/static/locales/de/bulkCodes.json
@@ -1,5 +1,6 @@
 {
   "bulkCodesTitle": "Bulk-Codes erzeugen",
+  "partnerSignupInfo": "Unsere Funktion Planet Cash / Bulk-Codes ist eine neue Funktion speziell für Partner von Plant-for-the-Planet. Melden Sie sich gerne bei Interesse bei <2>partner@plant-for-the-planet.org</2>.",
   "bulkCodesDescription1": "Mit PlanetCash kannst du Tausende von Codes auf einmal erzeugen.",
   "bulkCodesDescription2": "Mit dieser Funktion kannst du Codes für benutzerdefinierte Zertifikate, Geschenkkarten, Spenden im Namen von Nutzern und einlösbare Codes erstellen, die du mit deinen Produkten verknüpfen kannst.",
   "tabCreationMethod": "Herstellungsmethode",
@@ -10,20 +11,12 @@
   "importMethodText": {
     "title": "Importieren",
     "subtitle": "Verwende diese Methode, wenn eines der folgenden Kriterien auf deinen Anwendungsfall zutrifft:",
-    "details": [
-      "Ich möchte für jeden Code den Namen des Empfängers oder seine E-Mail-Adresse angeben.",
-      "Ich möchte, dass Plant-for-the-Planet nach der Erstellung automatisch eine E-Mail an die Empfänger sendet (optional).",
-      "Ich möchte Codes für verschiedene Zahlen von Bäumen vergeben."
-    ]
+    "details": ["Ich möchte für jeden Code den Namen des Empfängers oder seine E-Mail-Adresse angeben.", "Ich möchte, dass Plant-for-the-Planet nach der Erstellung automatisch eine E-Mail an die Empfänger sendet (optional).", "Ich möchte Codes für verschiedene Zahlen von Bäumen vergeben."]
   },
   "genericMethodText": {
     "title": "Generische Codes erstellen",
     "subtitle": "Verwende diese Methode, wenn die folgenden Kriterien auf deinen Anwendungsfall zutreffen:",
-    "details": [
-      "Alle Codes werden den gleichen Wert haben.",
-      "Ich möchte eine Reihe von Codes für beliebige Empfänger generieren.",
-      "Namen und E-Mail-Adressen können nicht mit dem Code verknüpft werden."
-    ]
+    "details": ["Alle Codes werden den gleichen Wert haben.", "Ich möchte eine Reihe von Codes für beliebige Empfänger generieren.", "Namen und E-Mail-Adressen können nicht mit dem Code verknüpft werden."]
   },
   "projectName": "Projektname",
   "costPerUnit": "Kosten pro Einheit",
@@ -39,7 +32,7 @@
   "occasion": "Anlass",
   "total": "Insgesamt",
   "chargeConsentText": "Indem du auf Codes erzeugen klickst, erklärst du dich damit einverstanden, dass der oben genannte Betrag von deinem Konto abgebucht wird.",
-  "invalidEmailWarningText": "Stelle bitte sicher, dass die Empfänger-E-Mail eine gültige Adresse ist. Die Verwendung von Dummy- oder ungültigen E-Mail-Adressen führt gemäß der Nutzungsbedingungen der Plattform zur Sperrung des Kontos.",
+  "invalidEmailWarningText": "Bitte stelle sicher, dass recipient_email eine gültige E-Mail ist. Die Verwendung von Pseudo-E-Mails oder ungültigen E-Mails führt zur Sperrung des Kontos in Übereinstimmung mit den Geschäftsbedingungen der Plattform.",
   "projectRequired": "Es wurde kein Projekt ausgewählt.",
   "unitsPerCodeRequired": "Jeder Code sollte mindestens eine Einheit enthalten.",
   "codeQuantityRequired": "Du musst mindestens einen Code erstellen.",
@@ -50,18 +43,18 @@
   "insufficientPCashBalance": "Unzureichendes Guthaben",
   "addBalanceGeneric": "Bitte klicke hier, um Guthaben hinzuzufügen.",
   "instructionsUploadCSV": {
-    "empty": "Drag & Drop / klicken um eine .xslx / .csv Datei zum hochladen auszuwählen.",
-    "error": "Bitte kontrolliere die Probleme und ziehe die .xslx / .csv Datei hier her zum hochladen.",
+    "empty": "Drag & Drop / Klicke zur Auswahl einer .xslx/.csv-Datei zum Hochladen.",
+    "error": "Bitte prüfe etwaige Probleme und ziehe die .xslx/.csv-Datei zum Hochladen hierher.",
     "processing": "Bitte warte, während wir deine Datei analysieren...",
-    "success": "Fahre fort oder ziehe eine .xlsx oder .csv Datei hier her um die aktuelle zu ersetzen."
+    "success": "Weiter oder ziehe eine .xslx or .csv-Datei hierher, um die aktuelle Datei zu ersetzen."
   },
   "statusUploadCSV": {
     "error": "Fehler",
     "success": "Dateianalyse abgeschlossen"
   },
   "errorUploadCSV": {
-    "fileInvalidType": "Es sind nur .csv und .xslx Dateien erlaubt.",
-    "tooManyFiles": "Lade bitte nur eine einzige Datei hoch.",
+    "fileInvalidType": "Nur .csv or .xslx Dateien sind zulässig",
+    "tooManyFiles": "Bitte lade nur eine einzige Datei hoch.",
     "fileTooSmall": "Die hochgeladene Datei scheint leer zu sein",
     "fileTooLarge": "Die hochgeladene Datei darf höchstens 5 MB groß sein.",
     "missingColumns": "In der hochgeladenen Datei fehlen die folgenden Spalten: ",
@@ -70,18 +63,18 @@
     "unitsNotProvided": "Einheiten fehlen oder sind ungültig bei einigen Empfängern.",
     "notifyNotPossible": "E-Mail und Name fehlen bei einigen Empfängern, die benachrichtigt werden sollen.",
     "instructionRowError": "In der 1. Zeile ist ein Fehler aufgetreten. Bitte prüfe, ob du die Anweisungen gelöscht hast oder ob zusätzliche Daten vorhanden sind.",
-    "invalidEmails": "Die angegebenen E-Mails sind in den folgenden Zeilen ungültig:",
+    "invalidEmails": "recipient_email enthält falsche/ungültige E-Mails in den folgenden Zeilen: {{rowList}}. Bitte entferne ungültige Emails oder füge gültige Emails hinzu.",
     "generalError": "Es ist ein Fehler aufgetreten. Bitte versuche es nach einer Weile erneut."
   },
   "successUploadCSV": {
-    "ignoredColumns": "Zusätzliche Spalten werden ignoriert."
+    "ignoredColumns": "Zusätzliche Spalten wurden ignoriert"
   },
-  "importInstructions": "Bitte lese die <2>Dokumentation hier</2>, und lade die hier die <5>Excel-</5> oder <8>CSV-Vorlage</8> herunter.",
+  "importInstructions": "Bitte lesen Sie die <2>Dokumentation hier</2>, lade die <5>Excel-Vorlage hier</5> und die <8>CSV-Vorlage hier</8> herunter.",
   "donationSuccess": "Deine Spende war erfolgreich. Du wirst in Kürze zur Anzeige der Spendendetails weitergeleitet...",
   "donationError": {
     "planet_cash_insufficient_credit": "Verfügbares Guthaben = {{availableBalance}}. Bitte lade Guthaben auf dein PlanetCash-Konto auf, um diese Spende zu tätigen.",
     "default": "Es ist ein Fehler aufgetreten. Bitte versuchen Sie es nach einer Weile erneut.",
     "planet_cash_payment_failure": "Die Transaktion ist fehlgeschlagen. {{reason}}",
     "planet_cash_invalid_project": "Du kannst für das ausgewählte Projekt nicht spenden."
   }
-}
+}
diff --git a/public/static/locales/de/donationLink.json b/public/static/locales/de/donationLink.json
@@ -1,20 +1,23 @@
 {
   "donationLinkTitle": "Erstelle deinen Spenden-Link",
   "donationLinkDescription": "Gestalte den Spenden-Link so, dass er deinen Bedürfnissen entspricht, damit deine Spender ein tolles Erlebnis haben. Verwende die Vorschau, um zu sehen, wie der Link am Ende aussehen wird.",
+  "qrCodeDiscription": "Anstelle des Links kann auch der QR-Code verwendet werden, um zum Projekt zu gelangen.",
   "labelCountry": "Land",
   "labelLanguages": "Sprache",
   "countryLanguageTitle": "Land und Sprache einstellen",
   "projectTitle": "Dein Projekt einstellen",
   "treeCounterTitle": "Unterstütze meinen TreeCounter",
   "testingTitle": "Testmodus",
   "urlTitle": "Deine Spenden-Link-URL",
+  "qrCodeTitle": "Spenden-Link QR-Code",
   "languages": "Sprachen",
   "preview": "Vorschau",
   "copy": "Kopieren",
   "treeCounterSubtitle": "Baumspenden über diesen Link unterstützen direkt mein Profil",
   "testingModeSubtitle1": "Verwende zum Testen den Link, der jetzt angezeigt wird. Dies dient nur zu Testzwecken. Damit der richtige Link freigegeben werden kann, musst du den Testmodus deaktivieren.",
   "testingModeSubtitle2": "Du kannst den Spendenvorgang mit Kartendaten testen unter",
-  "linkUpdatedMessage": "Der Link wurde aktualisiert",
+  "linkAndQRCodeUpdatedMessage": "Link und QR-Code wurden aktualisiert.",
   "treeCounterPrivateAccountSubtitle": "Um dein Profil zu unterstützen, musst du es in den Kontoeinstellungen auf öffentlich setzen.",
-  "automaticSelection": "Automatische Auswahl"
+  "automaticSelection": "Automatische Auswahl",
+  "qrCodeFileName": "Spenden-Link-QR-Code"
 }
diff --git a/public/static/locales/de/me.json b/public/static/locales/de/me.json
@@ -247,5 +247,6 @@
   "apiKeyMessage2": "Sobald du einen API-Schlüssel generiert hast, benötigen wir eine Zwei-Faktor-Authentifizierung für deine Anmeldung. Diese kannst du beim nächsten Mal einrichten, wenn du dich anmeldest.",
   "apiKeyMessage3": "Wenn du den API-Schlüssel neu generierst, wird dein bestehender API-Schlüssel sofort ungültig.",
   "regenerateKey": "Schlüssel neu generieren",
-  "giftFund": "GiftFund"
+  "giftFund": "GiftFund",
+  "donatedTrees": "Gespendete Bäume"
 }
diff --git a/public/static/locales/de/planetcash.json b/public/static/locales/de/planetcash.json
@@ -1,5 +1,6 @@
 {
   "title": "PlanetCash",
+  "partnerSignupInfo": "Unsere Funktion Planet Cash / Bulk-Codes ist eine neue Funktion speziell für Partner von Plant-for-the-Planet. Melden Sie sich gerne bei Interesse bei <2>partner@plant-for-the-planet.org</2>.",
   "description": "PlanetCash ist ein entwicklerfreundliches Tool, das die Plant-for-the-Planet Plattform mit APIs und eingebauten Tools erweitert. Das PlanetCash-Guthaben ist ein Beitrag zu Plant-for-the-Planet, der vom Spender für verschiedene Projekte auf der Plattform verwendet werden kann.",
   "termsText": "Bedingungen & Konditionen anzeigen.",
   "learnMoreText": "Erfahre mehr über PlanetCash.",