@@ -23,6 +23,8 @@ import { useActivateFlow } from './ActivateFlow';
2323import { useLocalRouter } from 'lib/LocalRouter';
2424import useImpliedTicket from 'lib/useImpliedTicket';
2525import useHasDisclaimed from 'lib/useHasDisclaimed';
26+import useBreakpoints from 'lib/useBreakpoints';
27+import WarningBox from 'components/WarningBox';
2628
2729export default function ActivateCode() {
2830 const history = useHistory();
@@ -39,12 +41,19 @@ export default function ActivateCode() {
3941 derivedPoint,
4042 setDerivedPoint,
4143 } = useActivateFlow();
44+ // this is a pretty naive way to detect if we're on a mobile device
45+ // (i.e. we're checking the width of the screen)
46+ // but it will suffice for the 99% case and if someone wants to get around it
47+ // well by golly they're allowed to turn their phone into landscape mode
48+ // for this screen
49+ const activationAllowed = useBreakpoints([false, true, true]);
4250
4351 const [ticketInput, { pass: validTicket, data: ticket }] = useTicketInput({
4452 name: 'ticket',
4553 label: 'Activation Code',
4654 initialValue: impliedTicket || '',
4755 autoFocus: true,
56+ disabled: !activationAllowed,
4857 });
4958
5059 const goToLogin = useCallback(() => history.popAndPush(ROUTE_NAMES.LOGIN), [
@@ -135,16 +144,19 @@ export default function ActivateCode() {
135144 <Grid.Item as={H4} className="mt3 mb2" full>
136145 Activate
137146 </Grid.Item>
147+
138148 <Grid.Item as={Input} {...ticketInput} full />
149+
139150 {generalError && (
140151 <Grid.Item full>
141− <ErrorText>{generalError}</ErrorText>{' '}
152+ <ErrorText>{generalError}</ErrorText>
142153 </Grid.Item>
143154 )}
155+
144156 <Grid.Item
145157 as={ForwardButton}
146158 className="mt4"
147− disabled={!pass || deriving}
159+ disabled={!pass || deriving || !activationAllowed}
148160 accessory={blinkIf(deriving)}
149161 onClick={goToPassport}
150162 solid
@@ -152,6 +164,12 @@ export default function ActivateCode() {
152164 {deriving && 'Deriving...'}
153165 {!deriving && 'Go'}
154166 </Grid.Item>
167+
168+ {!activationAllowed && (
169+ <Grid.Item full as={WarningBox} className="mt4">
170+ For your security, please access Bridge on a desktop device.
171+ </Grid.Item>
172+ )}
155173 </Grid>
156174 <FooterButton as={ForwardButton} onClick={goToLogin}>
157175 Login