- updated base for endpoints

- added loading states
- need to add new form for ftp type

src/features/dashboard/components/SystemHealth.tsx

@@ -13,6 +13,8 @@ type SystemHealthProps = {
 const SystemHealth = ({ startTime, uptime, statuses, isLoading, isError, dateUpdatedAt }: SystemHealthProps) => {
   const updatedDate = dateUpdatedAt ? new Date(dateUpdatedAt).toLocaleString() : null;
 
+  // console.log(statuses);
+
   if (isError) {
     return <span className="text-red-500">Error loading system health.</span>;
   }
@@ -31,7 +33,7 @@ const SystemHealth = ({ startTime, uptime, statuses, isLoading, isError, dateUpd
       </div>
       <div className="h-50 overflow-auto">
         {statuses?.map((status: SystemHealthStatus) => (
-          <div className="border border-gray-700 p-4 rounded-md m-2 flex justify-between">
+          <div className="border border-gray-700 p-4 rounded-md m-2 flex justify-between" key={status.id}>
             <span>{status.id}</span> <Badge text={status.tags[0]} />
           </div>
         ))}

src/features/dashboard/hooks/useGetSystemHealth.ts

@@ -1,7 +1,8 @@
 import { useQuery } from "@tanstack/react-query";
+import { CAMBASE } from "../../../utils/config";
 
 const fetchData = async () => {
-  const response = await fetch(`http://100.115.148.59/api/system-health`);
+  const response = await fetch(`${CAMBASE}/api/system-health`);
   if (!response.ok) throw new Error("Cannot get System overview");
   return response.json();
 };