From ff58433e4df6a8199548256ff4a91da17cc3299f Mon Sep 17 00:00:00 2001
From: myftija <saadi.myftija@gmail.com>
Date: Wed, 23 Jul 2025 11:48:05 +0200
Subject: [PATCH] Fail gracefully when runs cannot be loaded

---
 .../route.tsx                                       | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs._index/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs._index/route.tsx
index edc9e9f34c..8c41f0ceac 100644
--- a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs._index/route.tsx
+++ b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs._index/route.tsx
@@ -58,6 +58,7 @@ import {
 } from "~/utils/pathBuilder";
 import { ListPagination } from "../../components/ListPagination";
 import { CreateBulkActionInspector } from "../resources.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs.bulkaction";
+import { Callout } from "~/components/primitives/Callout";
 
 export const meta: MetaFunction = () => {
   return [
@@ -149,7 +150,17 @@ export default function Page() {
                 </div>
               }
             >
-              <TypedAwait resolve={data}>
+              <TypedAwait
+                resolve={data}
+                errorElement={
+                  <div className="flex items-center justify-center px-3 py-12">
+                    <Callout variant="error" className="max-w-fit">
+                      Unable to load your task runs. Please refresh the page or try again in a
+                      moment.
+                    </Callout>
+                  </div>
+                }
+              >
                 {(list) => {
                   return (
                     <RunsList