Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 0c6888c

Browse files
Added translations for Notifications settings components
1 parent 55712ff commit 0c6888c

File tree

11 files changed

+299
-193
lines changed

11 files changed

+299
-193
lines changed

‎frontend/src/pages/Settings/Notifications/ContentPreferences/ContentPreferences.tsx‎

Lines changed: 31 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React, { ReactElement, useState } from "react";
22
import { Divider, Typography } from "@material-ui/core";
33
import classnames from "classnames";
44
import { Link } from "react-router-dom";
5+
import { useTranslation } from "react-i18next";
56

67
import { useGlobalStyles } from "../../../../util/globalClasses";
78
import { useContentPreferencesStyles } from "./ContentPreferencesStyles";
@@ -18,6 +19,7 @@ import {
1819
const ContentPreferences = (): ReactElement => {
1920
const globalClasses = useGlobalStyles({});
2021
const classes = useContentPreferencesStyles();
22+
const { t } = useTranslation();
2123
const [visibleExploreModal, setVisibleExploreModal] = useState<boolean>(false);
2224
const [visibleRecommendationsModal, setVisibleRecommendationsModal] = useState<boolean>(false);
2325
const [isSearchModal, setIsSearchModal] = useState<boolean>(true);
@@ -40,87 +42,89 @@ const ContentPreferences = (): ReactElement => {
4042
return (
4143
<>
4244
<div className={globalClasses.itemInfoWrapper}>
43-
<Typography variant={"h5"} component={"div"}>
44-
Explore
45+
<Typography variant="h5" component="div">
46+
{t("EXPLORE",{defaultValue: "Explore"})}
4547
</Typography>
4648
</div>
4749
<div
48-
id={"searchSettings"}
50+
id="searchSettings"
4951
className={globalClasses.contentLink}
5052
onClick={() => onOpenSettingsModal(true)}
5153
>
52-
<Typography variant={"body1"} component={"span"}>
53-
Search settings
54+
<Typography variant="body1" component="span">
55+
{t("SEARCH_SETTINGS",{defaultValue: "Search settings"})}
5456
</Typography>
5557
{ArrowRightIcon}
5658
</div>
5759
<div
58-
id={"exploreSettings"}
60+
id="exploreSettings"
5961
className={globalClasses.contentLink}
6062
onClick={() => onOpenSettingsModal(false)}
6163
>
62-
<Typography variant={"body1"} component={"span"}>
63-
Explore settings
64+
<Typography variant="body1" component="span">
65+
{t("EXPLORE_SETTINGS",{defaultValue: "Explore settings"})}
6466
</Typography>
6567
{ArrowRightIcon}
6668
</div>
6769
<Divider />
6870
<div className={globalClasses.itemInfoWrapper}>
69-
<Typography variant={"h5"} component={"div"}>
70-
Languages
71+
<Typography variant="h5" component="div">
72+
{t("LANGUAGES",{defaultValue: "Languages"})}
7173
</Typography>
7274
</div>
7375
<div
74-
id={"openVisibleRecommendationsModal"}
76+
id="openVisibleRecommendationsModal"
7577
className={globalClasses.contentLink}
7678
onClick={onOpenVisibleRecommendationsModal}
7779
>
78-
<Typography variant={"body1"} component={"span"}>
79-
Recommendations
80+
<Typography variant="body1" component="span">
81+
{t("RECOMMENDATIONS",{defaultValue: "Recommendations"})}
8082
</Typography>
8183
{ArrowRightIcon}
8284
</div>
8385
<div className={globalClasses.itemInfoWrapper}>
84-
<Typography variant={"subtitle2"} component={"div"}>
85-
Select which languages you want recommended Tweets, people, and trends to include.
86+
<Typography variant="subtitle2" component="div">
87+
{t("LANGUAGES_RECOMMENDATIONS_DESCRIPTION", {
88+
defaultValue: "Select which languages you want recommended Tweets, people, and trends to include."
89+
})}
8690
</Typography>
8791
</div>
8892
<Divider />
8993
<div className={globalClasses.itemInfoWrapper}>
90-
<Typography variant={"h5"} component={"div"}>
91-
Safety
94+
<Typography variant="h5" component="div">
95+
{t("SAFETY",{defaultValue: "Safety"})}
9296
</Typography>
9397
</div>
9498
<Link to={SETTINGS_PRIVACY_AND_SAFETY_MUTED} className={globalClasses.linkWrapper}>
9599
<div className={globalClasses.contentLink}>
96-
<Typography variant={"body1"} component={"span"}>
97-
Muted
100+
<Typography variant="body1" component="span">
101+
{t("MUTED",{defaultValue: "Muted"})}
98102
</Typography>
99103
{ArrowRightIcon}
100104
</div>
101105
</Link>
102106
<Link to={SETTINGS_PRIVACY_AND_SAFETY_BLOCKED} className={globalClasses.linkWrapper}>
103107
<div className={globalClasses.contentLink}>
104-
<Typography variant={"body1"} component={"span"}>
105-
Blocked accounts
108+
<Typography variant="body1" component="span">
109+
{t("BLOCKED_ACCOUNTS",{defaultValue: "Blocked accounts"})}
106110
</Typography>
107111
{ArrowRightIcon}
108112
</div>
109113
</Link>
110114
<Divider />
111115
<div className={globalClasses.itemInfoWrapper}>
112-
<Typography variant={"h5"} component={"div"}>
113-
Personalization and data
116+
<Typography variant="h5" component="div">
117+
{t("PERSONALIZATION_AND_DATA",{defaultValue: "Personalization and data"})}
114118
</Typography>
115119
</div>
116120
<Link to={SETTINGS_PERSONALIZATION} className={globalClasses.linkWrapper}>
117121
<div className={classnames(classes.personalizationLink, globalClasses.contentLink)}>
118122
<div className={classes.personalizationInfo}>
119-
<Typography variant={"body1"} component={"div"}>
120-
Personalization and data
123+
<Typography variant="body1" component="div">
124+
{t("PERSONALIZATION_AND_DATA",{defaultValue: "Personalization and data"})}
121125
</Typography>
122-
<Typography variant={"subtitle2"} component={"div"}>
123-
Allow some
126+
<Typography variant="subtitle2" component="div">
127+
{t("ALLOW_SOME",{defaultValue: "Allow some"})}
124128
</Typography>
125129
</div>
126130
{ArrowRightIcon}

‎frontend/src/pages/Settings/Notifications/ContentPreferences/ExploreModal/ExploreModal.tsx‎

Lines changed: 33 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React, { FC, ReactElement } from "react";
22
import { Dialog, DialogContent, Link as MuiLink } from "@material-ui/core";
3+
import { useTranslation } from "react-i18next";
34

45
import { useGlobalStyles } from "../../../../../util/globalClasses";
56
import { TWITTER_SEARCH } from "../../../../../constants/url-constants";
@@ -14,43 +15,64 @@ export interface ExploreModalProps {
1415

1516
const ExploreModal: FC<ExploreModalProps> = ({ visible, onClose, isSearchModal }): ReactElement | null => {
1617
const globalClasses = useGlobalStyles({});
18+
const { t } = useTranslation();
1719

1820
if (!visible) {
1921
return null;
2022
}
2123

2224
return (
2325
<Dialog open={visible} onClose={onClose}>
24-
<DialogTitleComponent title={isSearchModal ? "Search settings" : "Explore settings"} onClose={onClose} />
26+
<DialogTitleComponent
27+
title={isSearchModal
28+
? t("SEARCH_SETTINGS", { defaultValue: "Search settings" })
29+
: t("EXPLORE_SETTINGS", { defaultValue: "Explore settings" })}
30+
onClose={onClose}
31+
/>
2532
<DialogContent className={globalClasses.dialogContent}>
2633
<ExploreModalInfo
2734
isSearchModal={isSearchModal}
28-
searchModalTitle={"Location"}
29-
title={isSearchModal ? "Hide sensitive content" : "Show content in this location"}
35+
searchModalTitle={t("LOCATION", { defaultValue: "Location" })}
36+
title={isSearchModal
37+
? t("HIDE_SENSITIVE_CONTENT", { defaultValue: "Hide sensitive content" })
38+
: t("SHOW_CONTENT_IN_THIS_LOCATION", { defaultValue: "Show content in this location" })}
3039
subtitle={isSearchModal ? (
3140
<>
32-
{`This prevents Tweets with potentially sensitive content from displaying in your search results. `}
41+
{t("HIDE_SENSITIVE_CONTENT_DESCRIPTION", {
42+
defaultValue: `This prevents Tweets with potentially sensitive content from displaying
43+
in your search results.`
44+
})}
45+
{" "}
3346
<MuiLink href={TWITTER_SEARCH} variant="subtitle2" target="_blank" rel="noopener">
34-
Learn more
47+
{t("LEARN_MORE",{defaultValue: "Learn more"})}
3548
</MuiLink>
3649
</>
3750
) : (
38-
"When this is on, you’ll see what’s happening around you right now."
51+
t("SHOW_CONTENT_IN_THIS_LOCATION_DESCRIPTION", {
52+
defaultValue: "When this is on, you’ll see what’s happening around you right now."
53+
})
3954
)}
4055
/>
4156
<ExploreModalInfo
4257
isSearchModal={isSearchModal}
43-
searchModalTitle={"Personalization"}
44-
title={isSearchModal ? "Remove blocked and muted accounts" : "Trends for you"}
58+
searchModalTitle={t("PERSONALIZATION", { defaultValue: "Personalization" })}
59+
title={isSearchModal
60+
? t("REMOVE_BLOCKED_AND_MUTED_ACCOUNTS", { defaultValue: "Remove blocked and muted accounts" })
61+
: t("TRENDS_FOR_YOU", { defaultValue: "Trends for you" })}
4562
subtitle={isSearchModal ? (
4663
<>
47-
{`Use this to eliminate search results from accounts you’ve blocked or muted. `}
64+
{t("REMOVE_BLOCKED_AND_MUTED_ACCOUNTS_DESCRIPTION", {
65+
defaultValue: "Use this to eliminate search results from accounts you’ve blocked or muted."
66+
})}
67+
{" "}
4868
<MuiLink href={TWITTER_SEARCH} variant="subtitle2" target="_blank" rel="noopener">
49-
Learn more
69+
{t("LEARN_MORE",{defaultValue: "Learn more"})}
5070
</MuiLink>
5171
</>
5272
) : (
53-
"You can personalize trends based on your location and who you follow."
73+
t("TRENDS_FOR_YOU_DESCRIPTION", {
74+
defaultValue: "You can personalize trends based on your location and who you follow."
75+
})
5476
)}
5577
/>
5678
</DialogContent>

‎frontend/src/pages/Settings/Notifications/ContentPreferences/ExploreModal/ExploreModalInfo/ExploreModalInfo.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { FC, ReactElement,useState } from "react";
1+
import React, { FC, ReactElement } from "react";
22
import { Checkbox, Typography } from "@material-ui/core";
33

44
import { useGlobalStyles } from "../../../../../../util/globalClasses";
@@ -24,19 +24,19 @@ const ExploreModalInfo: FC<ExploreModalInfoProps> = (
2424
<>
2525
{!isSearchModal && (
2626
<div className={globalClasses.itemInfoWrapper}>
27-
<Typography variant={"h5"} component={"div"}>
27+
<Typography variant="h5" component="div">
2828
{searchModalTitle}
2929
</Typography>
3030
</div>
3131
)}
3232
<div className={globalClasses.itemInfoWrapper}>
3333
<div className={globalClasses.infoItemCheckbox}>
34-
<Typography variant={"body1"} component={"span"}>
34+
<Typography variant="body1" component="span">
3535
{title}
3636
</Typography>
3737
<Checkbox />
3838
</div>
39-
<Typography variant={"subtitle2"} component={"div"}>
39+
<Typography variant="subtitle2" component="div">
4040
{subtitle}
4141
</Typography>
4242
</div>

‎frontend/src/pages/Settings/Notifications/ContentPreferences/RecommendationsModal/RecommendationsModal.tsx‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { FC, ReactElement } from "react";
22
import { Dialog, DialogContent, Typography } from "@material-ui/core";
33
import TwitterIcon from "@material-ui/icons/Twitter";
4+
import { useTranslation } from "react-i18next";
45

56
import { useRecommendationsModalStyles } from "./RecommendationsModalStyles";
67
import { useGlobalStyles } from "../../../../../util/globalClasses";
@@ -15,6 +16,7 @@ export interface RecommendationsModalProps {
1516
const RecommendationsModal: FC<RecommendationsModalProps> = ({ visible, onClose }): ReactElement | null => {
1617
const globalClasses = useGlobalStyles({});
1718
const classes = useRecommendationsModalStyles();
19+
const { t } = useTranslation();
1820

1921
if (!visible) {
2022
return null;
@@ -27,16 +29,18 @@ const RecommendationsModal: FC<RecommendationsModalProps> = ({ visible, onClose
2729
<TwitterIcon />
2830
</div>
2931
<div className={classes.contentWrapper}>
30-
<Typography variant={"h3"} component={"div"}>
31-
Which languages do you speak?
32+
<Typography variant="h3" component="div">
33+
{t("WHICH_LANGUAGES_DO_YOU_SPEAK",{defaultValue: "Which languages do you speak?"})}
3234
</Typography>
33-
<Typography variant={"subtitle1"} component={"div"} className={classes.infoText}>
34-
You’ll be able to see Tweets, people, and trends in any languages you choose.
35+
<Typography variant="subtitle1" component="div" className={classes.infoText}>
36+
{t("WHICH_LANGUAGES_DO_YOU_SPEAK_DESCRIPTION", {
37+
defaultValue: "You’ll be able to see Tweets, people, and trends in any languages you choose."
38+
})}
3539
</Typography>
36-
<RecommendedLanguage title={"English"} />
37-
<RecommendedLanguage title={"Russian - русский"} />
38-
<RecommendedLanguage title={"Chinese - 中文"} />
39-
<FullWidthButton onClick={onClose} title={"Done"} />
40+
<RecommendedLanguage title="English" />
41+
<RecommendedLanguage title="German - Deutsch" />
42+
<RecommendedLanguage title="Chinese - 中文" />
43+
<FullWidthButton onClick={onClose} title={t("DONE",{defaultValue: "Done"})} />
4044
</div>
4145
</DialogContent>
4246
</Dialog>

‎frontend/src/pages/Settings/Notifications/ContentPreferences/RecommendationsModal/RecommendedLanguage/RecommendedLanguage.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const RecommendedLanguage: FC<RecommendedLanguageProps> = ({ title }): ReactElem
1616
return (
1717
<>
1818
<div className={classnames(globalClasses.infoItemCheckbox, classes.checkboxWrapper)}>
19-
<Typography variant={"body1"} component={"span"}>
19+
<Typography variant="body1" component="span">
2020
{title}
2121
</Typography>
2222
<Checkbox />

‎frontend/src/pages/Settings/Notifications/Filters/Filters.tsx‎

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { FC, ReactElement } from "react";
22
import { Link } from "react-router-dom";
33
import { Checkbox, Link as MuiLink, Typography } from "@material-ui/core";
4+
import { useTranslation } from "react-i18next";
45

56
import { ArrowRightIcon } from "../../../../icons";
67
import { useGlobalStyles } from "../../../../util/globalClasses";
@@ -10,34 +11,39 @@ import { UNDERSTANDING_THE_NOTIFICATIONS_TIMELINE } from "../../../../constants/
1011

1112
const Filters: FC = (): ReactElement => {
1213
const globalClasses = useGlobalStyles({});
14+
const { t } = useTranslation();
1315

1416
return (
1517
<>
1618
<div className={globalClasses.itemInfoWrapper}>
17-
<Typography variant={"subtitle2"} component={"div"}>
18-
Choose the notifications you’d like to see — and those you don’t.
19+
<Typography variant="subtitle2" component="div">
20+
{t("FILTERS_DESCRIPTION", {
21+
defaultValue: "Choose the notifications you’d like to see — and those you don’t."
22+
})}
1923
</Typography>
2024
</div>
2125
<div className={globalClasses.itemInfoWrapper}>
2226
<div className={globalClasses.infoItemCheckbox}>
23-
<Typography variant={"body1"} component={"span"}>
24-
Quality filter
27+
<Typography variant="body1" component="span">
28+
{t("QUALITY_FILTER",{defaultValue: "Quality filter"})}
2529
</Typography>
2630
<Checkbox />
2731
</div>
28-
<Typography variant={"subtitle2"} component={"div"}>
29-
{"Choose to filter out content such as duplicate or automated Tweets. This doesn’t apply to " +
30-
"notifications from accounts you follow or have interacted with recently. "}
31-
<MuiLink href={UNDERSTANDING_THE_NOTIFICATIONS_TIMELINE} variant="subtitle2" target="_blank"
32-
rel="noopener">
33-
Learn more
32+
<Typography variant="subtitle2" component="div">
33+
{t("QUALITY_FILTER_DESCRIPTION", {
34+
defaultValue: `Choose to filter out content such as duplicate or automated Tweets.
35+
This doesn’t apply to notifications from accounts you follow or have interacted with recently.`
36+
})}
37+
{" "}
38+
<MuiLink href={UNDERSTANDING_THE_NOTIFICATIONS_TIMELINE} variant="subtitle2" target="_blank" rel="noopener">
39+
{t("LEARN_MORE", { defaultValue: "Learn more" })}
3440
</MuiLink>
3541
</Typography>
3642
</div>
3743
<Link to={SETTINGS_PRIVACY_AND_SAFETY_ADVANCED_FILTERS} className={globalClasses.linkWrapper}>
3844
<div className={globalClasses.contentLink}>
39-
<Typography variant={"body1"} component={"span"}>
40-
Muted notifications
45+
<Typography variant="body1" component="span">
46+
{t("MUTED_NOTIFICATIONS",{defaultValue: "Muted notifications"})}
4147
</Typography>
4248
{ArrowRightIcon}
4349
</div>

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /