tailwind + ky + backend oauth connection

src/global.css

@@ -0,0 +1,3 @@
+@import "tailwindcss";
+
+

src/lib/constants.ts

@@ -0,0 +1 @@
+export const OAUTH_LINK = "https://discord.com/oauth2/authorize?client_id=1368939221678817382&response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A8081%2Fapi%2Fauth%2Fcallback&scope=identify+email"

src/routes/api/[path]/index.tsx

@@ -0,0 +1,12 @@
+import type { RequestHandler } from '@builder.io/qwik-city';
+import ky from 'ky';
+
+export const onGet: RequestHandler = async ({ send, pathname, request }) => {
+  const res = await ky.get(`http://localhost:8081${pathname}`, {
+    method: request.method,
+    headers: request.headers,
+    body: request.method === 'GET' ? null : request.body,
+  });
+
+  send(res);
+};

src/routes/index.tsx

@@ -1,15 +1,28 @@
-import { component$ } from "@builder.io/qwik";
+import { component$, useSignal, useVisibleTask$ } from "@builder.io/qwik";
 import type { DocumentHead } from "@builder.io/qwik-city";
+import ky from "ky";
+import { OAUTH_LINK } from "~/lib/constants";
 
 export default component$(() => {
+  const files = useSignal<any[]>([]);
+  
+  useVisibleTask$(async () => {
+    const res: any[] | undefined = await ky.get("/api/list", { headers: { Authorization: `Bearer ${localStorage.getItem("token")}` } })
+      .json();
+    console.log(res);
+    files.value = res!;
+  })
+
   return (
     <>
-      <h1>Hi 👋</h1>
-      <div>
-        Can't wait to see what you build with qwik!
-        <br />
-        Happy coding.
-      </div>
+      <a href={OAUTH_LINK}>oauth</a>
+      {files.value.map((file) => (
+        <div key={file.ID}>
+          <h2>Owner: {file.Owner}</h2>
+          <p>File ID: {file.ID}</p>
+          <p>Created: {new Date(file.CreatedAt).toLocaleString()}</p>
+        </div>
+      ))}
     </>
   );
 });