versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2026-01-26 12:26:02 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: ✨ Edit site to support Lysand's OIDC/OAuth2

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-04-18 07:53:37 -10:00
parent 65ad29ea92
commit 9edfd5ac2d
No known key found for this signature in database
3 changed files with 38 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
nuxt.config.ts
View file

@ -42,7 +42,7 @@ export default defineNuxtConfig({
titleSeparator: "·",
siteName: "Lysand",
trailingSlash: true,
apiHost: "localhost:8080",
apiHost: "https://lysand.localhost",
},
},
site: {

61
pages/oauth/redirect.vue
View file

@ -6,8 +6,8 @@
style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" />
</div>
<div v-if="validUrlParameters" class="mt-10 sm:mx-auto sm:w-full sm:max-w-sm">
<form class="space-y-6" method="POST"
:action="`/api/auth/redirect?redirect_uri=${encodeURIComponent(redirect_uri)}&client_id=${client_id}&code=${code}`">
<form class="space-y-6" method="POST" :action="url.pathname.replace('/oauth/redirect', '/oauth/authorize')">
<input type="hidden" v-for="([key, value]) in url.searchParams" :key="key" :name="key" :value="value" />
<div class="flex flex-col items-center gap-y-5">
<h1 class="font-bold text-2xl text-center tracking-tight">Allow this application to access your
account?</h1>
@ -50,32 +50,36 @@
</form>
</div>
<div v-else class="mx-auto max-w-md">
<h1 class="text-2xl font-bold tracking-tight text-gray-900 sm:text-4xl">Invalid access
parameters
</h1>
<p class="mt-6 text-lg leading-8 text-gray-600">This page should be accessed
through a valid OAuth2 authorization request. Please use a <strong class="font-bold">Mastodon API</strong> client to access this page.
</p>
<p class="mt-6 text-lg leading-8 text-gray-600">Here are some recommended clients:</p>
<ul class="w-full flex flex-col gap-3 mt-4">
<li v-for="client of recommendedClients" :key="client.name" class="w-full">
<a :href="client.link" class="rounded-sm ring-2 ring-black/10 px-4 py-2 w-full flex flex-row gap-3 items-center">
<img :src="client.icon" :alt="client.name" class="h-10 w-10" />
<div class="flex flex-col justify-between items-start">
<h2 class="font-bold">{{ client.name }}</h2>
<span class="underline text-purple-700">{{ client.link }}</span>
</div>
</a>
</li>
</ul>
<p class="mt-6 text-lg leading-8 text-gray-600">
Many other clients exist, but <strong class="font-bold">they have not been tested for compatibility</strong>. Bug reports are nevertheless welcome.
</p>
<h1 class="text-2xl font-bold tracking-tight text-gray-900 sm:text-4xl">Invalid access
parameters
</h1>
<p class="mt-6 text-lg leading-8 text-gray-600">This page should be accessed
through a valid OAuth2 authorization request. Please use a <strong class="font-bold">Mastodon
API</strong> client to access this page.
</p>
<p class="mt-6 text-lg leading-8 text-gray-600">Here are some recommended clients:</p>
<ul class="w-full flex flex-col gap-3 mt-4">
<li v-for="client of recommendedClients" :key="client.name" class="w-full">
<a :href="client.link"
class="rounded-sm ring-2 ring-black/10 px-4 py-2 w-full flex flex-row gap-3 items-center">
<img :src="client.icon" :alt="client.name" class="h-10 w-10" />
<div class="flex flex-col justify-between items-start">
<h2 class="font-bold">{{ client.name }}</h2>
<span class="underline text-purple-700">{{ client.link }}</span>
</div>
</a>
</li>
</ul>
<p class="mt-6 text-lg leading-8 text-gray-600">
Many other clients exist, but <strong class="font-bold">they have not been tested for
compatibility</strong>. Bug reports are nevertheless welcome.
</p>
<p class="mt-6 text-lg leading-8 text-gray-600">
Found a problem? Report it on <a href="https://github.com/lysand-org/lysand/issues/new/choose" class="underline text-purple-700">the issue tracker</a>.
</p>
</div>
<p class="mt-6 text-lg leading-8 text-gray-600">
Found a problem? Report it on <a href="https://github.com/lysand-org/lysand/issues/new/choose"
class="underline text-purple-700">the issue tracker</a>.
</p>
</div>
</div>
</template>
@ -83,6 +87,7 @@
import { useRoute } from "vue-router";
import { recommendedClients } from "../../constants";
const url = useRequestURL();
const query = useRoute().query;
const application = query.application;
@ -93,7 +98,7 @@ const scope = decodeURIComponent((query.scope as string) || "");
const code = query.code;
const validUrlParameters =
application && website && redirect_uri && client_id && scope && code;
application && website && redirect_uri && client_id && scope;
const oauthScopeText: Record<string, string> = {
"rw:accounts": "$VERB your account information",

4
pages/register/index.vue
View file

@ -112,7 +112,9 @@ if (!config) {
const instanceInfo = (await fetch(new URL("/api/v1/instance", config.http.base_url)).then(
(data) => data.json(),
));
)).catch((e: Error) => {
console.error(e);
});
const errors = ref<{
[key: string]: {