1.2.8 • Published 11 months ago
verifire-client-library v1.2.8
📦 Install
npm i verifire-client-library
🔨 Usage
import { VerfireLogin, VerifireClientContext } from 'verifire-client-library'
function App() {
let verifireOptions = {
verifireClient: 'https://localhost.something.com:12000',
callback: (response) => handleCredentialResponse(response),
}
const [credential, setCredential] = useState(null)
const handleCredentialResponse = (credentials) => {
if (!credentials) {
// route to signin/signup page
}
setCredential(credentials)
}
const onLogout = () => {
window.location.reload()
}
return (
<div className="App">
<VerifireClientContext options={verifireOptions}>
{credential ? (
<div style={{ wordBreak: 'break-word', padding: '4rem 4rem', maxWidth: '800px' }}>
<span style={{ fontSize: '1.2rem', fontWeight: '500', color: 'green' }}>
Already logged in as
</span>{' '}
<pre style={{ whiteSpace: 'break-spaces' }}>{JSON.stringify(credential.profile)}</pre>
</div>
) : (
<VerfireLogin
handleCredentialResponse={handleCredentialResponse}
style={{ height: '100vh', width: '100vw' }}
/>
)}
</VerifireClientContext>
</div>
)
}
Render profile dropdown
<div className="header">
<div id="verifireUserDropdown">
{credential && window.verifireClient.renderProfileDropdown({ logoutCallback: onLogout })}
</div>
</div>
Note:
Wrap your authenticated module root around VerifireClientContext to make sure your routes are protected.