{siteConfig.newsletter.description}
- Or subscribe to the{" "} - RSS feed. + {t.rich("rss", { + link: (chunks) => ( + {chunks} + ), + })}
Opt-in to receive future issues of the newsletter via email.
+{t("inboxDescription")}
- Or subscribe to the{" "} - RSS feed. + {t.rich("rss", { + link: (chunks) => ( + {chunks} + ), + })}
Please enter your new password below.
+{t("Auth.resetPassword.body")}
- First time here?
Sorry, we couldn’t find the page you were looking for.
- Home +{t("NotFound.body")}
+ {t("Actions.home")}No messages yet
+{t("Chat.empty")}
{isDemo || message.sender_id === user?.id - ? `You reached out to ${otherPersonName}` + ? t("Chat.youReachedOut", { name: otherPersonName }) : listing?.owner_has_multiple_non_residential_listings && listing?.name - ? `${otherPersonName} reached out to you about ${listing.name}` - : `${otherPersonName} reached out to you`} + ? t("Chat.personReachedOutAbout", { + name: otherPersonName, + listing: listing.name, + }) + : t("Chat.personReachedOut", { + name: otherPersonName, + })}
)} diff --git a/src/components/IntroHeader/IntroHeader.jsx b/src/components/IntroHeader/IntroHeader.jsx index 2978ce98..459b9244 100644 --- a/src/components/IntroHeader/IntroHeader.jsx +++ b/src/components/IntroHeader/IntroHeader.jsx @@ -3,6 +3,7 @@ import { useState, useEffect } from "react"; import MapPin from "@/components/MapPin"; import Avatar from "@/components/Avatar"; import { styled, keyframes } from "@pigment-css/react"; +import { useTranslations } from "next-intl"; const featuredItems = [ { @@ -123,6 +124,7 @@ const enterMarkerAnimation = keyframes({ }); function IntroHeader() { + const t = useTranslations("Index"); const [itemIndex, setItemIndex] = useState(0); const [prevItemIndex, setPrevItemIndex] = useState(null); @@ -149,7 +151,7 @@ function IntroHeader() { isExiting={true} isDemo={true} src={`/avatars/featured/${featuredItems[prevItemIndex].photo}`} - alt="The avatar for a Peels host" + alt={t("hostAvatarAlt")} size="massive" /> @@ -163,7 +165,7 @@ function IntroHeader() { isExiting={false} isDemo={true} src={`/avatars/featured/${featuredItems[itemIndex].photo}`} - alt="The avatar for a Peels host" + alt={t("hostAvatarAlt")} size="massive" /> diff --git a/src/components/Label/Label.jsx b/src/components/Label/Label.jsx index 89a86222..03113124 100644 --- a/src/components/Label/Label.jsx +++ b/src/components/Label/Label.jsx @@ -1,5 +1,6 @@ import { Label as HeadlessLabel } from "@headlessui/react"; import { styled } from "@pigment-css/react"; +import { useTranslations } from "next-intl"; const StyledLabel = styled(HeadlessLabel)(({ theme }) => ({ color: theme.colors.text.ui.primary, @@ -12,9 +13,11 @@ const StyledLabel = styled(HeadlessLabel)(({ theme }) => ({ })); export default function Label({ required = true, children, ...props }) { + const t = useTranslations("Common"); + return (- This is your own listing{isStub && ", marked as a stub"}.{" "} - {visibility - ? "Lookin’ good!" - : "You’ve hidden it from the map, so only you can see this right now."} + {t("Listings.read.ownerNote", { + stub: isStub ? "true" : "false", + visibility: visibility ? "true" : "false", + })}
{t("Listings.read.stubNote")}
- This is a stub created by the Peels team. Double-check the listing - information before visiting. -
-
- Are you the owner?{" "}
-
- First time here?
{listing?.area_name ? ( - <>Resident of {listing?.area_name} + <>{t("Listings.read.residentOf", { area: listing.area_name })} ) : ( - "Local resident" + t("Listings.read.localResident") )}
)} {listing?.type === "community" && ({listing?.area_name ? ( - <>Community in {listing?.area_name} + <>{t("Listings.read.communityIn", { area: listing.area_name })} ) : ( - "Local community" + t("Listings.read.localCommunity") )}
)} {listing?.type === "business" && ({listing?.area_name ? ( - <>Business in {listing?.area_name} + <>{t("Listings.read.businessIn", { area: listing.area_name })} ) : ( - "Local business" + t("Listings.read.localBusiness") )}
)} - {listing?.is_stub &&Drop photos here
+{t("Listings.photos.dropHere")}
- {listingDisplayName} is a resident of{" "} - {listing.area_name ? listing.area_name : "this area"}. Ask - them for their exact location when you arrange a food scrap - drop-off. + {t("Listings.read.residentialLocation", { + name: listingDisplayName, + area: listing.area_name + ? listing.area_name + : t("Listings.read.thisArea"), + })}
) : (- {listingDisplayName} is{" "} - {listing.type === "business" - ? "a business" - : listing.type === "community" - ? "a community spot" - : ""}{" "} - located in {listing.area_name}. + {t("Listings.read.nonResidentialLocation", { + name: listingDisplayName, + type: + listing.type === "business" + ? t("Listings.read.businessType") + : listing.type === "community" + ? t("Listings.read.communityType") + : "", + area: listing.area_name, + })}
)} @@ -199,7 +209,7 @@ const ListingRead = memo(function Listing({ size="small" href={`/map?listing=${listing.slug}`} > - See nearby listings + {t("Actions.seeNearbyListings")} {listing.type !== "residential" && ( <> @@ -211,7 +221,7 @@ const ListingRead = memo(function Listing({ )}`} target="_blank" > - Open in Apple Maps + {t("Actions.openInAppleMaps")} )} @@ -235,11 +245,14 @@ const ListingRead = memo(function Listing({ !user && listing.type === "residential" ? undefined : "visible" } > -
-
- The listing you’re looking for doesn’t exist or has been - removed. Sorry to disappoint. -
+{t("Map.emptyBody")}
{randomFact.fact}
{randomFact.source && (- Source + {t("Common.source")}
diff --git a/src/components/NewsletterAside/NewsletterAside.jsx b/src/components/NewsletterAside/NewsletterAside.jsx index ed50bd1f..02c5de0a 100644 --- a/src/components/NewsletterAside/NewsletterAside.jsx +++ b/src/components/NewsletterAside/NewsletterAside.jsx @@ -3,34 +3,35 @@ import { useNewsletterStatus } from "@/hooks/useNewsletterStatus"; import StrongLink from "@/components/StrongLink"; import { styled } from "@pigment-css/react"; +import { useTranslations } from "next-intl"; // Replaces EmailAside for the web version of newsletter issues // Used as an aside within a newsletter, explaining the context of the issue // and providing information on how to opt-in (whether signed up already or not) // See also NewsletterCallout which does a similar job, albeit outside of the newsletter bounds export default function NewsletterAside() { + const t = useTranslations("Newsletter.aside"); const status = useNewsletterStatus(); return ( ); diff --git a/src/components/NewsletterCallout/NewsletterCallout.jsx b/src/components/NewsletterCallout/NewsletterCallout.jsx index 0789cfcb..ea0b5d03 100644 --- a/src/components/NewsletterCallout/NewsletterCallout.jsx +++ b/src/components/NewsletterCallout/NewsletterCallout.jsx @@ -3,44 +3,24 @@ import { useNewsletterStatus } from "@/hooks/useNewsletterStatus"; import Button from "@/components/Button"; import PostageStamp from "@/components/PostageStamp"; import { styled } from "@pigment-css/react"; - -const userConfig = { - alreadySubscribed: { - title: "You’re already subscribed", - description: - "You should see the next issue appear in your email inbox. Feel free to share this page with a friend in the meantime!", - button: { - text: "Edit newsletter preference", - href: "/profile", - }, - }, - notYetSubscribed: { - title: "You’re not subscribed", - description: "Change your newsletter preference on your Profile page.", - button: { - text: "Edit newsletter preference", - href: "/profile", - }, - }, -}; +import { useTranslations } from "next-intl"; function UnauthenticatedCallout() { + const t = useTranslations(); + return (- You need to be a member of Peels to get the newsletter via email. - Signing up is free and only takes a few seconds. -
+{t("Newsletter.callout.guestBody")}
{status.isNewsletterSubscribed - ? userConfig.alreadySubscribed.description - : userConfig.notYetSubscribed.description} + ? t("Newsletter.callout.alreadySubscribedBody") + : t("Newsletter.callout.notSubscribedBody")}
Refine your pin location:
*/} @@ -346,11 +373,11 @@ export default function LocationSelect({{t("Profile.listingPrompt")}
-