Created page for blocking non-members from bookings

client/.storybook/main.ts

@@ -23,7 +23,7 @@ const config: StorybookConfig = {
   core: {
     builder: "@storybook/builder-webpack5"
   },
-  webpackFinal: async (config) => {
+  webpackFinal: async (config, options) => {
     const imageRule = config.module?.rules?.find((rule) => {
       const test = (rule as { test: RegExp }).test
 
@@ -41,6 +41,9 @@ const config: StorybookConfig = {
       use: ["@svgr/webpack"]
     })
 
+    //@ts-expect-error
+    options!.cache!.set = () => Promise.resolve()
+
     return config
   }
 }

client/package.json

@@ -19,6 +19,7 @@
     "@stripe/react-stripe-js": "^2.7.3",
     "@stripe/stripe-js": "^4.1.0",
     "@tanstack/react-query": "^5.50.1",
+    "client": "file:",
     "firebase": "^10.12.3",
     "next": "14.2.4",
     "next-sanity": "^9.4.2",

client/src/components/generic/SignUpNotif/SignUpNotif.tsx

@@ -1,5 +1,6 @@
 import { useRouter } from "next/navigation"
 import Button from "../FigmaButtons/FigmaButton"
+import LockIcon from "@/assets/icons/lock.svg"
 
 interface ISignUpNotif {
   /**
@@ -22,15 +23,20 @@ export const SignUpNotif = ({ signedIn }: ISignUpNotif) => {
 
   return (
     <div
-      className="text-dark-blue-100 border-gray-3 flex flex-col items-center justify-center 
-    gap-4 rounded-md border bg-white py-8"
+      className="border-gray-3 flex max-h-[402px] max-w-[570px] flex-col items-center justify-center 
+    gap-4 rounded-md border bg-white py-8 text-black"
     >
-      <h2 className="text-center italic">Currently unavailable</h2>
-      <h4 className="max-h-[87px] max-w-[386px] text-center">
-        Only paid members can access bookings. Please sign up or wait until your
-        membership payment has been proccessed.
+      <div>
+        <LockIcon />
+      </div>
+      <h2 className="text-center italic"> Sorry!</h2>
+      <h4 className="max-h-[87px] max-w-[407px] text-center">
+        Bookings are only available for UASC members.
       </h4>
-      <span className="flex w-full max-w-80 gap-2">
+      <h4 className="max-h-[87px] max-w-[407px] text-center">
+        Please sign up or wait until your membership payment has been processed.
+      </h4>
+      <span className="mt-2 flex w-full max-w-80 gap-2">
         {!signedIn && <Button onClick={() => goToLogin()}>Log in</Button>}
         <Button onClick={() => goToRegister()}>
           {signedIn ? "Join Now" : "Sign up"}

server/package.json

@@ -12,6 +12,7 @@
     "helmet": "^7.1.0",
     "nodemailer": "^6.9.14",
     "pug": "^3.0.3",
+    "server": "file:",
     "stripe": "^14.22.0",
     "supertest": "^6.3.4",
     "swagger-jsdoc": "^6.2.8",

yarn.lock

@@ -10904,7 +10904,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"client@workspace:client":
+"client@file:, client@workspace:client":
   version: 0.0.0-use.local
   resolution: "client@workspace:client"
   dependencies:
@@ -10934,6 +10934,7 @@ __metadata:
     "@types/react-csv": "npm:^1.1.10"
     "@types/react-dom": "npm:^18"
     "@types/scheduler": "npm:^0"
+    client: "file:"
     eslint: "npm:~8.57.0"
     firebase: "npm:^10.12.3"
     jest: "npm:^29.7.0"
@@ -21585,7 +21586,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"server@workspace:server":
+"server@file:, server@workspace:server":
   version: 0.0.0-use.local
   resolution: "server@workspace:server"
   dependencies:
@@ -21610,6 +21611,7 @@ __metadata:
     nodemailer: "npm:^6.9.14"
     nodemon: "npm:^3.1.0"
     pug: "npm:^3.0.3"
+    server: "file:"
     stripe: "npm:^14.22.0"
     supertest: "npm:^6.3.4"
     swagger-jsdoc: "npm:^6.2.8"