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 07165af

Browse files
Added translations for components
1 parent fde5a8b commit 07165af

File tree

78 files changed

+695
-536
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

78 files changed

+695
-536
lines changed

‎frontend/src/App.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -264,7 +264,7 @@ const App: FC = (): ReactElement => {
264264
<Route path={`${USER_FOLLOWERS_YOU_FOLLOW}/:id`} component={FollowersYouKnow} exact />
265265
<Route path={`${USER}/:id/:follow`} component={FollowingFollowers} exact />
266266
</Switch>
267-
{background && <Route path={`${MODAL}/:id`} children={<TweetImageModal />} />}
267+
{background && <Route path={`${MODAL}/:tweetId`} children={<TweetImageModal />} />}
268268
{background && <Route path={`${PROFILE_PHOTO}/:id`} children={<UserImageModal />} />}
269269
{background && <Route path={`${PROFILE_HEADER_PHOTO}/:id`} children={<UserImageModal />} />}
270270
</Layout>

‎frontend/src/components/SideSearch/RecentSearchResults/RecentSearchResults.tsx‎

Lines changed: 36 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { FC, ReactElement, useEffect } from "react";
22
import { useDispatch, useSelector } from "react-redux";
33
import { Button, Typography } from "@material-ui/core";
4+
import { useTranslation } from "react-i18next";
45

56
import { useRecentSearchResultsStyles } from "./RecentSearchResultsStyles";
67
import { SEARCH_TERMS } from "../../../constants/common-constants";
@@ -25,6 +26,7 @@ const RecentSearchResults: FC = (): ReactElement => {
2526
const recentUsersSearchResult = useSelector(selectRecentUsersSearchResult);
2627
const isRecentSearchResultEmpty = useSelector(selectIsRecentSearchResultEmpty);
2728
const localStorageItem = localStorage.getItem(SEARCH_TERMS);
29+
const { t } = useTranslation();
2830

2931
useEffect(() => {
3032
if (localStorageItem) {
@@ -38,41 +40,43 @@ const RecentSearchResults: FC = (): ReactElement => {
3840
localStorage.removeItem(SEARCH_TERMS);
3941
};
4042

43+
if (isRecentSearchResultEmpty) {
44+
return (
45+
<Typography className={classes.searchText} variant="body1" component="div">
46+
{t("EMPTY_SEARCH_RESULT", { defaultValue: "Try searching for people, topics, or keywords" })}
47+
</Typography>
48+
);
49+
}
50+
4151
return (
4252
<>
43-
{isRecentSearchResultEmpty ? (
44-
<Typography className={classes.searchText} variant={"body1"} component={"div"}>
45-
Try searching for people, topics, or keywords
46-
</Typography>
53+
{isLoadingSearchResult ? (
54+
<Spinner />
4755
) : (
48-
isLoadingSearchResult ? (
49-
<Spinner />
50-
) : (
51-
<>
52-
<div>
53-
<Typography className={classes.header} variant={"h5"} component={"div"}>
54-
Recent
55-
</Typography>
56-
<Button
57-
className={classes.clearButton}
58-
onClick={onClickClearSearchTerms}
59-
variant="text"
60-
color="primary"
61-
>
62-
Clear all
63-
</Button>
64-
</div>
65-
{recentTextSearchResult.map((text, index) => (
66-
<TextSearchResult key={index} text={text} recentSearch />
67-
))}
68-
{recentTagsSearchResult.map((tag, index) => (
69-
<TextSearchResult key={index} text={tag} recentSearch />
70-
))}
71-
{recentUsersSearchResult.map((user) => (
72-
<UserSearchResult key={user.id} user={user} recentSearch />
73-
))}
74-
</>
75-
)
56+
<>
57+
<div>
58+
<Typography className={classes.header} variant="h5" component="div">
59+
{t("RECENT", { defaultValue: "Recent" })}
60+
</Typography>
61+
<Button
62+
className={classes.clearButton}
63+
onClick={onClickClearSearchTerms}
64+
variant="text"
65+
color="primary"
66+
>
67+
{t("CLEAR_ALL", { defaultValue: "Clear all" })}
68+
</Button>
69+
</div>
70+
{recentTextSearchResult.map((text, index) => (
71+
<TextSearchResult key={index} text={text} recentSearch />
72+
))}
73+
{recentTagsSearchResult.map((tag, index) => (
74+
<TextSearchResult key={index} text={tag} recentSearch />
75+
))}
76+
{recentUsersSearchResult.map((user) => (
77+
<UserSearchResult key={user.id} user={user} recentSearch />
78+
))}
79+
</>
7680
)}
7781
</>
7882
);

‎frontend/src/components/SideSearch/SideSearch.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { FC, MouseEvent, ReactElement, useEffect } from "react";
22
import { useDispatch } from "react-redux";
33
import { ClickAwayListener, IconButton, InputAdornment } from "@material-ui/core";
4+
import { useTranslation } from "react-i18next";
45

56
import { SideSearchTextField } from "../SearchTextField/SideSearchTextField";
67
import { CloseIcon, SearchIcon } from "../../icons";
@@ -18,6 +19,7 @@ const SideSearch: FC = (): ReactElement => {
1819
const { open, onClickOpen, onClickClose } = useClickAway();
1920
const { text, setText, handleChangeText } = useInputText();
2021
const textToSearch = useDebounce(text, 300);
22+
const { t } = useTranslation();
2123

2224
useEffect(() => {
2325
if (textToSearch) {
@@ -49,10 +51,11 @@ const SideSearch: FC = (): ReactElement => {
4951
<div className={classes.content}>
5052
<SideSearchTextField
5153
variant="outlined"
52-
placeholder="Search Twitter"
54+
placeholder={t("SEARCH_TWITTER",{defaultValue: "Search Twitter"})}
5355
onChange={handleChangeText}
5456
onClick={handleClickOpenPopup}
5557
value={text}
58+
fullWidth
5659
InputProps={{
5760
startAdornment: (
5861
<InputAdornment position="start">
@@ -62,14 +65,13 @@ const SideSearch: FC = (): ReactElement => {
6265
endAdornment: (
6366
text && (
6467
<InputAdornment position="end">
65-
<IconButton id={"clearText"} color="primary" onClick={handleClearText}>
68+
<IconButton id="clearText" color="primary" onClick={handleClearText}>
6669
{CloseIcon}
6770
</IconButton>
6871
</InputAdornment>
6972
)
7073
)
7174
}}
72-
fullWidth
7375
/>
7476
{open && (
7577
<div className={classes.dropdown}>

‎frontend/src/components/SideSearch/TextSearchResult/TextSearchResult.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,11 +33,11 @@ const TextSearchResult: FC<TextSearchResultProps> = memo(({ text, tweetCount, re
3333
{SearchIcon}
3434
</span>
3535
<div>
36-
<Typography variant={"h6"} component={"div"}>
36+
<Typography variant="h6" component="div">
3737
{text}
3838
</Typography>
3939
{tweetCount && (
40-
<Typography variant={"subtitle1"} component={"div"}>
40+
<Typography variant="subtitle1" component="div">
4141
{tweetCount} Tweets
4242
</Typography>
4343
)}

‎frontend/src/components/SideSearch/UserSearchResult/UserSearchResult.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,17 +29,17 @@ const UserSearchResult: FC<UserSearchResultProps> = ({ user, recentSearch }): Re
2929
return (
3030
<ListItem className={classes.searchPersonResult} onClick={handleClickUserProfile}>
3131
<ListItemAvatar>
32-
<Avatar className={globalClasses.avatar} alt={"avatar"} src={user.avatar} />
32+
<Avatar className={globalClasses.avatar} alt="avatar" src={user.avatar} />
3333
</ListItemAvatar>
3434
<div className={classes.userInfo}>
35-
<Typography variant={"h6"} display={"inline"}>
35+
<Typography variant="h6" display="inline">
3636
{user.fullName}
3737
</Typography>
38-
<Typography variant={"subtitle1"} component={"div"}>
38+
<Typography variant="subtitle1" component="div">
3939
@{user.username}
4040
</Typography>
4141
</div>
42-
{recentSearch && <RemoveSearchResultButton stateItem={"users"} item={user.id} />}
42+
{recentSearch && <RemoveSearchResultButton stateItem="users" item={user.id} />}
4343
</ListItem>
4444
);
4545
};

‎frontend/src/components/SmallLinkPreview/SmallLinkPreview.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,14 +23,14 @@ const SmallLinkPreview: FC<SmallLinkPreviewProps> = (
2323
isFullTweet
2424
}
2525
): ReactElement => {
26-
const classes = useSmallLinkPreviewStyles({ linkCover: linkCover,isFullTweet: isFullTweet });
26+
const classes = useSmallLinkPreviewStyles({ linkCover, isFullTweet });
2727
const matches = link.match(/^https?\:\/\/([^\/?#]+)(?:[\/?#]|$)/i);
2828
const domain = matches && matches[1];
2929

3030
const LinkPreview = (): JSX.Element => {
3131
if (onOpenYouTubeVideo) {
3232
return (
33-
<div id={"openYouTubeVideo"} className={classes.container} onClick={onOpenYouTubeVideo}>
33+
<div id="openYouTubeVideo" className={classes.container} onClick={onOpenYouTubeVideo}>
3434
<div className={classes.linkPreviewImage}>
3535
<div className={classes.videoIcon}>
3636
{PlayVideoIcon}
@@ -54,20 +54,20 @@ const SmallLinkPreview: FC<SmallLinkPreviewProps> = (
5454
const LinkPreviewInfo = (): JSX.Element => {
5555
return (
5656
<div className={classes.linkPreviewTitle}>
57-
<Typography variant={"body1"} component={"div"}>
57+
<Typography variant="body1" component="div">
5858
{linkTitle}
5959
</Typography>
60-
<Typography variant={"subtitle1"} component={"div"}>
60+
<Typography variant="subtitle1" component="div">
6161
{linkDescription}
6262
</Typography>
63-
<Typography variant={"subtitle1"} component={"div"}>
63+
<Typography variant="subtitle1" component="div">
6464
{LinkIcon}{domain}
6565
</Typography>
6666
</div>
6767
);
6868
};
6969

70-
return (<LinkPreview />);
70+
return <LinkPreview />;
7171
};
7272

7373
export default SmallLinkPreview;

‎frontend/src/components/Tags/Tags.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const Tags = (): ReactElement => {
2020
return (
2121
<Paper className={classes.container}>
2222
<Paper className={classes.header} variant="outlined">
23-
<Typography variant={"h5"} component={"div"}>
23+
<Typography variant="h5" component="div">
2424
{t("TRENDS_FOR_YOU", { defaultValue: "Trends for you" })}
2525
</Typography>
2626
<SettingsModal />
@@ -32,7 +32,7 @@ const Tags = (): ReactElement => {
3232
{tags.slice(0, 3).map((tag) => (<TagItem key={tag.id} tag={tag} classes={classes} />))}
3333
<Link to={HOME_TRENDS}>
3434
<ListItem className={classes.footer}>
35-
<Typography variant={"body1"} component={"span"}>
35+
<Typography variant="body1" component="span">
3636
{t("SHOW_MORE", { defaultValue: "Show more" })}
3737
</Typography>
3838
</ListItem>

‎frontend/src/components/TweetActionResult/TweetActionResult.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ const TweetActionResult: FC<TweetActionResultProps> = ({ action, text }): ReactE
3131
return (
3232
<div className={classes.container}>
3333
{showIcon()}
34-
<Typography variant={"subtitle2"} component={"div"}>
34+
<Typography variant="subtitle2" component="div">
3535
{text}
3636
</Typography>
3737
</div>

‎frontend/src/components/TweetAnalyticsModal/TweetAnalyticsModal.tsx‎

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

56
import { useTweetAnalyticsModalStyles } from "./TweetAnalyticsModalStyles";
67
import { textFormatter } from "../../util/text-formatter";
@@ -24,42 +25,50 @@ const TweetAnalyticsModal: FC<TweetAnalyticsModalStyles> = (
2425
}
2526
): ReactElement | null => {
2627
const classes = useTweetAnalyticsModalStyles();
28+
const { t } = useTranslation();
2729

2830
if (!visible) {
2931
return null;
3032
}
3133

3234
return (
3335
<Dialog open={visible} onClose={onClose} className={classes.container}>
34-
<DialogTitleComponent title={"Tweet Analytics"} onClose={onClose} />
36+
<DialogTitleComponent
37+
title={t("TWEET_ANALYTICS", { defaultValue: "Tweet Analytics" })}
38+
onClose={onClose}
39+
/>
3540
<DialogContent>
3641
<div className={classes.tweetInfoContainer}>
3742
<div className={classes.tweetInfoWrapper}>
38-
<Typography variant={"h6"} className={classes.tweetInfoFullName} component={"span"}>
43+
<Typography variant="h6" className={classes.tweetInfoFullName} component="span">
3944
{fullName}
4045
</Typography>
41-
<Typography variant={"subtitle1"} component={"span"}>
46+
<Typography variant="subtitle1" component="span">
4247
@{username}
4348
</Typography>
44-
<Typography className={classes.tweetInfoText} component={"div"}>
49+
<Typography className={classes.tweetInfoText} component="div">
4550
{textFormatter(text)}
4651
</Typography>
4752
</div>
4853
<div className={classes.analyticsInfoWrapper}>
49-
<Typography className={classes.analyticsInfoTitle} component={"div"}>
50-
Impressions
54+
<Typography className={classes.analyticsInfoTitle} component="div">
55+
{t("IMPRESSIONS",{defaultValue: "Impressions"})}
5156
<div className={classes.impressionsCount}>0</div>
5257
</Typography>
53-
<Typography className={classes.analyticsInfoText} component={"div"}>
54-
times people saw this Tweet on Twitter
58+
<Typography className={classes.analyticsInfoText} component="div">
59+
{t("IMPRESSIONS_DESCRIPTION", {
60+
defaultValue: "times people saw this Tweet on Twitter"
61+
})}
5562
</Typography>
5663
<div className={classes.engagementsWrapper}>
57-
<Typography className={classes.analyticsInfoTitle} component={"div"}>
58-
Total engagements
64+
<Typography className={classes.analyticsInfoTitle} component="div">
65+
{t("TOTAL_ENGAGEMENTS",{defaultValue: "Total engagements"})}
5966
<div className={classes.impressionsCount}>0</div>
6067
</Typography>
61-
<Typography className={classes.analyticsInfoText} component={"div"}>
62-
times people interacted with this Tweet
68+
<Typography className={classes.analyticsInfoText} component="div">
69+
{t("TOTAL_ENGAGEMENTS_DESCRIPTION", {
70+
defaultValue: "times people interacted with this Tweet"
71+
})}
6372
</Typography>
6473
</div>
6574
</div>
@@ -70,18 +79,23 @@ const TweetAnalyticsModal: FC<TweetAnalyticsModalStyles> = (
7079
size="small"
7180
fullWidth
7281
>
73-
View all engagements
82+
{t("VIEW_ALL_ENGAGEMENTS",{defaultValue: "View all engagements"})}
7483
</Button>
7584
</div>
7685
<div className={classes.promoteWrapper}>
7786
<img className={classes.promoteImage}
78-
src="https://ton.twimg.com/tfb/promote-a54f43f3904fb8073e4f16564fe00058.png" />
79-
<Typography className={classes.promoteTitle} component={"div"}>
80-
Promote your Tweet
87+
src="https://ton.twimg.com/tfb/promote-a54f43f3904fb8073e4f16564fe00058.png"
88+
/>
89+
<Typography className={classes.promoteTitle} component="div">
90+
{t("PROMOTE_YOUR_TWEET", { defaultValue: "Promote your Tweet" })}
8191
</Typography>
82-
<Typography className={classes.promoteText} component={"div"}>
83-
Your Tweet has 0 total impressions so far. <br />
84-
Get more impressions on this Tweet!
92+
<Typography className={classes.promoteText} component="div">
93+
{t("PROMOTE_YOUR_TWEET_DESCRIPTION", {
94+
impressions: 0,
95+
defaultValue: "Your Tweet has 0 total impressions so far."
96+
})}
97+
{" "}<br />
98+
{t("GET_MORE_IMPRESSIONS", { defaultValue: "Get more impressions on this Tweet!" })}
8599
</Typography>
86100
</div>
87101
<div className={classes.engagementsButton}>
@@ -91,7 +105,7 @@ const TweetAnalyticsModal: FC<TweetAnalyticsModalStyles> = (
91105
size="small"
92106
fullWidth
93107
>
94-
Promote your Tweet
108+
{t("PROMOTE_YOUR_TWEET",{defaultValue: "Promote your Tweet"})}
95109
</Button>
96110
</div>
97111
</div>

‎frontend/src/components/TweetComponent/AnalyticsIconButton/AnalyticsIconButton.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import React, { FC, memo, ReactElement } from "react";
2+
import { useTranslation } from "react-i18next";
23

34
import ActionIconButton from "../../ActionIconButton/ActionIconButton";
45
import { AnalyticsIcon } from "../../../icons";
@@ -23,11 +24,12 @@ const AnalyticsIconButton: FC<AnalyticsIconButtonProps> = memo((
2324
): ReactElement => {
2425
const classes = useAnalyticsIconButtonStyles();
2526
const { visibleModalWindow, onOpenModalWindow, onCloseModalWindow } = useModalWindow();
27+
const { t } = useTranslation();
2628

2729
return (
28-
<div id={"analytics"} className={classes.replyIcon}>
30+
<div id="analytics" className={classes.replyIcon}>
2931
<ActionIconButton
30-
actionText={"Analytics"}
32+
actionText={t("ANALYTICS",{defaultValue: "Analytics"})}
3133
icon={AnalyticsIcon}
3234
onClick={onOpenModalWindow}
3335
disabled={isUserCanReply}

0 commit comments

Comments
(0)

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