-  // onDestroy(unsubscribe)
+import { onDestroy } from "svelte"
+import { derived } from "svelte/store"
+import {
+  type ColumnDef,
+  getCoreRowModel,
+  getFilteredRowModel,
+  getPaginationRowModel
+} from "@tanstack/svelte-table"
+
+import type { MaybePromise } from "valibot"
+import { writable, type Readable } from "svelte/store"
+import { cn } from "$lib/utilities/shadcn.ts"
+import * as Table from "$lib/components/ui/table"
+import * as Card from "$lib/components/ui/card/index.ts"
+import { showUnsupported } from "$lib/stores/user.ts"
+import {
+  createSvelteTable,
+  renderComponent,
+  renderSnippet,
+  FlexRender,
+  createVirtualizer,
+  createWindowVirtualizer
+} from "$lib/components/table"
+
+type DataRow = $$Generic
+
+interface Props {
+  columns: Array<ColumnDef<DataRow>>
+  dataStore: Readable<Array<DataRow>>
+  pageIndex?: number
+  pageSize?: any
+  onClick?: undefined | ((row: DataRow) => MaybePromise<void>)
+}
+
+let {
+  columns,
+  dataStore,
+  pageIndex = 0,
+  pageSize = $dataStore.length,
+  onClick = undefined
+}: Props = $props()
+
+let virtualListElement: HTMLDivElement
+
+const table = createSvelteTable({
+  get data() {
+    return $dataStore
+  },
+  state: {
+    get pagination() {
+      return { pageIndex, pageSize }
+    }
+  },
+  columns,
+
+  getCoreRowModel: getCoreRowModel(),
+  getFilteredRowModel: getFilteredRowModel(),
+  getPaginationRowModel: getPaginationRowModel()
+})
+
+const rows = derived(table, $t => $t.getRowModel().rows)
+
+const hasUrls = derived(table, $rows => typeof $rows.at(0)?.original.url === "string")
+
+let virtualizer = createVirtualizer<HTMLDivElement, HTMLTableRowElement>({
+  overscan: 20,
+  count: $rows.length,
+  estimateSize: () => 34,
+  getScrollElement: () => virtualListElement
+})
+
+// const unsubscribe = dataStore.subscribe(() => {
+//   if (!$dataStore) return
+//   table.setPageSize($dataStore.length)
+//   // table.options.update(options => ({ ...options, data: $dataStore }))
+// })
+
+function hasInfoProperty(assets: Object) {
+  return !!Object.values(assets)[0].info
+}
+
+// onDestroy(unsubscribe)
 </script>
 
 <Card.Root class="dark:bg-muted">
diff --git a/app/src/routes/explorer/+page.svelte b/app/src/routes/explorer/+page.svelte
index 968bd9f..dce54f6 100644
--- a/app/src/routes/explorer/+page.svelte
+++ b/app/src/routes/explorer/+page.svelte
@@ -19,8 +19,7 @@ onMount(() => {
 
 let text = $derived(shouldRedirect ? "" : "Welcome to the Union Explorer")
 onMount(() => {
-console.info(text)
-  
+  console.info(text)
 })
 </script>