feat: add Discord login

src/App.svelte

@@ -11,6 +11,7 @@
   import Member from './pages/Member.svelte';
   import Group from './pages/Group.svelte';
   import { Alert } from 'sveltestrap';
+import DiscordLogin from "./pages/DiscordLogin.svelte";
   
   // theme cdns (I might make some myself too)
   let light = "https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css";
@@ -51,6 +52,7 @@
 <Router>
   <Navigation bind:style={style}/>
     <Route path="/"><Home /></Route>
+    <Route path="/login/discord"><DiscordLogin /></Route>
     <Route path="dash"><Dash /></Route>
     <Route path="dash/m/:id"><Member isPublic={falseBool}/></Route>
     <Route path = "dash/g/:id"><Group isPublic={falseBool}/></Route>

src/pages/DiscordLogin.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+    import { Container, Row, Col } from 'sveltestrap';
+    import { onMount } from 'svelte';
+
+    import api from '../api';
+
+    let text = "Loading...";
+    
+    onMount(async () =>
+    {
+        const params = new URLSearchParams(window.location.search);
+        const paramkeys = [...params.keys()];
+        if (paramkeys.includes("code"))
+        {
+            const res = await api().private.discord.callback.post({ data: { code: params.get("code"), redirect_domain: window.location.origin } });
+            localStorage.setItem("pk-token", res.token);
+            localStorage.setItem("pk-user", JSON.stringify(res.system));
+            window.location.href = window.location.origin;
+        }
+        else
+        {
+            text = "Error: " + params.get("error_description");
+        }
+    });
+</script>
+
+<Container>
+    <Row>
+        <Col class="mx-auto" xs={12} lg={11} xl={10}>
+                {text}
+        </Col>
+    </Row>
+</Container>

src/pages/Home.svelte

@@ -108,6 +108,18 @@
                                 <Button style="width: 100%" color="primary" on:click={() => login(token)}>Submit</Button>
                             </Col>
                         </Row>
+                        <br>
+                        <Row>
+                            <Col xs={1} md={0}><span>Or,</span></Col>
+                            <Col md={4}>
+                                <Button style="width: 90%" color="dark" on:click={() => window.location.href = `https://discord.com/api/oauth2/authorize?client_id=${localStorage.isBeta ? "912009351160541225" : "466378653216014359"}&redirect_uri=${encodeURIComponent(window.location.origin + "/login/discord")}&response_type=code&scope=guilds%20identify`}>
+                                    <svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">
+                                        <path d="M19.54 0c1.356 0 2.46 1.104 2.46 2.472v21.528l-2.58-2.28-1.452-1.344-1.536-1.428.636 2.22h-13.608c-1.356 0-2.46-1.104-2.46-2.472v-16.224c0-1.368 1.104-2.472 2.46-2.472h16.08zm-4.632 15.672c2.652-.084 3.672-1.824 3.672-1.824 0-3.864-1.728-6.996-1.728-6.996-1.728-1.296-3.372-1.26-3.372-1.26l-.168.192c2.04.624 2.988 1.524 2.988 1.524-1.248-.684-2.472-1.02-3.612-1.152-.864-.096-1.692-.072-2.424.024l-.204.024c-.42.036-1.44.192-2.724.756-.444.204-.708.348-.708.348s.996-.948 3.156-1.572l-.12-.144s-1.644-.036-3.372 1.26c0 0-1.728 3.132-1.728 6.996 0 0 1.008 1.74 3.66 1.824 0 0 .444-.54.804-.996-1.524-.456-2.1-1.416-2.1-1.416l.336.204.048.036.047.027.014.006.047.027c.3.168.6.3.876.408.492.192 1.08.384 1.764.516.9.168 1.956.228 3.108.012.564-.096 1.14-.264 1.74-.516.42-.156.888-.384 1.38-.708 0 0-.6.984-2.172 1.428.36.456.792.972.792.972zm-5.58-5.604c-.684 0-1.224.6-1.224 1.332 0 .732.552 1.332 1.224 1.332.684 0 1.224-.6 1.224-1.332.012-.732-.54-1.332-1.224-1.332zm4.38 0c-.684 0-1.224.6-1.224 1.332 0 .732.552 1.332 1.224 1.332.684 0 1.224-.6 1.224-1.332 0-.732-.54-1.332-1.224-1.332z"/>
+                                    </svg>
+                                    Login with Discord
+                                </Button>
+                        </Col>
+                        </Row>
                     {/if}
                 </CardBody>
             </Card>