vendors service added

frontend/src/index.js

@@ -10,17 +10,18 @@ import reportWebVitals from './reportWebVitals';
 import Vendors from './routes/vendors.jsx';
 import ErrorPage from './components/error.jsx';
 import './App.css';
-import { createBrowserRouter, Navigate, RouterProvider } from 'react-router-dom';
+import {createBrowserRouter, Navigate, RouterProvider} from 'react-router-dom';
 import Register from './routes/register';
 import MockEventService from './services/MockServices/MockEventService.js';
 import MockVendorService from './services/MockServices/MockVendorService.js';
 import ResetPassword from './routes/reset_password';
-import { handleLoginVendor } from './services/handleLogin.js';
-import { handleRegister } from './services/handleRegister.js';
+import {handleLoginVendor} from './services/handleLogin.js';
+import {handleRegister} from './services/handleRegister.js';
 import EventsService from './services/Events/EventsService.js';
+import VendorsService from './services/Vendors/VendorsService.js';
 
 import config from './config.js';
-import { MessageProvider } from './context.jsx';
+import {MessageProvider} from './context.jsx';
 
 const isadmin = true;
 const session = true;
@@ -41,9 +42,10 @@ if (config.environment == 'dev') {
 
   // Initilize Services
   const eventsService = new EventsService(baseUrl);
+  const vendorsService = new VendorsService(baseUrl);
 
   eventService = eventsService;
-  vendorService = vendorService;
+  vendorService = vendorsService;
 }
 
 const router = createBrowserRouter([
@@ -90,11 +92,11 @@ const router = createBrowserRouter([
 
 const root = ReactDOM.createRoot(document.getElementById('root'));
 export default root.render(
-  <React.StrictMode>
-    <MessageProvider>
-      <RouterProvider router={router} />
-    </MessageProvider>
-  </React.StrictMode>,
+    <React.StrictMode>
+      <MessageProvider>
+        <RouterProvider router={router} />
+      </MessageProvider>
+    </React.StrictMode>,
 );
 // If you want to start measuring performance in your app, pass a function
 // to log results (for example: reportWebVitals(console.log))

frontend/src/objects/Vendor.js

@@ -14,7 +14,7 @@ class Vendor {
     this.name = name;
     this.email = email;
     this.website = website;
-    this.phone_number = phoneNumber;
+    this.phoneNumber = phoneNumber;
     this.image = image;
   }
 

frontend/src/routes/vendors.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useEffect} from 'react';
 import {useState} from 'react';
 import PropTypes from 'prop-types';
 // import {Link} from 'react-router-dom';
@@ -12,7 +12,27 @@ function VendorButton({content, onClick}) {
 }
 
 export default function Vendors({VendorService}) {
-  const [vendors, setVendors] = useState(VendorService.getVendors());
+  const [vendors, setVendors] = useState([]);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    const fetchVendors = async () => {
+      try {
+        const fetchedVendors = await VendorService.getVendors();
+        if (fetchedVendors.length === 0) {
+          console.error('No vendors found');
+        } else {
+          setVendors(fetchedVendors);
+          setError('');
+        }
+      } catch (error) {
+        console.error('Error fetching vendors:', error);
+        setError('Failed to fetch vendors.');
+      }
+    };
+
+    fetchVendors();
+  }, [VendorService]);
 
   const handleSearch = (vendor) => {
     vendor ? setVendors(VendorService.getVendorByName(vendor)) : setVendors(VendorService.getVendors());
@@ -28,6 +48,15 @@ export default function Vendors({VendorService}) {
       <VendorButton onClick={() => handlePromote()} content='Promote'/>
     </div>
   );
+
+  if (error) {
+    return (
+      <div className='w-full mx-auto flex flex-col justify-center pb-16'>
+        <h1 className='color-white text-2xl text-center my-3 font-semibold'>No Vendors Found</h1>
+      </div>
+    );
+  }
+
   return (
     <div className=' w-screen pl-2 pr-2 flex flex-col items-left justify-between gap-2'>
       <h1 className='color-white text-xl'>Vendors</h1>

frontend/src/services/Vendors/VendorsRepository.js

@@ -0,0 +1,67 @@
+import axios from 'axios';
+
+export default class VendorsRepository {
+  constructor(baseUrl) {
+    this.baseUrl = baseUrl;
+  }
+
+  async getAllVendors() {
+    try {
+      const response = await axios.get(`${this.baseUrl}/vendors`);
+      return response.data;
+    } catch (error) {
+      console.error('Error fetching vendors:', error);
+      throw error;
+    }
+  }
+
+  async getVendorById(vendorId) {
+    try {
+      const response = await axios.get(`${this.baseUrl}/vendors/${vendorId}`);
+      return response.data;
+    } catch (error) {
+      console.error(`Error fetching vendor with ID ${vendorId}:`, error);
+      throw error;
+    }
+  }
+
+  async authenticateVendor(vendorData) {
+    try {
+      const response = await axios.post(`${this.baseUrl}/vendors/login`, vendorData);
+      return response.data;
+    } catch (error) {
+      console.error('Error logging in vendor:', error);
+      throw error;
+    }
+  }
+
+  async createVendor(vendorData) {
+    try {
+      const response = await axios.post(`${this.baseUrl}/vendors`, vendorData);
+      return response.data;
+    } catch (error) {
+      console.error('Error creating vendor:', error);
+      throw error;
+    }
+  }
+
+  async updateVendor(vendorId, vendorData) {
+    try {
+      const response = await axios.put(`${this.baseUrl}/vendors/${vendorId}`, vendorData);
+      return response.data;
+    } catch (error) {
+      console.error(`Error updating vendor with ID ${vendorId}:`, error);
+      throw error;
+    }
+  }
+
+  async deleteVendor(vendorId) {
+    try {
+      const response = await axios.delete(`${this.baseUrl}/vendors/${vendorId}`);
+      return response.data;
+    } catch (error) {
+      console.error(`Error deleting vendor with ID ${vendorId}:`, error);
+      throw error;
+    }
+  }
+}

frontend/src/services/Vendors/VendorsService.js

@@ -0,0 +1,67 @@
+import VendorsRepository from './VendorsRepository';
+import Vendor from '../../objects/Vendor';
+
+export default class VendorsService {
+  constructor(baseUrl) {
+    this.vendorsRepository = new VendorsRepository(baseUrl);
+  }
+
+  async getVendors() {
+    const vendorsData = await this.vendorsRepository.getAllVendors();
+    return vendorsData.map((data) => new Vendor(
+        data.vendorId,
+        data.name,
+        data.email,
+        data.website,
+        data.phoneNumber,
+        data.image,
+    ));
+  }
+
+  async getVendorById(vendorId) {
+    const vendorData = await this.vendorsRepository.getVendorById(vendorId);
+    return new Vendor(
+        vendorData.vendorId,
+        vendorData.name,
+        vendorData.email,
+        vendorData.website,
+        vendorData.phoneNumber,
+        vendorData.image,
+    );
+  }
+
+  async authenticateVendor(vendor) {
+    const vendorData = {
+      email: vendor.email,
+      password: vendor.password,
+    };
+    return await this.vendorsRepository.authenticateVendor(vendorData);
+  }
+
+  async createVendor(vendor) {
+    const vendorData = {
+      name: vendor.name,
+      email: vendor.email,
+      password: vendor.password,
+      website: vendor.website,
+      phoneNumber: vendor.phoneNumber,
+      image: vendor.image,
+    };
+    return await this.vendorsRepository.createVendor(vendorData);
+  }
+
+  async updateVendor(vendor) {
+    const vendorData = {
+      name: vendor.name,
+      email: vendor.email,
+      website: vendor.website,
+      phoneNumber: vendor.phoneNumber,
+      image: vendor.image,
+    };
+    return await this.vendorsRepository.updateVendor(vendor.vendorId, vendorData);
+  }
+
+  async deleteVendor(vendorId) {
+    return await this.vendorsRepository.deleteVendor(vendorId);
+  }
+}