tubearchivist-frontend/app/routes/_index.tsx

34 lines
901 B
TypeScript

import { useLoaderData } from "@remix-run/react";
import type { ErrorBoundaryComponent, LoaderArgs } from "@remix-run/server-runtime";
import { json } from "@remix-run/server-runtime";
import VideoList from "~/components/VideoList/VideoList";
import { getVideos } from "~/lib/getVideos";
export const loader = async ({ context, request }: LoaderArgs) => {
const data = await getVideos(request);
return json(data);
};
export default function Index() {
const { data: videos } = useLoaderData<typeof loader>();
// console.log(videos);
return (
<main>
<VideoList videos={videos} />
</main>
);
}
export const ErrorBoundary: ErrorBoundaryComponent = ({ error }: { error: Error }) => {
console.warn(error);
return (
<div className="boxed-content">
<div className="title-bar">
<h1>Error: </h1>
<p>{error.message}</p>
</div>
</div>
);
};