Merge pull request #15 from akirachix/develop

Develop

Author: hunterachieng

biopima/next.config.ts

@@ -5,3 +5,8 @@ const nextConfig: NextConfig = {
 };
 
 export default nextConfig;
+module.exports = {
+  images: {
+    domains: ['biopima-cfbfed4a262a.herokuapp.com'],
+  },
+};

biopima/package-lock.json

@@ -11,10 +11,12 @@
   },
   "dependencies": {
     "@heroicons/react": "^2.2.0",
+    "chart.js": "^4.5.0",
     "jest-canvas-mock": "^2.5.2",
     "lucide-react": "^0.544.0",
     "next": "15.5.3",
     "react": "19.1.0",
+    "react-chartjs-2": "^5.3.0",
     "react-dom": "19.1.0",
     "react-icons": "^5.5.0",
     "recharts": "^3.2.1"
@@ -25,6 +27,8 @@
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.8.0",
     "@testing-library/react": "^16.3.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/chart.js": "^2.9.41",
     "@types/jest": "^30.0.0",
     "@types/node": "^20",
     "@types/react": "^19",

biopima/package.json

@@ -0,0 +1,34 @@
+const baseUrl = process.env.BASE_URL;
+
+export async function POST(request: Request) {
+ try {
+   const body = await request.json();
+   const { email, password } = body;
+   if (!email || !password) {
+     return new Response(
+       "Missing required values: email, password",
+       { status: 400 }
+     );
+   }
+   const response = await fetch(`${baseUrl}/api/set-password/`, {
+     method: "POST",
+     headers: { "Content-Type": "application/json" },
+     body: JSON.stringify({
+       email,
+       password
+     }),
+   })
+ 
+
+  
+   const result = await response.json();
+   return new Response(JSON.stringify(result), {
+     status: 201,
+     statusText: "Password set successfully",
+   });
+ } catch (error) {
+   return new Response("Failed to set password: " + (error as Error).message, {
+     status: 500,
+   });
+ }
+}

biopima/src/app/api/set-password/route.ts

@@ -13,7 +13,7 @@ export async function GET() {
     const result = await response.json();
     return NextResponse.json(result, {
       status: 200,
-      statusText: 'User created successfully'
+      statusText: result.message
     });
   } catch (error) {
     console.error('GET request error:', error);
@@ -29,35 +29,44 @@ export async function GET() {
 export async function POST(request: Request) {
   try {
     const bodyData = await request.json();
-    const {name, email, phone_number, username} = bodyData;
+    const { name, email, phone_number, username } = bodyData;
     if (!name || !email || !phone_number || !username) {
       return NextResponse.json(
         { message: 'Missing required fields' },
-        {
-          status: 400,
-        }
+        { status: 400 }
       );
     }
 
     const response = await fetch(`${baseUrl}/api/user/`, {
       method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
+      headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify(bodyData),
     });
 
     const result = await response.json();
-    
+
+    if (response.status === 409 || (result.message && result.message.toLowerCase().includes("already"))) {
+      return NextResponse.json(
+        { message: 'User already exists' },
+        { status: 409 }
+      );
+    }
+
+    if (!response.ok) {
+      return NextResponse.json(
+        { message: result.message || 'User already exists' },
+        { status: response.status }
+      );
+    }
 
     return new Response(JSON.stringify(result), {
       status: 201,
-      statusText: 'User created successfully',
+      statusText: result.message,
     });
-  } catch(error){
-        return new Response((error as Error).message, {
-            status:500,
-            statusText: 'Internal server error'
-        })
-    }
+  } catch (error) {
+    return new Response((error as Error).message, {
+      status: 500,
+      statusText: 'Internal server error',
+    });
+  }
 }

biopima/src/app/api/user/route.ts

@@ -38,21 +38,18 @@ export default function RolePage() {
       <div className="flex flex-row sm:flex-row gap-6">
         <button
           onClick={() => handleSelect("institution")}
-         
-          className="border-2 border-[#9EAF1B] bg-transparent text-[#9EAF1B] text-xl md:text-2xl font-bold py-3 px-8 rounded-2xl hover:bg-green-50 transition-all duration-200 shadow-md hover:shadow-lg min-w-[140px] cursor-pointer"
+          className="border-2 border-[#9EAF1B] bg-transparent text-[#9EAF1B] text-xl md:text-2xl font-bold py-3 px-8 rounded-2xl hover:bg-[#9EAF1B] hover:text-white transition-all duration-200 shadow-md hover:shadow-lg min-w-[140px] cursor-pointer"
         >
-           
           Institution
         </button>
 
         <button
           onClick={() => handleSelect("consultant")}
-          className="bg-[#9EAF1B] text-white text-xl md:text-2xl font-bold py-3 px-8 rounded-2xl hover:bg-[#8a9d18] transition-all duration-200 shadow-md hover:shadow-lg min-w-[140px] cursor-pointer"
+          className="border-2 border-[#9EAF1B] bg-transparent text-[#9EAF1B] text-xl md:text-2xl font-bold py-3 px-8 rounded-2xl hover:bg-[#9EAF1B] hover:text-white transition-all duration-200 shadow-md hover:shadow-lg min-w-[140px] cursor-pointer"
         >
           Consultant
         </button>
       </div>
     </div>
   );
 }
-

biopima/src/app/chooserole/page.tsx

@@ -0,0 +1,10 @@
+import ConsultantLayout from "../shared-components/Sidebar/ConsultantLayout";
+import Profile from "../profile/page";
+
+export default function ConsultantProfile(){
+    return(
+        <ConsultantLayout>
+            <Profile/>
+        </ConsultantLayout>
+    )
+}

biopima/src/app/consultant-profile/page.tsx

@@ -0,0 +1,10 @@
+import ConsultantLayout from "../shared-components/Sidebar/ConsultantLayout";
+import ReportsPage from "../report/page";
+
+export default function ConsultantProfile(){
+    return(
+        <ConsultantLayout>
+            <ReportsPage/>
+        </ConsultantLayout>
+    )
+}

biopima/src/app/consultant-report/page.tsx

@@ -1,47 +1,53 @@
-import { render, screen } from '@testing-library/react';
-import ActivityFeed from '.';
-
-describe('ActivityFeed', () => {
-  let container: HTMLElement;
-
+// src/app/dashboard/components/ActivityFeed/index.test.tsx
+import React from "react";
+import { render, screen } from "@testing-library/react";
+import ActivityFeed from "./index";
+
+// Mock icons for predictable testing
+jest.mock("lucide-react", () => ({
+  Thermometer: (props: React.SVGProps<SVGSVGElement>) => (
+    <svg data-testid="thermometer-icon" {...props} />
+  ),
+  AlertTriangle: (props: React.SVGProps<SVGSVGElement>) => (
+    <svg data-testid="alert-triangle-icon" {...props} />
+  ),
+  Gauge: (props: React.SVGProps<SVGSVGElement>) => (
+    <svg data-testid="gauge-icon" {...props} />
+  ),
+  Activity: (props: React.SVGProps<SVGSVGElement>) => (
+    <svg data-testid="activity-icon" {...props} />
+  ),
+}));
+
+describe("ActivityFeed", () => {
   beforeEach(() => {
-    const rendered = render(<ActivityFeed />);
-    container = rendered.container;
+    render(<ActivityFeed />);
   });
 
-  it('renders main heading and subtitle', () => {
-    expect(screen.getByRole('heading', { name: /Activity Feed/i })).toBeInTheDocument();
-    expect(screen.getByText(/Recent system events and alerts/i)).toBeInTheDocument();
-  });
+  it("renders Temp Warning event correctly", () => {
+    // Check title
+    expect(screen.getByText("Temp Warning")).toBeInTheDocument();
 
-  it('renders two activity items with correct titles and descriptions', () => {
-    expect(screen.getByText('Temp Warning')).toBeInTheDocument();
-    expect(screen.getByText(/Low Temperature Warning: Digester temperature at 34.6°C./i)).toBeInTheDocument();
+    // Use regex with wildcards to handle extra characters / formatting
+    expect(screen.getByText(/Low Temperature Warning.*34\.6°C/i)).toBeInTheDocument();
 
-    expect(screen.getByText('Leak Warning')).toBeInTheDocument();
-    expect(screen.getByText(/Leak Warning: Pressure at 1.02 bar \(15.0% drop\)./i)).toBeInTheDocument();
+    // Check thermometer icon
+    expect(screen.getByTestId("thermometer-icon")).toBeInTheDocument();
   });
 
-  it('displays correct timestamps for each alert', () => {
-    const timestamps = screen.getAllByText(/less than a minute ago/i);
-    expect(timestamps.length).toBe(2);
-  });
+  it("renders Leak Warning event correctly", () => {
+    // Check title
+    expect(screen.getByText("Leak Warning")).toBeInTheDocument();
 
-  it('renders Thermometer SVG icon in Temp Warning section', () => {
-    const thermometerIcon = container.querySelector('svg.lucide-thermometer');
-    expect(thermometerIcon).toBeInTheDocument();
-  });
+    // Use regex with wildcards to match the full dynamic text
+    expect(screen.getByText(/Leak Warning.*1\.02 bar.*15\.0% drop/i)).toBeInTheDocument();
 
-  it('renders AlertTriangle SVG icon in Leak Warning section', () => {
-    const alertTriangleIcon = container.querySelector('svg.lucide-triangle-alert');
-    expect(alertTriangleIcon).toBeInTheDocument();
+    // Check alert triangle icon
+    expect(screen.getByTestId("alert-triangle-icon")).toBeInTheDocument();
   });
 
-  it('uses correct colors for status indicator dots', () => {
-    const greenDot = container.querySelector('span.bg-green-500');
-    expect(greenDot).toBeInTheDocument();
-
-    const yellowDot = container.querySelector('span.bg-yellow-700');
-    expect(yellowDot).toBeInTheDocument();
+  it("renders overall Activity Feed container and description", () => {
+    expect(screen.getByText("Activity Feed")).toBeInTheDocument();
+    expect(screen.getByText("Recent system events and alerts.")).toBeInTheDocument();
   });
 });