on master help sign in
Merge pull request #522 from urbit/m/flow-selection
f3b6250fang
src/lib/flowCommand.jsnew file+46
@@ -0,0 +1,46 @@
1+import ob from 'urbit-ob';
2+
3+import { ensurePatFormat } from 'form/formatters';
4+
5+// looks into the GET parameters and attempts to construct a "flow" object,
6+// which would indicate bridge is to be used for one specific flow.
7+// expects to find any of the following sets of parameters, varying by kind.
8+//
9+// ? kind = invite
10+// & as = ~ship // who to send the invite as
11+// & ship = ~ship // what planet to send as the invite
12+// & email = ex@amp.le // email to send the invite code to
13+//
14+
15+const COMMANDS = {
16+ //
17+};
18+
19+const useFlowCommand = () => {
20+ let flow = {};
21+ window.location.search
22+ .substr(1)
23+ .split('&')
24+ .forEach(arg => {
25+ if ('' === arg) return;
26+ const pam = arg.split('=');
27+ flow[pam[0]] = pam.length <= 1 ? true : decodeURIComponent(pam[1]);
28+ });
29+
30+ if (typeof flow === 'object') {
31+ switch (flow.kind) {
32+ default:
33+ console.log('unrecognized kind of flow:', flow.kind);
34+ // eslint-disable-next-line no-fallthrough
35+ case undefined:
36+ flow = null;
37+ break;
38+ }
39+ } else {
40+ flow = null;
41+ }
42+
43+ return flow;
44+};
45+
46+export { COMMANDS, useFlowCommand };
src/lib/useInviter.js+1
@@ -61,6 +61,7 @@ const useInviter = () => {
61 setTxStatus(STATUS.INPUT);
61 setTxStatus(STATUS.INPUT);
62 }, [setProgress, setInvites, setTxStatus]);
62 }, [setProgress, setInvites, setTxStatus]);
63
63
64+ //TODO split this out into smaller callbacks within useInviter
64 const generateInvites = useCallback(
65 const generateInvites = useCallback(
65 async numInvites => {
66 async numInvites => {
66 const _contracts = contracts.getOrElse(null);
67 const _contracts = contracts.getOrElse(null);
src/views/Login.js+35−8
@@ -5,8 +5,10 @@ import { version } from '../../package.json';
5
5
6import { useHistory } from 'store/history';
6import { useHistory } from 'store/history';
7import { useWallet } from 'store/wallet';
7import { useWallet } from 'store/wallet';
8+import { usePointCursor } from 'store/pointCursor';
8
9
9import { WALLET_TYPES } from 'lib/wallet';
10import { WALLET_TYPES } from 'lib/wallet';
11+import { COMMANDS, useFlowCommand } from 'lib/flowCommand';
10
12
11import View from 'components/View';
13import View from 'components/View';
12import Tabs from 'components/Tabs';
14import Tabs from 'components/Tabs';
@@ -43,6 +45,8 @@ export default function Login() {
43 // globals
45 // globals
44 const { pop, push, names } = useHistory();
46 const { pop, push, names } = useHistory();
45 const { walletType } = useWallet();
47 const { walletType } = useWallet();
48+ const { setPointCursor } = usePointCursor();
49+ const flow = useFlowCommand();
46
50
47 // inputs
51 // inputs
48 const [isOther, setisOther] = useState(false);
52 const [isOther, setisOther] = useState(false);
@@ -53,8 +57,22 @@ export default function Login() {
53 ]);
57 ]);
54
58
55 const goHome = useCallback(() => {
59 const goHome = useCallback(() => {
60+ if (!flow) {
56− push(names.POINTS);
61+ push(names.POINTS);
62+ } else {
63+ switch (flow.kind) {
64+ default:
65+ throw new Error('unimplemented flow ' + flow.kind);
66+ }
67+ }
57− }, [push, names]);
68+ }, [flow, push, names]);
69+
70+ const flowDescription = command => {
71+ switch (command.kind) {
72+ default:
73+ return <>Flow: {command.kind}</>;
74+ }
75+ };
58
76
59 return (
77 return (
60 <View inset>
78 <View inset>
@@ -65,8 +83,12 @@ export default function Login() {
65 </Grid.Item>
83 </Grid.Item>
66 <Grid.Item as={Text}>Login</Grid.Item>
84 <Grid.Item as={Text}>Login</Grid.Item>
67 </Grid.Item>
85 </Grid.Item>
68− {isOther && <Grid.Item full as={Other} goHome={goHome} />}
86+ {flow && (
87+ <Grid.Item full as={Text} className="t-center mb4">
88+ {flowDescription(flow)}
89+ </Grid.Item>
90+ )}
69− {!isOther && <Grid.Item full as={Ticket} goHome={goHome} />}
91+ <Grid.Item full as={isOther ? Other : Ticket} goHome={goHome} />
70 {!isOther && (
92 {!isOther && (
71 <>
93 <>
72 <Grid.Item full className="t-center mv4 gray4">
94 <Grid.Item full className="t-center mv4 gray4">
@@ -80,10 +102,15 @@ export default function Login() {
80 onClick={() => setisOther(true)}>
102 onClick={() => setisOther(true)}>
81 Metamask, Mnemonic, Hardware Wallet...
103 Metamask, Mnemonic, Hardware Wallet...
82 </Grid.Item>
104 </Grid.Item>
105+ {!flow && (
106+ <Grid.Item
107+ full
108+ onClick={goToActivate}
83− <Grid.Item full onClick={goToActivate} className="mv10 t-center f6">
109+ className="mv10 t-center f6">
84− <span className="gray4">New Urbit ID? </span>
110+ <span className="gray4">New Urbit ID? </span>
85− <LinkButton>Activate</LinkButton>
111+ <LinkButton>Activate</LinkButton>
86− </Grid.Item>
112+ </Grid.Item>
113+ )}
87 </>
114 </>
88 )}
115 )}
89 {isOther && (
116 {isOther && (