2023-12-17 23:57:24 +00:00
|
|
|
|
import Feed from "@/components/Feed";
|
|
|
|
|
import SearchBar from "@/components/SearchBar";
|
|
|
|
|
import { ApiResponse, fetchFeedData } from "@/lib/feed.ts";
|
|
|
|
|
import * as GraphicSection from "@/components/GraphicSection";
|
|
|
|
|
import { ArrowIcon } from "@/components/ArrowIcon";
|
|
|
|
|
import { GetServerSideProps } from "next";
|
|
|
|
|
import { Article } from "@/lib/prisma.ts";
|
2023-11-10 13:34:04 +00:00
|
|
|
|
|
2023-11-22 11:59:45 +00:00
|
|
|
|
type Props = {
|
2023-12-17 23:57:24 +00:00
|
|
|
|
data: ApiResponse<Article>;
|
|
|
|
|
};
|
2023-11-22 11:59:45 +00:00
|
|
|
|
|
2023-12-17 23:57:24 +00:00
|
|
|
|
export const getServerSideProps: GetServerSideProps<Props> = async ({
|
|
|
|
|
req,
|
|
|
|
|
params,
|
|
|
|
|
}) => {
|
|
|
|
|
if (!req.headers.referer && params?.q) {
|
|
|
|
|
return {
|
|
|
|
|
redirect: {
|
|
|
|
|
destination: `/search?q=${params?.q}`,
|
|
|
|
|
permanent: false,
|
|
|
|
|
},
|
|
|
|
|
};
|
2023-11-22 11:59:45 +00:00
|
|
|
|
}
|
2023-11-29 23:07:31 +00:00
|
|
|
|
|
2023-12-17 23:57:24 +00:00
|
|
|
|
const data = await fetchFeedData({});
|
|
|
|
|
|
|
|
|
|
return { props: { data } };
|
|
|
|
|
};
|
2023-11-29 23:07:31 +00:00
|
|
|
|
|
2023-12-17 23:57:24 +00:00
|
|
|
|
export default async function Home({ data }: Props) {
|
2023-11-10 13:34:04 +00:00
|
|
|
|
return (
|
2023-11-14 15:52:42 +00:00
|
|
|
|
<>
|
2023-11-10 17:17:30 +00:00
|
|
|
|
<SearchBar />
|
2023-11-15 09:35:32 +00:00
|
|
|
|
<div className="space-y-8 w-full my-10">
|
|
|
|
|
<div className="flex flex-row flex-wrap justify-between w-full">
|
2023-11-22 11:27:11 +00:00
|
|
|
|
<Feed
|
|
|
|
|
title="Latest from the community"
|
2023-11-29 23:07:31 +00:00
|
|
|
|
icon={"paper-icon"}
|
2023-11-22 11:59:45 +00:00
|
|
|
|
className="w-[calc(33%-20px)] max-w-md"
|
2023-11-29 23:07:31 +00:00
|
|
|
|
initialData={data.data}
|
2023-11-22 11:27:11 +00:00
|
|
|
|
/>
|
2023-11-15 09:35:32 +00:00
|
|
|
|
</div>
|
2023-12-17 23:57:24 +00:00
|
|
|
|
<GraphicSection.Root
|
|
|
|
|
href="https://lumeweb.com"
|
|
|
|
|
className="h-[100px] border border-gray-800 cursor-pointer [&:hover_.link]:underline [&:hover_.background]:rotate-12 [&:hover_.background]:scale-110"
|
|
|
|
|
>
|
2023-12-05 16:06:54 +00:00
|
|
|
|
<GraphicSection.Background>
|
|
|
|
|
<img
|
|
|
|
|
src="/lume-logo-bg.png"
|
|
|
|
|
className="background transition-transform duration-500 transform-gpu absolute -top-[320px] -right-10"
|
|
|
|
|
alt=""
|
|
|
|
|
aria-hidden
|
|
|
|
|
/>
|
|
|
|
|
</GraphicSection.Background>
|
|
|
|
|
<GraphicSection.Foreground>
|
|
|
|
|
<div className="mt-5 flex flex-col items-center justify-center">
|
|
|
|
|
<p className="text-white text-lg">
|
|
|
|
|
WEB3.NEWS is a project by Lume. Let’s build an open, user-owned
|
|
|
|
|
web together.
|
|
|
|
|
</p>
|
|
|
|
|
<div className="link flex text-gray-400">
|
2023-12-17 23:57:24 +00:00
|
|
|
|
<span>Learn more about Lume and join our community</span>
|
|
|
|
|
<ArrowIcon className=" ml-2 mt-2" />
|
2023-12-05 16:06:54 +00:00
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</GraphicSection.Foreground>
|
|
|
|
|
</GraphicSection.Root>
|
2023-11-10 13:34:04 +00:00
|
|
|
|
</div>
|
2023-11-14 15:52:42 +00:00
|
|
|
|
</>
|
2023-12-17 23:57:24 +00:00
|
|
|
|
);
|
2023-11-29 23:07:31 +00:00
|
|
|
|
}
|