Skip to content

Commit 5681bd9

Browse files
benjiwheelerbenjiwheeler
committed
receive canEditTitle and authorThumbnailUrl props
1 parent 0a1c00f commit 5681bd9

File tree

15 files changed

+80
-104
lines changed

15 files changed

+80
-104
lines changed

‎src/components/action-menu/action-menu.css‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
@import "../../css/colors.css";
2+
@import "../../css/units.css";
23
@import "../../css/z-index.css";
34

45
$main-button-size: 2.75rem;
@@ -153,7 +154,7 @@ button::-moz-focus-inner {
153154

154155
.tooltip {
155156
border: 1px solid hsla(0, 0%, 0%, .1) !important;
156-
border-radius: .25rem !important;
157+
border-radius: $form-radius !important;
157158
box-shadow: 0 0 .5rem hsla(0, 0%, 0%, .25) !important;
158159
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
159160
z-index: $z-index-tooltip !important;

‎src/components/button/button.css‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1+
@import "../../css/units.css";
2+
13
.outlined-button {
24
cursor: pointer;
3-
border-radius: .25rem;
5+
border-radius: $form-radius;
46
font-weight: bold;
57
display: flex;
68
flex-direction: row;

‎src/components/coming-soon/coming-soon.css‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,13 @@
55
*/
66

77
@import "../../css/colors.css";
8+
@import "../../css/units.css";
89
@import "../../css/z-index.css";
910

1011
.coming-soon {
1112
background-color: $data-primary !important;
1213
border: 1px solid $ui-black-transparent !important;
13-
border-radius: .25rem !important;
14+
border-radius: $form-radius !important;
1415
box-shadow: 0 0 .5rem $ui-black-transparent !important;
1516
padding: .75rem 1rem !important;
1617
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
@@ -25,7 +26,7 @@
2526
border-left: 0 !important;
2627
border-bottom: 0 !important;
2728
border-right: 1px solid $ui-black-transparent !important;
28-
border-radius: .25rem;
29+
border-radius: $form-radius;
2930
background-color: $data-primary !important;
3031
height: 1rem !important;
3132
width: 1rem !important;

‎src/components/gui/gui.jsx‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,13 +59,15 @@ const GUIComponent = props => {
5959
activeTabIndex,
6060
alertsVisible,
6161
authorId,
62+
authorThumbnailUrl,
6263
authorUsername,
6364
basePath,
6465
backdropLibraryVisible,
6566
backpackOptions,
6667
blocksTabVisible,
6768
cardsVisible,
6869
canCreateNew,
70+
canEditTitle,
6971
canRemix,
7072
canSave,
7173
canCreateCopy,
@@ -182,9 +184,11 @@ const GUIComponent = props => {
182184
<MenuBar
183185
accountNavOpen={accountNavOpen}
184186
authorId={authorId}
187+
authorThumbnailUrl={authorThumbnailUrl}
185188
authorUsername={authorUsername}
186189
canCreateCopy={canCreateCopy}
187190
canCreateNew={canCreateNew}
191+
canEditTitle={canEditTitle}
188192
canRemix={canRemix}
189193
canSave={canSave}
190194
canShare={canShare}
@@ -328,6 +332,7 @@ GUIComponent.propTypes = {
328332
accountNavOpen: PropTypes.bool,
329333
activeTabIndex: PropTypes.number,
330334
authorId: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
335+
authorThumbnailUrl: PropTypes.string,
331336
authorUsername: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
332337
backdropLibraryVisible: PropTypes.bool,
333338
backpackOptions: PropTypes.shape({
@@ -338,6 +343,7 @@ GUIComponent.propTypes = {
338343
blocksTabVisible: PropTypes.bool,
339344
canCreateCopy: PropTypes.bool,
340345
canCreateNew: PropTypes.bool,
346+
canEditTitle: PropTypes.bool,
341347
canRemix: PropTypes.bool,
342348
canSave: PropTypes.bool,
343349
canShare: PropTypes.bool,
@@ -383,6 +389,7 @@ GUIComponent.defaultProps = {
383389
},
384390
basePath: './',
385391
canCreateNew: false,
392+
canEditTitle: false,
386393
canRemix: false,
387394
canSave: false,
388395
canCreateCopy: false,

‎src/components/menu-bar/account-nav.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ const AccountNavComponent = ({
4343
{thumbnailUrl ? (
4444
<UserAvatar
4545
className={styles.avatar}
46-
src={thumbnailUrl}
46+
imageUrl={thumbnailUrl}
4747
/>
4848
) : null}
4949
<span className={styles.profileName}>

‎src/components/menu-bar/author-info.css‎

Lines changed: 10 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,39 @@
11
@import "../../css/colors.css";
22
@import "../../css/units.css";
33

4-
5-
64
.author-info {
75
color: $ui-white;
86
font-family: "Helvetica Neue";
97
display: flex;
108
justify-content: start;
119
align-items: center;
10+
cursor: default;
1211
}
1312

14-
.author-info .avatar {
13+
.avatar {
1514
margin-right: .5625rem;
1615
}
1716

18-
.author-info .title-author {
19-
/* display: flex;
20-
align-items: center;
21-
justify-content: end; */
22-
}
23-
24-
.author-info .project-title {
25-
max-width: 12rem;
17+
.project-title {
18+
max-width: $menu-bar-item-max-width;
2619
display: block;
2720
overflow: hidden;
28-
font-size: .875rem;
29-
line-height: 1.0625rem;
21+
font-size: $menu-bar-large-font-size;
3022
font-weight: bold;
3123
text-overflow: ellipsis;
3224
white-space: nowrap;
3325
}
3426

35-
.author-info .username-line {
36-
max-width: 12rem;
37-
font-size: .75rem;
38-
line-height: .9375rem;
27+
.username-line {
28+
max-width: $menu-bar-item-max-width;
29+
font-size: $menu-bar-standard-font-size;
3930
display: block;
4031
overflow: hidden;
32+
font-weight: normal;
4133
text-overflow: ellipsis;
4234
white-space: nowrap;
4335
}
4436

45-
.author-info .username {
37+
.username {
4638
font-weight: bold;
4739
}
48-
49-
.author-info .unimportant-text {
50-
font-weight: normal;
51-
}

‎src/components/menu-bar/author-info.jsx‎

Lines changed: 24 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -8,50 +8,45 @@ import styles from './author-info.css';
88

99
const AuthorInfo = ({
1010
className,
11+
imageUrl,
1112
projectTitle,
12-
userId,
13+
// TODO: use userId to link to user's profile
14+
userId, // eslint-disable-line no-unused-vars
1315
username
1416
}) => (
1517
<div
1618
className={classNames(
17-
className
19+
className,
20+
styles.authorInfo
1821
)}
1922
>
20-
<div
21-
className={classNames(
22-
styles.authorInfo
23-
)}
24-
>
25-
<UserAvatar
26-
className={styles.avatar}
27-
userId={userId}
28-
/>
29-
<div className={styles.titleAuthor}>
30-
<span className={styles.projectTitle}>
31-
{projectTitle}
23+
<UserAvatar
24+
className={styles.avatar}
25+
imageUrl={imageUrl}
26+
/>
27+
<div className={styles.titleAuthor}>
28+
<span className={styles.projectTitle}>
29+
{projectTitle}
30+
</span>
31+
<div>
32+
<span className={styles.usernameLine}>
33+
<FormattedMessage
34+
defaultMessage="by {username}"
35+
description="Shows that a project was created by this user"
36+
id="gui.authorInfo.byUser"
37+
values={{
38+
username: <span className={styles.username}>{username}</span>
39+
}}
40+
/>
3241
</span>
33-
<div>
34-
<span className={styles.usernameLine}>
35-
<span className={styles.unimportantText}>
36-
<FormattedMessage
37-
defaultMessage="by"
38-
description="Shows that a project was created by this user"
39-
id="gui.authorInfo.by"
40-
/>
41-
&nbsp;
42-
</span>
43-
<span className={styles.username}>
44-
{username}
45-
</span>
46-
</span>
47-
</div>
4842
</div>
4943
</div>
5044
</div>
5145
);
5246

5347
AuthorInfo.propTypes = {
5448
className: PropTypes.string,
49+
imageUrl: PropTypes.string,
5550
projectTitle: PropTypes.string,
5651
userId: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
5752
username: PropTypes.oneOfType([PropTypes.string, PropTypes.bool])

‎src/components/menu-bar/menu-bar.css‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
width: 100%;
2626
*/
2727
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
28-
font-size: .75rem;
28+
font-size: $menu-bar-standard-font-size;
2929
font-weight: bold;
3030
background-color: $motion-primary;
3131
color: $ui-white;
@@ -83,7 +83,7 @@
8383
}
8484

8585
.menu-bar-item.growable {
86-
max-width: 12rem;
86+
max-width: $menu-bar-item-max-width;
8787
flex: 1;
8888
}
8989

‎src/components/menu-bar/menu-bar.jsx‎

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -469,14 +469,7 @@ class MenuBar extends React.Component {
469469
<FormattedMessage {...ariaMessages.tutorials} />
470470
</div>
471471
<Divider className={classNames(styles.divider)} />
472-
{(this.props.authorUsername && this.props.authorUsername !== this.props.username) ? (
473-
<AuthorInfo
474-
className={styles.authorInfo}
475-
projectTitle={this.props.projectTitle}
476-
userId={this.props.authorId}
477-
username={this.props.authorUsername}
478-
/>
479-
) : (
472+
{this.props.canEditTitle ? (
480473
<div className={classNames(styles.menuBarItem, styles.growable)}>
481474
<MenuBarItemTooltip
482475
enable
@@ -488,7 +481,15 @@ class MenuBar extends React.Component {
488481
/>
489482
</MenuBarItemTooltip>
490483
</div>
491-
)}
484+
) : ((this.props.authorUsername && this.props.authorUsername !== this.props.username) ? (
485+
<AuthorInfo
486+
className={styles.authorInfo}
487+
imageUrl={this.props.authorThumbnailUrl}
488+
projectTitle={this.props.projectTitle}
489+
userId={this.props.authorId}
490+
username={this.props.authorUsername}
491+
/>
492+
) : null)}
492493
<div className={classNames(styles.menuBarItem)}>
493494
{this.props.canShare ? shareButton : (
494495
this.props.showComingSoon ? (
@@ -688,9 +689,11 @@ class MenuBar extends React.Component {
688689
MenuBar.propTypes = {
689690
accountMenuOpen: PropTypes.bool,
690691
authorId: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
692+
authorThumbnailUrl: PropTypes.string,
691693
authorUsername: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
692694
canCreateCopy: PropTypes.bool,
693695
canCreateNew: PropTypes.bool,
696+
canEditTitle: PropTypes.bool,
694697
canRemix: PropTypes.bool,
695698
canSave: PropTypes.bool,
696699
canShare: PropTypes.bool,

‎src/components/menu-bar/user-avatar.css‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,5 @@
44
.user-thumbnail {
55
border-radius: $form-radius;
66
vertical-align: middle;
7-
border-radius: .25rem;
87
box-shadow: 0 0 0 1px $ui-black-transparent;
98
}

0 commit comments

Comments
 (0)