git.iko.soy/bridge
on master help sign in
Merge pull request #446 from urbit/lf/login-single-click

One click login

commit9277c41e7c910335bedd4f07ee34eff6dd5c4264 authorFang <git@fang.io> dateTue 7 Apr 2020, 16:34 (7 years ago) parentff5f05e51e7d9d
3 files changed+121−15
compare with master
unifiedsplit
src/components/LoginButton.js+27 src/lib/useLocaHosting.js+51 src/views/UrbitOS/Home.js+43−15
src/components/LoginButton.jsnew file+27
@@ -0,0 +1,27 @@
1+import React, { useRef } from 'react';
2+import { Button } from 'indigo-react';
3+
4+export default function LoginButton({ url, className, code, ...rest }) {
5+ const formEl = useRef(null);
6+ return (
7+ <form
8+ style={{ display: 'contents' }}
9+ action={url}
10+ method="POST"
11+ target="_blank"
12+ ref={formEl}>
13+ <input name="password" value={code} type="hidden" />
14+ <input name="redirect" value="/" type="hidden" />
15+ <Button
16+ type="submit"
17+ accessory="↗"
18+ solid
19+ success
20+ className={className}
21+ onClick={() => formEl.current.submit()}
22+ {...rest}>
23+ Open OS
24+ </Button>
25+ </form>
26+ );
27+}
src/lib/useLocaHosting.jsnew file+51
@@ -0,0 +1,51 @@
1+import { useState, useEffect, useMemo } from 'react';
2+import { Just } from 'folktale/maybe';
3+import * as ob from 'urbit-ob';
4+
5+import { usePointCursor } from 'store/pointCursor';
6+
7+const DOMAIN = 'arvo.network';
8+
9+const STATE = {
10+ UNKNOWN: 'UNKNOWN',
11+ MISSING: 'MISSING',
12+ RUNNING: 'RUNNING',
13+};
14+
15+export default function useLocalHosting() {
16+ const [status, setStatus] = useState(STATE.UNKNOWN);
17+
18+ const { pointCursor } = usePointCursor();
19+
20+ useEffect(() => {
21+ const updateStatus = async point => {
22+ const patp = ob.patp(point).slice(1);
23+ try {
24+ const { who } = await fetch(`https://${patp}.${DOMAIN}/who.json`).then(
25+ r => r.json()
26+ );
27+ if (who === patp) {
28+ setStatus(STATE.RUNNING);
29+ } else {
30+ setStatus(STATE.MISSING);
31+ }
32+ } catch (e) {
33+ setStatus(STATE.MISSING);
34+ }
35+ };
36+ if (Just.hasInstance(pointCursor)) {
37+ updateStatus(pointCursor.value);
38+ }
39+ }, [pointCursor]);
40+
41+ const url = useMemo(
42+ () =>
43+ pointCursor.value &&
44+ `https://${ob.patp(pointCursor.value).slice(1)}.${DOMAIN}`,
45+ [pointCursor]
46+ );
47+
48+ const running = useMemo(() => status === STATE.RUNNING, [status]);
49+
50+ return { running, url };
51+}
src/views/UrbitOS/Home.js+43−15
@@ -1,4 +1,4 @@
1−import React, { useCallback, useState, useEffect } from 'react';
1+import React, { useCallback, useState, useEffect, useMemo } from 'react';
22import cn from 'classnames';
33import { Grid, Button, SelectInput, Flex } from 'indigo-react';
44import * as ob from 'urbit-ob';
@@ -15,12 +15,14 @@ import { OutButton, ForwardButton } from 'components/Buttons';
1515import { CopyButtonWide } from 'components/CopyButton';
1616import NetworkingKeys from 'components/NetworkingKeys';
1717import ProgressButton from 'components/ProgressButton';
18+import LoginButton from 'components/LoginButton';
1819
1920import BridgeForm from 'form/BridgeForm';
2021import { useLocalRouter } from 'lib/LocalRouter';
2122import { useHosting } from 'store/hosting';
2223import DownloadKeyfileButton from 'components/DownloadKeyfileButton';
2324import useLifecycle from 'lib/useLifecycle';
25+import useLocalHosting from 'lib/useLocaHosting';
2426
2527export default function UrbitOSHome({ manualNetworkSeed }) {
2628 const { pointCursor } = usePointCursor();
@@ -103,6 +105,13 @@ function Hosting({ manualNetworkSeed }) {
103105 disabled,
104106 } = ship;
105107
108+ const { running: localRunning, url: localUrl } = useLocalHosting();
109+
110+ let running = useMemo(() => localRunning || ship.running, [
111+ ship,
112+ localRunning,
113+ ]);
114+
106115 useLifecycle(() => {
107116 syncStatus();
108117 });
@@ -113,10 +122,29 @@ function Hosting({ manualNetworkSeed }) {
113122 const options = [{ text: 'Tlon', value: 'tlon' }];
114123
115124 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+ }
116138 if (ship.running) {
117139 return (
118140 <>
119− <Grid.Item cols={[1, 9]} as={OutButton} solid success href={url}>
141+ <Grid.Item
142+ cols={[1, 9]}
143+ as={LoginButton}
144+ solid
145+ success
146+ url={url}
147+ code={code}>
120148 Open OS
121149 </Grid.Item>
122150 {/* Unsupported for now */}
@@ -151,6 +179,7 @@ function Hosting({ manualNetworkSeed }) {
151179 );
152180 }
153181 }, [
182+ localRunning,
154183 ship.missing,
155184 ship.running,
156185 ship.pending,
@@ -195,11 +224,8 @@ function Hosting({ manualNetworkSeed }) {
195224 <Grid.Item full className="f5" as={Flex}>
196225 <Flex.Item>Urbit OS </Flex.Item>
197226 <Flex.Item
198− className={cn(
199− { green3: ship.running, gray4: !ship.running },
200− 'ml3'
201− )}>
202− {ship.running ? 'Connected' : 'Disconnected'}
227+ className={cn({ green3: running, gray4: !running }, 'ml3')}>
228+ {running ? 'Connected' : 'Disconnected'}
203229 </Flex.Item>
204230 </Grid.Item>
205231 <BridgeForm initialValues={{ provider: 'tlon' }}>
@@ -207,14 +233,16 @@ function Hosting({ manualNetworkSeed }) {
207233 <>
208234 {renderDetails()}
209235 {renderMain()}
210− <Grid.Item
211− full
212− as={SelectInput}
213− name="provider"
214− label="Host Provider"
215− options={options}
216− disabled
217− />
236+ {!localRunning && (
237+ <Grid.Item
238+ full
239+ as={SelectInput}
240+ name="provider"
241+ label="Host Provider"
242+ options={options}
243+ disabled
244+ />
245+ )}
218246 </>
219247 )}
220248 </BridgeForm>