switch to another frontend framework wheeeeeeeeeeee
This commit is contained in:
parent
fa3c1ccaa7
commit
c4adf6918c
GPG key ID:
B4EF20DDE721CAA1
58 changed files with 6246 additions and 1703 deletions
|
|
@ -1,14 +0,0 @@
|
|||
<script lang="ts">
|
||||
import { page } from "$app/stores";
|
||||
import neofox from "./neofox_confused_2048.png";
|
||||
</script>
|
||||
|
||||
{#if $page.status === 404}
|
||||
<div class="has-text-centered">
|
||||
<img src={neofox} alt="A very confused-looking fox" width="25%" />
|
||||
<h1 class="title">Not found</h1>
|
||||
<p>Our foxes can't find the page you're looking for, sorry!</p>
|
||||
</div>
|
||||
{:else}
|
||||
div.has-text-centered
|
||||
{/if}
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
import type Meta from "$lib/api/meta";
|
||||
import type { User } from "$lib/api/user";
|
||||
import request from "$lib/request";
|
||||
|
||||
export async function load({ fetch, locals }) {
|
||||
const meta = await request<Meta>(fetch, "GET", "/meta");
|
||||
let user: User | undefined;
|
||||
try {
|
||||
user = await request<User>(fetch, "GET", "/users/@me");
|
||||
} catch {}
|
||||
|
||||
return { meta, currentUser: user, token: locals.token };
|
||||
}
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
<script lang="ts">
|
||||
import type { LayoutData } from "./$types";
|
||||
import "../app.scss";
|
||||
import Navbar from "$lib/nav/Navbar.svelte";
|
||||
|
||||
export let data: LayoutData;
|
||||
</script>
|
||||
|
||||
<Navbar user={data.currentUser} />
|
||||
<slot />
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
<script lang="ts">
|
||||
import type { PageData } from "./$types";
|
||||
export let data: PageData;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>pronouns.cc</title>
|
||||
</svelte:head>
|
||||
|
||||
<h1 class="title">Welcome to SvelteKit</h1>
|
||||
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
|
||||
|
||||
<p>
|
||||
are you logged in? {data.currentUser !== undefined}
|
||||
{#if data.currentUser}
|
||||
<br />hello, {data.currentUser.username}!
|
||||
<br />your ID: {data.currentUser.id}
|
||||
{/if}
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<strong>stats:</strong>
|
||||
{data.meta.users.total} users, {data.meta.members} members
|
||||
</p>
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import { error } from "@sveltejs/kit";
|
||||
import type { User } from "$lib/api/user";
|
||||
import request from "$lib/request";
|
||||
|
||||
export const load = async ({ params, fetch }) => {
|
||||
try {
|
||||
const user = await request<User>(fetch, "GET", `/users/${params.username}`);
|
||||
return { user };
|
||||
} catch {
|
||||
error(404, { message: "User not found" });
|
||||
}
|
||||
};
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
<script lang="ts">
|
||||
import type { PageData } from "./$types";
|
||||
export let data: PageData;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>@{data.user.username} • pronouns.cc</title>
|
||||
</svelte:head>
|
||||
|
||||
<h1>this is the user page for @{data.user.username}</h1>
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import request from "$lib/request.js";
|
||||
|
||||
type UrlsResponse = {
|
||||
discord: string | null;
|
||||
google: string | null;
|
||||
tumblr: string | null;
|
||||
};
|
||||
|
||||
export const load = async ({ fetch }) => {
|
||||
const urls = await request<UrlsResponse>(fetch, "POST", "/auth/urls");
|
||||
return { urls };
|
||||
};
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
<script lang="ts">
|
||||
import type { PageData } from "./$types";
|
||||
export let data: PageData;
|
||||
$: hasUrls = !!(data.urls.discord || data.urls.google || data.urls.tumblr);
|
||||
</script>
|
||||
|
||||
<div class="container mt-6">
|
||||
<div class="fixed-grid has-1-cols has-2-cols-desktop">
|
||||
<div class="grid">
|
||||
<div class="cell">
|
||||
<p class="title">Log in with email address</p>
|
||||
<form method="POST" action="?/login">
|
||||
<div class="field">
|
||||
<label for="email" class="label">Email address</label>
|
||||
<div class="control">
|
||||
<input type="email" id="email" class="input" placeholder="Email address" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label for="password" class="label">Password</label>
|
||||
<div class="control">
|
||||
<input type="password" id="password" class="input" placeholder="Password" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-primary">Log in</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<a href="/auth/signup" class="button">Sign up</a>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
{#if hasUrls}
|
||||
<div class="cell">
|
||||
<p class="title">Log in with third-party provider</p>
|
||||
<ul>
|
||||
{#if data.urls.discord}
|
||||
<li><a href={data.urls.discord}>Log in with Discord</a></li>
|
||||
{/if}
|
||||
{#if data.urls.google}
|
||||
<li><a href={data.urls.google}>Log in with Google</a></li>
|
||||
{/if}
|
||||
{#if data.urls.tumblr}
|
||||
<li><a href={data.urls.tumblr}>Log in with Tumblr</a></li>
|
||||
{/if}
|
||||
</ul>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
import request from "$lib/request";
|
||||
import type { AuthResponse, CallbackResponse } from "$lib/api/auth";
|
||||
|
||||
export const load = async ({ fetch, url, cookies, parent }) => {
|
||||
const data = await parent();
|
||||
if (data.user) {
|
||||
return { loggedIn: true, token: data.token, user: data.user };
|
||||
}
|
||||
|
||||
const resp = await request<AuthResponse | CallbackResponse>(
|
||||
fetch,
|
||||
"POST",
|
||||
"/auth/discord/callback",
|
||||
{
|
||||
body: {
|
||||
code: url.searchParams.get("code"),
|
||||
state: url.searchParams.get("state"),
|
||||
},
|
||||
},
|
||||
);
|
||||
|
||||
if ("token" in resp) {
|
||||
const authResp = resp as AuthResponse;
|
||||
cookies.set("pronounscc-token", authResp.token, { path: "/" });
|
||||
return { loggedIn: true, token: authResp.token, user: authResp.user };
|
||||
}
|
||||
|
||||
const callbackResp = resp as CallbackResponse;
|
||||
return {
|
||||
loggedIn: false,
|
||||
hasAccount: callbackResp.has_account,
|
||||
ticket: resp.ticket,
|
||||
remoteUsername: resp.remote_username,
|
||||
};
|
||||
};
|
||||
|
||||
export const actions = {
|
||||
register: async ({ cookies, request: req, fetch, locals }) => {
|
||||
const data = await req.formData();
|
||||
const username = data.get("username");
|
||||
const ticket = data.get("ticket");
|
||||
|
||||
const resp = await request<AuthResponse>(fetch, "POST", "/auth/discord/register", {
|
||||
body: { username, ticket },
|
||||
});
|
||||
cookies.set("pronounscc-token", resp.token, { path: "/" });
|
||||
locals.token = resp.token;
|
||||
|
||||
return { token: resp.token, user: resp.user };
|
||||
},
|
||||
};
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
<script lang="ts">
|
||||
import { onMount } from "svelte";
|
||||
import { goto } from "$app/navigation";
|
||||
import { enhance } from "$app/forms";
|
||||
import type { PageData, ActionData } from "./$types";
|
||||
export let data: PageData;
|
||||
|
||||
export let form: ActionData;
|
||||
|
||||
onMount(async () => {
|
||||
if (data.user) {
|
||||
await new Promise((r) => setTimeout(r, 3000));
|
||||
await goto(`/@${data.user.username}`);
|
||||
}
|
||||
});
|
||||
|
||||
const redirectOnForm = async (action: ActionData) => {
|
||||
if (form?.user) {
|
||||
await new Promise((r) => setTimeout(r, 3000));
|
||||
await goto(`/@${form.user.username}`);
|
||||
}
|
||||
};
|
||||
|
||||
$: redirectOnForm(form);
|
||||
</script>
|
||||
|
||||
<div class="container">
|
||||
{#if form?.user}
|
||||
<h1 class="title">Successfully created account!</h1>
|
||||
<p>Welcome, <strong>@{form.user.username}</strong>!</p>
|
||||
<p>
|
||||
You should automatically be redirected to your profile in a few seconds. If you're not
|
||||
redirected, please press the link above.
|
||||
</p>
|
||||
{:else if data.loggedIn}
|
||||
<h1 class="title">Successfully logged in!</h1>
|
||||
<p>You are now logged in as <a href="/@{data.user?.username}">@{data.user?.username}</a>.</p>
|
||||
<p>
|
||||
You should automatically be redirected to your profile in a few seconds. If you're not
|
||||
redirected, please press the link above.
|
||||
</p>
|
||||
{:else}
|
||||
<h1 class="title">Finish signing up with a Discord account</h1>
|
||||
<form method="POST" action="?/register" use:enhance>
|
||||
<div class="field">
|
||||
<label for="remote_username" class="label">Discord username</label>
|
||||
<div class="control">
|
||||
<input
|
||||
type="text"
|
||||
name="remote_username"
|
||||
id="remote_username"
|
||||
class="input"
|
||||
value={data.remoteUsername}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label for="username" class="label">Username</label>
|
||||
<div class="control">
|
||||
<input type="text" name="username" id="username" class="input" placeholder="Username" />
|
||||
</div>
|
||||
</div>
|
||||
<input
|
||||
type="text"
|
||||
name="ticket"
|
||||
id="ticket"
|
||||
class="hidden"
|
||||
style="display: hidden;"
|
||||
value={data.ticket}
|
||||
/>
|
||||
<div class="field">
|
||||
<div class="control">
|
||||
<button class="button is-primary">Sign up</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{/if}
|
||||
</div>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 143 KiB |
Loading…
Add table
Add a link
Reference in a new issue