Added Polls Page

frontend/src/components/Header/Header.jsx

@@ -1,26 +1,37 @@
-import React from 'react'
-import { Link } from 'react-router-dom'
-import useUserStore from '../../store/useStore'
-import ProfileImage from './ProfileImage';
+import React from "react";
+import { Link } from "react-router-dom";
+import useUserStore from "../../store/useStore";
+import ProfileImage from "./ProfileImage";
 
 function Header() {
-
-  const {user} = useUserStore();
+  const { user } = useUserStore();
 
   return (
     <div className="navbar bg-base-100">
-  <div className="flex-1">
-  <Link to={"/"} className="btn btn-ghost text-xl">LivePoll</Link>
-  </div>
-  <div className="flex-none">
-    <ul className="menu menu-horizontal px-1">
-      {user.username ? <li><Link to={"/dashboard"}>Dashboard</Link></li> : <li><Link to={"/login"}>Login</Link></li>}
-      <li><Link to={'/bookmark'}>Bookmarks</Link></li>
-    </ul>
-  </div>  
-  {user.username && <ProfileImage userData={user}/>}
-</div>
-  )
+      <div className="flex-1">
+        <Link to={"/"} className="btn btn-ghost text-xl">
+          LivePoll
+        </Link>
+      </div>
+      <div className="flex-none">
+        <ul className="menu menu-horizontal px-1 gap-1">
+          {user.username ? (
+            <li>
+              <Link to={"/dashboard"}>Dashboard</Link>
+            </li>
+          ) : (
+            <li>
+              <Link to={"/login"}>Login</Link>
+            </li>
+          )}
+          <li>
+            <Link to={"/poll"}>Polls</Link>
+          </li>
+        </ul>
+      </div>
+      {user.username && <ProfileImage userData={user} />}
+    </div>
+  );
 }
 
-export default Header
+export default Header;

frontend/src/components/Header/ProfileImage.jsx

@@ -29,6 +29,9 @@ function ProfileImage({userData}) {
             Profile
             <span className="badge">New</span>
           </Link>
+          <Link to={"/bookmark"} className="justify-between" >
+            Bookmarks
+          </Link>
         </li>
         <li><a onClick={handleLogout}>Logout</a></li>
       </ul>

frontend/src/components/PollCard/PollCard.jsx

@@ -0,0 +1,28 @@
+import React from "react";
+import { useNavigate } from "react-router-dom";
+
+function PollCard({ poll }) {
+
+    const navigator = useNavigate();
+
+    const handleViewOnClick = () => {
+        navigator(`/view/${poll._id}`);
+    };
+
+  return (
+    <div className="card bg-base-300 shadow-xl text-white w-full md:w-80">
+      <div className="card-body">
+        <h2 className="card-title text-xl font-bold">{poll.title}</h2>
+        <p className="text-sm text-base-content">{poll.description}</p>
+        <div className="flex items-center justify-between mt-4">
+          <div className="text-xs text-gray-400">
+            Created by <span className="text-yellow-400">{poll.creatorData.username}</span> on {new Date(poll?.createdAt).toLocaleDateString()}
+          </div>
+          <button onClick={handleViewOnClick} className="btn btn-primary btn-sm text-base-content">View</button>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default PollCard;