CAN-10 Added harm reduction page (#23) (#24)

* CAN-10
Subject: added initial harm reduction page with a very short description and link to detailed guide with references

Problem: we want to do harm reduction and didn't have any information as of yet

Solution: added harm reduction page

Note: also added translations for the footer and some harm reduction key words. Also added the ability for the action button to open external links in a new tab as we don't want to lose people on our website when we link them to 3rd parties

* CAN-10
Subject: added link to drug checking berlin on harm reductio

Problem: we want more servicies listed here from the get go

Solution: added more services

* CAN-10
Subject: fix duplicated code in action button with cheeky elvis

Problem: marc was duplicating code like a silly boyo

Solution: ain't nothing but a hound dog

app/[locale]/harmreduction/harmreduction-content.tsx

@@ -0,0 +1,37 @@
+"use client"
+import ActionButton from '@/app/ui/Home/actionbutton';
+import { useLocale, useTranslations } from 'next-intl';
+
+export default function HarmReductionContent() {
+    const t = useTranslations('HarmReductionPage');
+    const localActive = useLocale();
+    return (
+        <div className='flex flex-col gap-8 md:gap-12 md:mt-30 lg:mt-16'>
+            <h1 className='font-bold text-4xl md:text-[4rem] opacity-[0.3] text-balance leading-tight'>
+                {t('headline')}
+            </h1>
+            <p>{t('headline_description')}</p>
+            <h2 className='font-bold text-4xl md:text-[2rem] opacity-[0.3] text-balance leading-tight'>Drugsand.me</h2>
+            <p>{t('headline_subdescription')}</p>
+            <ActionButton
+                backgroundColor={'#B6CF54'}
+                textColor={'#ffffff'}
+                href={`https://www.drugsand.me/drugs/cannabis/`}
+                externalLink={true}
+            >
+                {t('drugs_and_me_button')}
+            </ActionButton>
+            <h2 className='font-bold text-4xl md:text-[2rem] opacity-[0.3] text-balance leading-tight'>Drug Checking Berlin</h2>
+            <p>{t('drug_checking_berlin')}</p>
+            <ActionButton
+                backgroundColor={'#B6CF54'}
+                textColor={'#ffffff'}
+                href={`https://drugchecking.berlin/`}
+                externalLink={true}
+            >
+                {t('drug_checking_button')}
+            </ActionButton>
+            <br/>
+        </div>
+    );
+}

app/[locale]/harmreduction/page.tsx

@@ -0,0 +1,11 @@
+import HarmReductionContent from './harmreduction-content';
+import { unstable_setRequestLocale } from 'next-intl/server';
+
+export default function About({ params: { locale } }: { params: { locale: string } }) {
+    unstable_setRequestLocale(locale);
+    return (
+        <div className='flex flex-col md:flex-row w-full justify-center md:justify-between items-center h-full overflow-auto pt-12 md:pl-[YourNavbarWidth]'>
+            <HarmReductionContent />
+        </div>
+    );
+}

app/[locale]/layout.tsx

@@ -16,7 +16,7 @@ export const metadata: Metadata = {
     description:
         'CannabisClubsBerlin.com is your premier source for insights into cannabis clubs in Berlin, offering comprehensive reviews and information to guide the Berlin population through the myriad of cannabis options available in the city. Our mission is to educate and inform users about the vibrant cannabis culture in Berlin and to navigate the local regulations regarding cannabis use and club memberships.Your number one spot for all cannabis related information in Berlin, Germany!',
     keywords:
-        'cannabis, berlin, weed, legal weed, kannabis, berlin weed, cannabis berlin, cannabis clubs, cannabis clubs berlin',
+        'cannabis, berlin, weed, legal weed, kannabis, berlin weed, cannabis berlin, cannabis clubs, cannabis clubs berlin, harm reduction, cannabis harm reduction, cannabis addiction',
 };
 
 //function to generate the routes for all the locales

app/ui/Footer/footer.tsx

@@ -1,5 +1,5 @@
 "use client"
-import { useLocale } from 'next-intl';
+import { useLocale, useTranslations } from 'next-intl';
 import Link from 'next/link';
 import React from 'react';
 
@@ -20,12 +20,14 @@ const footerStyle: React.CSSProperties = {
 const Footer = () => {
     const currentYear = new Date().getFullYear();
     const localActive = useLocale();
+    const t = useTranslations('Footer');
+
     return (
         <div style={footerStyle}>
             <div className='text-center py-4'>
-                <Link href={`/${localActive}/imprint`}>Imprint</Link>
+                <Link href={`/${localActive}/imprint`}>{t("imprint")}</Link>
                 <span> | </span>
-                <Link href={`/${localActive}/termsofuse`}>Terms of Use</Link>
+                <Link href={`/${localActive}/termsofuse`}>{t("terms_of_use")}</Link>
                 <p>
                     © {currentYear} CannabisClubsBerlin.com. All rights
                     reserved.

app/ui/Home/actionbutton.js

@@ -6,8 +6,10 @@ export default function ActionButton({
     textColor,
     backgroundColor,
     children,
+    externalLink=false
 }) {
     return (
+        !externalLink ? 
         <Link
             href={href}
             className={
@@ -17,6 +19,17 @@ export default function ActionButton({
         >
             {children}
             <Triangle color={textColor} />
-        </Link>
+        </Link> 
+        :
+        <a href={href} 
+            target="_blank" 
+            className={
+                    'py-2 px-4 md:py-3 md:px-7 flex flex-row justify-center rounded-3xl cursor-pointer items-center gap-3'
+                }
+                style={{ color: textColor, backgroundColor: backgroundColor }}
+                >
+                {children}
+                <Triangle color={textColor} />
+        </a>
     );
 }

app/ui/Navigation/navbar.tsx

@@ -15,6 +15,7 @@ export default function Navbar() {
         { name: t('law_title'), href: `/${localActive}/law` },
         { name: t('contact_title'), href: `/${localActive}/contact` },
         { name: t('about_title'), href: `/${localActive}/about` },
+        { name: t('harm_reduction_title'), href: `/${localActive}/harmreduction` },
     ];
 
     return (

messages/de.json

@@ -110,6 +110,14 @@
         "headline_description": "Bitte zögern Sie nicht, uns über die unten aufgeführten Kanäle zu kontaktieren.",
         "headline_subdescription" : "[email protected]"
     }, 
+    "HarmReductionPage" : {
+        "headline": "Schadensminderung",
+        "headline_description": "Die Schadensminderung im Zusammenhang mit dem Konsum von Cannabis erkennt die potenziellen Vorteile der Substanz an und spricht gleichzeitig die Risiken an, die mit ihrem Gebrauch verbunden sind. Cannabis wird für seine therapeutischen Effekte geschätzt, einschließlich Schmerzlinderung, Verringerung von Angstzuständen und seiner Fähigkeit, Symptome verschiedener medizinischer Zustände zu mildern. Die Schadensminderung betont jedoch die Bedeutung des Verständnisses und der Minderung der Risiken, die mit dem Konsum von Cannabis verbunden sind, wie etwa potenzielle Abhängigkeit, beeinträchtigte kognitive und motorische Funktionen und die Auswirkungen auf die psychische Gesundheit, insbesondere bei jungen Nutzern. Strategien beinhalten die Förderung von Bildung über sichere Konsumpraktiken, die Ermutigung zur Mäßigung und die Unterstützung von Forschung zu den positiven und negativen Effekten des Cannabiskonsums. Dieser ausgewogene Ansatz zielt darauf ab, die öffentliche Gesundheit zu schützen und gleichzeitig die Vorteile der Substanz anzuerkennen.",
+        "headline_subdescription" : "Bitte finden Sie einen detaillierten Leitfaden zum Gebrauch von Cannabis unter dem folgenden Link, mit einer Auflistung der für den Leitfaden verwendeten Referenzen.",
+        "drugs_and_me_button": "Vollständiger Leitfaden auf drugsand.me",
+        "drug_checking_berlin" : "Der Service auf drugchecking.berlin bietet anonyme, kostenlose und vertrauliche Beratung sowie Tests für psychoaktive Substanzen. Ihr Ziel ist es, Gesundheitsschäden zu verhindern, indem sie chemische Analysen von bewusstseinsverändernden Substanzen durchführen und professionelle Beratung zusammen mit den Testergebnissen anbieten. Sie veröffentlichen auch Warnungen über Substanzproben, die ein signifikantes Risiko über das übliche Konsumniveau hinaus darstellen. Diese Initiative ist Teil einer breiteren Kampagne zur Schadensminderung und zur Information über sicheren Gebrauch in Berlin.",
+        "drug_checking_button": "Weitere Informationen zu sicherem Gebrauch und Drogenprüfung in Berlin"                
+    },
     "ImprintPage": {
         "headline": "Impressum",
         "headline_description": "CannabisClubsBerlin.com ist Ihre erste Anlaufstelle für Einblicke in die Cannabis-Clubs in Berlin und bietet umfassende Bewertungen und Informationen, um die Berliner Bevölkerung durch die Vielzahl der in der Stadt verfügbaren Cannabis-Optionen zu führen. Unser Ziel ist es, Nutzer über die lebendige Cannabis-Kultur in Berlin aufzuklären und bei der Navigation durch die lokalen Vorschriften bezüglich des Cannabis-Konsums und der Clubmitgliedschaften zu unterstützen.",
@@ -148,6 +156,11 @@
         "clubs_title": "Vereine",
         "law_title": "Gesetz",
         "contact_title": "Kontakt",
-        "about_title": "Über uns"
+        "about_title": "Über uns",
+        "harm_reduction_title": "Schadensminderung"
+    },
+    "Footer" : {
+        "imprint" : "Impressum",
+        "terms_of_use" : "Nutzungsbedingungen"
     }
 }

messages/en.json

@@ -110,6 +110,14 @@
         "headline_description": "Please feel free to contact us through the channels listed below.",
         "headline_subdescription" : "[email protected]"
     }, 
+    "HarmReductionPage" : {
+        "headline": "Harm Reduction",
+        "headline_description": "Harm reduction related to cannabis usage recognizes the substance's potential benefits while also addressing the risks associated with its use. Cannabis has been celebrated for its therapeutic effects, including pain relief, reduction in anxiety, and its ability to mitigate symptoms of various medical conditions. However, harm reduction emphasizes the importance of understanding and mitigating the risks linked to cannabis consumption, such as potential dependency, impaired cognitive and motor functions, and the impact on mental health, particularly in young users. Strategies include promoting education on safe consumption practices, encouraging moderation, and supporting research into both the positive and adverse effects of cannabis use. This balanced approach aims to protect public health while acknowledging the substance's benefits.",
+        "headline_subdescription" : "Bitte finden Sie einen detaillierten Leitfaden zum Gebrauch von Cannabis unter dem folgenden Link, mit einer Auflistung der für den Leitfaden verwendeten Referenzen.",
+        "drugs_and_me_button": "Full guide on Drugsand.me",
+        "drug_checking_berlin" : "The service offered at drugchecking.berlin provides anonymous, free, and confidential advice and testing for psychoactive substances. Their aim is to prevent health damage by conducting chemical analyses of mind-altering substances and offering professional advice alongside the test results. They also publish warnings about substance samples that pose significant risks beyond the usual level of consumption. This initiative is part of a broader harm reduction and safe usage information campaign in Berlin.",
+        "drug_checking_button": "More information on safe usage and drug checking in Berlin"        
+    },
     "ImprintPage": {
         "headline": "Imprint",
         "headline_description": "CannabisClubsBerlin.com is your premier source for insights into cannabis clubs in Berlin, offering comprehensive reviews and information to guide the Berlin population through the myriad of cannabis options available in the city. Our mission is to educate and inform users about the vibrant cannabis culture in Berlin and to navigate the local regulations regarding cannabis use and club memberships.",
@@ -147,7 +155,12 @@
         "clubs_title": "Clubs",
         "law_title": "Law",
         "contact_title": "Contact",
-        "about_title": "About"
+        "about_title": "About",
+        "harm_reduction_title": "Harm Reduction"    
+    },
+    "Footer" : {
+        "imprint" : "Imprint",
+        "terms_of_use" : "Terms of Use"
     }
 
 }