@@ -1,28 +1,17 @@
1−import React, { useCallback, useState, useEffect, useMemo } from 'react';
2−import cn from 'classnames';
3−import { Grid, Button, SelectInput, Flex } from 'indigo-react';
1+import React, { useCallback, useState } from 'react';
2+import { Grid } from 'indigo-react';
43import * as ob from 'urbit-ob';
54import { azimuth } from 'azimuth-js';
65
76import { usePointCursor } from 'store/pointCursor';
87import { usePointCache } from 'store/pointCache';
98
10−import useCurrentPointName from 'lib/useCurrentPointName';
11−import useKeyfileGenerator from 'lib/useKeyfileGenerator';
129import * as need from 'lib/need';
1310
14−import { OutButton, ForwardButton } from 'components/Buttons';
15−import { CopyButtonWide } from 'components/CopyButton';
11+import { ForwardButton } from 'components/Buttons';
1612import NetworkingKeys from 'components/NetworkingKeys';
17−import ProgressButton from 'components/ProgressButton';
18−import LoginButton from 'components/LoginButton';
1913
20−import BridgeForm from 'form/BridgeForm';
2114import { useLocalRouter } from 'lib/LocalRouter';
22−import { useHosting } from 'store/hosting';
23−import DownloadKeyfileButton from 'components/DownloadKeyfileButton';
24−import useLifecycle from 'lib/useLifecycle';
25−import useLocalHosting from 'lib/useLocalHosting';
2615
2716export default function UrbitOSHome({ manualNetworkSeed }) {
2817 const { pointCursor } = usePointCursor();
@@ -51,8 +40,6 @@ export default function UrbitOSHome({ manualNetworkSeed }) {
5140 ]);
5241 return (
5342 <>
54− <Hosting manualNetworkSeed={manualNetworkSeed} />
55−
5643 <Grid>
5744 <Grid.Item full className="mv7 f5">
5845 Network
@@ -89,182 +76,3 @@ export default function UrbitOSHome({ manualNetworkSeed }) {
8976 </>
9077 );
9178}
92−
93−// eslint-disable-next-line
94−function Hosting({ manualNetworkSeed }) {
95− const bind = useKeyfileGenerator(manualNetworkSeed);
96− const { keyfile, code } = bind;
97− const ship = useHosting();
98−
99− const {
100− syncStatus,
101− url,
102− unknown,
103− bootProgress,
104− bootMessage,
105− disabled,
106− } = ship;
107−
108− const { running: localRunning, url: localUrl } = useLocalHosting();
109−
110− let running = useMemo(() => localRunning || ship.running, [
111− ship,
112− localRunning,
113− ]);
114−
115− useLifecycle(() => {
116− syncStatus();
117− });
118−
119− const createShip = useCallback(() => ship.create(keyfile), [keyfile, ship]);
120−
121− const name = useCurrentPointName();
122− const options = [{ text: 'Tlon', value: 'tlon' }];
123−
124− const renderMain = useCallback(() => {
125− if (localRunning) {
126− return (
127− <Grid.Item
128− full
129− as={LoginButton}
130− solid
131− success
132− url={localUrl}
133− code={code}>
134− Open OS
135− </Grid.Item>
136− );
137− }
138− if (ship.running) {
139− return (
140− <>
141− <Grid.Item
142− cols={[1, 9]}
143− as={LoginButton}
144− solid
145− success
146− url={url}
147− code={code}>
148− Open OS
149− </Grid.Item>
150− {/* Unsupported for now */}
151− {/* <Grid.Item cols={[9, 13]} as={Button} className="b-black b1" center> */}
152− {/* Disconnect */}
153− {/* </Grid.Item> */}
154− </>
155− );
156− }
157− if (ship.missing) {
158− return (
159− <Grid.Item
160− full
161− as={ForwardButton}
162− solid
163− disabled={!keyfile}
164− onClick={createShip}>
165− Connect
166− </Grid.Item>
167− );
168− }
169− if (ship.pending) {
170− return (
171− <Grid.Item
172− full
173− as={ProgressButton}
174− success
175− disabled
176− progress={bootProgress}>
177− {bootMessage || 'Connecting'}
178− </Grid.Item>
179− );
180− }
181− }, [
182− localRunning,
183− ship.running,
184− ship.missing,
185− ship.pending,
186− localUrl,
187− code,
188− url,
189− keyfile,
190− createShip,
191− bootProgress,
192− bootMessage,
193− ]);
194−
195− const renderDetails = useCallback(() => {
196− if (ship.running) {
197− return (
198− <>
199− <Grid.Item cols={[1, 9]} className="gray4">
200− <span className="mono">{name}</span> is connected to Tlon
201− </Grid.Item>
202− </>
203− );
204− }
205− if (!keyfile && ship.missing) {
206− return (
207− <Grid.Item full className="gray4">
208− Please reset your networking keys in order to use hosting
209− </Grid.Item>
210− );
211− }
212− }, [name, ship, keyfile]);
213−
214− return (
215− <>
216− {disabled && (
217− <Grid gap={4}>
218− <Grid.Item full className="f5">
219− Urbit OS
220− </Grid.Item>
221− <Grid.Divider />
222− </Grid>
223− )}
224− {!disabled && (
225− <Grid gap={4}>
226− <Grid.Item full className="f5" as={Flex}>
227− <Flex.Item>Urbit OS </Flex.Item>
228− <Flex.Item
229− className={cn({ green3: running, gray4: !running }, 'ml3')}>
230− {running ? 'Connected' : 'Disconnected'}
231− </Flex.Item>
232− </Grid.Item>
233− <BridgeForm initialValues={{ provider: 'tlon' }}>
234− {() => (
235− <>
236− {renderDetails()}
237− {renderMain()}
238− {!localRunning && (
239− <Grid.Item
240− full
241− as={SelectInput}
242− name="provider"
243− label="Host Provider"
244− options={options}
245− disabled
246− />
247− )}
248− </>
249− )}
250− </BridgeForm>
251− </Grid>
252− )}
253− <Grid>
254− <Grid.Item
255− full
256− as={DownloadKeyfileButton}
257− {...bind}
258− className="mt2"
259− detail="A keyfile authenticates your Urbit ID to Urbit OS"
260− />
261− <Grid.Divider />
262− {code && (
263− <Grid.Item full className="mt2" as={CopyButtonWide} text={code}>
264− Login Code
265− </Grid.Item>
266− )}
267− </Grid>
268− </>
269− );
270−}