Added Pages and Content

app/(root)/ask-question/page.tsx

@@ -0,0 +1,32 @@
+import { auth } from "@clerk/nextjs";
+import { redirect } from "next/navigation";
+
+import Question from "@/components/forms/Question";
+
+import { getUserById } from "@/lib/actions/user.action";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+ title: "Ask a Question — DevOverflow",
+};
+
+const Page = async () => {
+ const { userId } = auth();
+
+ if (!userId) return null;
+
+ const mongoUser = await getUserById({ userId });
+ if (!mongoUser?.onboarded) redirect("/onboarding");
+
+ return (
+ <div>
+ <h1 className="h1-bold text-dark100_light900">Ask a Question</h1>
+
+ <div className="mt-9">
+ <Question type="create" mongoUserId={JSON.stringify(mongoUser._id)} />
+ </div>
+ </div>
+ );
+};
+
+export default Page;

app/(root)/collection/loading.tsx

@@ -0,0 +1,22 @@
+import { Skeleton } from "@/components/ui/skeleton";
+
+const Loading = () => {
+ return (
+ <section>
+ <h1 className="h1-bold text-dark100_light900">Saved Questions</h1>
+
+ <div className="mb-12 mt-11 flex flex-wrap gap-5">
+ <Skeleton className="h-14 flex-1" />
+ <Skeleton className="h-14 w-28" />
+ </div>
+
+ <div className="flex flex-col gap-6">
+ {[...Array(10)].map((_, i) => (
+ <Skeleton key={i} className="h-48 w-full rounded-xl" />
+ ))}
+ </div>
+ </section>
+ );
+};
+
+export default Loading;

app/(root)/collection/page.tsx

@@ -0,0 +1,88 @@
+import { auth } from "@clerk/nextjs";
+import { redirect } from "next/navigation";
+
+import LocalSearchbar from "@/components/shared/search/LocalSearchbar";
+import Filter from "@/components/shared/Filter";
+import NoResult from "@/components/shared/NoResult";
+import Pagination from "@/components/shared/Pagination";
+import QuestionCard from "@/components/cards/QuestionCard";
+
+import { getSavedQuestions, getUserById } from "@/lib/actions/user.action";
+
+import { QuestionFilters } from "@/constants/filters";
+
+import type { SearchParamsProps } from "@/types";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+ title: "Collection — DevOverflow",
+};
+
+export default async function Collection({ searchParams }: SearchParamsProps) {
+ const { userId: clerkId } = auth();
+
+ if (!clerkId) return null;
+
+ const mongoUser = await getUserById({ userId: clerkId });
+ if (!mongoUser?.onboarded) redirect("/onboarding");
+
+ const result = await getSavedQuestions({
+ clerkId,
+ searchQuery: searchParams.q,
+ filter: searchParams.filter,
+ page: searchParams.page ? +searchParams.page : 1,
+ });
+
+ return (
+ <>
+ <h1 className="h1-bold text-dark100_light900">Saved Questions</h1>
+ <div className="mt-11 flex justify-between gap-5 max-sm:flex-col sm:items-center">
+ <LocalSearchbar
+ route="/collection"
+ iconPosition="left"
+ imgSrc="/assets/icons/search.svg"
+ placeholder="Search for questions"
+ otherClasses="flex-1"
+ />
+
+ <Filter
+ filters={QuestionFilters}
+ otherClasses="min-h-[56px] sm:min-w-[170px]"
+ />
+ </div>
+
+ <div className="mt-10 flex w-full flex-col gap-6">
+ {result.questions.length > 0 ? (
+ result.questions.map((question: any) => (
+ <QuestionCard
+ key={question._id}
+ _id={question._id}
+ clerkId={clerkId}
+ title={question.title}
+ tags={question.tags}
+ author={question.author}
+ upvotes={question.upvotes}
+ views={question.views}
+ answers={question.answers}
+ createdAt={question.createdAt}
+ />
+ ))
+ ) : (
+ <NoResult
+ title="No Saved Questions Found"
+ description="It appears that there are no saved questions in your collection at the moment 😔. Start exploring and saving questions that pique your interest 🌟"
+ link="/"
+ linkTitle="Explore Questions"
+ />
+ )}
+ </div>
+
+ <div className="mt-10">
+ <Pagination
+ pageNumber={searchParams?.page ? +searchParams.page : 1}
+ isNext={result.isNext}
+ />
+ </div>
+ </>
+ );
+}

app/(root)/community/loading.tsx

@@ -0,0 +1,22 @@
+import { Skeleton } from "@/components/ui/skeleton";
+
+const Loading = () => {
+ return (
+ <section>
+ <h1 className="h1-bold text-dark100_light900">All Users</h1>
+
+ <div className="mb-12 mt-11 flex flex-wrap gap-5">
+ <Skeleton className="h-14 flex-1" />
+ <Skeleton className="h-14 w-28" />
+ </div>
+
+ <div className="flex flex-wrap gap-4">
+ {[...Array(10)].map((_, i) => (
+ <Skeleton key={i} className="h-60 w-full rounded-2xl sm:w-[260px]" />
+ ))}
+ </div>
+ </section>
+ );
+};
+
+export default Loading;

app/(root)/community/page.tsx

@@ -0,0 +1,69 @@
+import Filter from "@/components/shared/Filter";
+import NoResult from "@/components/shared/NoResult";
+import Pagination from "@/components/shared/Pagination";
+import LocalSearchbar from "@/components/shared/search/LocalSearchbar";
+import UserCard from "@/components/cards/UserCard";
+
+import { getAllUsers } from "@/lib/actions/user.action";
+
+import { UserFilters } from "@/constants/filters";
+
+import type { SearchParamsProps } from "@/types";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+ title: "Community — DevOverflow",
+};
+
+const Page = async ({ searchParams }: SearchParamsProps) => {
+ const result = await getAllUsers({
+ searchQuery: searchParams.q,
+ filter: searchParams.filter,
+ page: searchParams.page ? +searchParams.page : 1,
+ });
+
+ return (
+ <>
+ <h1 className="h1-bold text-dark100_light900">All Users</h1>
+
+ <div className="mt-11 flex justify-between gap-5 max-sm:flex-col sm:items-center">
+ <LocalSearchbar
+ route="/community"
+ iconPosition="left"
+ imgSrc="/assets/icons/search.svg"
+ placeholder="Search for amazing minds"
+ otherClasses="flex-1"
+ />
+
+ <Filter
+ filters={UserFilters}
+ otherClasses="min-h-[56px] sm:min-w-[170px]"
+ />
+ </div>
+
+ <section className="mt-12 flex flex-wrap gap-4">
+ {result.users.length > 0 ? (
+ result.users.map((user: any) => (
+ <UserCard key={user._id} user={user} />
+ ))
+ ) : (
+ <NoResult
+ title="No Users Found"
+ description="Be the first to break the silence! 🚀 Signup to be the first and kickstart the community. Get involved! 💡"
+ link="/sign-up"
+ linkTitle="Sign Up"
+ />
+ )}
+ </section>
+
+ <div className="mt-10">
+ <Pagination
+ pageNumber={searchParams?.page ? +searchParams.page : 1}
+ isNext={result.isNext}
+ />
+ </div>
+ </>
+ );
+};
+
+export default Page;

app/(root)/edit-answer/[id]/page.tsx

@@ -0,0 +1,44 @@
+import { auth } from "@clerk/nextjs";
+import { redirect } from "next/navigation";
+
+import Answer from "@/components/forms/Answer";
+
+import { getUserById } from "@/lib/actions/user.action";
+import { getAnswerById } from "@/lib/actions/answer.action";
+
+import type { ParamsProps } from "@/types";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+ title: "Edit Answer — DevOverflow",
+};
+
+const Page = async ({ params }: ParamsProps) => {
+ const { userId } = auth();
+
+ if (!userId) return null;
+
+ const mongoUser = await getUserById({ userId });
+ if (!mongoUser?.onboarded) redirect("/onboarding");
+
+ const result = await getAnswerById({ answerId: params.id });
+
+ if (userId !== result.author.clerkId) redirect("/");
+
+ return (
+ <>
+ <h1 className="h1-bold text-dark100_light900">Edit Answer</h1>
+ <div className="mt-9">
+ <Answer
+ type="Edit"
+ question={result.content}
+ questionId={JSON.stringify(result.question)}
+ authorId={JSON.stringify(result.author)}
+ answerData={JSON.stringify(result)}
+ />
+ </div>
+ </>
+ );
+};
+
+export default Page;

app/(root)/jobs/loading.tsx

@@ -0,0 +1,34 @@
+import { Skeleton } from "@/components/ui/skeleton";
+
+const Loading = () => {
+ return (
+ <section>
+ <h1 className="h1-bold text-dark100_light900">Jobs</h1>
+
+ <div className="mb-12 mt-11 flex flex-wrap gap-5">
+ <Skeleton className="h-14 flex-1" />
+ <Skeleton className="h-14 w-28" />
+ </div>
+
+ <div className="my-10">
+ <div className="hidden flex-wrap gap-3 md:flex">
+ <Skeleton className="h-9 w-28" />
+ <Skeleton className="h-9 w-28" />
+ <Skeleton className="h-9 w-28" />
+ <Skeleton className="h-9 w-28" />
+ </div>
+ <div className="mt-2">
+ <Skeleton className="h-9 w-72" />
+ </div>
+ </div>
+
+ <div className="flex flex-col gap-6">
+ {[...Array(10)].map((_, i) => (
+ <Skeleton key={i} className="h-52 w-full rounded-xl" />
+ ))}
+ </div>
+ </section>
+ );
+};
+
+export default Loading;