forked from
pds.ls/pdsls
atmosphere explorer
open add account when clicking homepage sign in
+22
-15
+9
-8
src/auth/account.tsx
+9
-8
src/auth/account.tsx
···
1
1
import { Did } from "@atcute/lexicons";
2
2
import { deleteStoredSession, getSession, OAuthUserAgent } from "@atcute/oauth-browser-client";
3
3
import { A } from "@solidjs/router";
4
-
import { createEffect, createSignal, For, onMount, Show } from "solid-js";
4
+
import { createEffect, For, onMount, Show } from "solid-js";
5
5
import { createStore, produce } from "solid-js/store";
6
6
import { ActionMenu, DropdownMenu, MenuProvider, NavMenu } from "../components/dropdown.jsx";
7
7
import { Modal } from "../components/modal.jsx";
···
26
26
setOpenManager,
27
27
setPendingPermissionEdit,
28
28
setSessions,
29
+
setShowAddAccount,
30
+
showAddAccount,
29
31
} from "./state.js";
30
32
31
33
const AccountDropdown = (props: { did: Did; onEditPermissions: (did: Did) => void }) => {
···
72
74
73
75
export const AccountManager = () => {
74
76
const [avatars, setAvatars] = createStore<Record<Did, string>>();
75
-
const [showingAddAccount, setShowingAddAccount] = createSignal(false);
76
77
77
78
const getThumbnailUrl = (avatarUrl: string) => {
78
79
return avatarUrl.replace("img/avatar/", "img/avatar_thumbnail/");
···
122
123
open={openManager()}
123
124
onClose={() => {
124
125
setOpenManager(false);
125
-
setShowingAddAccount(false);
126
+
setShowAddAccount(false);
126
127
scopeFlow.cancel();
127
128
}}
128
129
alignTop
129
130
contentClass="dark:bg-dark-300 dark:shadow-dark-700 pointer-events-auto w-full max-w-sm rounded-lg border-[0.5px] border-neutral-300 bg-neutral-50 p-4 mx-3 shadow-md dark:border-neutral-700"
130
131
>
131
-
<Show when={!scopeFlow.showScopeSelector() && !showingAddAccount()}>
132
+
<Show when={!scopeFlow.showScopeSelector() && !showAddAccount()}>
132
133
<div class="mb-2 px-1 font-semibold">
133
134
<span>Switch account</span>
134
135
</div>
···
169
170
</For>
170
171
</div>
171
172
<button
172
-
onclick={() => setShowingAddAccount(true)}
173
+
onclick={() => setShowAddAccount(true)}
173
174
class="dark:hover:bg-dark-200 dark:active:bg-dark-100 flex w-full items-center justify-center gap-2 rounded-lg border border-neutral-200 px-3 py-2 hover:bg-neutral-100 active:bg-neutral-200 dark:border-neutral-700"
174
175
>
175
176
<span class="iconify lucide--plus"></span>
···
177
178
</button>
178
179
</Show>
179
180
180
-
<Show when={showingAddAccount() && !scopeFlow.showScopeSelector()}>
181
-
<Login onCancel={() => setShowingAddAccount(false)} />
181
+
<Show when={showAddAccount() && !scopeFlow.showScopeSelector()}>
182
+
<Login onCancel={() => setShowAddAccount(false)} />
182
183
</Show>
183
184
184
185
<Show when={scopeFlow.showScopeSelector()}>
···
189
190
onConfirm={scopeFlow.complete}
190
191
onCancel={() => {
191
192
scopeFlow.cancel();
192
-
setShowingAddAccount(false);
193
+
setShowAddAccount(false);
193
194
}}
194
195
/>
195
196
</Show>
+1
-1
src/auth/login.tsx
+1
-1
src/auth/login.tsx
+1
-1
src/auth/scope-selector.tsx
+1
-1
src/auth/scope-selector.tsx
···
68
68
classList={{ "opacity-50": isDisabled() }}
69
69
>
70
70
<div
71
-
class="flex size-5 items-center justify-center rounded border-2 transition-colors"
71
+
class="flex size-5 items-center justify-center rounded border-2"
72
72
classList={{
73
73
"bg-blue-500 border-transparent group-hover:bg-blue-600 group-active:bg-blue-400":
74
74
isSelected() && !isDisabled(),
+1
src/auth/state.ts
+1
src/auth/state.ts
···
13
13
export const [agent, setAgent] = createSignal<OAuthUserAgent | undefined>();
14
14
export const [sessions, setSessions] = createStore<Sessions>();
15
15
export const [openManager, setOpenManager] = createSignal(false);
16
+
export const [showAddAccount, setShowAddAccount] = createSignal(false);
16
17
export const [pendingPermissionEdit, setPendingPermissionEdit] = createSignal<string | null>(null);
+3
-3
src/components/search.tsx
+3
-3
src/components/search.tsx
···
348
348
</span>
349
349
<button
350
350
type="button"
351
-
class="text-xs text-neutral-500 hover:text-neutral-700 dark:text-neutral-400 dark:hover:text-neutral-200"
351
+
class="text-xs not-hover:text-neutral-500 dark:not-hover:text-neutral-400"
352
352
onClick={() => {
353
353
localStorage.removeItem(RECENT_SEARCHES_KEY);
354
354
setRecentSearches([]);
···
390
390
</A>
391
391
<button
392
392
type="button"
393
-
class="mr-1 flex items-center rounded p-1 opacity-0 group-hover:opacity-100 hover:bg-neutral-300 dark:hover:bg-neutral-600"
393
+
class="flex items-center p-2.5 opacity-0 not-hover:text-neutral-500 group-hover:opacity-100 dark:not-hover:text-neutral-400"
394
394
onClick={() => {
395
395
removeRecentSearch(recent.path);
396
396
setRecentSearches(getRecentSearches());
397
397
}}
398
398
>
399
-
<span class="iconify lucide--x text-sm text-neutral-500 dark:text-neutral-400"></span>
399
+
<span class="iconify lucide--x text-base"></span>
400
400
</button>
401
401
</div>
402
402
);
+7
-2
src/views/home.tsx
+7
-2
src/views/home.tsx
···
1
1
import { A } from "@solidjs/router";
2
2
import { For, JSX } from "solid-js";
3
-
import { setOpenManager } from "../auth/state";
3
+
import { setOpenManager, setShowAddAccount } from "../auth/state";
4
4
import { Button } from "../components/button";
5
5
import { SearchButton } from "../components/search";
6
6
···
111
111
<span>to find any account</span>
112
112
</div>
113
113
<div class="flex items-center gap-1.5 text-xs text-neutral-500 dark:text-neutral-400">
114
-
<Button onClick={() => setOpenManager(true)}>
114
+
<Button
115
+
onClick={() => {
116
+
setOpenManager(true);
117
+
setShowAddAccount(true);
118
+
}}
119
+
>
115
120
<span class="iconify lucide--user-round"></span>
116
121
Sign in
117
122
</Button>