const contract = props.contract || "chat-internal.ws-protocol-63"; const componentOwnerId = props.componentOwnerId || "calimero.testnet"; const encryptionUrl = props.encryptionUrl || "https://cali-encryption.euw3.staging.gcp.calimero.network/key"; const accountId = context.accountId; const [loggedIn, setLoggedIn] = useState(false); const PageContainer = styled.div` width: 100%; height: calc(100vh - 88px); @media (max-width: 1024px) { height: calc(100vh - 64px); } background-color: #0e0e10; `; const loginApi = useMemo( () => ({ join: () => Near.fakCalimeroCall(contract, "join"), login: () => Near.requestCalimeroFak(contract), validateKey: () => Near.hasValidCalimeroFak(contract), getMembers: () => Near.asyncCalimeroView(contract, "get_members"), }), [contract] ); const Logo = () => ( <Widget src={ `${ componentOwnerId }/widget/Calimero.Curb.Navbar.CurbLogo` } props={ { justify: true, } } /> ); // Ping to prepare the new key, needs to be simplified const ping = () => Near.fakCalimeroCall(contract, "ping"); return ( <PageContainer> {!loggedIn || !accountId ? ( <Widget src={ `${ componentOwnerId }/widget/Calimero.Common.Login.index` } props={ { loginApi, accountId: context.accountId, componentOwnerId, onValidLogin: () => ping().then(() => { setLoggedIn(true); }), logo: <Logo />, }} /> ) : ( <Widget src={`${componentOwnerId}/widget/Calimero.Curb.AppContainer`} props={{ componentOwnerId, contract, encryptionUrl, accountId: context.accountId, }} /> )} </PageContainer> );