Deployment

README.md

@@ -32,9 +32,16 @@ Applying technology in the effort to support underserved communities is a key va
 
 Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
 
+## Background
+We use simple react/vite app for landing page, aka [website], which is being served from files on S3 using Amplify
+we're also developing a PWA on nextjs for automation of need4deed business processes, this is fe repo. also we use separate repo sdk mostly for sharing of types between fron and backend.
+also we plan merging our landing page into the app so in the end there should be frontend, backend, and sdk.
+so the website is now kind of frozen in terms of development. it still operates along with legacy backend before we launch the app with the new backend.
+
+
 ## Step 1: Fork the Repository
 
-1. Go to the our repository: [https://gitlab.com/need4deed/website](https://gitlab.com/need4deed/website).
+1. Go to the our repository: [https://github.com/need4deed-org/website](https://github.com/need4deed-org/website).
 1. Click the **Fork** button in the top-right corner.
 1. Choose where to fork the repository (usually your own GitLab account).
 

src/components/VolunteeringOpportunities/OpportunityCard.tsx

@@ -6,7 +6,7 @@ import {
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 
-import { OpportunityType } from "need4deed-sdk";
+import { Lang, OpportunityType } from "need4deed-sdk";
 import { ScreenTypes } from "../../config/types";
 import useScreenType from "../../hooks/useScreenType";
 import { Activities } from "../core/common";
@@ -92,6 +92,7 @@ export default function OpportunityCard({
 }: Props) {
   const { t, i18n } = useTranslation();
   const screenType = useScreenType();
+  const language = i18n.language as Lang;
 
   const {
     title,
@@ -137,7 +138,7 @@ export default function OpportunityCard({
 
   const district = locations.join(", ");
   const scheduleAsStr =
-    (accompanyingDate && formatAccompanyingDate(accompanyingDate)) ||
+    (accompanyingDate && formatAccompanyingDate(accompanyingDate, language)) ||
     schedule ||
     "";
 
@@ -170,7 +171,7 @@ export default function OpportunityCard({
       enableHoverEffect={enableHoverEffect}
     >
       <IconDiv>{iconNameMap[iconName]}</IconDiv>
-      <HyphenatedHeading3 lang={i18n.language}>{title}</HyphenatedHeading3>
+      <HyphenatedHeading3 lang={language}>{title}</HyphenatedHeading3>
       {vo && <Paragraph>{voInformation}</Paragraph>}
       <Activities activities={activities} />
       <OpportunityCardDetails cardDetails={cardDetails} />

src/components/VolunteeringOpportunities/utils.ts

@@ -1,4 +1,4 @@
-import { OpportunityType, TranslatedIntoType } from "need4deed-sdk";
+import { Lang, OpportunityType, TranslatedIntoType } from "need4deed-sdk";
 
 import { TFunction } from "i18next";
 import { IconName } from "../VolunteeringCategories/types";
@@ -192,7 +192,14 @@ export const getActivityBackgroundColor = (activity: string) => {
     : "var(--color-papaya)";
 };
 
-export const formatAccompanyingDate = (date: Date) => {
+const langLocaleMap: Record<Lang, string> = {
+  [Lang.EN]: "en-US",
+  [Lang.DE]: "de-DE",
+};
+
+export const formatAccompanyingDate = (date: Date, lang: Lang): string => {
+  const locale = langLocaleMap[lang];
+
   const dateOptions: Intl.DateTimeFormatOptions = {
     weekday: "long",
     month: "long",
@@ -205,8 +212,8 @@ export const formatAccompanyingDate = (date: Date) => {
     hour12: false,
   };
 
-  const dateFormatter = new Intl.DateTimeFormat("en-US", dateOptions);
-  const timeFormatter = new Intl.DateTimeFormat("en-US", timeOptions);
+  const dateFormatter = new Intl.DateTimeFormat(locale, dateOptions);
+  const timeFormatter = new Intl.DateTimeFormat(locale, timeOptions);
 
   const formattedDatePart: string = dateFormatter.format(date);
   const formattedTimePart: string = timeFormatter.format(date);