aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/services/content/ServiceView.js
diff options
context:
space:
mode:
authorLibravatar muhamedsalih-tw <104364298+muhamedsalih-tw@users.noreply.github.com>2022-11-19 15:21:09 +0530
committerLibravatar GitHub <noreply@github.com>2022-11-19 09:51:09 +0000
commita051331680b21f20201a47601d69505a4cfa9e40 (patch)
treef98dd4bc668c9814d58c0e49170aeeb19c2fe1de /src/components/services/content/ServiceView.js
parent6.2.1-nightly.46 [skip ci] (diff)
downloadferdium-app-a051331680b21f20201a47601d69505a4cfa9e40.tar.gz
ferdium-app-a051331680b21f20201a47601d69505a4cfa9e40.tar.zst
ferdium-app-a051331680b21f20201a47601d69505a4cfa9e40.zip
Transform service components to ts (#778)
Diffstat (limited to 'src/components/services/content/ServiceView.js')
-rw-r--r--src/components/services/content/ServiceView.js190
1 files changed, 0 insertions, 190 deletions
diff --git a/src/components/services/content/ServiceView.js b/src/components/services/content/ServiceView.js
deleted file mode 100644
index cae16ef49..000000000
--- a/src/components/services/content/ServiceView.js
+++ /dev/null
@@ -1,190 +0,0 @@
1/* eslint-disable react/jsx-no-useless-fragment */
2import { Component } from 'react';
3import PropTypes from 'prop-types';
4import { autorun } from 'mobx';
5import { observer, inject } from 'mobx-react';
6import classnames from 'classnames';
7import TopBarProgress from 'react-topbar-progress-indicator';
8
9import ServiceModel from '../../../models/Service';
10import StatusBarTargetUrl from '../../ui/StatusBarTargetUrl';
11import WebviewLoader from '../../ui/WebviewLoader';
12import WebviewCrashHandler from './WebviewCrashHandler';
13import WebviewErrorHandler from './ErrorHandlers/WebviewErrorHandler';
14import ServiceDisabled from './ServiceDisabled';
15import ServiceWebview from './ServiceWebview';
16import SettingsStore from '../../../stores/SettingsStore';
17import WebControlsScreen from '../../../features/webControls/containers/WebControlsScreen';
18import { CUSTOM_WEBSITE_RECIPE_ID } from '../../../config';
19
20class ServiceView extends Component {
21 static propTypes = {
22 service: PropTypes.instanceOf(ServiceModel).isRequired,
23 setWebviewReference: PropTypes.func.isRequired,
24 detachService: PropTypes.func.isRequired,
25 reload: PropTypes.func.isRequired,
26 edit: PropTypes.func.isRequired,
27 enable: PropTypes.func.isRequired,
28 isActive: PropTypes.bool,
29 stores: PropTypes.shape({
30 settings: PropTypes.instanceOf(SettingsStore).isRequired,
31 }).isRequired,
32 isSpellcheckerEnabled: PropTypes.bool.isRequired,
33 };
34
35 static defaultProps = {
36 isActive: false,
37 };
38
39 state = {
40 forceRepaint: false,
41 targetUrl: '',
42 statusBarVisible: false,
43 };
44
45 hibernationTimer = null;
46
47 autorunDisposer = null;
48
49 forceRepaintTimeout = null;
50
51 componentDidMount() {
52 this.autorunDisposer = autorun(() => {
53 if (this.props.service.isActive) {
54 this.setState({ forceRepaint: true });
55 this.forceRepaintTimeout = setTimeout(() => {
56 this.setState({ forceRepaint: false });
57 }, 100);
58 }
59 });
60 }
61
62 componentWillUnmount() {
63 this.autorunDisposer();
64 clearTimeout(this.forceRepaintTimeout);
65 clearTimeout(this.hibernationTimer);
66 }
67
68 render() {
69 const {
70 detachService,
71 service,
72 setWebviewReference,
73 reload,
74 edit,
75 enable,
76 stores,
77 isSpellcheckerEnabled,
78 } = this.props;
79
80 const { navigationBarBehaviour, navigationBarManualActive } =
81 stores.settings.app;
82
83 const showNavBar =
84 navigationBarBehaviour === 'always' ||
85 (navigationBarBehaviour === 'custom' &&
86 service.recipe.id === CUSTOM_WEBSITE_RECIPE_ID) ||
87 navigationBarManualActive;
88
89 const webviewClasses = classnames({
90 services__webview: true,
91 'services__webview-wrapper': true,
92 'is-active': service.isActive,
93 'services__webview--force-repaint': this.state.forceRepaint,
94 });
95
96 let statusBar = null;
97 if (this.state.statusBarVisible) {
98 statusBar = <StatusBarTargetUrl text={this.state.targetUrl} />;
99 }
100
101 return (
102 <div
103 className={webviewClasses}
104 data-name={service.name}
105 style={{ order: service.order }}
106 >
107 {service.isActive && service.isEnabled && (
108 <>
109 {service.hasCrashed && (
110 <WebviewCrashHandler
111 name={service.recipe.name}
112 webview={service.webview}
113 reload={reload}
114 />
115 )}
116 {service.isEnabled &&
117 service.isLoading &&
118 service.isFirstLoad &&
119 !service.isHibernating &&
120 !service.isServiceAccessRestricted && (
121 <WebviewLoader loaded={false} name={service.name} />
122 )}
123 {service.isProgressbarEnabled &&
124 service.isLoadingPage &&
125 !service.isFirstLoad && <TopBarProgress />}
126 {service.isError && (
127 <WebviewErrorHandler
128 name={service.recipe.name}
129 errorMessage={service.errorMessage}
130 reload={reload}
131 edit={edit}
132 />
133 )}
134 </>
135 )}
136 {!service.isEnabled ? (
137 <>
138 {service.isActive && (
139 <ServiceDisabled
140 name={service.name !== '' ? service.name : service.recipe.name}
141 webview={service.webview}
142 enable={enable}
143 />
144 )}
145 </>
146 ) : (
147 <>
148 {!service.isHibernating ? (
149 <>
150 {showNavBar && <WebControlsScreen service={service} />}
151 <ServiceWebview
152 service={service}
153 setWebviewReference={setWebviewReference}
154 detachService={detachService}
155 isSpellcheckerEnabled={isSpellcheckerEnabled}
156 />
157 </>
158 ) : (
159 <div
160 style={{
161 display: 'flex',
162 flexDirection: 'column',
163 justifyContent: 'center',
164 alignItems: 'center',
165 textAlign: 'center',
166 }}
167 >
168 <span
169 role="img"
170 aria-label="Sleeping Emoji"
171 style={{ fontSize: 42 }}
172 >
173 😴
174 </span>
175 <br />
176 <br />
177 This service is currently hibernating.
178 <br />
179 Try switching services or reloading Ferdium.
180 </div>
181 )}
182 </>
183 )}
184 {statusBar}
185 </div>
186 );
187 }
188}
189
190export default inject('stores', 'actions')(observer(ServiceView));