Skip to content

Frontend/i18n: Remove inline <Trans> text #9211

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
tristanlabelle merged 3 commits into from
Jul 3, 2026
Merged

Frontend/i18n: Remove inline <Trans> text #9211

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d1d15d0
Frontend/i18n: Remove inline <Trans> text
tristanlabelle Jun 30, 2026
1636461
Format frontend
couchersbot[bot] Jun 30, 2026
2a9ebfe
Fix PushNotificationSettings tests
tristanlabelle Jul 1, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion app/web/components/Navigation/ReportDialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ export default function ReportDialog({ open, onClose }: DialogProps) {
</StyledLink>
),
}}
></Trans>
/>
</Snackbar>
)}
<Dialog aria-labelledby="bug-reporter" open={open} onClose={handleClose}>
Expand Down
22 changes: 9 additions & 13 deletions app/web/components/ProfileIncompleteDialog/ProfileIncompleteDialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,21 +46,17 @@ export default function ProfileIncompleteDialog({
</DialogTitle>
<DialogContent>
<DialogContentText>
<Trans i18nKey="profile:complete_profile_dialog.description_1">
Before you can {{ action_name: action_text }}, you must{" "}
<strong>write a bit about yourself</strong> in your profile and{" "}
<strong>upload a profile photo</strong>.
</Trans>
<Trans
i18nKey="profile:complete_profile_dialog.description_1"
values={{ action_name: action_text }}
components={{ 4: <strong />, 7: <strong /> }}
/>
</DialogContentText>
<DialogContentText>
<Trans i18nKey="profile:complete_profile_dialog.description_2">
This helps build a trusted community and reduce spam. For more
information,{" "}
<StyledLink href={howToCompleteProfileUrl}>
please refer to this help page
</StyledLink>
. Thank you for your help!
</Trans>
<Trans
i18nKey="profile:complete_profile_dialog.description_2"
components={{ 2: <StyledLink href={howToCompleteProfileUrl} /> }}
/>
</DialogContentText>
</DialogContent>
<DialogActions>
Expand Down
7 changes: 2 additions & 5 deletions app/web/features/auth/email/ChangeEmail.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,11 +79,8 @@ export default function ChangeEmail({ className, email }: ChangeEmailProps) {
<Trans
i18nKey="auth:change_email_form.current_email_message"
values={{ email }}
>
{`Your email address is currently `}
<strong>{email}</strong>
{`.`}
</Trans>
components={{ 1: <strong /> }}
/>
</Typography>
{changeEmailError && (
<Alert severity="error">{changeEmailError.message}</Alert>
Expand Down
5 changes: 1 addition & 4 deletions app/web/features/auth/phone/ChangePhone.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -156,10 +156,7 @@ export default function ChangePhone({
components={{
2: <StyledLink href={howToDonateUrl} />,
}}
>
You need to <StyledLink href={howToDonateUrl}>donate</StyledLink>
before you can complete phone verification.
</Trans>
/>
</Typography>
) : (
<StyledForm onSubmit={onChangeSubmit}>
Expand Down
7 changes: 4 additions & 3 deletions app/web/features/auth/signup/AccountForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -426,9 +426,10 @@ export default function AccountForm() {
)}
/>
<Typography variant="body1">
<Trans i18nKey="auth:account_form.tos_prompt">
To continue, please read and accept the <TOSLink />.
</Trans>
<Trans
i18nKey="auth:account_form.tos_prompt"
components={{ 1: <TOSLink /> }}
/>
</Typography>
<FormControlLabel
control={
Expand Down
27 changes: 14 additions & 13 deletions app/web/features/auth/signup/ResendVerificationEmailForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,19 +34,20 @@ export default function ResendVerificationEmailForm() {
</Typography>
<Typography variant="body1">
{!resent ? (
<Trans i18nKey="auth:sign_up_resend_verification_email_help">
Didn't receive the email? Click{" "}
<StyledLink
href="#"
onClick={(e) => {
e.preventDefault();
mutation.mutateAsync();
}}
>
here to resend the verification link
</StyledLink>
.
</Trans>
<Trans
i18nKey="auth:sign_up_resend_verification_email_help"
components={{
2: (
<StyledLink
href="#"
onClick={(e) => {
e.preventDefault();
mutation.mutateAsync();
}}
/>
),
}}
/>
) : (
<>{t("auth:sign_up_resend_verification_done")}</>
)}
Expand Down
8 changes: 4 additions & 4 deletions app/web/features/auth/signup/Signup.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -180,10 +180,10 @@ export default function Signup() {
<SignupFormContent inviteCode={inviteCode || undefined} />
)}
<Typography sx={{ marginTop: theme.spacing(2) }}>
<Trans i18nKey="auth:basic_sign_up_form.existing_user_prompt">
Already have an account?{" "}
<StyledLink href={loginRoute}>Log in</StyledLink>
</Trans>
<Trans
i18nKey="auth:basic_sign_up_form.existing_user_prompt"
components={{ 2: <StyledLink href={loginRoute} /> }}
/>
</Typography>
</StyledFormWrapper>
</PageContainer>
Expand Down
25 changes: 13 additions & 12 deletions app/web/features/auth/signup/SignupFormContent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,18 +81,19 @@ export default function SignupFormContent({
submitText={t("global:create_account")}
/>
<Typography variant="caption">
<Trans i18nKey="auth:basic_sign_up_form.sign_up_agreement_explainer">
By continuing, you agree to our{" "}
<StyledLink
href={tosRoute}
target={isNativeEmbed ? undefined : "_blank"}
variant="caption"
sx={{ fontWeight: 700 }}
>
Terms of Service
</StyledLink>
, including our cookie, email, and data handling policies.
</Trans>
<Trans
i18nKey="auth:basic_sign_up_form.sign_up_agreement_explainer"
components={{
2: (
<StyledLink
href={tosRoute}
target={isNativeEmbed ? undefined : "_blank"}
variant="caption"
sx={{ fontWeight: 700 }}
/>
),
}}
/>
</Typography>
</>
);
Expand Down
95 changes: 24 additions & 71 deletions app/web/features/auth/verification/StrongVerificationPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,24 +96,13 @@ export default function StrongVerificationInstructions() {
}}
>
<li>
<Trans i18nKey="auth:strong_verification.instructions.before_you_start.nfc_check">
Your phone must have <strong>NFC capability</strong> — most
phones do. Check your phone settings to make sure NFC is turned
on.
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.before_you_start.nfc_check" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.before_you_start.passport_check">
Your passport must be a <strong>biometric passport</strong> —
look for the gold chip symbol on the cover. Older passports
without this symbol won't work.
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.before_you_start.passport_check" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.before_you_start.remove_case">
<strong>Remove your phone case before starting</strong> — even
thin cases can block the NFC signal and cause the scan to fail.
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.before_you_start.remove_case" />
</li>
</Box>
</Box>
Expand All @@ -134,19 +123,14 @@ export default function StrongVerificationInstructions() {
>
<ListItem sx={{ display: "list-item", paddingY: 0.5 }}>
<Typography variant="body1" sx={{ marginBottom: 1 }}>
<Trans i18nKey="auth:strong_verification.instructions.step1">
Download the <strong>IRIS ID</strong> app
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.step1" />
</Typography>
<Typography
variant="body2"
color="text.secondary"
sx={{ marginTop: 1, marginBottom: 1 }}
>
<Trans i18nKey="auth:strong_verification.instructions.step1_apple_note">
<strong>Apple users:</strong> You can skip the download and use
your browser instead. Just click "Open" when prompted.
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.step1_apple_note" />
</Typography>
<Box
sx={{
Expand Down Expand Up @@ -187,10 +171,7 @@ export default function StrongVerificationInstructions() {
</ListItem>
<ListItem sx={{ display: "list-item", paddingY: 0.5 }}>
<Typography variant="body1">
<Trans i18nKey="auth:strong_verification.instructions.step2">
Click <strong>"Start Strong Verification"</strong> below (opens
in new tab)
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.step2" />
</Typography>
</ListItem>
<ListItem sx={{ display: "list-item", paddingY: 0.5 }}>
Expand All @@ -205,9 +186,7 @@ export default function StrongVerificationInstructions() {
</ListItem>
<ListItem sx={{ display: "list-item", paddingY: 0.5 }}>
<Typography variant="body1">
<Trans i18nKey="auth:strong_verification.instructions.step5">
Select <strong>Passport</strong> (ID cards not supported)
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.step5" />
</Typography>
</ListItem>
<ListItem sx={{ display: "list-item", paddingY: 0.5 }}>
Expand All @@ -217,11 +196,7 @@ export default function StrongVerificationInstructions() {
</ListItem>
<ListItem sx={{ display: "list-item", paddingY: 0.5 }}>
<Typography variant="body1">
<Trans i18nKey="auth:strong_verification.instructions.step7">
Hold your phone against the passport page with the NFC chip and
<strong>keep completely still for at least 5 seconds</strong> —
moving too early is the most common cause of failure
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.step7" />
</Typography>
</ListItem>
<ListItem sx={{ display: "list-item", paddingY: 0.5 }}>
Expand Down Expand Up @@ -269,20 +244,13 @@ export default function StrongVerificationInstructions() {
}}
>
<li>
<Trans i18nKey="auth:strong_verification.instructions.chip_location.us_germany_mexico">
<strong>US, Germany (2016), Mexico:</strong> Back page
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.chip_location.us_germany_mexico" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.chip_location.finland_germany_new">
<strong>Finland, Germany (2017+):</strong> Picture page
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.chip_location.finland_germany_new" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.chip_location.australia">
<strong>Australia:</strong> Middle page (marked with symbol +
"chip name")
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.chip_location.australia" />
</li>
</Box>
</Box>
Expand Down Expand Up @@ -325,35 +293,19 @@ export default function StrongVerificationInstructions() {
}}
>
<li>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.remove_case">
<strong>Remove your phone case</strong> — even thin cases can
block the NFC signal
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.remove_case" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.hold_still">
<strong>Hold your phone completely still</strong> for at least 5
seconds — moving too early is the most common cause of failure
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.hold_still" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.flat_surface">
<strong>Place your passport on a flat surface</strong> — don't
hold it in your hand
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.flat_surface" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.nfc_location">
<strong>Find your phone's NFC antenna</strong> — it's usually
near the top-center on the back of the phone. Try different
positions if it doesn't connect
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.nfc_location" />
</li>
<li>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.no_metal">
<strong>Avoid metal surfaces</strong> — don't place your
passport on a metal table or laptop
</Trans>
<Trans i18nKey="auth:strong_verification.instructions.scanning_tips.no_metal" />
</li>
<li>
{t("auth:strong_verification.instructions.scanning_tips.retry")}
Expand Down Expand Up @@ -388,13 +340,14 @@ export default function StrongVerificationInstructions() {
</li>
</Box>
<Typography variant="body1">
<Trans i18nKey="auth:strong_verification.instructions.didnt_work.contact">
If you're still having trouble,
<StyledLink href="mailto:support@couchers.org?subject=Strong%20Verification%20Help">
let us know
</StyledLink>
and we'll help.
</Trans>
<Trans
i18nKey="auth:strong_verification.instructions.didnt_work.contact"
components={{
1: (
<StyledLink href="mailto:support@couchers.org?subject=Strong%20Verification%20Help" />
),
}}
/>
</Typography>
</Box>

Expand Down
48 changes: 26 additions & 22 deletions app/web/features/communities/CommunitiesPage/CommunitiesPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,17 +91,19 @@ const CommunitiesPage = () => {
<Trans i18nKey="dashboard:communities_intro" />
</StyledTypography>
<StyledTypography variant="body1" paragraph>
<Trans i18nKey="dashboard:community_builder">
{`Want to be an ambassador for your community and help it grow? Become a `}
<MuiLink
href={helpCenterCommunityBuilderURL}
target="_blank"
rel="noreferrer noopener"
underline="hover"
>
Community Builder!
</MuiLink>
</Trans>
<Trans
i18nKey="dashboard:community_builder"
components={{
1: (
<MuiLink
href={helpCenterCommunityBuilderURL}
target="_blank"
rel="noreferrer noopener"
underline="hover"
/>
),
}}
/>
</StyledTypography>

<MainTitle variant="h1">
Expand All @@ -112,17 +114,19 @@ const CommunitiesPage = () => {
<MainTitle variant="h1">{t("dashboard:find_your_community")}</MainTitle>

<StyledTypography variant="body1" paragraph>
<Trans i18nKey="dashboard:find_your_community_intro_simplified">
{`Search for your community or browse below. `}
<MuiLink
href={communityCreationFormURL(accountInfo?.username)}
target="_blank"
rel="noreferrer noopener"
underline="hover"
>
Don't see yours? Request it!
</MuiLink>
</Trans>
<Trans
i18nKey="dashboard:find_your_community_intro_simplified"
components={{
1: (
<MuiLink
href={communityCreationFormURL(accountInfo?.username)}
target="_blank"
rel="noreferrer noopener"
underline="hover"
/>
),
}}
/>
</StyledTypography>

<NewCommunities />
Expand Down
Loading
Loading