chore: remove create route and misc UI changes

app/blogs/page.tsx

@@ -1,5 +1,4 @@
 "use client";
-
 import getBlogs from "@/actions/getBlogs";
 import BlogList from "@/components/BlogList";
 

app/protected/[user]/page.tsx

@@ -4,11 +4,11 @@ import { useSession } from "next-auth/react";
 import { useState, useEffect } from "react";
 import { useParams } from "next/navigation";
 import { Card, CardBody, CardHeader, CardFooter, Button, useDisclosure } from "@nextui-org/react";
-import { Blog } from "@/models/UserModel";
 import { FaEdit } from "react-icons/fa";
 import Link from "next/link";
 import Image from "next/image";
 
+import { Blog } from "@/models/UserModel";
 import Loader from "@/components/Loader";
 import PostModal from "@/components/PostModal";
 import firstBlog from "@/assets/dazzle-blog-post-article.gif";
@@ -46,22 +46,21 @@ export default function User() {
         </div>
       ) : blogs.length !== 0 ? (
         <div>
-          <ul className="w-full flex flex-col items-center p-3">
-            <h4 className="text-4xl mt-4  text-blue-700">Your Blogs</h4>
+          <ul className="w-full flex flex-col items-center p-3 mt-7">
             {blogs.map((blog: Blog) => (
               <li
                 key={blog?._id}
                 className="mt-5"
               >
-                <Card className="w-[600px]  p-4 text-cyan-50 ">
+                <Card className="w-[600px] bg-theme  p-4 text-cyan-50 ">
                   <CardHeader className="text-2xl p-4">{blog.title}</CardHeader>
                   <CardBody className="p-4">{blog.content}</CardBody>
                   <CardFooter className="justify-between">
                     <Button
                       as={Link}
                       color="primary"
                       href={`/protected/${params.user}/${blog._id}`}
-                      variant="flat"
+                      className="font-semibold"
                     >
                       <FaEdit />
                       Edit
@@ -74,7 +73,6 @@ export default function User() {
         </div>
       ) : (
         <div className="h-full flex flex-col justify-center items-center">
-          {/* <h2 className="text-2xl"></h2> */}
           <Image
             src={firstBlog}
             alt="first blog"
@@ -87,9 +85,7 @@ export default function User() {
             color="primary"
             variant="light"
             className="text-xl  font-bold transition ease-in-out hover:scale-110 duration-300"
-            // as={Link}
             onPress={onOpen}
-            // href="/create"
           >
             Write your first Post
           </Button>

components/BlogCard.tsx

@@ -1,11 +1,7 @@
-"use client";
-import { Blog } from "@/models/UserModel";
-
-import LikeButton from "./LikeButton";
-
-import React, { useEffect } from "react";
 import { Card, CardBody, CardHeader, CardFooter } from "@nextui-org/card";
 
+import { Blog } from "@/models/UserModel";
+import LikeButton from "./LikeButton";
 import CommentButton from "./CommentButton";
 
 interface CardProps {
@@ -15,8 +11,6 @@ interface CardProps {
 }
 
 const BlogCard = ({ blog, handleLike, handleComment }: CardProps) => {
-  console.log("rendered");
-  console.log(blog);
   return (
     <>
       <Card className="w-full p-2 m-4 bg-theme text-cyan-50 font-semibold  drop-shadow-2xl ">

utils/connectMongo.js

@@ -1,3 +1,3 @@
 import mongoose from "mongoose";
-const connectMongo= async()=>(mongoose.connect('mongodb://127.0.0.1:27017/Users'))
-export default connectMongo
+const connectMongo = async () => mongoose.connect(process.env.MONGODB_URI);
+export default connectMongo;