Something went wrong. Try again.
Monorepo for Tangled forked from tangled.org/core
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748<script lang="ts"> import Check from "$icon/check"; import Github from "$icon/github"; import LogOut from "$icon/log-out"; import Button from "#lib/components/ui/Button.svelte"; import Spinner from "#lib/components/ui/Spinner.svelte";
interface Props { connected: boolean; connectHref: string; onDisconnect: () => void; pending?: boolean; }
let { connected, connectHref, onDisconnect, pending = false }: Props = $props();</script>
<div class="flex flex-wrap items-center gap-md"> <div class="flex items-center gap-md"> <Button data-testid="connectGithub" href={connected ? undefined : (connectHref as `/${string}`)} icon={Github} disabled={connected || pending} > Connect to your GitHub account </Button> {#if pending} <span role="status" class="flex items-center gap-xs typography-paragraph-small text-foreground-muted" > <Spinner class="size-4" />Loading… </span> {:else if connected} <span data-testid="githubConnectedStatus" class="flex items-center gap-2xs typography-paragraph-small text-foreground-success" > <Check class="size-4" aria-hidden="true" />Connected </span> {/if} </div> {#if connected} <Button variant="ghost" icon={LogOut} onclick={onDisconnect}>Disconnect account</Button> {/if}</div>