feat(shared): Component to reload the account
This commit is contained in:
parent
0e7166a4d8
commit
15f48d4e90
2 changed files with 42 additions and 0 deletions
|
@ -7,6 +7,7 @@ import { PageWrapper } from 'shared/components/wrappers/page.mjs'
|
|||
import { Popout } from 'shared/components/popout/index.mjs'
|
||||
import { PageLink } from 'shared/components/page-link.mjs'
|
||||
import { BareLayout } from 'site/components/layouts/bare.mjs'
|
||||
import { ForceAccountCheck } from 'shared/components/account/force-account-check.mjs'
|
||||
|
||||
/*
|
||||
* Each page MUST be wrapped in the PageWrapper component.
|
||||
|
@ -21,6 +22,7 @@ const HomePage = ({ page }) => (
|
|||
</Head>
|
||||
<div>
|
||||
<div className="max-w-xl m-auto my-32 px-6">
|
||||
<ForceAccountCheck />
|
||||
<Popout fixme>
|
||||
Create homepage. Meanwhile check <PageLink href="/signup" txt="the signup flow" />
|
||||
</Popout>
|
||||
|
|
40
sites/shared/components/account/force-account-check.mjs
Normal file
40
sites/shared/components/account/force-account-check.mjs
Normal file
|
@ -0,0 +1,40 @@
|
|||
// Dependencies
|
||||
import { useState, useEffect } from 'react'
|
||||
import { useTranslation } from 'next-i18next'
|
||||
// Hooks
|
||||
import { useAccount } from 'shared/hooks/use-account.mjs'
|
||||
import { useBackend } from 'shared/hooks/use-backend.mjs'
|
||||
import { useToast } from 'shared/hooks/use-toast.mjs'
|
||||
|
||||
export const ns = ['account', 'toast']
|
||||
|
||||
export const ForceAccountCheck = ({ showWelcome = false, trigger = null }) => {
|
||||
// Hooks
|
||||
const { account, setAccount, token, logout } = useAccount()
|
||||
const backend = useBackend(token)
|
||||
const { t } = useTranslation(ns)
|
||||
const toast = useToast()
|
||||
|
||||
// State
|
||||
const [lastCheck, setLastCheck] = useState(Date.now())
|
||||
|
||||
// The actual check
|
||||
useEffect(() => {
|
||||
const age = Date.now() - lastCheck
|
||||
if (account.status && age < 500) {
|
||||
const checkAccount = async () => {
|
||||
const result = await backend.reloadAccount()
|
||||
if (result.success) {
|
||||
setAccount(result.data.account)
|
||||
} else {
|
||||
// Login expired. Logout user.
|
||||
logout()
|
||||
}
|
||||
}
|
||||
checkAccount()
|
||||
}
|
||||
}, [trigger])
|
||||
|
||||
// Don't return anything. This is all about the useEffect hook.
|
||||
return null
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue