git.iko.soy/bridge
on master help sign in
Merge pull request #992 from urbit/hm/fix-shard-login
dd11cb5Hunter Miller
src/components/L2/Headers/AdvancedOptions.tsx+17
compare with master
unifiedsplit
@@ -1,6 +1,7 @@
1import React, { useState } from 'react';
1import React, { useState } from 'react';
2import { Text, Box, Checkbox, Icon, Row } from '@tlon/indigo-react';
2import { Text, Box, Checkbox, Icon, Row } from '@tlon/indigo-react';
3import './AdvancedOptions.scss';
3import './AdvancedOptions.scss';
4+import styled from 'styled-components';
4
5
5interface AdvancedOptionsProps {
6interface AdvancedOptionsProps {
6 options: {
7 options: {
@@ -11,6 +12,15 @@ interface AdvancedOptionsProps {
11 }[];
12 }[];
12}
13}
13
14
15+// Hide this input completely
16+const HiddenInput = styled.input`
17+ position: absolute;
18+ opacity: 0;
19+ height: 0;
20+ width: 0;
21+ margin: 0px;
22+`;
23+
14export default function AdvancedOptions({ options }: AdvancedOptionsProps) {
24export default function AdvancedOptions({ options }: AdvancedOptionsProps) {
15 const showingAny = options.reduce(
25 const showingAny = options.reduce(
16 (anySelected, { selected }) => anySelected || selected,
26 (anySelected, { selected }) => anySelected || selected,
@@ -33,6 +43,13 @@ export default function AdvancedOptions({ options }: AdvancedOptionsProps) {
33 <Box className="options">
43 <Box className="options">
34 {options.map((option, ind) => (
44 {options.map((option, ind) => (
35 <Row className="option" key={`adv-opt-${ind}`}>
45 <Row className="option" key={`adv-opt-${ind}`}>
46+ <HiddenInput
47+ checked={option.selected}
48+ name={option.key}
49+ id={option.key}
50+ type="checkbox"
51+ readOnly
52+ />
36 <Checkbox
53 <Checkbox
37 className={`checkbox ${option.selected ? 'checked' : ''}`}
54 className={`checkbox ${option.selected ? 'checked' : ''}`}
38 {...option}
55 {...option}
src/views/Login/Ticket.tsx+34−36
@@ -17,7 +17,6 @@ import { timeout } from 'lib/timeout';
17import useRoller from 'lib/useRoller';
17import useRoller from 'lib/useRoller';
18
18
19import BridgeForm from 'form/BridgeForm';
19import BridgeForm from 'form/BridgeForm';
20−import Condition from 'form/Condition';
21import { TicketInput, PassphraseInput, PointInput } from 'form/Inputs';
20import { TicketInput, PassphraseInput, PointInput } from 'form/Inputs';
22import {
21import {
23 composeValidator,
22 composeValidator,
@@ -53,35 +52,38 @@ export default function Ticket({ className, goHome }: TicketProps) {
53 const [usePassphrase, setUsePassphrase] = useState(false);
52 const [usePassphrase, setUsePassphrase] = useState(false);
54 const [useShards, setUseShards] = useState(false);
53 const [useShards, setUseShards] = useState(false);
55
54
56− const validateForm = useCallback((values, errors) => {
55+ const validateForm = useCallback(
56+ (values, errors) => {
57− didWarn.current = false;
57+ didWarn.current = false;
58
58
59− if (errors.point) {
59+ if (errors.point) {
60− return errors;
61− }
62−
63− if (values.useShards) {
64− if (errors.shard1 || errors.shard2 || errors.shard3) {
65− return errors;
66− }
67− const empty = ['shard1', 'shard2', 'shard3'].filter(s => !values[s]);
68− if (empty.length > 1) {
69− let errors: Record<string, string> = {};
70− empty.forEach(s => {
71− errors[s] = 'Please provide at least two out of three shards.';
72− });
73 return errors;
60 return errors;
74 }
61 }
62+
63+ if (useShards) {
64+ if (errors.shard1 || errors.shard2 || errors.shard3) {
65+ return errors;
66+ }
67+ const empty = ['shard1', 'shard2', 'shard3'].filter(s => !values[s]);
68+ if (empty.length > 1) {
69+ let errors: Record<string, string> = {};
70+ empty.forEach(s => {
71+ errors[s] = 'Please provide at least two out of three shards.';
72+ });
73+ return errors;
74+ }
75− } else {
75+ } else {
76− if (errors.ticket) {
76+ if (errors.ticket) {
77− return errors;
77+ return errors;
78+ }
78 }
79 }
79− }
80+ },
81+ [useShards]
80− }, []);
82+ );
81
83
82 const onSubmit = useCallback(
84 const onSubmit = useCallback(
83 async values => {
85 async values => {
84− const ticket = values.useShards
86+ const ticket = useShards
85 ? kg.combine(
87 ? kg.combine(
86 [values.shard1, values.shard2, values.shard3].map(v =>
88 [values.shard1, values.shard2, values.shard3].map(v =>
87 v === '' ? undefined : v
89 v === '' ? undefined : v
@@ -122,41 +124,37 @@ export default function Ticket({ className, goHome }: TicketProps) {
122 console.error(error);
124 console.error(error);
123 return {
125 return {
124 [FORM_ERROR]: `Unable to derive wallet from ${
126 [FORM_ERROR]: `Unable to derive wallet from ${
125− values.useShards ? 'shards' : 'ticket'
127+ useShards ? 'shards' : 'ticket'
126 }.`,
128 }.`,
127 };
129 };
128 }
130 }
129 },
131 },
130− [setPointCursor, setUrbitWallet, getPoints]
132+ [setPointCursor, setUrbitWallet, getPoints, useShards]
131 );
133 );
132
134
135+ const emptyValidator = () => undefined;
136+
133 const validate = useMemo(
137 const validate = useMemo(
134 () =>
138 () =>
135 composeValidator(
139 composeValidator(
136 {
140 {
137− useAdvanced: buildCheckboxValidator(),
138− usePassphrase: buildCheckboxValidator(),
139− useShards: buildCheckboxValidator(),
140 point: buildPointValidator(4),
141 point: buildPointValidator(4),
141− ticket: buildPatqValidator(),
142+ ticket: useShards ? emptyValidator : buildPatqValidator(),
142− shard1: buildShardValidator(),
143+ shard1: useShards ? buildShardValidator() : emptyValidator,
143− shard2: buildShardValidator(),
144+ shard2: useShards ? buildShardValidator() : emptyValidator,
144− shard3: buildShardValidator(),
145+ shard3: useShards ? buildShardValidator() : emptyValidator,
145 ticketHidden: buildCheckboxValidator(),
146 ticketHidden: buildCheckboxValidator(),
146 passphrase: buildPassphraseValidator(),
147 passphrase: buildPassphraseValidator(),
147 },
148 },
148 validateForm
149 validateForm
149 ),
150 ),
150− [validateForm]
151+ [validateForm, useShards]
151 );
152 );
152
153
153 const initialValues = useMemo(
154 const initialValues = useMemo(
154 () => ({
155 () => ({
155 point: impliedPoint || '',
156 point: impliedPoint || '',
156− usePasshrase: false,
157− useShards: false,
158 ticketHidden: true,
157 ticketHidden: true,
159− useAdvanced: false,
160 }),
158 }),
161 [impliedPoint]
159 [impliedPoint]
162 );
160 );
src/views/UrbitOS/NetworkKeys.scss+1−1
@@ -24,7 +24,7 @@
24 }
24 }
25
25
26 .contents {
26 .contents {
27− height: 448px;
27+ height: 100%;
28 width: 100%;
28 width: 100%;
29 display: flex;
29 display: flex;
30 flex-direction: column;
30 flex-direction: column;