this repo has no description
lewis.moe
1<script lang="ts">
2 import { getCurrentPath } from './lib/router.svelte'
3 import { initAuth, getAuthState } from './lib/auth.svelte'
4 import Login from './routes/Login.svelte'
5 import Register from './routes/Register.svelte'
6 import Verify from './routes/Verify.svelte'
7 import ResetPassword from './routes/ResetPassword.svelte'
8 import Dashboard from './routes/Dashboard.svelte'
9 import AppPasswords from './routes/AppPasswords.svelte'
10 import InviteCodes from './routes/InviteCodes.svelte'
11 import Settings from './routes/Settings.svelte'
12 import Sessions from './routes/Sessions.svelte'
13 import Notifications from './routes/Notifications.svelte'
14 import RepoExplorer from './routes/RepoExplorer.svelte'
15 import Admin from './routes/Admin.svelte'
16 import OAuthConsent from './routes/OAuthConsent.svelte'
17 import OAuthLogin from './routes/OAuthLogin.svelte'
18 import OAuthAccounts from './routes/OAuthAccounts.svelte'
19 import OAuth2FA from './routes/OAuth2FA.svelte'
20 import OAuthError from './routes/OAuthError.svelte'
21
22 const auth = getAuthState()
23
24 $effect(() => {
25 initAuth()
26 })
27
28 function getComponent(path: string) {
29 switch (path) {
30 case '/login':
31 return Login
32 case '/register':
33 return Register
34 case '/verify':
35 return Verify
36 case '/reset-password':
37 return ResetPassword
38 case '/dashboard':
39 return Dashboard
40 case '/app-passwords':
41 return AppPasswords
42 case '/invite-codes':
43 return InviteCodes
44 case '/settings':
45 return Settings
46 case '/sessions':
47 return Sessions
48 case '/notifications':
49 return Notifications
50 case '/repo':
51 return RepoExplorer
52 case '/admin':
53 return Admin
54 case '/oauth/consent':
55 return OAuthConsent
56 case '/oauth/login':
57 return OAuthLogin
58 case '/oauth/accounts':
59 return OAuthAccounts
60 case '/oauth/2fa':
61 return OAuth2FA
62 case '/oauth/error':
63 return OAuthError
64 default:
65 return auth.session ? Dashboard : Login
66 }
67 }
68
69 let currentPath = $derived(getCurrentPath())
70 let CurrentComponent = $derived(getComponent(currentPath))
71</script>
72
73<main>
74 {#if auth.loading}
75 <div class="loading">
76 <p>Loading...</p>
77 </div>
78 {:else}
79 <CurrentComponent />
80 {/if}
81</main>
82
83<style>
84 :global(:root) {
85 --bg-primary: #fafafa;
86 --bg-secondary: #f9f9f9;
87 --bg-card: #ffffff;
88 --bg-input: #ffffff;
89 --bg-input-disabled: #f5f5f5;
90 --text-primary: #333333;
91 --text-secondary: #666666;
92 --text-muted: #999999;
93 --border-color: #dddddd;
94 --border-color-light: #cccccc;
95 --accent: #0066cc;
96 --accent-hover: #0052a3;
97 --success-bg: #dfd;
98 --success-border: #8c8;
99 --success-text: #060;
100 --error-bg: #fee;
101 --error-border: #fcc;
102 --error-text: #c00;
103 --warning-bg: #ffd;
104 --warning-text: #660;
105 }
106
107 @media (prefers-color-scheme: dark) {
108 :global(:root) {
109 --bg-primary: #1a1a1a;
110 --bg-secondary: #242424;
111 --bg-card: #2a2a2a;
112 --bg-input: #333333;
113 --bg-input-disabled: #2a2a2a;
114 --text-primary: #e0e0e0;
115 --text-secondary: #a0a0a0;
116 --text-muted: #707070;
117 --border-color: #404040;
118 --border-color-light: #505050;
119 --accent: #4da6ff;
120 --accent-hover: #7abbff;
121 --success-bg: #1a3d1a;
122 --success-border: #2d5a2d;
123 --success-text: #7bc67b;
124 --error-bg: #3d1a1a;
125 --error-border: #5a2d2d;
126 --error-text: #ff7b7b;
127 --warning-bg: #3d3d1a;
128 --warning-text: #c6c67b;
129 }
130 }
131
132 :global(body) {
133 margin: 0;
134 font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
135 line-height: 1.5;
136 color: var(--text-primary);
137 background: var(--bg-primary);
138 }
139
140 :global(*) {
141 box-sizing: border-box;
142 }
143
144 main {
145 min-height: 100vh;
146 background: var(--bg-primary);
147 }
148
149 .loading {
150 display: flex;
151 align-items: center;
152 justify-content: center;
153 min-height: 100vh;
154 color: var(--text-secondary);
155 }
156</style>