From bf63180104e522212f5df509882cc6907020ad96 Mon Sep 17 00:00:00 2001
From: Redm4x <2829180+Redm4x@users.noreply.github.com>
Date: Wed, 1 May 2024 15:33:31 -0400
Subject: [PATCH] fix(deploy-web): fix provider page

---
 api/src/types/provider.ts                        | 1 +
 deploy-web/src/pages/providers/[owner]/index.tsx | 6 +++---
 deploy-web/src/types/provider.ts                 | 1 +
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/api/src/types/provider.ts b/api/src/types/provider.ts
index b6e95e412..2dedbd6e1 100644
--- a/api/src/types/provider.ts
+++ b/api/src/types/provider.ts
@@ -21,6 +21,7 @@ export interface ProviderList {
   uptime30d: number;
   isValidVersion: boolean;
   isOnline: boolean;
+  lastOnlineDate: Date;
   isAudited: boolean;
   gpuModels: { vendor: string; model: string; ram: string; interface: string }[];
   activeStats: {
diff --git a/deploy-web/src/pages/providers/[owner]/index.tsx b/deploy-web/src/pages/providers/[owner]/index.tsx
index b2edd2e56..7a032fe28 100644
--- a/deploy-web/src/pages/providers/[owner]/index.tsx
+++ b/deploy-web/src/pages/providers/[owner]/index.tsx
@@ -91,7 +91,7 @@ const ProviderDetailPage: React.FunctionComponent<Props> = ({ owner, _provider }
   function groupUptimeChecksByPeriod(uptimeChecks: { isOnline: boolean; checkDate: string }[] = []) {
     const groupedSnapshots: { checkDate: Date; checks: boolean[] }[] = [];
 
-    const sortedUptimeChecks = uptimeChecks.toSorted((a, b) => new Date(a.checkDate).getTime() - new Date(b.checkDate).getTime());
+    const sortedUptimeChecks = [...uptimeChecks].sort((a, b) => new Date(a.checkDate).getTime() - new Date(b.checkDate).getTime());
 
     for (const snapshot of sortedUptimeChecks) {
       const recentGroup = groupedSnapshots.find(x => differenceInMinutes(new Date(snapshot.checkDate), x.checkDate) < 15);
@@ -113,7 +113,7 @@ const ProviderDetailPage: React.FunctionComponent<Props> = ({ owner, _provider }
   }
 
   const uptimePeriods = useMemo(() => groupUptimeChecksByPeriod(provider?.uptime || []), [provider?.uptime]);
-  const wasRecentlyOnline = provider && (provider.isOnline || (provider.lastCheckDate && new Date(provider.lastCheckDate) >= sub(new Date(), { hours: 24 })));
+  const wasRecentlyOnline = provider && (provider.isOnline || (provider.lastOnlineDate && new Date(provider.lastOnlineDate) >= sub(new Date(), { hours: 24 })));
 
   return (
     <Layout isLoading={isLoading}>
@@ -126,7 +126,7 @@ const ProviderDetailPage: React.FunctionComponent<Props> = ({ owner, _provider }
           </Box>
         )}
 
-        {provider && !wasRecentlyOnline && !isLoading && (
+        {provider && !wasRecentlyOnline && !isLoadingProvider && (
           <Alert
             variant="outlined"
             severity="warning"
diff --git a/deploy-web/src/types/provider.ts b/deploy-web/src/types/provider.ts
index dd72312e9..2f6427b0f 100644
--- a/deploy-web/src/types/provider.ts
+++ b/deploy-web/src/types/provider.ts
@@ -205,6 +205,7 @@ export interface ApiProviderList {
   uptime30d: number;
   isValidVersion: boolean;
   isOnline: boolean;
+  lastOnlineDate: string;
   isAudited: boolean;
   gpuModels: { vendor: string; model: string; ram: string; interface: string }[];
   activeStats: {