diff --git a/README.md b/README.md index 41c3ea3..f3383b0 100644 --- a/README.md +++ b/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). diff --git a/src/components/VolunteeringOpportunities/OpportunityCard.tsx b/src/components/VolunteeringOpportunities/OpportunityCard.tsx index 1bbab68..8d5599c 100644 --- a/src/components/VolunteeringOpportunities/OpportunityCard.tsx +++ b/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} > {iconNameMap[iconName]} - {title} + {title} {vo && {voInformation}} diff --git a/src/components/VolunteeringOpportunities/utils.ts b/src/components/VolunteeringOpportunities/utils.ts index 5c5450c..4a5c451 100644 --- a/src/components/VolunteeringOpportunities/utils.ts +++ b/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.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);