feat : picked order finish order

src/api/Order.ts

@@ -72,3 +72,16 @@ export async function updateOrderAPI(orderId : number, username : string, status
         throw err;
     }
 }
+
+export async function finishOrderAPI(orderId : number, username : string) {
+    try {
+        const API_URL = REST_URL + "/order/finish-order";
+        const data = {orderId : orderId, username : username};
+        console.log("GOLGOLOG", data);
+        const response = await axios.put(API_URL, data);
+        return response;
+    } catch(err) {
+        alert(err);
+        throw err;
+    }
+}

src/pages/PickedOrder.tsx

@@ -18,7 +18,7 @@ export default function PickedOrder() {
   useEffect(() => {
     getUserDetail(user.username ? user.username : "").then(
       (userDetail) => {
-        const response = getOrderByCourier(userDetail.data.id);
+        const response = getOrderByCourier(userDetail.data.id ? userDetail.data.id : 0);
         response.then((order) => {
           console.log(order.data);
           setOrders(order.data);

src/pages/PickedOrderDetail.tsx

@@ -19,41 +19,52 @@ import {
 import { useEffect, useState } from 'react'
 import OrderDetail from '../interfaces/OrderDetail';
 import OrderInterface from '../interfaces/OrderInterface';
-import { getOrderById, getOrderDetails, updateOrder } from '../utils/Order';
-import { useParams } from 'react-router-dom';
+import { finishOrder, getOrderById, getOrderDetails, updateOrder } from '../utils/Order';
+import { useNavigate, useParams } from 'react-router-dom';
 import { getUser } from '../utils/LocalStorage';
 
 
 export default function PickedOrderDetail() {
-  const username = getUser();
+  const user = getUser();
   const { id } = useParams();
   const orderId = parseInt(id ? id : "0");
   const [order, setOrder] = useState<OrderInterface>();
   const [orderDetails, setOrderDetails] = useState<OrderDetail[]>([]);
   const [pickupStatus, setPickupStatus] = useState(false);
   const [newDescription, setNewDescription] = useState("");
+  const navigate = useNavigate();
 
   function changeDescription() {
-    if(!username) {
+    if(!user.username) {
       alert("Perlu log in");
       return;
     }
     
-    updateOrder(orderId, username, order?.status ? order.status : "pickup", newDescription);
-    setOrder({...order, keterangan : newDescription})
+    updateOrder(orderId, user.username, order?.status ? order.status : "pickup", newDescription);
+    setOrder({...order, keterangan : newDescription});
   }
 
   function changeTransit() {
-    if(!username) {
+    if(!user.username) {
       alert("Perlu log in");
       return;
     }
     
-    updateOrder(orderId, username, "transit", order?.keterangan ? order.keterangan : "");
-    setOrder({...order, status : "transit"})
+    updateOrder(orderId, user.username, "transit", order?.keterangan ? order.keterangan : "");
+    setOrder({...order, status : "transit"});
     setPickupStatus(false);
   }
 
+  function finishingOrder() {
+    if(!user.username) {
+      alert("Perlu log in");
+      return;
+    }
+
+    finishOrder(orderId, user.username);
+    navigate("/History");
+  }
+
   useEffect(() => {
     const orderResponse = getOrderById(orderId);
     const detailResponse = getOrderDetails(orderId);
@@ -176,7 +187,6 @@ export default function PickedOrderDetail() {
           :
           <>
           </>}
-          {/* TODO : make button functionality */}
           <Button
             display={{ base: 'none', md: 'inline-flex' }}
             fontSize={'sm'}
@@ -186,6 +196,7 @@ export default function PickedOrderDetail() {
             _hover={{
               bg: 'blue.300',
             }}
+            onClick={finishingOrder}
             >
             Selesaikan Pengantaran
           </Button>

src/utils/Order.ts

-import { fetchAvailableOrder, fetchOrderByCourier, fetchOrderById, fetchOrderDetails, pickOrderAPI, updateOrderAPI } from "../api/Order";
+import { fetchAvailableOrder, fetchOrderByCourier, fetchOrderById, fetchOrderDetails, finishOrderAPI, pickOrderAPI, updateOrderAPI } from "../api/Order";
 
 export async function getAvailableOrder() {
     const availableOrders = await fetchAvailableOrder();
@@ -29,3 +29,8 @@ export async function updateOrder(orderId : number, username : string, status :
     const response = await updateOrderAPI(orderId, username, status, description);
     return response;
 }
+
+export async function finishOrder(orderId : number, username : string) {
+    const response = await finishOrderAPI(orderId, username);
+    return response;
+}