Merge branch 'main' into issue/1054-Integrate_CRUD_endpoints_properties

# Conflicts:
#	landing-page/components/Header.tsx

landing-page/components/Header.tsx

@@ -12,7 +12,7 @@ import { Chip } from '@helpwave/common/components/ChipList'
 
 const homeURL = '/'
 
-const linkNames = ['products', 'story', 'team', 'talks', 'tasks'] as const
+const linkNames = ['products', 'mediquu', 'story', 'team', 'talks', 'tasks'] as const
 type LinkNames = typeof linkNames[number]
 
 type LinkType = {
@@ -35,6 +35,10 @@ const items: SubLinkType[] = [
       }
     ]
   },
+  {
+    name: 'mediquu',
+    url: '/mediquu'
+  },
   {
     name: 'story',
     url: '/story'
@@ -56,6 +60,7 @@ type HeaderTranslation = {
 const defaultHeaderTranslation: Record<Languages, HeaderTranslation> = {
   en: {
     products: 'Products',
+    mediquu: 'mediQuu',
     story: 'Story',
     team: 'Team',
     contact: 'Contact us',
@@ -64,6 +69,7 @@ const defaultHeaderTranslation: Record<Languages, HeaderTranslation> = {
   },
   de: {
     products: 'Produkte',
+    mediquu: 'mediQuu',
     story: 'Geschichte',
     team: 'Team',
     contact: 'Kontakt',
@@ -80,11 +86,11 @@ const Header = () => {
 
   return (
     <>
-      <div className={tw('w-screen z-[50] fixed shadow-sm top-0 border bg-white')}>
-        <nav className={tw('flex mobile:p-2 desktop:max-w-[1000px] items-center justify-between mx-auto')}>
-          <Link href={homeURL}>
-            <Helpwave/>
-            <MarkdownInterpreter text={'\\helpwave'}/>
+      <div className={tw('absolute flex flex-row justify-center top-0 w-screen z-[50] bg-white mobile:px-6 tablet:px-12 desktop:px-24')}>
+        <nav className={tw('flex pt-2 items-center justify-between w-full max-w-[1200px]')}>
+          <Link href={homeURL} className={tw('flex flex-row gap-x-1 items-center text-2xl')}>
+            <Helpwave />
+            <MarkdownInterpreter text={'\\helpwave'} />
           </Link>
           <div className={tw('mobile:hidden w-full')}>
             <div className={tw('flex flex-wrap items-center justify-evenly')}>
@@ -141,8 +147,8 @@ const Header = () => {
             </div>
           </div>
           <button onClick={() => setNavbarOpen(true)} className={tw('desktop:hidden tablet:hidden content-end')}
-                  aria-controls="navbar" aria-expanded="false">
-            <MenuIcon size={32}/>
+            aria-controls="navbar" aria-expanded="false">
+            <MenuIcon size={32} />
           </button>
         </nav>
       </div>
@@ -151,7 +157,7 @@ const Header = () => {
         <div className={tw('absolute w-screen h-screen z-[100] bg-white')}>
           <div className={tw('text-center content-center fixed left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2')}>
             <button onClick={() => setNavbarOpen(false)} className={tw('mb-5')}>
-              <X size={64}/>
+              <X size={64} />
             </button>
 
             <div className={tw('w-full p-2')}>

landing-page/components/TeamMember.tsx

@@ -4,7 +4,8 @@ import Link from 'next/link'
 
 export type TeamMemberProps = {
   name: string,
-  title: string | undefined,
+  prefix: string | undefined,
+  suffix: string | undefined,
   pictureURL: string | undefined,
   role: string,
   tags: string[],
@@ -13,7 +14,8 @@ export type TeamMemberProps = {
 
 const TeamMember = ({
   name,
-  title,
+  prefix,
+  suffix,
   pictureURL,
   role,
   tags,
@@ -38,8 +40,9 @@ const TeamMember = ({
   return (
     <div className={tw('flex flex-col h-full mb-8 w-1/2 text-center p-8 min-w-[300px] items-center')}>
       <Image alt="Profilepicture" src={backedPictureURL} style={{ objectFit: 'contain' }} width={size} height={size} className={tx(`w-[${size}px] tansition-all duration-500 shadow-md hover:shadow-2xl rounded-full object-center m-auto mb-6`)}/>
-      <h4 className={tw('font-space text-gray-600 text-lg h-[32px]')}>{title}</h4>
+      <h4 className={tw('font-space text-gray-600 text-lg h-[32px]')}>{prefix}</h4>
       <h2 className={tw('text-3xl font-inter')}>{name}</h2>
+      <h4 className={tw('font-space text-gray-600 text-sm h-[32px]')}>{suffix}</h4>
       <h3 className={tw('mt-4 text-2xl font-space')}>{role} <span className={tw('text-md text-sm font-sans')}>{shorthand}</span></h3>
       <h4 className={tw('mt-2 text-lg font-space leading-none justify-center flex flex-wrap gap-2 text-gray-600 max-w-[300px]')}> {generatedSocials} {hashTags}</h4>
     </div>

landing-page/components/sections/landing/MarketStatsSection.tsx

@@ -4,7 +4,7 @@ import { useTranslation } from '@helpwave/common/hooks/useTranslation'
 import type { Languages } from '@helpwave/common/hooks/useLanguage'
 import { Span } from '@helpwave/common/components/Span'
 import type { PropsWithChildren } from 'react'
-import { Hospital, PieChart, UsersRound } from 'lucide-react'
+import Image from 'next/image'
 import { SectionBase } from '@/components/sections/SectionBase'
 
 type MarketStatsItemProps = PropsWithChildren<{
@@ -16,8 +16,8 @@ const MarketStatsItem = ({ children, stat, title }: MarketStatsItemProps) => {
   return (
     <div className={tw('flex flex-col items-center')}>
       {children}
-      <span className={tw('text-3xl mt-2')}>{stat}</span>
-      <h4><Span type="description" className={tw('text-xl')}>{title}</Span></h4>
+      <Span className={tw('text-3xl mobile:text-xl mt-2 mobile:font-semibold')}>{stat}</Span>
+      <h4><Span type="description" className={tw('text-xl mobile:!text-base')}>{title}</Span></h4>
     </div>
   )
 }
@@ -55,15 +55,18 @@ const MarketStatsSection = ({ overwriteTranslation }: PropsForTranslation<Market
       <Span type="description" className={tw('text-center')}>{translation.marketPotential}</Span>
       <div className={tw('mt-8 w-full flex flex-wrap gap-y-16 gap-x-32 justify-evenly items-center')}>
         <MarketStatsItem stat="1.800" title={translation.hospitals}>
-          <Hospital size={72} />
+          {/* Image needs attribution to https://www.flaticon.com/free-icon/hospital_3809392?term=hospital&page=1&position=8&origin=search&related_id=3809392 */}
+          <Image width={72} height={72} alt="" src="https://cdn.helpwave.de/icons/hospital.png" className={tw('w-[72px] h-[72px] mobile:w-[48px] mobile:h-[48px] p-[5%]')}/>
         </MarketStatsItem>
 
         <MarketStatsItem stat="1.000.000" title={translation.healthcareWorkers}>
-          <UsersRound size={72} />
+          {/* Image needs attribution to https://www.flaticon.com/free-icon/hospital_3809392?term=hospital&page=1&position=8&origin=search&related_id=3809392 */}
+          <Image width={72} height={72} alt="" src="https://cdn.helpwave.de/icons/doctors.png" className={tw('w-[72px] h-[72px] mobile:w-[48px] mobile:h-[48px]')}/>
         </MarketStatsItem>
 
         <MarketStatsItem stat="12,1%" title={translation.gdp}>
-          <PieChart size={72} />
+          {/* Image needs attribution to https://www.freepik.com/icon/donut-chart_483638 */}
+          <Image width={72} height={72} alt="" src="https://cdn.helpwave.de/icons/pie_chart.png" className={tw('w-[72px] h-[72px] mobile:w-[48px] mobile:h-[48px]')}/>
         </MarketStatsItem>
       </div>
     </SectionBase>

landing-page/components/sections/mediQuu/MediQuuFAQ.tsx

@@ -20,9 +20,12 @@ const defaultMediQuuFAQTranslation: Record<Languages, MediQuuFAQTranslation> = {
         question: 'I just want to continue using mediQuu products, what do I need to do?',
         answer: `
           We're glad to hear that! We'll make the transition as easy as possible for you.
-          \\b{There will be no changes to your contract or data protection terms.} In the coming weeks,
-          we will personally provide you with further information on the administrative details.
-          Protecting your data and ensuring your convenience are our top priorities.
+          \\b{There will be no changes to your contract or data protection terms.} Two emails will be sent to you in the next few days or may have already arrived in your mailbox. In one email, we will ask you to agree to the transfer of the contracts to helpwave under the existing conditions. The second email will ask you to confirm that helpwave is authorised to take over the mediQuu data under the existing data processing agreement. Please check your inbox and confirm the two emails by replying to them simply and informally. Here are two suggested wordings:
+          \\b{For the transfer of contracts:}
+          "Dear Sir or Madam, I hereby agree on behalf of practice XY to the transfer of my contracts to helpwave. I also agree to the terms and conditions and the privacy policy."
+          \\b{For the transfer of data:}
+          "Dear Sir or Madam, I hereby declare on behalf of practice XY my consent to the transfer of my personal data from mediQuu to helpwave within the scope of the existing data processing agreement."
+
         `
       },
       {
@@ -56,8 +59,12 @@ const defaultMediQuuFAQTranslation: Record<Languages, MediQuuFAQTranslation> = {
         answer: `
           Das freut uns! Wir machen Ihnen den Übergang so einfach wie möglich.
           \\b{An Ihrem Vertrag und Ihren Datenschutzbedingungen ändert sich überhaupt nichts.}
-          In den kommenden Wochen werden wir Ihnen persönlich weitere Informationen zu den administrativen
-          Details zukommen lassen. Der Schutz Ihrer Daten und Ihr Komfort stehen dabei an erster Stelle.
+          In den kommenden Tagen werden Ihnen zwei eMails zugesendet oder sind vielleicht sogar schon ins Postfach gekommen. In einer Mail bitten wir Sie um Ihre Zustimmung zur Übernahme der Verträge zu den bestehenden Konditionen and helpwave. In der zweiten Mail geht es um Ihre Bestätigung, dass helpwave die Daten der mediQuu im Rahmen der bestehenden Datenverarbeitungsvereinbarung übernehmen darf. Schauen Sie bitte in Ihr Postfach und bestätigen Sie die beiden Mails in dem Sie einfach und formlos darauf antworten. Hier wären zwei Formulierungsvorschläge:
+          \\b{Zur Übernahme der Verträge:}
+          "Sehr geehrte Damen und Herren, hiermit stimme Ich im Namen der Praxis XY der Übernahme meiner Verträge durch helpwave zu. Außerdem stimme ich den AGBs und der Datenschutzerklärung zu."
+          \\b{Zur Übernahme der Daten:}
+          "Sehr geehrte Damen und Herren, hiermit erkläre Ich im Namen der Praxis XY meine Einwilligung zur Übertragung meiner personenbezogenen Daten von mediQuu an helpwave im Rahmen der bereits an die mediQuu erteilten Auftragsverarbeitungsvereinbarung."
+          Sie sehen also, hier handelt es sich um rein administrative Schritte, die wir Ihnen so einfach wie möglich machen wollen. Der Schutz Ihrer Daten und Ihr Komfort sind uns wichtig.
         `
       },
       {

landing-page/components/sections/mediQuu/TeamSection.tsx

@@ -14,7 +14,7 @@ const imageUrl = (key: string) => `https://cdn.helpwave.de/profile/${key}.png`
 const contactsHelpwave: (ProfileProps & { translatedInfo?: Record<Languages, string> })[] = [
   {
     name: 'Christian Porschen',
-    title: 'Dr. med.',
+    prefix: 'Dr. med.',
     role: 'Chief Medical Officer',
     roleBadge: 'CMO',
     imageUrl: imageUrl('christian_porschen'),
@@ -78,7 +78,6 @@ const contactsMediquu: (ProfileProps & { translatedInfo?: Record<Languages, stri
     imageUrl: 'https://cdn.helpwave.de/mediquu/christian_remfert.jpg',
     socials: [
       { type: 'linkedin', url: 'https://www.linkedin.com/in/christian-remfert/' },
-      { type: 'mail', url: 'mailto:[email protected]' },
     ],
     imageClassName: '!w-[230px] !h-[200px]',
     translatedInfo: {

landing-page/components/sections/tasks/PatientSection.tsx

@@ -5,7 +5,7 @@ import type { Languages } from '@helpwave/common/hooks/useLanguage'
 import Image from 'next/image'
 import { Span } from '@helpwave/common/components/Span'
 import { MarkdownInterpreter } from '@helpwave/common/components/MarkdownInterpreter'
-import { Tag } from 'lucide-react'
+import { TagIcon } from '@helpwave/common/icons/Tag'
 import { SectionBase } from '@/components/sections/SectionBase'
 
 type PatientSectionTranslation = {
@@ -49,8 +49,8 @@ export const PatientSection = ({ overwriteTranslation }: PropsForTranslation<Pat
       </div>
       <div className={tw('flex flex-col gap-y-2 pb-16 mobile:pb-0')}>
         <div className={tw('flex flex-col gap-y-2')}>
-          <div className={tw('flex flex-row gap-x-1 text-hw-primary-400')}>
-            <Tag size={24} strokeWidth={3}/>
+          <div className={tw('flex flex-row gap-x-1 text-hw-primary-800 items-center')}>
+            <TagIcon/>
             <Span className={tw('text-lg font-bold')}>{translation.patients}</Span>
           </div>
           <h1><Span type="title" className={tw('!text-4xl')}>{translation.title}</Span></h1>

landing-page/components/sections/tasks/PropertiesSection.tsx

@@ -5,7 +5,7 @@ import type { Languages } from '@helpwave/common/hooks/useLanguage'
 import Image from 'next/image'
 import { Span } from '@helpwave/common/components/Span'
 import { MarkdownInterpreter } from '@helpwave/common/components/MarkdownInterpreter'
-import { Tag } from 'lucide-react'
+import { TagIcon } from '@helpwave/common/icons/Tag'
 import { SectionBase } from '@/components/sections/SectionBase'
 
 type PropertiesSectionTranslation = {
@@ -49,8 +49,8 @@ export const PropertiesSection = ({ overwriteTranslation }: PropsForTranslation<
       </div>
       <div className={tw('flex flex-col gap-y-2 pb-16 mobile:pb-0')}>
         <div className={tw('flex flex-col gap-y-2')}>
-          <div className={tw('flex flex-row gap-x-1 text-hw-primary-400')}>
-            <Tag size={24} strokeWidth={3}/>
+          <div className={tw('flex flex-row gap-x-1 text-hw-primary-800 items-center')}>
+            <TagIcon/>
             <Span className={tw('text-lg font-bold')}>{translation.properties}</Span>
           </div>
           <h1><Span type="title" className={tw('!text-4xl')}>{translation.title}</Span></h1>

landing-page/components/sections/tasks/TasksKanbanSection.tsx

@@ -5,7 +5,7 @@ import type { Languages } from '@helpwave/common/hooks/useLanguage'
 import Image from 'next/image'
 import { Span } from '@helpwave/common/components/Span'
 import { MarkdownInterpreter } from '@helpwave/common/components/MarkdownInterpreter'
-import { Tag } from 'lucide-react'
+import { TagIcon } from '@helpwave/common/icons/Tag'
 import { SectionBase } from '@/components/sections/SectionBase'
 
 type TasksKanbanSectionTranslation = {
@@ -38,8 +38,8 @@ export const TasksKanbanSection = ({ overwriteTranslation }: PropsForTranslation
     >
       <div className={tw('flex flex-col gap-y-2 pb-16 mobile:pb-0')}>
         <div className={tw('flex flex-col gap-y-2')}>
-          <div className={tw('flex flex-row gap-x-1 text-hw-primary-400')}>
-            <Tag size={24} strokeWidth={3}/>
+          <div className={tw('flex flex-row gap-x-1 text-hw-primary-800 items-center')}>
+            <TagIcon/>
             <Span className={tw('text-lg font-bold')}>{translation.tasks}</Span>
           </div>
           <h1><Span type="title" className={tw('!text-4xl')}>{translation.title}</Span></h1>

landing-page/components/sections/tasks/TasksTemplatesSection.tsx

@@ -5,7 +5,7 @@ import type { Languages } from '@helpwave/common/hooks/useLanguage'
 import Image from 'next/image'
 import { Span } from '@helpwave/common/components/Span'
 import { MarkdownInterpreter } from '@helpwave/common/components/MarkdownInterpreter'
-import { Tag } from 'lucide-react'
+import { TagIcon } from '@helpwave/common/icons/Tag'
 import { SectionBase } from '@/components/sections/SectionBase'
 
 type TasksTemplatesSectionTranslation = {
@@ -39,8 +39,8 @@ export const TasksTemplatesSection = ({ overwriteTranslation }: PropsForTranslat
     >
       <div className={tw('flex flex-col gap-y-2 pb-16 mobile:pb-0 overflow-hidden break-words')}>
         <div className={tw('flex flex-col gap-y-2')}>
-          <div className={tw('flex flex-row gap-x-1 text-hw-primary-400')}>
-            <Tag size={24} strokeWidth={3}/>
+          <div className={tw('flex flex-row gap-x-1 text-hw-primary-800 items-center')}>
+            <TagIcon/>
             <Span className={tw('text-lg font-bold')}>{translation.taskTemplates}</Span>
           </div>
           <h1><Span type="title" className={tw('!text-4xl')}>{translation.title}</Span></h1>

landing-page/components/sections/team/TeamSection.tsx

@@ -35,7 +35,7 @@ const teamData: Record<string, ProfileProps[]> = {
     },
     {
       name: 'Christian Porschen',
-      title: 'Dr. med.',
+      prefix: 'Dr. med.',
       role: 'Chief Medical Officer',
       roleBadge: 'CMO',
       imageUrl: imageUrl('christian_porschen'),
@@ -51,6 +51,7 @@ const teamData: Record<string, ProfileProps[]> = {
   development: [
     {
       name: 'Felix Thape',
+      suffix: 'B. Sc. RWTH',
       role: 'fullstack wizard',
       imageUrl: imageUrl('felix_thape'),
       tags: ['maintainer', 'web', 'mobile'],
@@ -62,6 +63,7 @@ const teamData: Record<string, ProfileProps[]> = {
     },
     {
       name: 'Max Baumann',
+      suffix: 'B. Sc. RWTH',
       role: 'backend magician',
       imageUrl: imageUrl('max_baumann'),
       tags: ['microservices', 'deployment', 'database'],
@@ -115,6 +117,8 @@ const teamData: Record<string, ProfileProps[]> = {
   medical: [
     {
       name: 'Ludwig Maidowski',
+      prefix: 'Dipl.-Jur.',
+      suffix: 'Maître en droit, Paris II',
       role: 'medical professional & legal',
       tags: ['law', 'doctor', 'product'],
       imageUrl: imageUrl('ludwig_maidowski'),