mirror of
https://github.com/stack-auth/stack.git
synced 2026-06-04 21:04:37 +08:00
Implement last logged in button (#453)
* store last used in localstorage * implement last logged in * add last badge * move the lastUsed * add new schema * wrong branch, roll it back * rollback prisma * fix useeffect deps --------- Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
This commit is contained in:
parent
180b455d4f
commit
dfadf809eb
@ -69,6 +69,7 @@ function Inner (props: Props) {
|
||||
const project = props.mockProject || projectFromHook;
|
||||
const { t } = useTranslation();
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
if (props.automaticRedirect) {
|
||||
if (user && !props.mockProject) {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
import { BrandIcons, Button } from '@stackframe/stack-ui';
|
||||
import Color from 'color';
|
||||
import { useId } from 'react';
|
||||
import { useEffect, useId, useState } from 'react';
|
||||
import { useStackApp } from '..';
|
||||
import { useTranslation } from '../lib/translations';
|
||||
|
||||
@ -26,6 +26,11 @@ export function OAuthButton({
|
||||
const stackApp = useStackApp();
|
||||
const styleId = useId().replaceAll(':', '-');
|
||||
|
||||
const [lastUsed, setLastUsed] = useState<string | null>(null);
|
||||
useEffect(() => {
|
||||
setLastUsed(localStorage.getItem('_STACK_AUTH.lastUsed'));
|
||||
}, []);
|
||||
|
||||
let style : {
|
||||
backgroundColor?: string,
|
||||
textColor?: string,
|
||||
@ -161,9 +166,17 @@ export function OAuthButton({
|
||||
<>
|
||||
<style>{styleSheet}</style>
|
||||
<Button
|
||||
onClick={() => stackApp.signInWithOAuth(provider)}
|
||||
className={`stack-oauth-button-${styleId} stack-scope`}
|
||||
onClick={async () => {
|
||||
localStorage.setItem('_STACK_AUTH.lastUsed', provider);
|
||||
await stackApp.signInWithOAuth(provider);
|
||||
}}
|
||||
className={`stack-oauth-button-${styleId} stack-scope relative`}
|
||||
>
|
||||
{lastUsed === provider && (
|
||||
<span className="absolute -top-2 -right-2 bg-blue-500 text-white text-xs px-2 py-1 rounded-md">
|
||||
last
|
||||
</span>
|
||||
)}
|
||||
<div className='flex items-center w-full gap-4'>
|
||||
{style.icon}
|
||||
<span className='flex-1'>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user