069e592 · bridge · git.iko.soy

src/components/Greeting.jsnew file+51

compare with master

unifiedsplit

@@ -0,0 +1,51 @@

1+import React, { useCallback } from 'react';

2+import cn from 'classnames';

3+import * as ob from 'urbit-ob';

4+import { Grid, H4, Text, LinkButton } from 'indigo-react';

5+

6+import useWasGreeted from 'lib/useWasGreeted';

7+

8+const TEXT_STYLE = 'f5';

9+

10+export default function ActivateDisclaimer({ point }) {

11+ const [wasGreeted, setWasGreeted] = useWasGreeted();

12+

13+ const pointName = ob.patp(point);

14+

15+ const dismiss = useCallback(async () => {

16+ setWasGreeted(true);

17+ }, [setWasGreeted]);

18+

19+ return (

20+ !wasGreeted && (

21+ <Grid gap={4} className="mb10">

22+ <Grid.Item as={H4} full>

23+ Welcome

24+ </Grid.Item>

25+ <Grid.Item full>

26+ <Text className={cn(TEXT_STYLE, 'block mb4')}>

27+ Hi <code>{pointName}</code>,

28+ </Text>

29+

30+ <Text className={cn(TEXT_STYLE, 'block mb4')}>

31+ Yes, <code>{pointName}</code> is your name here. It's good to meet

32+ you. As of this very moment, you own a digital identity that you can

33+ keep for the rest of your life.

34+ </Text>

35+

36+ <Text className={cn(TEXT_STYLE, 'block mb4')}>

37+ Welcome to Azimuth. We hope you like it.

38+ </Text>

39+

40+ <Text className={cn(TEXT_STYLE, 'block mb4')}>

41+ Get started by booting and exploring Arvo, our full operating system

42+ (still in early stages!)

43+ </Text>

44+ </Grid.Item>

45+ <Grid.Item full as={LinkButton} onClick={dismiss}>

46+ Dismiss

47+ </Grid.Item>

48+ </Grid>

49+ )

50+ );

51+}

src/lib/useWasGreeted.jsnew file+7

@@ -0,0 +1,7 @@

1+import useLocalStorageState from './useLocalStorageState';

2+

3+const WAS_GREETED_KEY = 'bridge:was-greeted';

4+

5+export default function useWasGreeted() {

6+ return useLocalStorageState(WAS_GREETED_KEY, false);

7+}

src/views/Point.js+2

@@ -7,6 +7,7 @@ import { azimuth } from 'azimuth-js';

7import { usePointCursor } from 'store/pointCursor';

8

9import View from 'components/View';

10+import Greeting from 'components/Greeting';

10import Passport from 'components/Passport';

11import Passport from 'components/Passport';

11import { ForwardButton, BootArvoButton } from 'components/Buttons';

12import { ForwardButton, BootArvoButton } from 'components/Buttons';

12import { matchBlinky } from 'components/Blinky';

13import { matchBlinky } from 'components/Blinky';

@@ -87,6 +88,7 @@ export default function Point() {

87

88

88 return (

89 return (

89 <View pop={pop} inset>

90 <View pop={pop} inset>

91+ <Greeting point={point} />

90 <Passport point={Just(point)} />

92 <Passport point={Just(point)} />

91 <Grid className="pt2">

93 <Grid className="pt2">

92 {inviteButton}

94 {inviteButton}