/
index.tsx
50 lines (44 loc) · 1.36 KB
/
index.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
import React, { useMemo } from 'react';
import { useMasa } from '../../helpers/provider/use-masa';
import { ModalComponent } from '../modal';
import { InterfaceAuthenticate } from './pages/authenticate';
import { InterfaceConnected } from './pages/connected';
import { InterfaceConnector } from './pages/connector';
import { InterfaceCreateIdentity } from './pages/createIdentity';
const pages = {
connector: <InterfaceConnector />,
createIdentity: <InterfaceCreateIdentity />,
connectedState: <InterfaceConnected />,
authenticate: <InterfaceAuthenticate />,
};
export const MasaInterface = () => {
const {
isModalOpen,
setModalOpen,
isConnected,
loading,
identity,
loggedIn,
closeModal,
scope,
} = useMasa();
const page = useMemo(() => {
console.log({ loading, isConnected, identity, loggedIn });
if (!isConnected) return 'connector';
if (!loggedIn) return 'authenticate';
if (!identity && scope?.includes('identity')) return 'createIdentity';
if (isConnected && loggedIn) return 'connectedState';
return 'connector';
}, [loading, isConnected, identity, loggedIn, scope]);
return (
<>
<ModalComponent
open={isModalOpen as boolean}
close={() => closeModal?.()}
setOpen={setModalOpen as (val: boolean) => void}
>
{pages[page]}
</ModalComponent>
</>
);
};