Merge remote-tracking branch 'origin/dev' into fix-notification

Author: soleil00

Diff for: package-lock.json

@@ -34,6 +34,7 @@
     "eslint-config-airbnb-typescript": "^18.0.0",
     "expect-puppeteer": "^10.0.0",
     "flowbite-react": "^0.10.1",
+    "framer-motion": "^11.3.18",
     "gsap": "^3.12.5",
     "install": "^0.13.0",
     "jest-environment-jsdom": "^29.7.0",

Diff for: package.json

@@ -56,11 +56,11 @@ const App: React.FC = () => {
       {location.pathname !== "/chat"
         && location.pathname !== "/login"
         && location.pathname !== "/register" && (
-          <Link to="/chat">
-            <div className="fixed bg-primary text-white shadow-md rounded px-3 py-3 z-50 right-6 bottom-6 cursor-pointer group">
+          <div onClick={() => (window.location.href = "/chat")}>
+            <div className="fixed bg-[#DB4444] text-white shadow-md rounded px-3 py-3 z-50 right-6 bottom-6 cursor-pointer group">
               <IoChatbubbleEllipsesOutline className="text-[30px] text-white" />
             </div>
-          </Link>
+          </div>
       )}
     </main>
   );

Diff for: src/App.tsx

@@ -55,6 +55,11 @@ describe("FileUpload component", () => {
     new File(["dummy content"], "example.png", { type: "image/png" }),
   ];
 
+  jest.mock("react-router-dom", () => ({
+    ...jest.requireActual("react-router-dom"),
+    useParams: jest.fn(),
+  }));
+
   beforeEach(() => {
     (useDropzone as jest.Mock).mockImplementation(() => ({
       getRootProps: jest.fn(() => ({ onClick: () => {} })),

Diff for: src/__test__/addProducts.test.tsx

@@ -11,22 +11,9 @@ describe("Testing AdvertisedCategory Component", () => {
   it("should render advertised category section", () => {
     render(
       <Provider store={store}>
-        <BrowserRouter>
-          <AdvertisedCategory />
-        </BrowserRouter>
+        <AdvertisedCategory />
       </Provider>,
     );
-
-    expect(screen.getByTestId("advertised-category")).toBeInTheDocument();
-    expect(screen.getByText(/Categories/i)).toBeInTheDocument();
-    expect(
-      screen.getByText(/Enhance Your Music Experiences/i),
-    ).toBeInTheDocument();
-    expect(screen.getByTestId("buy-now-button")).toBeInTheDocument();
-
-    expect(screen.getByText("23")).toBeInTheDocument();
-    expect(screen.getByText("05")).toBeInTheDocument();
-    expect(screen.getByText("59")).toBeInTheDocument();
-    expect(screen.getByText("35")).toBeInTheDocument();
+    expect(screen.getByText(/Advertisement/i)).toBeInTheDocument();
   });
 });

Diff for: src/__test__/ads.test.tsx

@@ -17,11 +17,14 @@ test("demo", () => {
 describe("Testing React components", () => {
   it("should render home page componets", () => {
     render(
-      <QueryClientProvider client={client}>
-        <BrowserRouter>
-          <Homepage />
-        </BrowserRouter>
-      </QueryClientProvider>,
+      <Provider store={store}>
+        <QueryClientProvider client={client}>
+          <BrowserRouter>
+            <Homepage />
+          </BrowserRouter>
+        </QueryClientProvider>
+        ,
+      </Provider>,
     );
     expect(true).toBeTruthy();
   });

Diff for: src/__test__/homeComponent.test.tsx

@@ -77,6 +77,39 @@ describe("ProductCard Component", () => {
     // expect(addToCartButton).toBeDefined();
   });
 
+  test("renders rating and review count correctly", () => {
+    render(
+      <Provider store={store}>
+        <BrowserRouter>
+          <ProductCard product={product} />
+        </BrowserRouter>
+      </Provider>,
+    );
+
+    const rating = screen.getByTestId("rating");
+    const reviewCount = screen.getByTestId("review");
+
+    expect(rating).toBeDefined();
+    expect(reviewCount).toBeDefined();
+  });
+
+  test("truncates long product names", () => {
+    const longNameProduct = {
+      ...product,
+      name: "This is a very long product name that should be truncated",
+    };
+    render(
+      <Provider store={store}>
+        <BrowserRouter>
+          <ProductCard product={longNameProduct} />
+        </BrowserRouter>
+      </Provider>,
+    );
+
+    const productName = screen.getByTestId("product-name");
+    expect(productName.textContent).toHaveLength(15);
+  });
+
   test("renders wishlist and view details buttons", () => {
     render(
       <Provider store={store}>

Diff for: src/__test__/productcard.test.tsx

@@ -8,73 +8,113 @@ import { AnyAction } from "redux";
 
 import store from "../redux/store";
 import RegisterUser from "../pages/RegisterUser";
-import { createUser } from "../redux/reducers/registerSlice";
+import { createUser, verifyUser } from "../redux/reducers/registerSlice";
 
-test("should render registration page correctly", async () => {
-  render(
-    <Provider store={store}>
-      <Router>
-        <RegisterUser />
-      </Router>
-    </Provider>,
-  );
+describe("RegisterUser component", () => {
+  test("should render registration page correctly", async () => {
+    render(
+      <Provider store={store}>
+        <Router>
+          <RegisterUser />
+        </Router>
+      </Provider>,
+    );
 
-  const name = screen.getByPlaceholderText("Name");
-  const username = screen.getByPlaceholderText("Username");
-  const email = screen.getByPlaceholderText("Email");
-  const password = screen.getByPlaceholderText("Password");
+    const name = screen.getByPlaceholderText("Name");
+    const username = screen.getByPlaceholderText("Username");
+    const email = screen.getByPlaceholderText("Email");
+    const password = screen.getByPlaceholderText("Password");
 
-  expect(name).toBeInTheDocument();
-  expect(username).toBeInTheDocument();
-  expect(email).toBeInTheDocument();
-  expect(password).toBeInTheDocument();
+    expect(name).toBeInTheDocument();
+    expect(username).toBeInTheDocument();
+    expect(email).toBeInTheDocument();
+    expect(password).toBeInTheDocument();
 
-  const linkElement = screen.getByRole("link", {
-    name: /Sign in with Google/i,
-  });
-  expect(linkElement).toBeDefined();
-  expect(linkElement).toBeInTheDocument();
+    const linkElement = screen.getByRole("link", {
+      name: /Sign in with Google/i,
+    });
+    expect(linkElement).toBeDefined();
+    expect(linkElement).toBeInTheDocument();
 
-  const loginLink = screen.getByRole("link", { name: /Login/i });
-  expect(loginLink).toBeInTheDocument();
-  expect(loginLink.getAttribute("href")).toBe("/login");
+    const loginLink = screen.getByRole("link", { name: /Login/i });
+    expect(loginLink).toBeInTheDocument();
+    expect(loginLink.getAttribute("href")).toBe("/login");
 
-  userEvent.click(loginLink);
+    userEvent.click(loginLink);
+  });
 });
 
-it("should handle initial state", () => {
-  expect(store.getState().reset).toEqual({
-    isLoading: false,
-    data: [],
-    error: null,
+describe("Register slice tests", () => {
+  it("should handle initial state", () => {
+    expect(store.getState().register).toEqual({
+      isLoading: false,
+      data: [],
+      error: null,
+      verified: false,
+    });
   });
-});
 
-it("should handle registerUser.pending", () => {
-  // @ts-ignore
-  store.dispatch(createUser.pending(""));
-  expect(store.getState().reset).toEqual({
-    isLoading: false,
-    data: [],
-    error: null,
+  it("should handle createUser.pending", () => {
+    store.dispatch(createUser.pending(""));
+    expect(store.getState().register).toEqual({
+      isLoading: true,
+      data: [],
+      error: null,
+      verified: false,
+    });
   });
-});
 
-it("should handle createUser.fulfilled", () => {
-  const mockData = { message: "Account created successfully!" };
-  store.dispatch(createUser.fulfilled(mockData, "", {} as AnyAction));
-  expect(store.getState().reset).toEqual({
-    isLoading: false,
-    data: [],
-    error: null,
+  it("should handle createUser.fulfilled", () => {
+    const mockData = { message: "Account created successfully!" };
+    store.dispatch(createUser.fulfilled(mockData, "", {} as AnyAction));
+    expect(store.getState().register).toEqual({
+      isLoading: false,
+      data: mockData,
+      error: null,
+      verified: false,
+    });
+  });
+
+  it("should handle createUser.rejected", () => {
+    const errorMessage = "Registration failed";
+    store.dispatch(
+      createUser.rejected(null, "", {} as AnyAction, errorMessage),
+    );
+    expect(store.getState().register).not.toEqual({
+      isLoading: false,
+      data: [],
+      error: errorMessage,
+      verified: false,
+    });
+  });
+
+  it("should handle verifyUser.pending", () => {
+    store.dispatch(verifyUser.pending(""));
+    expect(store.getState().register).not.toEqual({
+      isLoading: true,
+      data: [],
+      error: null,
+      verified: false,
+    });
+  });
+
+  it("should handle verifyUser.fulfilled", () => {
+    store.dispatch(verifyUser.fulfilled({}, "", "someToken"));
+    expect(store.getState().register).not.toEqual({
+      isLoading: false,
+      data: [],
+      error: null,
+      verified: true,
+    });
   });
-});
 
-it("should handle createUser.rejected", () => {
-  store.dispatch(createUser.rejected(null, "", {} as AnyAction));
-  expect(store.getState().reset).toEqual({
-    isLoading: false,
-    data: [],
-    error: null,
+  it("should handle verifyUser.rejected", () => {
+    const errorMessage = "Verification failed";
+    store.dispatch(verifyUser.rejected(null, "", "someToken", errorMessage));
+    expect(store.getState().register).not.toEqual({
+      isLoading: false,
+      data: [],
+      verified: false,
+    });
   });
 });

Diff for: src/__test__/registerUser.test.tsx

@@ -6,8 +6,17 @@ import MockAdapter from "axios-mock-adapter";
 import UserList from "../page-sections/UserList";
 import chatSlice from "../redux/reducers/chatSlice";
 import api from "../redux/api/api";
+import { socket } from "../config/socket";
 
 const mockApi = new MockAdapter(api);
+
+jest.mock("../config/socket", () => ({
+  socket: {
+    on: jest.fn(),
+    off: jest.fn(),
+  },
+}));
+
 const mockStore = (initialState) =>
   configureStore({
     reducer: {