Skip to content

Commit 678f6e1

Browse files
kkartunovkkartunov
committed
Default avatar for #4662 
1 parent 9b298b1 commit 678f6e1

File tree

6 files changed

+53
-72
lines changed

6 files changed

+53
-72
lines changed

‎__tests__/shared/components/Leaderboard/__snapshots__/LeaderboardTable.jsx.snap

+16-40
Original file line numberDiff line numberDiff line change
@@ -44,16 +44,10 @@ exports[`Matches shallow shapshot 1`] = `
4444
<span
4545
className="src-shared-components-Leaderboard-LeaderboardTable-themes-___styles__leaderboard-avatar___21pJ3"
4646
>
47-
<ThemedAvatar
48-
composeAdhocTheme="deeply"
49-
composeContextTheme="softly"
50-
mapThemrProps={[Function]}
51-
theme={
52-
Object {
53-
"avatar": "src-shared-components-Leaderboard-avatarStyles___default___1bHTzy",
54-
}
55-
}
56-
themePriority="adhoc-context-default"
47+
<DefaultAvatar
48+
data-name="Layer 1"
49+
viewBox="0 0 33 33.00137"
50+
xmlns="http://www.w3.org/2000/svg"
5751
/>
5852
</span>
5953
</td>
@@ -97,16 +91,10 @@ exports[`Matches shallow shapshot 1`] = `
9791
<span
9892
className="src-shared-components-Leaderboard-LeaderboardTable-themes-___styles__leaderboard-avatar___21pJ3"
9993
>
100-
<ThemedAvatar
101-
composeAdhocTheme="deeply"
102-
composeContextTheme="softly"
103-
mapThemrProps={[Function]}
104-
theme={
105-
Object {
106-
"avatar": "src-shared-components-Leaderboard-avatarStyles___default___1bHTzy",
107-
}
108-
}
109-
themePriority="adhoc-context-default"
94+
<DefaultAvatar
95+
data-name="Layer 1"
96+
viewBox="0 0 33 33.00137"
97+
xmlns="http://www.w3.org/2000/svg"
11098
/>
11199
</span>
112100
</td>
@@ -150,16 +138,10 @@ exports[`Matches shallow shapshot 1`] = `
150138
<span
151139
className="src-shared-components-Leaderboard-LeaderboardTable-themes-___styles__leaderboard-avatar___21pJ3"
152140
>
153-
<ThemedAvatar
154-
composeAdhocTheme="deeply"
155-
composeContextTheme="softly"
156-
mapThemrProps={[Function]}
157-
theme={
158-
Object {
159-
"avatar": "src-shared-components-Leaderboard-avatarStyles___default___1bHTzy",
160-
}
161-
}
162-
themePriority="adhoc-context-default"
141+
<DefaultAvatar
142+
data-name="Layer 1"
143+
viewBox="0 0 33 33.00137"
144+
xmlns="http://www.w3.org/2000/svg"
163145
/>
164146
</span>
165147
</td>
@@ -203,16 +185,10 @@ exports[`Matches shallow shapshot 1`] = `
203185
<span
204186
className="src-shared-components-Leaderboard-LeaderboardTable-themes-___styles__leaderboard-avatar___21pJ3"
205187
>
206-
<ThemedAvatar
207-
composeAdhocTheme="deeply"
208-
composeContextTheme="softly"
209-
mapThemrProps={[Function]}
210-
theme={
211-
Object {
212-
"avatar": "src-shared-components-Leaderboard-avatarStyles___default___1bHTzy",
213-
}
214-
}
215-
themePriority="adhoc-context-default"
188+
<DefaultAvatar
189+
data-name="Layer 1"
190+
viewBox="0 0 33 33.00137"
191+
xmlns="http://www.w3.org/2000/svg"
216192
/>
217193
</span>
218194
</td>

‎__tests__/shared/components/Leaderboard/__snapshots__/PodiumSpot.jsx.snap

+8-20
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,10 @@ exports[`Matches shallow shapshot 1`] = `
77
<span
88
className="src-shared-components-Leaderboard-PodiumSpot-themes-___styles__leaderboard-avatar___JjdZ_"
99
>
10-
<ThemedAvatar
11-
composeAdhocTheme="deeply"
12-
composeContextTheme="softly"
13-
mapThemrProps={[Function]}
14-
theme={
15-
Object {
16-
"avatar": "src-shared-components-Leaderboard-avatarStyles___gold___1KUGNq",
17-
}
18-
}
19-
themePriority="adhoc-context-default"
10+
<DefaultAvatar
11+
data-name="Layer 1"
12+
viewBox="0 0 33 33.00137"
13+
xmlns="http://www.w3.org/2000/svg"
2014
/>
2115
<div
2216
className="src-shared-components-Leaderboard-PodiumSpot-themes-___styles__ranking___3eGBy"
@@ -72,16 +66,10 @@ exports[`Matches shallow shapshot 2`] = `
7266
<span
7367
className="src-shared-components-Leaderboard-PodiumSpot-themes-___styles__leaderboard-avatar___JjdZ_"
7468
>
75-
<ThemedAvatar
76-
composeAdhocTheme="deeply"
77-
composeContextTheme="softly"
78-
mapThemrProps={[Function]}
79-
theme={
80-
Object {
81-
"avatar": "src-shared-components-Leaderboard-avatarStyles___gold___1KUGNq",
82-
}
83-
}
84-
themePriority="adhoc-context-default"
69+
<DefaultAvatar
70+
data-name="Layer 1"
71+
viewBox="0 0 33 33.00137"
72+
xmlns="http://www.w3.org/2000/svg"
8573
/>
8674
<div
8775
className="src-shared-components-Leaderboard-PodiumSpot-themes-___styles__ranking___3eGBy"

‎src/assets/images/default-avatar-photo.svg

+1
Loading

‎src/shared/components/Leaderboard/LeaderboardTable/index.jsx

+12-6
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ import PT from 'prop-types';
2828
import { Avatar } from 'topcoder-react-ui-kit';
2929
import { config } from 'topcoder-react-utils';
3030
import _ from 'lodash';
31+
import DefaultAvatar from 'assets/images/default-avatar-photo.svg';
32+
3133

3234
import avatarStyles from '../avatarStyles.scss';
3335
import defaultStyles from './themes/styles.scss'; // eslint-disable-line
@@ -68,12 +70,16 @@ export default function LeaderboardTable(props) {
6870
<td styleName={`${stylesName}.col-rank`}>{competitor.rank}</td>
6971
<td styleName={`${stylesName}.col-avatar`}>
7072
<span styleName={`${stylesName}.leaderboard-avatar`}>
71-
<Avatar
72-
theme={{
73-
avatar: avatarStyles.default,
74-
}}
75-
url={photoUrl}
76-
/>
73+
{
74+
photoUrl ? (
75+
<Avatar
76+
theme={{
77+
avatar: avatarStyles.default,
78+
}}
79+
url={photoUrl}
80+
/>
81+
) : <DefaultAvatar />
82+
}
7783
</span>
7884
</td>
7985
<td styleName={`${stylesName}.col-handle`}>

‎src/shared/components/Leaderboard/LeaderboardTable/themes/tco20.scss

+5
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,11 @@ $table-bg-hover: #f5f5f5;
118118
height: 40px;
119119
width: 40px;
120120
overflow: hidden;
121+
122+
svg {
123+
border: 3px solid rgba(0, 0, 0, 0.05);
124+
border-radius: 50%;
125+
}
121126
}
122127

123128
.col-handle {

‎src/shared/components/Leaderboard/PodiumSpot/index.jsx

+11-6
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import PT from 'prop-types';
2929
import { Avatar } from 'topcoder-react-ui-kit';
3030
import { config } from 'topcoder-react-utils';
3131
import _ from 'lodash';
32+
import DefaultAvatar from 'assets/images/default-avatar-photo.svg';
3233

3334
import avatarStyles from '../avatarStyles.scss';
3435
import defaultStyles from './themes/styles.scss'; // eslint-disable-line
@@ -110,12 +111,16 @@ export default function PodiumSpot(props) {
110111
return (
111112
<div styleName={rootStyle}>
112113
<span styleName={`${stylesName}.leaderboard-avatar`}>
113-
<Avatar
114-
theme={{
115-
avatar: CUSTOM_STYLES[themeName][competitor.rank],
116-
}}
117-
url={photoUrl}
118-
/>
114+
{
115+
photoUrl ? (
116+
<Avatar
117+
theme={{
118+
avatar: CUSTOM_STYLES[themeName][competitor.rank],
119+
}}
120+
url={photoUrl}
121+
/>
122+
) : <DefaultAvatar />
123+
}
119124
<div styleName={`${stylesName}.ranking`}>{DISPLAY_RANKING[competitor.rank]}</div>
120125
</span>
121126
{

0 commit comments

Comments
 (0)