f0a7c70 · bridge · git.iko.soy

src/style/bridge.scss−12

compare with master

unifiedsplit

@@ -28,15 +28,3 @@ div.copy-button-wide {

28 font-size: 0.75rem;

29 }

30}

31−

32−// For fading content in and out

33−

34−.faded-out{

35− opacity:0;

36− transition: opacity 0.5s;

37−

38−}

39−.faded-in{

40− opacity:1;

41− transition: opacity 0.5s;

42−}

src/style/activate.scss → src/style/fadeable.scssrenamed

The content is the same.

src/style/index.scss+2−2

@@ -13,5 +13,5 @@

13/* Bridge Styles */

14@import './bridge.scss';

15

16−/* Activate Flow animations */

16+/* Fade animations */

17−@import './activate.scss';

17+@import './fadeable.scss';

src/views/Activate/ActivateCodeForm.tsx−2

@@ -17,7 +17,6 @@ import { CheckboxInput, Grid } from 'indigo-react';

17import { useCallback, useMemo, useRef } from 'react';

18import { useActivateFlow } from './ActivateFlow';

19import WarningBox from 'components/WarningBox';

20−import { CSSTransition } from 'react-transition-group';

21import useRoller from 'lib/useRoller';

20import useRoller from 'lib/useRoller';

22import useImpliedTicket from 'lib/useImpliedTicket';

21import useImpliedTicket from 'lib/useImpliedTicket';

23import {

22import {

@@ -45,7 +44,6 @@ const ActivateCodeForm = ({ afterSubmit }: ActivateCodeFormProps) => {

45 const didWarn = useRef<boolean>(false);

44 const didWarn = useRef<boolean>(false);

46

45

47 const {

46 const {

48− isIn,

49 setDerivedPoint,

47 setDerivedPoint,

50 setDerivedWallet,

48 setDerivedWallet,

51 setInviteWallet,

49 setInviteWallet,

src/views/Activate/ActivateHeader.tsx−5

@@ -1,7 +1,4 @@

1import { Box, Text } from '@tlon/indigo-react';

2−import { DEFAULT_FADE_TIMEOUT } from 'lib/constants';

3−import { CSSTransition } from 'react-transition-group';

4−import { useActivateFlow } from './ActivateFlow';

5import withFadeable from './withFadeable';

2import withFadeable from './withFadeable';

6

3

7type ActivateHeaderProps = {

4type ActivateHeaderProps = {

@@ -11,8 +8,6 @@ type ActivateHeaderProps = {

11};

8};

12

9

13const ActivateHeader = ({ copy }: ActivateHeaderProps) => {

10const ActivateHeader = ({ copy }: ActivateHeaderProps) => {

14− const { isIn } = useActivateFlow();

15−

16 return (

11 return (

17 <Box>

12 <Box>

18 <Text

13 <Text

src/views/Activate/MasterKeyReveal.tsx+1−1

@@ -12,7 +12,7 @@ import { useLocalRouter } from 'lib/LocalRouter';

12import { FadeableActivateButton as ActivateButton } from './ActivateButton';

13

14const MasterKeyReveal = () => {

15− const { isIn, setIsIn } = useActivateFlow();

15+ const { setIsIn } = useActivateFlow();

16 const { push, names } = useLocalRouter();

17 const [showMasterKey, setShowMasterKey] = useState<boolean>(false);

18 const [triggerAnimation, setTriggerAnimation] = useState<boolean>(false);

src/views/Activate/useActivateFlowState.js−4

@@ -7,7 +7,6 @@ export default function useActivateFlowState() {

7 const [derivedPoint, setDerivedPoint] = useState(Nothing());

8 const [generated, setGenerated] = useState(false);

9 const [incomingPoints, setIncomingPoints] = useState(Nothing());

10− const [isFaded, setIsFaded] = useState(false);

11 const [isIn, setIsIn] = useState(false);

10 const [isIn, setIsIn] = useState(false);

12

11

13 const reset = useCallback(() => {

12 const reset = useCallback(() => {

@@ -16,7 +15,6 @@ export default function useActivateFlowState() {

16 setDerivedPoint(Nothing());

15 setDerivedPoint(Nothing());

17 setGenerated(false);

16 setGenerated(false);

18 setIncomingPoints(Nothing());

17 setIncomingPoints(Nothing());

19− setIsFaded(false);

20 }, [

18 }, [

21 setDerivedWallet,

19 setDerivedWallet,

22 setInviteWallet,

20 setInviteWallet,

@@ -36,8 +34,6 @@ export default function useActivateFlowState() {

36 setGenerated,

34 setGenerated,

37 incomingPoints,

35 incomingPoints,

38 setIncomingPoints,

36 setIncomingPoints,

39− isFaded,

40− setIsFaded,

41 isIn,

37 isIn,

42 setIsIn,

38 setIsIn,

43 reset,

39 reset,