mirror of
https://github.com/nestriness/nestri.git
synced 2025-12-12 16:55:37 +02:00
⭐feat(auth): Update the authentication UI (#153)
We added a new Auth UI, with all the business logic to handle profiles and such... it works alright
This commit is contained in:
54
apps/www/src/routes/(auth)/login-test/index.tsx
Normal file
54
apps/www/src/routes/(auth)/login-test/index.tsx
Normal file
@@ -0,0 +1,54 @@
|
||||
import { $, component$, useVisibleTask$ } from "@builder.io/qwik";
|
||||
import { createClient } from "@openauthjs/openauth/client";
|
||||
|
||||
function getHashParams(url: URL) {
|
||||
const urlString = url.toString()
|
||||
const hash = urlString.substring(urlString.indexOf('#') + 1); // Extract the part after the #
|
||||
console.log("url", hash)
|
||||
const params = new URLSearchParams(hash);
|
||||
const paramsObj = {} as any;
|
||||
for (const [key, value] of params.entries()) {
|
||||
paramsObj[key] = decodeURIComponent(value);
|
||||
}
|
||||
console.log(paramsObj)
|
||||
return paramsObj;
|
||||
}
|
||||
|
||||
function removeURLParams() {
|
||||
const newURL = window.location.origin + window.location.pathname; // Just origin and path
|
||||
window.location.replace(newURL);
|
||||
}
|
||||
|
||||
export default component$(() => {
|
||||
|
||||
const login = $(async () => {
|
||||
const client = createClient({
|
||||
clientID: "www",
|
||||
issuer: "https://auth.lauryn.dev.nestri.io"
|
||||
})
|
||||
|
||||
const { url } = await client.authorize("http://localhost:5173/login-test", "token", { pkce: true })
|
||||
window.location.href = url
|
||||
})
|
||||
|
||||
// eslint-disable-next-line qwik/no-use-visible-task
|
||||
useVisibleTask$(async () => {
|
||||
const urlObj = new URL(window.location.href);
|
||||
const params = getHashParams(urlObj)
|
||||
if (params.access_token && params.refresh_token) {
|
||||
|
||||
localStorage.setItem("access_token", params.access_token)
|
||||
localStorage.setItem("refresh_token", params.refresh_token)
|
||||
removeURLParams()
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
return (
|
||||
<div class="h-screen w-screen flex justify-center items-center">
|
||||
<button class="px-2 py-1 font-title text-lg bg-gray-400 rounded-lg" onClick$={login}>
|
||||
Login
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
Reference in New Issue
Block a user