wip: migrate frontend to new backend

packages/lume-column-timeline/src/home.tsx

@@ -3,16 +3,15 @@ import { ArrowRightCircleIcon, LoaderIcon, SearchIcon } from "@lume/icons";
 import { Event, Kind } from "@lume/types";
 import { EmptyFeed } from "@lume/ui";
 import { FETCH_LIMIT } from "@lume/utils";
-import { NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
 import { useInfiniteQuery } from "@tanstack/react-query";
 import { useEffect, useMemo, useRef } from "react";
 import { Link } from "react-router-dom";
 import { CacheSnapshot, VList, VListHandle } from "virtua";
 
-export function HomeRoute({ colKey }: { colKey: string }) {
+export function HomeRoute({ queryKey }: { queryKey: string }) {
 	const ark = useArk();
 	const ref = useRef<VListHandle>();
-	const cacheKey = `${colKey}-vlist`;
+	const cacheKey = `${queryKey}-vlist`;
 
 	const [offset, cache] = useMemo(() => {
 		const serialized = sessionStorage.getItem(cacheKey);
@@ -22,16 +21,14 @@ export function HomeRoute({ colKey }: { colKey: string }) {
 
 	const { data, hasNextPage, isLoading, isFetchingNextPage, fetchNextPage } =
 		useInfiniteQuery({
-			queryKey: [colKey],
+			queryKey: [queryKey],
 			initialPageParam: 0,
 			queryFn: async ({
-				signal,
 				pageParam,
 			}: {
-				signal: AbortSignal;
 				pageParam: number;
 			}) => {
-				const events = await ark.get_text_events(FETCH_LIMIT);
+				const events = await ark.get_text_events(FETCH_LIMIT, pageParam);
 				return events;
 			},
 			getNextPageParam: (lastPage) => {
@@ -71,23 +68,6 @@ export function HomeRoute({ colKey }: { colKey: string }) {
 		};
 	}, []);
 
-	/*
-	if (!ark.account.contacts.length) {
-		return (
-			<div className="px-3 mt-3">
-				<EmptyFeed />
-				<Link
-					to="/suggest"
-					className="mt-3 w-full gap-2 inline-flex items-center justify-center text-sm font-medium rounded-lg h-9 bg-blue-500 hover:bg-blue-600 text-white"
-				>
-					<SearchIcon className="size-5" />
-					Find accounts to follow
-				</Link>
-			</div>
-		);
-	}
-	*/
-
 	return (
 		<div className="w-full h-full">
 			<VList ref={ref} cache={cache} overscan={2} className="flex-1 px-3">

packages/lume-column-timeline/src/index.tsx

@@ -1,51 +1,25 @@
 import { Column } from "@lume/ark";
-import { IColumn } from "@lume/types";
+import { LumeColumn } from "@lume/types";
 import { EventRoute, SuggestRoute, UserRoute } from "@lume/ui";
 import { HomeRoute } from "./home";
 
-export function Timeline({ column }: { column: IColumn }) {
+export function Timeline({ column }: { column: LumeColumn }) {
 	const colKey = `timeline-${column.id}`;
-	// const ark = useArk();
-	// const queryClient = useQueryClient();
-	// const since = useRef(Math.floor(Date.now() / 1000));
-
-	/*
-	const refresh = async (events: NDKEvent[]) => {
-		const uniqEvents = new Set(events);
-		await queryClient.setQueryData(
-			[colKey],
-			(prev: { pageParams: number; pages: Array<NDKEvent[]> }) => ({
-				...prev,
-				pages: [[...uniqEvents], ...prev.pages],
-			}),
-		);
-	};
-	*/
 
 	return (
-		<Column.Root>
-			{/*<Column.Header id={column.id} queryKey={[colKey]} title="Timeline" />*/}
-			{/*ark.account.contacts.length ? (
-				<Column.Live
-					filter={{
-						kinds: [NDKKind.Text, NDKKind.Repost],
-						authors: ark.account.contacts,
-						since: since.current,
-					}}
-					onClick={refresh}
-				/>
-				) : null*/}
-			<Column.Content>
-				<Column.Route path="/" element={<HomeRoute colKey={colKey} />} />
-				{/*
+		<Column.Provider column={column}>
+			<Column.Root>
+				<Column.Header queryKey={[colKey]} />
+				<Column.Content>
+					<Column.Route path="/" element={<HomeRoute queryKey={colKey} />} />
 					<Column.Route path="/events/:id" element={<EventRoute />} />
 					<Column.Route path="/users/:id" element={<UserRoute />} />
 					<Column.Route
 						path="/suggest"
-						element={<SuggestRoute queryKey={[colKey]} />}
+						element={<SuggestRoute queryKey={colKey} />}
 					/>
-				*/}
-			</Column.Content>
-		</Column.Root>
+				</Column.Content>
+			</Column.Root>
+		</Column.Provider>
 	);
 }