Restructure types for retailer-centric flow

astro/src/components/KiosMap.tsx

@@ -6,12 +6,19 @@ import L, { LatLngBounds } from 'leaflet';
 import { useQuery, useMutation, useQueryClient, queryOptions } from "@tanstack/react-query";
 import axios from "axios";
 
-
-
 //Todo: Move types to own file
+type User = {
+  name: string;
+  id: string;
+  email: string;
+  phoneNumber: string;
+}
+
 type Product = {
   id: string;
   productTitle: string;
+  weight: number;
+  img: string;
   createdAt: string;
   updatedAt: string;
 };
@@ -24,6 +31,8 @@ type Product = {
 type Maker = {
   id: string;
   name: string;
+  email: string;
+  phoneNumber: string;
   location: [number, number];
   products: Product[];
   createdAt: string;
@@ -33,48 +42,55 @@ type Maker = {
 type Retailer = {
   id: string;
   name: string;
+  email: string;
+  phoneNumber: string;
   location: [number, number];
   products: Product[];
   createdAt: string;
   updatedAt: string;
 };
 
-//Todo: the courier should not hold the starting and end points
-type Courier = {
-  id: string;
-  name: string;
-  startingPoint: string;
-  destination: string;
-  departureDate: string;
-  arrivalDate: string;
-  weightAllowance: number;
-  createdAt: string;
-  updatedAt: string;
-}
+const DISPATCH_STATUS = ['requested', 'accepted', 'archived'] as const;
+type DispatchStatus = typeof DISPATCH_STATUS[number];
 
 type Dispatch = {
   id: string;
-  dispatchesCode: string;
-  products: Product[];
-  typeOfTransportation: string[];
-  courier: Courier;
-  timeSensitive: boolean;
-  status: string[];
+  dispatchesCode: string; //Human readable id
   createdAt: string;
   updatedAt: string;
+
+  maker: Maker;
+  retailer: Retailer;
+  products: Product[];
+
+  courier: User;
+  
+  timeSensitive: boolean;
+  status: DispatchStatus[];
+
+  departureDate: string;
+  arrivalDate: string;
+  weightAllowance: number;
 }
 
 
 //Todo: update fetch url endpoints
 //Todo: Move queryclient and hooks to own file
-const ROOT_URL = "http://localhost:3001"
+//Todo: Move axios stuff
+const API_URL = "http://localhost:3001"
+
+const headers = {
+  "Content-Type": "application/json",
+}
+
+
 
 const getMakers = async () => {
-  const url = `${ROOT_URL}/api/makers`
+  const url = `${API_URL}/api/makers`
   console.log("Fetching url:", url)
   const response = await axios.get(url);
 
-  const makers = response.data.docs;
+  const makers: Maker[] = response.data.docs;
   console.log(`Fetch result from ${url}`, makers)
   return makers;
 
@@ -89,18 +105,18 @@ const useGetMakers = () => {
 }
 
 const getRetailers = async () => {
-  const url = `${ROOT_URL}/api/retailers`
+  const url = `${API_URL}/api/retailers`
   console.log("Fetching url:", url)
   const response = await axios.get(url);
 
-  const retailers = response.data.docs;
+  const retailers:Retailer[] = response.data.docs;
   console.log(`Fetch result from ${url}`, retailers)
   return retailers;
 
 }
 
 const useGetRetailers = () => {
-  return useQuery<Dispatch[]>({
+  return useQuery<Retailer[]>({
     queryFn: () => getRetailers(),
     queryKey: ['retailers'],
     enabled: true
@@ -108,11 +124,11 @@ const useGetRetailers = () => {
 }
 
 const getDispatches = async () => {
-  const url = `${ROOT_URL}/api/dispatches`
+  const url = `${API_URL}/api/dispatches`
   console.log("Fetching url:", url)
   const response = await axios.get(url);
 
-  const dispatches = response.data.docs;
+  const dispatches:Dispatch[] = response.data.docs;
   console.log(`Fetch result from ${url}`, dispatches)
   return dispatches;
 
@@ -188,11 +204,11 @@ export const KiosMap = () => {
         </LayerGroup>
       }
 
-      {/* {dispatches &&
+      {dispatches &&
         <LayerGroup>
           {dispatches.map((dispatch: any, index: number) => {
-            const start = dispatch.startingPoint.location;
-            const end = dispatch.endPoint.location;
+            const start = dispatch.maker.location;
+            const end = dispatch.retailer.location;
 
             let productsString = '';
             dispatch.products.forEach((product: any, i: number) => {
@@ -200,19 +216,19 @@ export const KiosMap = () => {
             });
 
             const myDashArray =
-              dispatch.status === 'routeRequested' ? '20, 10' :
-                dispatch.status === 'completed' ? '1, 5' :
+              dispatch.status === 'requested' ? '20, 10' :
+                dispatch.status === 'archived' ? '1, 5' :
                   '0, 0';
 
             return (
               <div key={index}>
                 <Marker position={[start[0], start[1]]}
-                //icon={blackDotIcon}
+                  icon={blackDotIcon}
                 >
                   <Popup>{dispatch.startingPoint.name}</Popup>
                 </Marker>
                 <Marker position={[end[0], end[1]]}
-                //icon={blackDotIcon}
+                  icon={blackDotIcon}
                 >
                   <Popup>{dispatch.endPoint.name}</Popup>
                 </Marker>
@@ -224,7 +240,7 @@ export const KiosMap = () => {
             );
           })}
         </LayerGroup>
-      } */}
+      }
     </MapContainer >
     </div>
   );

astro/src/types.ts

@@ -33,7 +33,8 @@ export interface Post {
 }
 export interface User {
   id: string;
-  name?: string;
+  name: string;
+  phoneNumber: number;
   updatedAt: string;
   createdAt: string;
   email: string;
@@ -59,12 +60,6 @@ export interface Media {
 }
 export interface Courier {
   id: string;
-  name: string;
-  startingPoint?: string;
-  destination?: string;
-  departureDate?: string;
-  arrivalDate?: string;
-  weightAllowance?: number;
   updatedAt: string;
   createdAt: string;
 }
@@ -72,18 +67,17 @@ export interface Dispatch {
   id: string;
   dispatchesCode: string;
   products?: string[] | Product[];
-  startingPoint?: string | Maker;
-  endPoint?: string | Retailer;
-  typeOfTransportation?: ('air' | 'car' | 'train' | 'boat')[];
-  courier: string | Courier;
-  timeSensitive?: boolean;
-  status?: ('routeRequested' | 'inTransit' | 'completed')[];
+  courier?: string | Courier;
+  maker?: string | Maker;
+  retailer?: string | Retailer;
+  status?: ('requested' | 'accepted' | 'archived')[];
   updatedAt: string;
   createdAt: string;
 }
 export interface Product {
   id: string;
   productTitle: string;
+  picture?: string | Media;
   updatedAt: string;
   createdAt: string;
 }
@@ -107,8 +101,7 @@ export interface Retailer {
    * @maxItems 2
    */
   location?: [number, number];
-  products?: string[] | Product[];
-  salesPoint?: string;
+  requestedProducts?: string[] | Product[];
   updatedAt: string;
   createdAt: string;
 }