Refactor

actions/user.actions.js

@@ -1,8 +1,20 @@
 "use server";
 import User from "@/lib/schemas/UserSchema";
 import dbConnect from "@/utils/dbConnect";
+import { auth } from "@clerk/nextjs/server";
 
 export const CreateUser = async (payload) => {
+ //* Protect the server action to allow only authenticated users to vist. Server action is basically an api endpoint exposed by the nextjs server
+ const { userId } = auth();
+ if (!userId) {
+ return JSON.parse(
+ JSON.stringify({
+ message: "Unauthorized",
+ status: 401,
+ })
+ );
+ }
+
  const email = payload.email;
  const conn = await dbConnect();
 
@@ -27,4 +39,4 @@ export const CreateUser = async (payload) => {
  data: data,
  })
  );
-};
+};

app/(auth)/onboarding/OnboardingForm.jsx

@@ -40,9 +40,8 @@ const OnboardingForm = ({ email, name, id }) => {
  return (
  <form
  onSubmit={handleSubmit}
- className="max-w-md mx-auto p-4 shadow-md rounded bg-white"
+ className="max-w-md mx-auto p-4 shadow-md rounded bg-white md:my-6 my-3"
  >
-
  <div className="mb-4">
  <label className="block text-gray-700">Name</label>
  <input
@@ -52,7 +51,7 @@ const OnboardingForm = ({ email, name, id }) => {
  onChange={handleChange}
  className="w-full p-2 border border-gray-300 rounded mt-1"
  required
- disabled={loading}
+ disabled
  />
  </div>
 
@@ -65,7 +64,7 @@ const OnboardingForm = ({ email, name, id }) => {
  onChange={handleChange}
  className="w-full p-2 border border-gray-300 rounded mt-1"
  required
- disabled={loading}
+ disabled
  />
  </div>
 
@@ -97,7 +96,7 @@ const OnboardingForm = ({ email, name, id }) => {
 
  <button
  type="submit"
- className="w-full p-2 bg-blue-600 text-white rounded mt-2 hover:bg-blue-700 transition"
+ className="w-full p-2 bg-red-500 text-white rounded mt-2 hover:bg-red-400 transition"
  disabled={loading}
  >
  Submit

app/(auth)/onboarding/page.jsx

@@ -1,12 +1,14 @@
 import { currentUser } from "@clerk/nextjs/server";
 import OnboardingForm from "./OnboardingForm";
+import Link from "next/link";
 
 const OnBoardingPage = async () => {
  const { primaryEmailAddress, fullName, id } = await currentUser();
- 
+
  return (
  <div className="w-full h-screen">
  <h1 className="text-3xl font-bold font-sans">OnBoarding</h1>
+ <Link href={"/"}>Home Page</Link>
  <OnboardingForm
  email={primaryEmailAddress.emailAddress}
  name={fullName}

app/admin/dashboard/page.jsx

@@ -1,8 +1,17 @@
-import Link from "next/link";
-import React from "react";
+import { auth } from "@clerk/nextjs/server";
+import { redirect } from "next/navigation";
 
-const Dashboard = () => {
- return <div className="w-full h-full">Analytics Data</div>;
-};
+export default async function AdminDashboard() {
+ const { sessionClaims } = auth();
 
-export default Dashboard;
+ if (sessionClaims?.metadata.role !== "admin") {
+ redirect("/");
+ }
+
+ return (
+ <>
+ <h1>This is the admin dashboard</h1>
+ <p>This page is restricted to users with the admin role.</p>
+ </>
+ );
+}

lib/schemas/ProductSchema.js

@@ -0,0 +1,16 @@
+import mongoose from "mongoose";
+const { Schema } = mongoose;
+
+const userSchema = new Schema({
+ name: String,
+ category: String,
+ mainImageUrl: String,
+ images: Array,
+ price: String, //todo make price and object price:{actualPrice:"", discountedPrice:"", isSaleOn:false}
+ excerpt: String,
+ description: String,
+ rating: String,
+ reviews: Array,
+});
+
+export default mongoose.models.Product || mongoose.model("Product", userSchema);