diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/components/settings/navigation/SettingsNavigation.js | 4 | ||||
-rw-r--r-- | src/components/settings/recipes/RecipesDashboard.js | 6 | ||||
-rw-r--r-- | src/components/ui/Link.js | 6 | ||||
-rw-r--r-- | src/styles/settings.scss | 4 |
4 files changed, 17 insertions, 3 deletions
diff --git a/src/components/settings/navigation/SettingsNavigation.js b/src/components/settings/navigation/SettingsNavigation.js index 192cfde7a..eb3249fa0 100644 --- a/src/components/settings/navigation/SettingsNavigation.js +++ b/src/components/settings/navigation/SettingsNavigation.js | |||
@@ -119,6 +119,7 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
119 | to="/settings/services" | 119 | to="/settings/services" |
120 | className="settings-navigation__link" | 120 | className="settings-navigation__link" |
121 | activeClassName="is-active" | 121 | activeClassName="is-active" |
122 | disabled={!isLoggedIn} | ||
122 | > | 123 | > |
123 | {intl.formatMessage(messages.yourServices)} | 124 | {intl.formatMessage(messages.yourServices)} |
124 | {' '} | 125 | {' '} |
@@ -134,6 +135,7 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
134 | to="/settings/workspaces" | 135 | to="/settings/workspaces" |
135 | className="settings-navigation__link" | 136 | className="settings-navigation__link" |
136 | activeClassName="is-active" | 137 | activeClassName="is-active" |
138 | disabled={!isLoggedIn} | ||
137 | > | 139 | > |
138 | {intl.formatMessage(messages.yourWorkspaces)} | 140 | {intl.formatMessage(messages.yourWorkspaces)} |
139 | {' '} | 141 | {' '} |
@@ -148,6 +150,7 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
148 | to="/settings/user" | 150 | to="/settings/user" |
149 | className="settings-navigation__link" | 151 | className="settings-navigation__link" |
150 | activeClassName="is-active" | 152 | activeClassName="is-active" |
153 | disabled={!isLoggedIn} | ||
151 | > | 154 | > |
152 | {intl.formatMessage(messages.account)} | 155 | {intl.formatMessage(messages.account)} |
153 | </Link> | 156 | </Link> |
@@ -155,6 +158,7 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
155 | to="/settings/team" | 158 | to="/settings/team" |
156 | className="settings-navigation__link" | 159 | className="settings-navigation__link" |
157 | activeClassName="is-active" | 160 | activeClassName="is-active" |
161 | disabled={!isLoggedIn} | ||
158 | > | 162 | > |
159 | {intl.formatMessage(messages.team)} | 163 | {intl.formatMessage(messages.team)} |
160 | {!user.data.isPremium && ( | 164 | {!user.data.isPremium && ( |
diff --git a/src/components/settings/recipes/RecipesDashboard.js b/src/components/settings/recipes/RecipesDashboard.js index 877cbc588..d08e6cbc2 100644 --- a/src/components/settings/recipes/RecipesDashboard.js +++ b/src/components/settings/recipes/RecipesDashboard.js | |||
@@ -153,6 +153,8 @@ export default @injectSheet(styles) @observer class RecipesDashboard extends Com | |||
153 | const communityRecipes = recipes.filter(r => !r.isDevRecipe); | 153 | const communityRecipes = recipes.filter(r => !r.isDevRecipe); |
154 | const devRecipes = recipes.filter(r => r.isDevRecipe); | 154 | const devRecipes = recipes.filter(r => r.isDevRecipe); |
155 | 155 | ||
156 | const isLoggedIn = Boolean(localStorage.getItem('authToken')); | ||
157 | |||
156 | return ( | 158 | return ( |
157 | <div className="settings__main"> | 159 | <div className="settings__main"> |
158 | <div className="settings__header"> | 160 | <div className="settings__header"> |
@@ -265,7 +267,7 @@ export default @injectSheet(styles) @observer class RecipesDashboard extends Com | |||
265 | <RecipeItem | 267 | <RecipeItem |
266 | key={recipe.id} | 268 | key={recipe.id} |
267 | recipe={recipe} | 269 | recipe={recipe} |
268 | onClick={() => showAddServiceInterface({ recipeId: recipe.id })} | 270 | onClick={() => isLoggedIn && showAddServiceInterface({ recipeId: recipe.id })} |
269 | /> | 271 | /> |
270 | ))} | 272 | ))} |
271 | </div> | 273 | </div> |
@@ -278,7 +280,7 @@ export default @injectSheet(styles) @observer class RecipesDashboard extends Com | |||
278 | <RecipeItem | 280 | <RecipeItem |
279 | key={recipe.id} | 281 | key={recipe.id} |
280 | recipe={recipe} | 282 | recipe={recipe} |
281 | onClick={() => showAddServiceInterface({ recipeId: recipe.id })} | 283 | onClick={() => isLoggedIn && showAddServiceInterface({ recipeId: recipe.id })} |
282 | /> | 284 | /> |
283 | ))} | 285 | ))} |
284 | </div> | 286 | </div> |
diff --git a/src/components/ui/Link.js b/src/components/ui/Link.js index 5f729844b..7930d98b4 100644 --- a/src/components/ui/Link.js +++ b/src/components/ui/Link.js | |||
@@ -11,7 +11,8 @@ import { matchRoute } from '../../helpers/routing-helpers'; | |||
11 | // TODO: create container component for this component | 11 | // TODO: create container component for this component |
12 | export default @inject('stores') @observer class Link extends Component { | 12 | export default @inject('stores') @observer class Link extends Component { |
13 | onClick(e) { | 13 | onClick(e) { |
14 | if (this.props.target === '_blank') { | 14 | if (this.props.disabled) e.preventDefault(); |
15 | else if (this.props.target === '_blank') { | ||
15 | e.preventDefault(); | 16 | e.preventDefault(); |
16 | shell.openExternal(this.props.to); | 17 | shell.openExternal(this.props.to); |
17 | } | 18 | } |
@@ -39,6 +40,7 @@ export default @inject('stores') @observer class Link extends Component { | |||
39 | const linkClasses = classnames({ | 40 | const linkClasses = classnames({ |
40 | [`${className}`]: true, | 41 | [`${className}`]: true, |
41 | [`${activeClassName}`]: match, | 42 | [`${activeClassName}`]: match, |
43 | 'is-disabled': this.props.disabled, | ||
42 | }); | 44 | }); |
43 | 45 | ||
44 | return ( | 46 | return ( |
@@ -68,12 +70,14 @@ Link.wrappedComponent.propTypes = { | |||
68 | strictFilter: PropTypes.bool, | 70 | strictFilter: PropTypes.bool, |
69 | target: PropTypes.string, | 71 | target: PropTypes.string, |
70 | style: PropTypes.object, | 72 | style: PropTypes.object, |
73 | disabled: PropTypes.bool, | ||
71 | }; | 74 | }; |
72 | 75 | ||
73 | Link.wrappedComponent.defaultProps = { | 76 | Link.wrappedComponent.defaultProps = { |
74 | className: '', | 77 | className: '', |
75 | activeClassName: '', | 78 | activeClassName: '', |
76 | strictFilter: false, | 79 | strictFilter: false, |
80 | disabled: false, | ||
77 | target: '', | 81 | target: '', |
78 | style: {}, | 82 | style: {}, |
79 | }; | 83 | }; |
diff --git a/src/styles/settings.scss b/src/styles/settings.scss index 324175d0b..305450fd2 100644 --- a/src/styles/settings.scss +++ b/src/styles/settings.scss | |||
@@ -92,6 +92,10 @@ | |||
92 | } | 92 | } |
93 | } | 93 | } |
94 | 94 | ||
95 | &.is-disabled { | ||
96 | filter: grayscale(100%) opacity(.2); | ||
97 | } | ||
98 | |||
95 | &.is-active { | 99 | &.is-active { |
96 | background: $dark-theme-gray; | 100 | background: $dark-theme-gray; |
97 | color: $dark-theme-gray-smoke; | 101 | color: $dark-theme-gray-smoke; |