Software-Mac/spacedrive
Software-Mac/spacedrive
1
0
Fork 0
mirror of https://github.com/spacedriveapp/spacedrive synced 2024-07-04 14:33:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Cancel login (#1562)

Browse source 
* Cancel login

* Fix light mode styling

* use `text-ink` + `button`

* better
This commit is contained in:
Oscar Beaumont 2023-10-13 18:39:26 +11:00 committed by GitHub
parent 9b5ae960b5
commit c5679d127f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
interface/components/LoginButton.tsx
View file

@ -5,21 +5,32 @@ import { usePlatform } from '..';
export function LoginButton({ children, ...props }: { onLogin?(): void } & ButtonProps) {
const authState = auth.useStateSnapshot();
const platform = usePlatform();
return (
<Button
variant="accent"
disabled={authState.status === 'loggingIn'}
onClick={async () => {
await auth.login(platform.auth);
props.onLogin?.();
}}
{...props}
>
{authState.status !== 'loggingIn' ? children || 'Log in' : 'Logging In...'}
</Button>
<div className="flex flex-col items-center justify-center">
<Button
variant="accent"
disabled={authState.status === 'loggingIn'}
onClick={async () => {
await auth.login(platform.auth);
props.onLogin?.();
}}
{...props}
>
{authState.status !== 'loggingIn' ? children || 'Log in' : 'Logging In...'}
</Button>
{authState.status === 'loggingIn' && (
<button
onClick={(e) => {
e.preventDefault();
auth.cancel();
}}
className="mt-2 text-sm text-ink-faint"
>
Cancel
</button>
)}
</div>
);
}

12
packages/client/src/stores/auth.ts
View file

@ -11,6 +11,7 @@ export interface ProviderConfig {
start(key: string): any;
finish?(ret: any): void;
}
// inner object so we can overwrite it in one assignment
const store = proxy<Store>({
state: {
@ -32,7 +33,8 @@ nonLibraryClient
store.state = { status: 'notLoggedIn' };
});
const loginCallbacks = new Set<(status: 'success' | 'error') => void>();
type CallbackStatus = 'success' | 'error' | 'cancel';
const loginCallbacks = new Set<(status: CallbackStatus) => void>();
function onError() {
loginCallbacks.forEach((cb) => cb('error'));
@ -57,7 +59,7 @@ export function login(config: ProviderConfig) {
});
return new Promise<void>((res, rej) => {
const cb = async (status: 'success' | 'error') => {
const cb = async (status: CallbackStatus) => {
loginCallbacks.delete(cb);
if (status === 'success') {
@ -79,3 +81,9 @@ export function logout() {
nonLibraryClient.query(['auth.me']);
store.state = { status: 'notLoggedIn' };
}
export function cancel() {
loginCallbacks.forEach((cb) => cb('cancel'));
loginCallbacks.clear();
store.state = { status: 'notLoggedIn' };
}