refactored public page endpoints
This commit is contained in:
@@ -1,18 +1,18 @@
|
||||
import getCollection from "@/lib/api/controllers/public/getCollection";
|
||||
import getPublicCollection from "@/lib/api/controllers/public/collections/getPublicCollection";
|
||||
import type { NextApiRequest, NextApiResponse } from "next";
|
||||
|
||||
export default async function collections(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse
|
||||
) {
|
||||
if (!req?.query?.body) {
|
||||
if (!req?.query?.id) {
|
||||
return res
|
||||
.status(401)
|
||||
.json({ response: "Please choose a valid collection." });
|
||||
}
|
||||
|
||||
if (req.method === "GET") {
|
||||
const collection = await getCollection(req?.query?.body as string);
|
||||
const collection = await getPublicCollection(Number(req?.query?.id));
|
||||
return res
|
||||
.status(collection.status)
|
||||
.json({ response: collection.response });
|
||||
@@ -0,0 +1,41 @@
|
||||
import getPublicLinksUnderCollection from "@/lib/api/controllers/public/links/getPublicLinksUnderCollection";
|
||||
import { LinkRequestQuery } from "@/types/global";
|
||||
import type { NextApiRequest, NextApiResponse } from "next";
|
||||
|
||||
export default async function collections(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse
|
||||
) {
|
||||
if (req.method === "GET") {
|
||||
// Convert the type of the request query to "LinkRequestQuery"
|
||||
const convertedData: Omit<LinkRequestQuery, "tagId"> = {
|
||||
sort: Number(req.query.sort as string),
|
||||
cursor: req.query.cursor ? Number(req.query.cursor as string) : undefined,
|
||||
collectionId: req.query.collectionId
|
||||
? Number(req.query.collectionId as string)
|
||||
: undefined,
|
||||
pinnedOnly: req.query.pinnedOnly
|
||||
? req.query.pinnedOnly === "true"
|
||||
: undefined,
|
||||
searchQueryString: req.query.searchQueryString
|
||||
? (req.query.searchQueryString as string)
|
||||
: undefined,
|
||||
searchByName: req.query.searchByName === "true" ? true : undefined,
|
||||
searchByUrl: req.query.searchByUrl === "true" ? true : undefined,
|
||||
searchByDescription:
|
||||
req.query.searchByDescription === "true" ? true : undefined,
|
||||
searchByTextContent:
|
||||
req.query.searchByTextContent === "true" ? true : undefined,
|
||||
searchByTags: req.query.searchByTags === "true" ? true : undefined,
|
||||
};
|
||||
|
||||
if (!convertedData.collectionId) {
|
||||
return res
|
||||
.status(400)
|
||||
.json({ response: "Please choose a valid collection." });
|
||||
}
|
||||
|
||||
const links = await getPublicLinksUnderCollection(convertedData);
|
||||
return res.status(links.status).json({ response: links.response });
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
import type { NextApiRequest, NextApiResponse } from "next";
|
||||
import getPublicUserById from "@/lib/api/controllers/public/users/getPublicUserById";
|
||||
import getPublicUser from "@/lib/api/controllers/public/users/getPublicUser";
|
||||
import { getToken } from "next-auth/jwt";
|
||||
|
||||
export default async function users(req: NextApiRequest, res: NextApiResponse) {
|
||||
@@ -12,7 +12,7 @@ export default async function users(req: NextApiRequest, res: NextApiResponse) {
|
||||
const isId = lookupId.split("").every((e) => Number.isInteger(parseInt(e)));
|
||||
|
||||
if (req.method === "GET") {
|
||||
const users = await getPublicUserById(lookupId, isId, requestingId);
|
||||
const users = await getPublicUser(lookupId, isId, requestingId);
|
||||
return res.status(users.status).json({ response: users.response });
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
"use client";
|
||||
import LinkCard from "@/components/PublicPage/LinkCard";
|
||||
import useDetectPageBottom from "@/hooks/useDetectPageBottom";
|
||||
import getPublicCollectionData from "@/lib/client/getPublicCollectionData";
|
||||
import { PublicCollectionIncludingLinks } from "@/types/global";
|
||||
import { CollectionIncludingMembersAndLinkCount, Sort } from "@/types/global";
|
||||
import { useRouter } from "next/router";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { motion, Variants } from "framer-motion";
|
||||
import Head from "next/head";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import useLinkStore from "@/store/links";
|
||||
|
||||
const cardVariants: Variants = {
|
||||
offscreen: {
|
||||
@@ -23,20 +24,42 @@ const cardVariants: Variants = {
|
||||
};
|
||||
|
||||
export default function PublicCollections() {
|
||||
const router = useRouter();
|
||||
const { reachedBottom, setReachedBottom } = useDetectPageBottom();
|
||||
const { links } = useLinkStore();
|
||||
|
||||
const [data, setData] = useState<PublicCollectionIncludingLinks>();
|
||||
const router = useRouter();
|
||||
|
||||
const [searchFilter, setSearchFilter] = useState({
|
||||
name: true,
|
||||
url: true,
|
||||
description: true,
|
||||
textContent: true,
|
||||
tags: true,
|
||||
});
|
||||
|
||||
const [filterDropdown, setFilterDropdown] = useState(false);
|
||||
const [sortDropdown, setSortDropdown] = useState(false);
|
||||
const [sortBy, setSortBy] = useState<Sort>(Sort.DateNewestFirst);
|
||||
|
||||
useLinks({
|
||||
sort: sortBy,
|
||||
searchQueryString: router.query.q
|
||||
? decodeURIComponent(router.query.q as string)
|
||||
: undefined,
|
||||
searchByName: searchFilter.name,
|
||||
searchByUrl: searchFilter.url,
|
||||
searchByDescription: searchFilter.description,
|
||||
searchByTextContent: searchFilter.textContent,
|
||||
searchByTags: searchFilter.tags,
|
||||
});
|
||||
|
||||
const [collection, setCollection] =
|
||||
useState<CollectionIncludingMembersAndLinkCount>();
|
||||
|
||||
document.body.style.background = "white";
|
||||
|
||||
useEffect(() => {
|
||||
if (router.query.id) {
|
||||
getPublicCollectionData(
|
||||
Number(router.query.id),
|
||||
data as PublicCollectionIncludingLinks,
|
||||
setData
|
||||
);
|
||||
getPublicCollectionData(Number(router.query.id), setCollection);
|
||||
}
|
||||
|
||||
// document
|
||||
@@ -49,26 +72,14 @@ export default function PublicCollections() {
|
||||
// );
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (reachedBottom && router.query.id) {
|
||||
getPublicCollectionData(
|
||||
Number(router.query.id),
|
||||
data as PublicCollectionIncludingLinks,
|
||||
setData
|
||||
);
|
||||
}
|
||||
|
||||
setReachedBottom(false);
|
||||
}, [reachedBottom]);
|
||||
|
||||
return data ? (
|
||||
return collection ? (
|
||||
<div className="max-w-4xl mx-auto p-5 bg">
|
||||
{data ? (
|
||||
{collection ? (
|
||||
<Head>
|
||||
<title>{data.name} | Linkwarden</title>
|
||||
<title>{collection.name} | Linkwarden</title>
|
||||
<meta
|
||||
property="og:title"
|
||||
content={`${data.name} | Linkwarden`}
|
||||
content={`${collection.name} | Linkwarden`}
|
||||
key="title"
|
||||
/>
|
||||
</Head>
|
||||
@@ -76,31 +87,33 @@ export default function PublicCollections() {
|
||||
<div
|
||||
className={`border border-solid border-sky-100 text-center bg-gradient-to-tr from-sky-100 from-10% via-gray-100 via-20% rounded-3xl shadow-lg p-5`}
|
||||
>
|
||||
<p className="text-5xl text-black mb-5 capitalize">{data.name}</p>
|
||||
<p className="text-5xl text-black mb-5 capitalize">{collection.name}</p>
|
||||
|
||||
{data.description && (
|
||||
{collection.description && (
|
||||
<>
|
||||
<hr className="mt-5 max-w-[30rem] mx-auto border-1 border-slate-400" />
|
||||
<p className="mt-2 text-gray-500">{data.description}</p>
|
||||
<p className="mt-2 text-gray-500">{collection.description}</p>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-5 my-8">
|
||||
{data?.links?.map((e, i) => {
|
||||
return (
|
||||
<motion.div
|
||||
key={i}
|
||||
initial="offscreen"
|
||||
whileInView="onscreen"
|
||||
viewport={{ once: true, amount: 0.8 }}
|
||||
>
|
||||
<motion.div variants={cardVariants}>
|
||||
<LinkCard link={e} count={i} />
|
||||
{links
|
||||
?.filter((e) => e.collectionId === Number(router.query.id))
|
||||
.map((e, i) => {
|
||||
return (
|
||||
<motion.div
|
||||
key={i}
|
||||
initial="offscreen"
|
||||
whileInView="onscreen"
|
||||
viewport={{ once: true, amount: 0.8 }}
|
||||
>
|
||||
<motion.div variants={cardVariants}>
|
||||
<LinkCard link={e as any} count={i} />
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
);
|
||||
})}
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
{/* <p className="text-center font-bold text-gray-500">
|
||||
|
||||
+2
-3
@@ -11,10 +11,9 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { useRouter } from "next/router";
|
||||
import { FormEvent, useEffect, useState } from "react";
|
||||
import MainLayout from "@/layouts/MainLayout";
|
||||
import { Tag } from "@prisma/client";
|
||||
import useTagStore from "@/store/tags";
|
||||
import SortDropdown from "@/components/SortDropdown";
|
||||
import { Sort } from "@/types/global";
|
||||
import { Sort, TagIncludingLinkCount } from "@/types/global";
|
||||
import useLinks from "@/hooks/useLinks";
|
||||
import Dropdown from "@/components/Dropdown";
|
||||
import { toast } from "react-hot-toast";
|
||||
@@ -33,7 +32,7 @@ export default function Index() {
|
||||
const [renameTag, setRenameTag] = useState(false);
|
||||
const [newTagName, setNewTagName] = useState<string>();
|
||||
|
||||
const [activeTag, setActiveTag] = useState<Tag>();
|
||||
const [activeTag, setActiveTag] = useState<TagIncludingLinkCount>();
|
||||
|
||||
useLinks({ tagId: Number(router.query.id), sort: sortBy });
|
||||
|
||||
|
||||
Reference in New Issue
Block a user