on master help sign in
ux: link to new Port for Windows

Yesterday Port added native support, so this points the download button to the Port latest downloads page for Windows users. Also, extract the button into its own component

commitae01be41782bec57b38b37dde72d003def910afb authortomholford <tomholford@users.noreply.github.com> dateThu 7 Oct 2021, 18:52 (5 years ago) parent1541f1c
2 files changed+36−28
src/views/Activate/DownloadPortButton.tsx+30 src/views/Activate/MasterKeyTransfer.tsx+6−28
src/views/Activate/DownloadPortButton.tsxnew file+30
@@ -0,0 +1,30 @@
1+import { useMemo } from 'react';
2+import { isMacOs, isWindows } from 'react-device-detect';
3+import ActivateButton from './ActivateButton';
4+
5+export const DownloadPortButton = ({ error }) => {
6+ const downloadButtonLabel = useMemo(() => {
7+ return isMacOs
8+ ? 'Download the Client for Mac'
9+ : isWindows
10+ ? 'Download the Client for Windows'
11+ : 'Download the Client for Your OS';
12+ }, []);
13+
14+ const downloadUrl = useMemo(() => {
15+ return isMacOs
16+ ? `https://github.com/urbit/port/releases/latest/download/Port.dmg`
17+ : 'https://github.com/urbit/port/releases/latest';
18+ }, []);
19+
20+ return (
21+ <>
22+ <ActivateButton
23+ onClick={() => window.open(downloadUrl)}
24+ disabled={error}
25+ success={true}>
26+ {downloadButtonLabel}
27+ </ActivateButton>
28+ </>
29+ );
30+};
src/views/Activate/MasterKeyTransfer.tsx+6−28
@@ -7,13 +7,12 @@ import { useActivateFlow } from './ActivateFlow';
77import ActivateView from './ActivateView';
88import useRoller from 'lib/useRoller';
99import { FadeableActivateHeader as ActivateHeader } from './ActivateHeader';
10−import { FadeableActivateButton as ActivateButton } from './ActivateButton';
1110import useFadeIn from './useFadeIn';
1211import PointPresenter from './PointPresenter';
1312import DangerBox from './DangerBox';
1413import View from 'components/View';
1514
16−import { isMacOs, isWindows } from 'react-device-detect';
15+import { DownloadPortButton } from './DownloadPortButton';
1716
1817const MasterKeyTransfer = () => {
1918 const { performL2Reticket } = useRoller();
@@ -36,9 +35,9 @@ const MasterKeyTransfer = () => {
3635 toWallet: derivedWallet.value,
3736 fromWallet: inviteWallet.value,
3837 });
39− } catch (error) {
40− console.error(error);
41− setError(error);
38+ } catch (e) {
39+ console.error(e);
40+ setError(e);
4241 }
4342 }, [
4443 derivedWallet,
@@ -47,22 +46,6 @@ const MasterKeyTransfer = () => {
4746 inviteWallet.value,
4847 ]);
4948
50− const downloadButtonLabel = useMemo(() => {
51− return isMacOs
52− ? 'Download the Client for Mac'
53− : isWindows
54− ? 'Download the Client for Windows'
55− : 'Download the Client for Your OS';
56− }, []);
57−
58− const downloadUrl = useMemo(() => {
59− return isMacOs
60− ? `https://github.com/urbit/port/releases/latest/download/Port.dmg`
61− : isWindows
62− ? 'https://github.com/urbit/urbit/releases/download/latest/windows.tgz'
63− : 'https://github.com/urbit/port/releases/download/latest';
64− }, []);
65−
6649 useFadeIn();
6750
6851 useLifecycle(() => {
@@ -112,12 +95,7 @@ const MasterKeyTransfer = () => {
11295 flexWrap={'nowrap'}
11396 justifyContent={'space-between'}>
11497 {error && <DangerBox>{error.toString()}</DangerBox>}
115− <ActivateButton
116− onClick={() => window.open(downloadUrl)}
117− disabled={error}
118− success={true}>
119− {downloadButtonLabel}
120− </ActivateButton>
98+ <DownloadPortButton error={error} />
12199 <Anchor
122100 href="https://urbit.org/getting-started/cli"
123101 marginTop={'20px'}
@@ -134,7 +112,7 @@ const MasterKeyTransfer = () => {
134112 </Anchor>
135113 </Box>
136114 );
137− }, [downloadButtonLabel, downloadUrl, error]);
115+ }, [error]);
138116
139117 return (
140118 <View centered={true}>