aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/layout/AppLayout.js
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/layout/AppLayout.js')
-rw-r--r--src/components/layout/AppLayout.js99
1 files changed, 53 insertions, 46 deletions
diff --git a/src/components/layout/AppLayout.js b/src/components/layout/AppLayout.js
index ebb9849ea..5edf96523 100644
--- a/src/components/layout/AppLayout.js
+++ b/src/components/layout/AppLayout.js
@@ -1,22 +1,21 @@
1import React, { Component } from 'react'; 1import React, { Component } from "react";
2import PropTypes from 'prop-types'; 2import PropTypes from "prop-types";
3import { observer, PropTypes as MobxPropTypes } from 'mobx-react'; 3import { observer, PropTypes as MobxPropTypes } from "mobx-react";
4import { defineMessages, intlShape } from 'react-intl'; 4import { defineMessages, intlShape } from "react-intl";
5import { TitleBar } from 'electron-react-titlebar'; 5import { TitleBar } from "electron-react-titlebar";
6import injectSheet from 'react-jss'; 6import injectSheet from "react-jss";
7 7
8import InfoBar from '../ui/InfoBar'; 8import InfoBar from "../ui/InfoBar";
9import { Component as DelayApp } from '../../features/delayApp'; 9import { Component as BasicAuth } from "../../features/basicAuth";
10import { Component as BasicAuth } from '../../features/basicAuth'; 10import { Component as ShareFranz } from "../../features/shareFranz";
11import { Component as ShareFranz } from '../../features/shareFranz'; 11import ErrorBoundary from "../util/ErrorBoundary";
12import ErrorBoundary from '../util/ErrorBoundary';
13 12
14// import globalMessages from '../../i18n/globalMessages'; 13// import globalMessages from '../../i18n/globalMessages';
15 14
16import { isWindows } from '../../environment'; 15import { isWindows } from "../../environment";
17import WorkspaceSwitchingIndicator from '../../features/workspaces/components/WorkspaceSwitchingIndicator'; 16import WorkspaceSwitchingIndicator from "../../features/workspaces/components/WorkspaceSwitchingIndicator";
18import { workspaceStore } from '../../features/workspaces'; 17import { workspaceStore } from "../../features/workspaces";
19import AppUpdateInfoBar from '../AppUpdateInfoBar'; 18import AppUpdateInfoBar from "../AppUpdateInfoBar";
20 19
21function createMarkup(HTMLString) { 20function createMarkup(HTMLString) {
22 return { __html: HTMLString }; 21 return { __html: HTMLString };
@@ -24,30 +23,33 @@ function createMarkup(HTMLString) {
24 23
25const messages = defineMessages({ 24const messages = defineMessages({
26 servicesUpdated: { 25 servicesUpdated: {
27 id: 'infobar.servicesUpdated', 26 id: "infobar.servicesUpdated",
28 defaultMessage: '!!!Your services have been updated.', 27 defaultMessage: "!!!Your services have been updated."
29 }, 28 },
30 buttonReloadServices: { 29 buttonReloadServices: {
31 id: 'infobar.buttonReloadServices', 30 id: "infobar.buttonReloadServices",
32 defaultMessage: '!!!Reload services', 31 defaultMessage: "!!!Reload services"
33 }, 32 },
34 requiredRequestsFailed: { 33 requiredRequestsFailed: {
35 id: 'infobar.requiredRequestsFailed', 34 id: "infobar.requiredRequestsFailed",
36 defaultMessage: '!!!Could not load services and user information', 35 defaultMessage: "!!!Could not load services and user information"
37 }, 36 }
38}); 37});
39 38
40const styles = theme => ({ 39const styles = theme => ({
41 appContent: { 40 appContent: {
42 width: `calc(100% + ${theme.workspaces.drawer.width}px)`, 41 width: `calc(100% + ${theme.workspaces.drawer.width}px)`,
43 transition: 'transform 0.5s ease', 42 transition: "transform 0.5s ease",
44 transform() { 43 transform() {
45 return workspaceStore.isWorkspaceDrawerOpen ? 'translateX(0)' : `translateX(-${theme.workspaces.drawer.width}px)`; 44 return workspaceStore.isWorkspaceDrawerOpen
46 }, 45 ? "translateX(0)"
47 }, 46 : `translateX(-${theme.workspaces.drawer.width}px)`;
47 }
48 }
48}); 49});
49 50
50@injectSheet(styles) @observer 51@injectSheet(styles)
52@observer
51class AppLayout extends Component { 53class AppLayout extends Component {
52 static propTypes = { 54 static propTypes = {
53 classes: PropTypes.object.isRequired, 55 classes: PropTypes.object.isRequired,
@@ -67,17 +69,16 @@ class AppLayout extends Component {
67 showRequiredRequestsError: PropTypes.bool.isRequired, 69 showRequiredRequestsError: PropTypes.bool.isRequired,
68 areRequiredRequestsSuccessful: PropTypes.bool.isRequired, 70 areRequiredRequestsSuccessful: PropTypes.bool.isRequired,
69 retryRequiredRequests: PropTypes.func.isRequired, 71 retryRequiredRequests: PropTypes.func.isRequired,
70 areRequiredRequestsLoading: PropTypes.bool.isRequired, 72 areRequiredRequestsLoading: PropTypes.bool.isRequired
71 isDelayAppScreenVisible: PropTypes.bool.isRequired,
72 }; 73 };
73 74
74 static defaultProps = { 75 static defaultProps = {
75 children: [], 76 children: [],
76 nextAppReleaseVersion: null, 77 nextAppReleaseVersion: null
77 }; 78 };
78 79
79 static contextTypes = { 80 static contextTypes = {
80 intl: intlShape, 81 intl: intlShape
81 }; 82 };
82 83
83 render() { 84 render() {
@@ -99,8 +100,7 @@ class AppLayout extends Component {
99 showRequiredRequestsError, 100 showRequiredRequestsError,
100 areRequiredRequestsSuccessful, 101 areRequiredRequestsSuccessful,
101 retryRequiredRequests, 102 retryRequiredRequests,
102 areRequiredRequestsLoading, 103 areRequiredRequestsLoading
103 isDelayAppScreenVisible,
104 } = this.props; 104 } = this.props;
105 105
106 const { intl } = this.context; 106 const { intl } = this.context;
@@ -108,23 +108,31 @@ class AppLayout extends Component {
108 return ( 108 return (
109 <ErrorBoundary> 109 <ErrorBoundary>
110 <div className="app"> 110 <div className="app">
111 {isWindows && !isFullScreen && <TitleBar menu={window.franz.menu.template} icon="assets/images/logo.svg" />} 111 {isWindows && !isFullScreen && (
112 <TitleBar
113 menu={window.franz.menu.template}
114 icon="assets/images/logo.svg"
115 />
116 )}
112 <div className={`app__content ${classes.appContent}`}> 117 <div className={`app__content ${classes.appContent}`}>
113 {workspacesDrawer} 118 {workspacesDrawer}
114 {sidebar} 119 {sidebar}
115 <div className="app__service"> 120 <div className="app__service">
116 <WorkspaceSwitchingIndicator /> 121 <WorkspaceSwitchingIndicator />
117 {news.length > 0 && news.map(item => ( 122 {news.length > 0 &&
118 <InfoBar 123 news.map(item => (
119 key={item.id} 124 <InfoBar
120 position="top" 125 key={item.id}
121 type={item.type} 126 position="top"
122 sticky={item.sticky} 127 type={item.type}
123 onHide={() => removeNewsItem({ newsId: item.id })} 128 sticky={item.sticky}
124 > 129 onHide={() => removeNewsItem({ newsId: item.id })}
125 <span dangerouslySetInnerHTML={createMarkup(item.message)} /> 130 >
126 </InfoBar> 131 <span
127 ))} 132 dangerouslySetInnerHTML={createMarkup(item.message)}
133 />
134 </InfoBar>
135 ))}
128 {/* {!isOnline && ( 136 {/* {!isOnline && (
129 <InfoBar 137 <InfoBar
130 type="danger" 138 type="danger"
@@ -163,7 +171,6 @@ class AppLayout extends Component {
163 onInstallUpdate={installAppUpdate} 171 onInstallUpdate={installAppUpdate}
164 /> 172 />
165 )} 173 )}
166 {isDelayAppScreenVisible && (<DelayApp />)}
167 <BasicAuth /> 174 <BasicAuth />
168 <ShareFranz /> 175 <ShareFranz />
169 {services} 176 {services}