chore: Add Artifact Deletion Warning

Author: camielvs

src/components/shared/ReactFlow/FlowCanvas/TaskNode/TaskOverview/IOSection/IOSection.tsx

@@ -5,9 +5,11 @@ import { BlockStack } from "@/components/ui/layout";
 import { Spinner } from "@/components/ui/spinner";
 import { Paragraph } from "@/components/ui/typography";
 import { useBackend } from "@/providers/BackendProvider";
+import { useExecutionData } from "@/providers/ExecutionDataProvider";
 import { getExecutionArtifacts } from "@/services/executionService";
 import { getBackendStatusString } from "@/utils/backend";
 import type { TaskSpec } from "@/utils/componentSpec";
+import { isOlderThanDays } from "@/utils/date";
 
 import IOExtras from "./IOExtras";
 import IOInputs from "./IOInputs";
@@ -21,6 +23,7 @@ interface IOSectionProps {
 
 const IOSection = ({ taskSpec, executionId, readOnly }: IOSectionProps) => {
   const { backendUrl, configured, available } = useBackend();
+  const { metadata } = useExecutionData();
 
   const {
     data: artifacts,
@@ -74,8 +77,18 @@ const IOSection = ({ taskSpec, executionId, readOnly }: IOSectionProps) => {
     ? ["inputs", "outputs", "other"]
     : ["outputs", "inputs", "other"];
 
+  const isOlderThan30Days =
+    metadata?.created_at && isOlderThanDays(metadata.created_at, 30);
+
   return (
     <BlockStack gap="4" className="w-full">
+      {isOlderThan30Days && (
+        <InfoBox title="Artifact Storage" variant="warning">
+          Remote artifacts may be unavailable for runs older than 30 days. To
+          keep an artifact, download it using the provided link before it
+          expires.
+        </InfoBox>
+      )}
       {order.map((section) => {
         if (section === "inputs") {
           return (

src/utils/date.ts

@@ -76,6 +76,25 @@ export const formatDuration = (startTime: string, endTime: string): string => {
   }
 };
 
+/**
+ * Check whether a date is older than a given number of calendar days ago.
+ * @param date - Date string or object to check
+ * @param days - Number of calendar days to compare against
+ * @returns True if the date is older than the specified number of days, false otherwise
+ */
+export const isOlderThanDays = (date: string | Date, days: number): boolean => {
+  const today = new Date();
+  today.setHours(0, 0, 0, 0);
+
+  const cutoff = new Date(today);
+  cutoff.setDate(cutoff.getDate() - days);
+
+  const target = new Date(date);
+  target.setHours(0, 0, 0, 0);
+
+  return target < cutoff;
+};
+
 /**
  * Format relative time between a past date and now
  * @param date - past timestamp string