dangerouslySetInnerHtml error fixed

next.config.js

@@ -1,4 +1,8 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {}
+const nextConfig = {
+  images:{
+    domains:["lh3.googleusercontent.com","firebasestorage.googleapis.com"]
+  }
+}
 
 module.exports = nextConfig

package.json

@@ -9,10 +9,17 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@auth/prisma-adapter": "^1.0.1",
+    "@prisma/client": "^5.2.0",
     "eslint": "8.48.0",
     "eslint-config-next": "13.4.19",
+    "firebase": "^10.3.0",
     "next": "13.4.19",
+    "next-auth": "^4.23.1",
+    "prisma": "^5.2.0",
     "react": "18.2.0",
-    "react-dom": "18.2.0"
+    "react-dom": "18.2.0",
+    "react-quill": "^2.0.0",
+    "swr": "^2.2.2"
   }
 }

prisma/schema.prisma

@@ -0,0 +1,91 @@
+// This is your Prisma schema file,
+// learn more about it in the docs: https://pris.ly/d/prisma-schema
+
+generator client {
+  provider = "prisma-client-js"
+}
+
+datasource db {
+  provider = "mongodb"
+  url      = env("DATABASE_URL")
+}
+
+model Account {
+  id                String  @id @default(cuid()) @map("_id")
+  userId            String
+  type              String
+  provider          String
+  providerAccountId String
+  refresh_token     String?
+  access_token      String?
+  expires_at        Int?
+  token_type        String?
+  scope             String?
+  id_token          String?
+  session_state     String?
+
+  user User @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+  @@unique([provider, providerAccountId])
+}
+
+model Session {
+  id           String   @id @default(cuid()) @map("_id")
+  sessionToken String   @unique
+  userId       String
+  expires      DateTime
+  user         User     @relation(fields: [userId], references: [id], onDelete: Cascade)
+}
+
+model User {
+  id            String    @id @default(cuid()) @map("_id")
+  name          String?
+  email         String    @unique
+  emailVerified DateTime?
+  image         String?
+  accounts      Account[]
+  sessions      Session[]
+  Post          Post[]
+  Comment       Comment[]
+}
+
+model VerificationToken {
+  identifier String   @id @map("_id")
+  token      String   @unique
+  expires    DateTime
+
+  @@unique([identifier, token])
+}
+
+model Category {
+  id    String  @id @default(cuid()) @map("_id")
+  slug  String  @unique
+  title String
+  img   String?
+  Posts Post[]
+}
+
+model Post {
+  id        String    @id @default(cuid()) @map("_id")
+  createdAt DateTime  @default(now())
+  slug      String    @unique
+  title     String
+  desc      String
+  img       String?
+  views     Int       @default(0)
+  catSlug   String
+  cat       Category  @relation(fields: [catSlug], references: [slug])
+  userEmail String
+  user      User      @relation(fields: [userEmail], references: [email])
+  comments  Comment[]
+}
+
+model Comment {
+  id        String   @id @default(cuid()) @map("_id")
+  createdAt DateTime @default(now())
+  desc      String
+  userEmail String
+  user      User     @relation(fields: [userEmail], references: [email])
+  postSlug  String
+  post      Post     @relation(fields: [postSlug], references: [slug])
+}

src/app/api/auth/[...nextauth]/route.js

@@ -0,0 +1,6 @@
+import { authOptions } from "@/utils/auth";
+import NextAuth from "next-auth";
+
+const handler = NextAuth(authOptions);
+
+export { handler as GET, handler as POST };

src/app/api/categories/route.js

@@ -0,0 +1,15 @@
+import prisma from "@/utils/connect";
+import { NextResponse } from "next/server";
+
+export const GET = async () => {
+  try {
+    const categories = await prisma.category.findMany();
+
+    return new NextResponse(JSON.stringify(categories, { status: 200 }));
+  } catch (err) {
+    console.log(err);
+    return new NextResponse(
+      JSON.stringify({ message: "Something went wrong!" }, { status: 500 })
+    );
+  }
+};

src/app/api/comments/route.js

@@ -0,0 +1,51 @@
+import { getAuthSession } from "@/utils/auth";
+import prisma from "@/utils/connect";
+import { NextResponse } from "next/server";
+
+// GET ALL COMMENTS OF A POST
+export const GET = async (req) => {
+  const { searchParams } = new URL(req.url);
+
+  const postSlug = searchParams.get("postSlug");
+
+  try {
+    const comments = await prisma.comment.findMany({
+      where: {
+        ...(postSlug && { postSlug }),
+      },
+      include: { user: true },
+    });
+
+    return new NextResponse(JSON.stringify(comments, { status: 200 }));
+  } catch (err) {
+    // console.log(err);
+    return new NextResponse(
+      JSON.stringify({ message: "Something went wrong!" }, { status: 500 })
+    );
+  }
+};
+
+// CREATE A COMMENT
+export const POST = async (req) => {
+  const session = await getAuthSession();
+
+  if (!session) {
+    return new NextResponse(
+      JSON.stringify({ message: "Not Authenticated!" }, { status: 401 })
+    );
+  }
+
+  try {
+    const body = await req.json();
+    const comment = await prisma.comment.create({
+      data: { ...body, userEmail: session.user.email },
+    });
+
+    return new NextResponse(JSON.stringify(comment, { status: 200 }));
+  } catch (err) {
+    console.log(err);
+    return new NextResponse(
+      JSON.stringify({ message: "Something went wrong!" }, { status: 500 })
+    );
+  }
+};

src/app/api/posts/[slug]/route.js

@@ -0,0 +1,22 @@
+import prisma from "@/utils/connect";
+import { NextResponse } from "next/server";
+
+// GET SINGLE POST
+export const GET = async (req, { params }) => {
+  const { slug } = params;
+
+  try {
+    const post = await prisma.post.update({
+      where: { slug },
+      data: { views: { increment: 1 } },
+      include: { user: true },
+    });
+
+    return new NextResponse(JSON.stringify(post, { status: 200 }));
+  } catch (err) {
+    console.log(err);
+    return new NextResponse(
+      JSON.stringify({ message: "Something went wrong!" }, { status: 500 })
+    );
+  }
+};

src/app/api/posts/route.js

@@ -0,0 +1,74 @@
+import { getAuthSession } from "@/utils/auth";
+import prisma from "@/utils/connect";
+import { NextResponse } from "next/server";
+
+export const GET = async (req) => {
+  const { searchParams } = new URL(req.url);
+
+  const page = searchParams.get("page");
+  const cat = searchParams.get("cat");
+
+  const POST_PER_PAGE = 2;
+
+  const query = {
+    take: POST_PER_PAGE,
+    skip: POST_PER_PAGE * (page - 1),
+    where: {
+      ...(cat && { catSlug: cat }),
+    },
+  };
+
+
+
+
+
+
+
+
+  try {
+    const [posts, count] = await prisma.$transaction([
+      prisma.post.findMany(query),
+      prisma.post.count({ where: query.where }),
+    ]);
+    return new NextResponse(JSON.stringify({ posts, count }, { status: 200 }));
+  } catch (err) {
+    console.log(err);
+    return new NextResponse(
+      JSON.stringify({ message: "Something went wrong!" }, { status: 500 })
+    );
+  }
+};
+
+
+
+
+
+
+
+
+
+
+// CREATE A POST
+export const POST = async (req) => {
+  const session = await getAuthSession();
+
+  if (!session) {
+    return new NextResponse(
+      JSON.stringify({ message: "Not Authenticated!" }, { status: 401 })
+    );
+  }
+
+  try {
+    const body = await req.json();
+    const post = await prisma.post.create({
+      data: { ...body, userEmail: session.user.email },
+    });
+
+    return new NextResponse(JSON.stringify(post, { status: 200 }));
+  } catch (err) {
+    console.log(err);
+    return new NextResponse(
+      JSON.stringify({ message: "Something went wrong!" }, { status: 500 })
+    );
+  }
+};

src/app/blog/blogPage.module.css

@@ -0,0 +1,13 @@
+.title{
+  background-color: coral;
+  color: white;
+  padding: 5px 10px;
+  text-align: center;
+  text-transform: capitalize;
+}
+
+.content{
+  display: flex;
+  gap: 50px;
+}
+

src/app/blog/page.jsx

@@ -0,0 +1,20 @@
+import CardList from "@/components/cardList/CardList";
+import styles from "./blogPage.module.css";
+import Menu from "@/components/Menu/Menu";
+
+const BlogPage = ({ searchParams }) => {
+  const page = parseInt(searchParams.page) || 1;
+  const { cat } = searchParams;
+
+  return (
+    <div className={styles.container}>
+      <h1 className={styles.title}>{cat} Blog</h1>
+      <div className={styles.content}>
+        <CardList page={page} cat={cat}/>
+        <Menu />
+      </div>
+    </div>
+  );
+};
+
+export default BlogPage;