diff options
author | Stefan Malzner <stefan@adlk.io> | 2017-10-13 12:29:40 +0200 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2017-10-13 12:29:40 +0200 |
commit | 58cda9cc7fb79ca9df6746de7f9662bc08dc156a (patch) | |
tree | 1211600c2a5d3b5f81c435c6896618111a611720 /src/components/services/content/Services.js | |
download | ferdium-app-58cda9cc7fb79ca9df6746de7f9662bc08dc156a.tar.gz ferdium-app-58cda9cc7fb79ca9df6746de7f9662bc08dc156a.tar.zst ferdium-app-58cda9cc7fb79ca9df6746de7f9662bc08dc156a.zip |
initial commit
Diffstat (limited to 'src/components/services/content/Services.js')
-rw-r--r-- | src/components/services/content/Services.js | 81 |
1 files changed, 81 insertions, 0 deletions
diff --git a/src/components/services/content/Services.js b/src/components/services/content/Services.js new file mode 100644 index 000000000..03c68b06f --- /dev/null +++ b/src/components/services/content/Services.js | |||
@@ -0,0 +1,81 @@ | |||
1 | import React, { Component } from 'react'; | ||
2 | import PropTypes from 'prop-types'; | ||
3 | import { observer, PropTypes as MobxPropTypes } from 'mobx-react'; | ||
4 | import { Link } from 'react-router'; | ||
5 | import { defineMessages, intlShape } from 'react-intl'; | ||
6 | |||
7 | import Webview from './ServiceWebview'; | ||
8 | import Appear from '../../ui/effects/Appear'; | ||
9 | |||
10 | const messages = defineMessages({ | ||
11 | welcome: { | ||
12 | id: 'services.welcome', | ||
13 | defaultMessage: '!!!Welcome to Franz', | ||
14 | }, | ||
15 | getStarted: { | ||
16 | id: 'services.getStarted', | ||
17 | defaultMessage: '!!!Get started', | ||
18 | }, | ||
19 | }); | ||
20 | |||
21 | @observer | ||
22 | export default class Services extends Component { | ||
23 | static propTypes = { | ||
24 | services: MobxPropTypes.arrayOrObservableArray.isRequired, | ||
25 | setWebviewReference: PropTypes.func.isRequired, | ||
26 | handleIPCMessage: PropTypes.func.isRequired, | ||
27 | openWindow: PropTypes.func.isRequired, | ||
28 | }; | ||
29 | |||
30 | static defaultProps = { | ||
31 | services: [], | ||
32 | activeService: '', | ||
33 | }; | ||
34 | |||
35 | static contextTypes = { | ||
36 | intl: intlShape, | ||
37 | }; | ||
38 | |||
39 | render() { | ||
40 | const { | ||
41 | services, | ||
42 | handleIPCMessage, | ||
43 | setWebviewReference, | ||
44 | openWindow, | ||
45 | } = this.props; | ||
46 | const { intl } = this.context; | ||
47 | |||
48 | return ( | ||
49 | <div className="services"> | ||
50 | {services.length === 0 && ( | ||
51 | <Appear | ||
52 | timeout={1500} | ||
53 | transitionName="slideUp" | ||
54 | > | ||
55 | <div className="services__no-service"> | ||
56 | <img src="./assets/images/logo.svg" alt="" /> | ||
57 | <h1>{intl.formatMessage(messages.welcome)}</h1> | ||
58 | <Appear | ||
59 | timeout={300} | ||
60 | transitionName="slideUp" | ||
61 | > | ||
62 | <Link to="/settings/recipes" className="button"> | ||
63 | {intl.formatMessage(messages.getStarted)} | ||
64 | </Link> | ||
65 | </Appear> | ||
66 | </div> | ||
67 | </Appear> | ||
68 | )} | ||
69 | {services.map(service => ( | ||
70 | <Webview | ||
71 | key={service.id} | ||
72 | service={service} | ||
73 | handleIPCMessage={handleIPCMessage} | ||
74 | setWebviewReference={setWebviewReference} | ||
75 | openWindow={openWindow} | ||
76 | /> | ||
77 | ))} | ||
78 | </div> | ||
79 | ); | ||
80 | } | ||
81 | } | ||