Feat/cms integration

.gitignore

@@ -0,0 +1 @@
+node_modules

api/package.json

@@ -11,9 +11,6 @@
     "start": "node dist/index.js",
     "dev": "nodemon index.ts",
     "email": "email dev",
-    "start-web": "cd ../web && yarn run dev",
-    "start-api": "yarn run dev",
-    "con": "concurrently \"yarn run start-api\" \"yarn run start-web\"",
     "db:generate": "drizzle-kit generate",
     "db:migrate": "node -r esbuild-register ./scripts/migrate.ts",
     "db:seed": "node -r esbuild-register ./scripts/seed.ts",
@@ -28,7 +25,6 @@
     "@types/node": "^20.11.17",
     "@types/react": "^18.2.55",
     "@types/react-dom": "^18.2.18",
-    "concurrently": "^8.2.2",
     "drizzle-kit": "^0.22.1",
     "nodemon": "^3.0.3",
     "typescript": "^5.3.3"

api/yarn.lock

@@ -10,13 +10,6 @@
     lodash.assignwith "^4.2.0"
     typical "^7.1.1"
 
-"@babel/runtime@^7.21.0":
-  version "7.24.5"
-  resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.5.tgz"
-  integrity sha512-Nms86NXrsaeU9vbBJKni6gXiEXZ4CVpYVzEjDH9Sb8vmZ3UljyA1GSOJl/6LGPO8EHLuSF9H+IxNXHPX8QHJ4g==
-  dependencies:
-    regenerator-runtime "^0.14.0"
-
 "@blakeembrey/deque@^1.0.5":
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/@blakeembrey/deque/-/deque-1.0.5.tgz#f4fa17fc5ee18317ec01a763d355782c7b395eaf"
@@ -764,21 +757,6 @@ [email protected]:
   resolved "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
   integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==
 
-concurrently@^8.2.2:
-  version "8.2.2"
-  resolved "https://registry.npmjs.org/concurrently/-/concurrently-8.2.2.tgz"
-  integrity sha512-1dP4gpXFhei8IOtlXRE/T/4H88ElHgTiUzh71YUmtjTEHMSRS2Z/fgOxHSxxusGHogsRfxNq1vyAwxSC+EVyDg==
-  dependencies:
-    chalk "^4.1.2"
-    date-fns "^2.30.0"
-    lodash "^4.17.21"
-    rxjs "^7.8.1"
-    shell-quote "^1.8.1"
-    spawn-command "0.0.2"
-    supports-color "^8.1.1"
-    tree-kill "^1.2.2"
-    yargs "^17.7.2"
-
 [email protected]:
   version "0.5.4"
   resolved "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz"
@@ -840,13 +818,6 @@ csstype@^3.0.2:
   resolved "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz"
   integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
 
-date-fns@^2.30.0:
-  version "2.30.0"
-  resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.30.0.tgz#f367e644839ff57894ec6ac480de40cae4b0f4d0"
-  integrity sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==
-  dependencies:
-    "@babel/runtime" "^7.21.0"
-
 [email protected]:
   version "2.6.9"
   resolved "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz"
@@ -1821,11 +1792,6 @@ readdirp@~3.6.0:
   dependencies:
     picomatch "^2.2.1"
 
-regenerator-runtime@^0.14.0:
-  version "0.14.1"
-  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz#356ade10263f685dda125100cd862c1db895327f"
-  integrity sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==
-
 require-directory@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42"
@@ -1836,13 +1802,6 @@ resolve-pkg-maps@^1.0.0:
   resolved "https://registry.yarnpkg.com/resolve-pkg-maps/-/resolve-pkg-maps-1.0.0.tgz#616b3dc2c57056b5588c31cdf4b3d64db133720f"
   integrity sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==
 
-rxjs@^7.8.1:
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-7.8.1.tgz#6f6f3d99ea8044291efd92e7c7fcf562c4057543"
-  integrity sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==
-  dependencies:
-    tslib "^2.1.0"
-
 [email protected], safe-buffer@^5.0.1, safe-buffer@~5.2.0:
   version "5.2.1"
   resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz"
@@ -1923,11 +1882,6 @@ shebang-regex@^3.0.0:
   resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172"
   integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==
 
-shell-quote@^1.8.1:
-  version "1.8.1"
-  resolved "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.1.tgz"
-  integrity sha512-6j1W9l1iAs/4xYBI1SYOVZyFcCis9b4KCLQ8fgAGG07QvzaRLVVRQvAy85yNmmZSjYjg4MWh4gNvlPujU/5LpA==
-
 side-channel@^1.0.4:
   version "1.0.6"
   resolved "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz"
@@ -1987,11 +1941,6 @@ sparse-bitfield@^3.0.3:
   dependencies:
     memory-pager "^1.0.2"
 
-[email protected]:
-  version "0.0.2"
-  resolved "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2.tgz"
-  integrity sha512-zC8zGoGkmc8J9ndvml8Xksr1Amk9qBujgbF0JAIWO7kXr43w0h/0GJNM/Vustixu+YE8N/MTrQ7N31FvHUACxQ==
-
 [email protected]:
   version "2.0.1"
   resolved "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz"
@@ -2063,13 +2012,6 @@ supports-color@^7.1.0:
   dependencies:
     has-flag "^4.0.0"
 
-supports-color@^8.1.1:
-  version "8.1.1"
-  resolved "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz"
-  integrity sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==
-  dependencies:
-    has-flag "^4.0.0"
-
 [email protected]:
   version "2.2.0"
   resolved "https://registry.npmjs.org/swr/-/swr-2.2.0.tgz"
@@ -2150,7 +2092,7 @@ ts-node@^10.9.1, ts-node@^10.9.2:
     v8-compile-cache-lib "^3.0.1"
     yn "3.1.1"
 
-[email protected], tslib@^2.0.3, tslib@^2.1.0:
+[email protected], tslib@^2.0.3:
   version "2.4.1"
   resolved "https://registry.npmjs.org/tslib/-/tslib-2.4.1.tgz"
   integrity sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==
@@ -2331,7 +2273,7 @@ yargs-parser@^21.1.1:
   resolved "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz"
   integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==
 
-yargs@^17.1.1, yargs@^17.7.2:
+yargs@^17.1.1:
   version "17.7.2"
   resolved "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz"
   integrity sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==

package.json

@@ -0,0 +1,14 @@
+{
+  "name": "auis-portal",
+  "version": "1.0.0",
+  "repository": "https://github.com/UoaWDCC/auis-portal.git",
+  "license": "MIT",
+  "scripts": {
+    "setup": "yarn && cd ./web && yarn && cd ../strapi && yarn && cd ../api && yarn",
+    "dev": "concurrently \"cd ./database && docker compose up\" \"cd ./web && yarn dev\" \"cd ./strapi && yarn develop\" \"cd ./api && yarn dev\"",
+    "build": "cd ./web && yarn build && cd ../strapi && yarn build && cd ../api && yarn build"
+  },
+  "devDependencies": {
+    "concurrently": "^8.2.2"
+  }
+}

web/__test__/Footer.test.tsx → web/__test__/components/Footer.test.tsx

@@ -1,11 +1,11 @@
 import React from "react";
 import { render, screen } from "@testing-library/react";
 import { describe, it, expect, vi } from "vitest";
-import Footer from "../src/components/Footer";
+import Footer from "../../src/components/Footer";
 import "@testing-library/jest-dom";
 
 // Mock the Socials component
-vi.mock("../src/components/Socials", () => ({
+vi.mock("../../src/components/Socials", () => ({
   default: () => <div>Socials Component</div>,
 }));
 

web/__test__/Header.test.tsx → web/__test__/components/Header.test.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { render, screen, fireEvent } from "@testing-library/react";
 import { MemoryRouter } from "react-router-dom";
 import { describe, it, expect, beforeEach } from "vitest";
-import Header from "../src/components/Header";
+import Header from "../../src/components/Header";
 
 describe("Header component", () => {
   beforeEach(() => {
@@ -68,7 +68,7 @@ describe("Header component", () => {
 
   it("should display navigation links properly on large screens", () => {
     resizeWindow(1024); // Simulate a large screen
-    const links = ["Events", "About Us", "Team", "Partners" , "Credits"];
+    const links = ["Events", "About Us", "Team", "Partners", "Credits"];
     links.forEach((link) => {
       expect(screen.getByText(link)).toBeInTheDocument();
     });

web/__test__/components/Introduction.test.tsx

@@ -0,0 +1,71 @@
+import { MockedProvider } from "@apollo/client/testing";
+import { GET_INTRODUCTION } from "../../src/graphql/queries";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import Introductions from "../../src/components/Introductions";
+import React from "react";
+import { GraphQLError } from "graphql";
+
+const mocks = [
+  {
+    request: {
+      query: GET_INTRODUCTION,
+    },
+    result: {
+      data: {
+        introductions: {
+          data: [
+            {
+              id: 1,
+              attributes: {
+                Events: "Hate",
+                Description: "Be a Professional Hater",
+                Followers: "1000",
+                Members: "2000",
+              },
+            },
+          ],
+        },
+      },
+    },
+  },
+];
+
+describe("Introductions Component", () => {
+  it("renders loading", async () => {
+    render(
+      <MockedProvider mocks={mocks} addTypename={false}>
+        <Introductions />
+      </MockedProvider>
+    );
+    expect(screen.getByTestId("loading-spinner")).toBeInTheDocument();
+  });
+
+  it("renders the mocked data", async () => {
+    render(
+      <MockedProvider mocks={mocks} addTypename={false}>
+        <Introductions />
+      </MockedProvider>
+    );
+    expect(await screen.findByText("Hate")).toBeInTheDocument();
+    expect(
+      await screen.findByText("Be a Professional Hater")
+    ).toBeInTheDocument();
+    expect(await screen.findByText("1000")).toBeInTheDocument();
+    expect(await screen.findByText("2000")).toBeInTheDocument();
+  });
+  it("renders error", async () => {
+    const execMock = {
+      request: {
+        query: GET_INTRODUCTION,
+      },
+      error: new GraphQLError("Error!"),
+    };
+    render(
+      <MockedProvider mocks={[execMock]} addTypename={false}>
+        <Introductions />
+      </MockedProvider>
+    );
+    expect(await screen.findByText("CMS Offline")).toBeInTheDocument();
+  });
+});

web/__test__/components/Partners.test.tsx

@@ -0,0 +1,76 @@
+import { MockedProvider } from "@apollo/client/testing";
+import { GET_PARTNERS } from "../../src/graphql/queries";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import Partners from "../../src/components/Partners";
+import React from "react";
+import { GraphQLError } from "graphql";
+
+const mocks = [
+  {
+    request: {
+      query: GET_PARTNERS,
+    },
+    result: {
+      data: {
+        partners: {
+          data: [
+            {
+              id: 1,
+              attributes: {
+                Name: "Dhruv",
+                Type: "Dal",
+                Location: "Nearest Dal Store",
+                Description: "Come to me for Dal",
+                Image: {
+                  data: {
+                    attributes: {
+                      url: "/uploads/john_doe.jpg",
+                    },
+                  },
+                },
+              },
+            },
+          ],
+        },
+      },
+    },
+  },
+];
+
+describe("Partner Component", () => {
+  it("renders loading", async () => {
+    render(
+      <MockedProvider mocks={mocks} addTypename={false}>
+        <Partners />
+      </MockedProvider>
+    );
+    expect(screen.getByTestId("loading-spinner")).toBeInTheDocument();
+  });
+
+  it("renders the mocked data", async () => {
+    render(
+      <MockedProvider mocks={mocks} addTypename={false}>
+        <Partners />
+      </MockedProvider>
+    );
+    expect(await screen.findByText("Dhruv")).toBeInTheDocument();
+    expect(await screen.findByText("Dal")).toBeInTheDocument();
+    expect(await screen.findByText("Nearest Dal Store")).toBeInTheDocument();
+    expect(await screen.findByText("Come to me for Dal")).toBeInTheDocument();
+  });
+  it("renders error", async () => {
+    const execMock = {
+      request: {
+        query: GET_PARTNERS,
+      },
+      error: new GraphQLError("Error!"),
+    };
+    render(
+      <MockedProvider mocks={[execMock]} addTypename={false}>
+        <Partners />
+      </MockedProvider>
+    );
+    expect(await screen.findByText("CMS Offline")).toBeInTheDocument();
+  });
+});

web/__test__/Socials.test.tsx → web/__test__/components/Socials.test.tsx

@@ -1,13 +1,13 @@
 import React from "react";
 import { render, screen } from "@testing-library/react";
 import { describe, it, expect } from "vitest";
-import Socials from "../src/components/Socials";
+import Socials from "../../src/components/Socials";
 import {
   FacebookLink,
   InstagramLink,
   LinkedinLink,
   EmailLink,
-} from "../src/data/data";
+} from "../../src/data/data";
 
 describe("Socials component", () => {
   it("should render social media links", () => {