Merge branch 'ms4' into ms4-jared/matching

Author: Jajared

README.md

@@ -9,27 +9,3 @@
 - You can choose to develop individual microservices within separate folders within this repository **OR** use individual repositories (all public) for each microservice.
 - In the latter scenario, you should enable sub-modules on this GitHub classroom repository to manage the development/deployment **AND** add your mentor to the individual repositories as a collaborator.
 - The teaching team should be given access to the repositories as we may require viewing the history of the repository in case of any disputes or disagreements.
-
-## For Development:
-
-### Backend:
-
-To launch the development environment using Docker Compose, follow these steps:
-
-1. Enter backend directory
-
-```
-cd backend
-```
-
-2. Run docker-compose using `-f` flag to specify the file to build from and `-d` flag to run the containers in detached mode (in the background)
-
-```
-docker-compose -f docker-compose.yml up -d
-```
-
-3. To stop the running services
-
-```
-docker-compose down
-```

backend/docker-compose.yml

@@ -22,6 +22,7 @@ services:
       - matching-service
     networks:
       - backend-network
+      - shared-network
 
   question-service:
     build:
@@ -90,3 +91,5 @@ services:
 networks:
   backend-network:
     driver: bridge
+  shared-network:
+    driver: bridge

frontend/docker-compose.yml

@@ -3,11 +3,19 @@ services:
     build:
       context: .
       dockerfile: Dockerfile
+    container_name: frontend-service
     volumes:
       - .:/app
       - /app/node_modules
     ports:
       - "3000:3000"
     environment:
       - NODE_ENV=development
+      - PUBLIC_API_URL=http://gateway-service:4000
+    networks:
+      - backend_shared-network
     command: npm run dev
+
+networks:
+  backend_shared-network:
+    external: true

frontend/next.config.mjs

@@ -1,5 +1,10 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
+  eslint: {
+    // Warning: This allows production builds to successfully complete even if
+    // your project has ESLint errors.
+    ignoreDuringBuilds: true,
+  },
 
   webpackDevMiddleware: (config) => {
     config.watchOptions = {

frontend/src/app/signin/components/socialLogin.tsx

@@ -1,10 +1,5 @@
-import { FaGithub, FaGoogle } from "react-icons/fa";
+const SocialButton = ({}) => {
+  return <div className="bg-primary-foreground"></div>;
+};
 
-const SocialButton = ({ }) => {
-    return (
-        <div className="bg-primary-foreground"> 
-        </div>
-    )
-}
-
-export default SocialButton
+export default SocialButton;

frontend/src/app/signin/layout.tsx

@@ -1,9 +1,11 @@
+import { Toaster } from "@/components/ui/toaster";
 import { ReactNode } from "react";
 
 export default function AuthLayout({ children }: { children: ReactNode }) {
   return (
     <>
       <main>{children}</main>
+      <Toaster />
     </>
   );
 }

frontend/src/app/signin/page.tsx

@@ -15,6 +15,7 @@ import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { login } from "@/services/authService";
 import { useRouter } from "next/navigation";
+import { useToast } from "@/hooks/use-toast";
 
 const FormSchema = z.object({
   email: z.string(),
@@ -24,6 +25,8 @@ const FormSchema = z.object({
 export default function DashboardPage() {
   const router = useRouter();
 
+  const { toast } = useToast();
+
   const methods = useForm<z.infer<typeof FormSchema>>({
     resolver: zodResolver(FormSchema),
   });
@@ -42,12 +45,20 @@ export default function DashboardPage() {
           "access_token",
           accessTokenResponse.data.access_token
         );
+        toast({
+          title: "Successfully Logged in!",
+          description: "You should be redirect to /dashboard",
+        });
         router.push("/dashboard");
       } else {
+        toast({
+          title: "Error!",
+          description: accessTokenResponse.message,
+        });
         // TODO: Display error message
       }
     },
-    [router]
+    [router, toast]
   );
 
   return (

frontend/src/contexts/UserContext.tsx

@@ -5,7 +5,6 @@ import {
   AccessTokenPayload,
   AccessTokenPayloadSchema,
 } from "@/types/Token";
-import { UserProfile } from "@/types/User";
 import React, {
   createContext,
   useContext,
@@ -14,11 +13,11 @@ import React, {
   PropsWithChildren,
 } from "react";
 
-const UserContext = createContext<UserProfile | undefined>(undefined);
+const UserContext = createContext<AccessTokenPayload | undefined>(undefined);
 
 export function UserProvider({ children }: PropsWithChildren) {
   // TODO: Once User Service is implemented on the backend, fetch user profile
-  const [user, setUser] = useState<UserProfile>();
+  const [user, setUser] = useState<AccessTokenPayload>();
 
   useEffect(() => {
     const token = localStorage.getItem("access_token");