add search, filter, watchlist, involved projects view

Author: Megha-Dev-19

apps/new/widget/components/project/Card.jsx

@@ -116,6 +116,7 @@ const EditButton = ({ item }) => {
           id: item.path,
         },
       })}
+      onClick={(e) => e.stopPropagation()}
       type="icon"
       className={"rounded-3"}
       variant="primary"

apps/new/widget/page/projects/MainViewContainer.jsx

@@ -93,7 +93,10 @@ const ProjectCardWrapper = ({ children, project }) => {
   return (
     <div
       className="cursor d-flex flex-1"
-      onClick={() => setShowQuickView(project)}
+      onClick={(e) => {
+        e.stopPropagation();
+        setShowQuickView(project);
+      }}
     >
       {children}
     </div>

apps/old/widget/components/Button.jsx

@@ -103,6 +103,7 @@ function Button({
         className={linkClassName}
         style={{ textDecoration: "none" }}
         target={target}
+        onClick={(e) => e.stopPropagation()}
       >
         <StyledButton
           id={id}
@@ -128,6 +129,7 @@ function Button({
         className={linkClassName}
         style={{ textDecoration: "none" }}
         target={target}
+        onClick={(e) => e.stopPropagation()}
       >
         <StyledButton
           id={id}

playwright-tests/tests/projects.spec.js

@@ -222,4 +222,88 @@ test.describe("?page=projects", () => {
       });
     });
   });
+
+  test.describe("Watchlist", () => {
+    test.beforeEach(async ({ page }) => {
+      await page.goto(`/${ROOT_SRC}?page=projects&tab=watchList`);
+    });
+
+    test.describe("User is not logged in", () => {
+      test.use({
+        storageState:
+          "playwright-tests/storage-states/wallet-not-connected.json",
+      });
+
+      test("should see login screen", async ({ page }) => {
+        const requireLogin = await page.getByText(
+          "Please log in in order to see watchlist projects!",
+        );
+        await expect(requireLogin).toBeVisible();
+      });
+    });
+
+    test.describe("User is logged in with bookmarked project", () => {
+      test.use({
+        storageState:
+          "playwright-tests/storage-states/wallet-connected-project-owner.json",
+      });
+      test("should see projects", async ({ page }) => {
+        const projectTitle = await page.getByText(
+          "Testing project on Build DAO",
+        );
+        await expect(projectTitle).toBeVisible();
+      });
+    });
+
+    test.describe("User without bookmarked projects is logged in", () => {
+      test.use({
+        storageState: "playwright-tests/storage-states/wallet-connected.json",
+      });
+      test("should see empty page", async ({ page }) => {
+        const noProjectFound = await page.getByText("No Projects Found");
+        await expect(noProjectFound).toBeVisible();
+      });
+    });
+  });
+
+  test.describe("Projects Involved", () => {
+    test.beforeEach(async ({ page }) => {
+      await page.goto(`/${ROOT_SRC}?page=projects&tab=involvedProjects`);
+    });
+
+    test.describe("User is not logged in", () => {
+      test.use({
+        storageState:
+          "playwright-tests/storage-states/wallet-not-connected.json",
+      });
+      test("should see login screen", async ({ page }) => {
+        const requireLogin = await page.getByText(
+          "Please log in in order to see involved projects!",
+        );
+        await expect(requireLogin).toBeVisible();
+      });
+    });
+
+    test.describe("User involved in projects is logged in", () => {
+      test.use({
+        storageState: "playwright-tests/storage-states/wallet-connected.json",
+      });
+      test("should see project", async ({ page }) => {
+        const projectTitle = await page.getByText(
+          "Testing project on Build DAO",
+        );
+        await expect(projectTitle).toBeVisible();
+      });
+    });
+
+    test.describe("User not involved in projects is logged in", () => {
+      test.use({
+        storageState: "playwright-tests/storage-states/wallet-connected.json",
+      });
+      test("should see empty screen", async ({ page }) => {
+        const noProjectFound = await page.getByText("No Projects Found");
+        await expect(noProjectFound).toBeVisible();
+      });
+    });
+  });
 });