frontend/src/routes/index.tsx

51 lines
1.3 KiB
TypeScript

import { component$, useSignal, useVisibleTask$ } from "@builder.io/qwik";
import type { DocumentHead } from "@builder.io/qwik-city";
import Controlbar from "~/components/Controlbar";
import File from "~/components/File";
import { useNanostore$ } from "~/hooks/nanostores";
import { api } from "~/lib/api";
import { OAUTH_LINK } from "~/lib/constants";
import { DashboardFiles } from "~/lib/stores";
import { StereoFile } from "~/lib/types";
// TODO: move this to dashboard/index.tsx
export default component$(() => {
const files = useNanostore$<StereoFile[]>(DashboardFiles);
const loaded = useSignal(false);
useVisibleTask$(async () => {
loaded.value = false;
files.value = await api.list();
console.log("Files loaded:", files.value);
loaded.value = true;
});
return (
<>
<Controlbar />
<a href={OAUTH_LINK}>oauth</a>
<div class="grid grid-cols-4 gap-4 p-4 mb-18">
{/* TODO: make ts better :broken_heart: */}
{!loaded.value ? <p>Loading...</p> : (
files.value.length === 0 ? ( <p> no files found fr </p> )
: files.value.map((file) => (
<File key={file.ID} file={file} />
))
)}
</div>
</>
);
});
export const head: DocumentHead = {
title: "Welcome to Qwik",
meta: [
{
name: "description",
content: "Qwik site description",
},
],
};