redux toolkit added

package.json

@@ -10,13 +10,15 @@
   },
   "dependencies": {
     "@prisma/client": "^4.12.0",
+    "@reduxjs/toolkit": "^1.9.3",
     "eslint": "8.37.0",
     "eslint-config-next": "13.2.4",
     "next": "13.2.4",
     "prisma": "^4.12.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-icons": "^4.8.0"
+    "react-icons": "^4.8.0",
+    "react-redux": "^8.0.5"
   },
   "devDependencies": {
     "autoprefixer": "^10.4.14",

pages/_app.js

@@ -2,6 +2,8 @@ import Footer from "@/components/Footer";
 import Navbar from "@/components/Navbar";
 import Head from "next/head";
 import "@/styles/globals.css";
+import { Provider } from "react-redux";
+import store from "@/store";
 
 export default function App({ Component, pageProps }) {
   return (
@@ -20,9 +22,11 @@ export default function App({ Component, pageProps }) {
         <meta name="robots" content="index, follow" />
         <link rel="canonical" href="https://www.euphoria.com/" />
       </Head>
-      <Navbar />
-      <Component {...pageProps} />
-      <Footer />
+      <Provider store={store}>
+        <Navbar />
+        <Component {...pageProps} />
+        <Footer />
+      </Provider>
     </>
   );
 }

pages/products/[productId].js

@@ -44,7 +44,10 @@ const ProductDetails = ({ product }) => {
         >
           Add to Cart
         </Link>
-        <p className="text-gray-500 mt-5">{product.description}</p>
+        <div className="mt-5">
+          <p className="font-medium mb-3">Description:</p>
+          <p className="text-gray-500">{product.description}</p>
+        </div>
       </div>
     </div>
   );

store/index.js

@@ -0,0 +1,10 @@
+import { configureStore } from "@reduxjs/toolkit";
+import { productSlice } from "./productSlice";
+
+const store = configureStore({
+  reducer: {
+    products: productSlice.reducer,
+  },
+});
+
+export default store;

store/productSlice.js

@@ -0,0 +1,15 @@
+import { createSlice } from "@reduxjs/toolkit";
+
+const initialState = {
+  products: localStorage.getItem("products")
+    ? JSON.parse(localStorage.getItem("products"))
+    : [],
+};
+
+export const productSlice = createSlice({
+  name: "products",
+  initialState,
+  reducers: {},
+});
+
+export const {} = productSlice.actions;