diff options
author | vantezzen <hello@vantezzen.io> | 2019-10-18 21:04:46 +0200 |
---|---|---|
committer | vantezzen <hello@vantezzen.io> | 2019-10-18 21:04:46 +0200 |
commit | f439e0d8acbd469f1dc9de4b38f8ac9dcb6488ea (patch) | |
tree | 7e46ab96da59d7e49fefac9a757350bbb9d376da /src/components | |
parent | Develop local server feature (diff) | |
download | ferdium-app-f439e0d8acbd469f1dc9de4b38f8ac9dcb6488ea.tar.gz ferdium-app-f439e0d8acbd469f1dc9de4b38f8ac9dcb6488ea.tar.zst ferdium-app-f439e0d8acbd469f1dc9de4b38f8ac9dcb6488ea.zip |
Add info about teams only being availible on Franz servers
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/settings/team/TeamDashboard.js | 149 |
1 files changed, 88 insertions, 61 deletions
diff --git a/src/components/settings/team/TeamDashboard.js b/src/components/settings/team/TeamDashboard.js index 2bf46b48d..3a38d682b 100644 --- a/src/components/settings/team/TeamDashboard.js +++ b/src/components/settings/team/TeamDashboard.js | |||
@@ -38,6 +38,14 @@ const messages = defineMessages({ | |||
38 | id: 'settings.team.upgradeAction', | 38 | id: 'settings.team.upgradeAction', |
39 | defaultMessage: '!!!Upgrade your Account', | 39 | defaultMessage: '!!!Upgrade your Account', |
40 | }, | 40 | }, |
41 | teamsUnavailible: { | ||
42 | id: 'settings.team.teamsUnavailible', | ||
43 | defaultMessage: '!!!Teams are unavailible', | ||
44 | }, | ||
45 | teamsUnavailibleInfo: { | ||
46 | id: 'settings.team.teamsUnavailibleInfo', | ||
47 | defaultMessage: '!!!Teams are currently only availible when using the Franz Server and after paying for Franz Professional. Please change your server to https://api.franzinfra.com to use teams.', | ||
48 | }, | ||
41 | }); | 49 | }); |
42 | 50 | ||
43 | const styles = { | 51 | const styles = { |
@@ -98,6 +106,7 @@ export default @injectSheet(styles) @observer class TeamDashboard extends Compon | |||
98 | openTeamManagement: PropTypes.func.isRequired, | 106 | openTeamManagement: PropTypes.func.isRequired, |
99 | classes: PropTypes.object.isRequired, | 107 | classes: PropTypes.object.isRequired, |
100 | isProUser: PropTypes.bool.isRequired, | 108 | isProUser: PropTypes.bool.isRequired, |
109 | server: PropTypes.string.isRequired, | ||
101 | }; | 110 | }; |
102 | 111 | ||
103 | static contextTypes = { | 112 | static contextTypes = { |
@@ -112,9 +121,84 @@ export default @injectSheet(styles) @observer class TeamDashboard extends Compon | |||
112 | openTeamManagement, | 121 | openTeamManagement, |
113 | isProUser, | 122 | isProUser, |
114 | classes, | 123 | classes, |
124 | server, | ||
115 | } = this.props; | 125 | } = this.props; |
116 | const { intl } = this.context; | 126 | const { intl } = this.context; |
117 | 127 | ||
128 | if (server === 'https://api.franzinfra.com') { | ||
129 | return ( | ||
130 | <div className="settings__main"> | ||
131 | <div className="settings__header"> | ||
132 | <span className="settings__header-item"> | ||
133 | {intl.formatMessage(messages.headline)} | ||
134 | </span> | ||
135 | </div> | ||
136 | <div className="settings__body"> | ||
137 | {isLoading && ( | ||
138 | <Loader /> | ||
139 | )} | ||
140 | |||
141 | {!isLoading && userInfoRequestFailed && ( | ||
142 | <Infobox | ||
143 | icon="alert" | ||
144 | type="danger" | ||
145 | ctaLabel={intl.formatMessage(messages.tryReloadUserInfoRequest)} | ||
146 | ctaLoading={isLoading} | ||
147 | ctaOnClick={retryUserInfoRequest} | ||
148 | > | ||
149 | {intl.formatMessage(messages.userInfoRequestFailed)} | ||
150 | </Infobox> | ||
151 | )} | ||
152 | |||
153 | {!userInfoRequestFailed && ( | ||
154 | <> | ||
155 | {!isLoading && ( | ||
156 | <> | ||
157 | <> | ||
158 | <h1 className={classnames({ | ||
159 | [classes.headline]: true, | ||
160 | [classes.headlineWithSpacing]: isProUser, | ||
161 | })} | ||
162 | > | ||
163 | {intl.formatMessage(messages.contentHeadline)} | ||
164 | |||
165 | </h1> | ||
166 | {!isProUser && ( | ||
167 | <Badge className={classes.proRequired}>{intl.formatMessage(globalMessages.proRequired)}</Badge> | ||
168 | )} | ||
169 | <div className={classes.container}> | ||
170 | <div className={classes.content}> | ||
171 | <p>{intl.formatMessage(messages.intro)}</p> | ||
172 | <p>{intl.formatMessage(messages.copy)}</p> | ||
173 | </div> | ||
174 | <img className={classes.image} src="https://cdn.franzinfra.com/announcements/assets/teams.png" alt="Franz for Teams" /> | ||
175 | </div> | ||
176 | <div className={classes.buttonContainer}> | ||
177 | {!isProUser ? ( | ||
178 | <UpgradeButton | ||
179 | className={classes.cta} | ||
180 | gaEventInfo={{ category: 'Todos', event: 'upgrade' }} | ||
181 | requiresPro | ||
182 | short | ||
183 | /> | ||
184 | ) : ( | ||
185 | <Button | ||
186 | label={intl.formatMessage(messages.manageButton)} | ||
187 | onClick={openTeamManagement} | ||
188 | className={classes.cta} | ||
189 | /> | ||
190 | )} | ||
191 | </div> | ||
192 | </> | ||
193 | </> | ||
194 | )} | ||
195 | </> | ||
196 | )} | ||
197 | </div> | ||
198 | <ReactTooltip place="right" type="dark" effect="solid" /> | ||
199 | </div> | ||
200 | ); | ||
201 | } | ||
118 | return ( | 202 | return ( |
119 | <div className="settings__main"> | 203 | <div className="settings__main"> |
120 | <div className="settings__header"> | 204 | <div className="settings__header"> |
@@ -123,68 +207,11 @@ export default @injectSheet(styles) @observer class TeamDashboard extends Compon | |||
123 | </span> | 207 | </span> |
124 | </div> | 208 | </div> |
125 | <div className="settings__body"> | 209 | <div className="settings__body"> |
126 | {isLoading && ( | 210 | <h1 className={classes.headline}> |
127 | <Loader /> | 211 | {intl.formatMessage(messages.teamsUnavailible)} |
128 | )} | 212 | </h1> |
129 | 213 | {intl.formatMessage(messages.teamsUnavailibleInfo)} | |
130 | {!isLoading && userInfoRequestFailed && ( | ||
131 | <Infobox | ||
132 | icon="alert" | ||
133 | type="danger" | ||
134 | ctaLabel={intl.formatMessage(messages.tryReloadUserInfoRequest)} | ||
135 | ctaLoading={isLoading} | ||
136 | ctaOnClick={retryUserInfoRequest} | ||
137 | > | ||
138 | {intl.formatMessage(messages.userInfoRequestFailed)} | ||
139 | </Infobox> | ||
140 | )} | ||
141 | |||
142 | {!userInfoRequestFailed && ( | ||
143 | <> | ||
144 | {!isLoading && ( | ||
145 | <> | ||
146 | <> | ||
147 | <h1 className={classnames({ | ||
148 | [classes.headline]: true, | ||
149 | [classes.headlineWithSpacing]: isProUser, | ||
150 | })} | ||
151 | > | ||
152 | {intl.formatMessage(messages.contentHeadline)} | ||
153 | |||
154 | </h1> | ||
155 | {!isProUser && ( | ||
156 | <Badge className={classes.proRequired}>{intl.formatMessage(globalMessages.proRequired)}</Badge> | ||
157 | )} | ||
158 | <div className={classes.container}> | ||
159 | <div className={classes.content}> | ||
160 | <p>{intl.formatMessage(messages.intro)}</p> | ||
161 | <p>{intl.formatMessage(messages.copy)}</p> | ||
162 | </div> | ||
163 | <img className={classes.image} src="https://cdn.franzinfra.com/announcements/assets/teams.png" alt="Franz for Teams" /> | ||
164 | </div> | ||
165 | <div className={classes.buttonContainer}> | ||
166 | {!isProUser ? ( | ||
167 | <UpgradeButton | ||
168 | className={classes.cta} | ||
169 | gaEventInfo={{ category: 'Todos', event: 'upgrade' }} | ||
170 | requiresPro | ||
171 | short | ||
172 | /> | ||
173 | ) : ( | ||
174 | <Button | ||
175 | label={intl.formatMessage(messages.manageButton)} | ||
176 | onClick={openTeamManagement} | ||
177 | className={classes.cta} | ||
178 | /> | ||
179 | )} | ||
180 | </div> | ||
181 | </> | ||
182 | </> | ||
183 | )} | ||
184 | </> | ||
185 | )} | ||
186 | </div> | 214 | </div> |
187 | <ReactTooltip place="right" type="dark" effect="solid" /> | ||
188 | </div> | 215 | </div> |
189 | ); | 216 | ); |
190 | } | 217 | } |