improve messaging and UI around cleanup of leftover index attempts (#3247)

* improve messaging and UI around cleanup of leftover index attempts

* add tag on init

web/src/app/admin/configuration/search/UpgradingPage.tsx

@@ -68,10 +68,11 @@ export default function UpgradingPage({
   const statusOrder: Record<ValidStatuses, number> = useMemo(
     () => ({
       failed: 0,
-      completed_with_errors: 1,
-      not_started: 2,
-      in_progress: 3,
-      success: 4,
+      canceled: 1,
+      completed_with_errors: 2,
+      not_started: 3,
+      in_progress: 4,
+      success: 5,
     }),
     []
   );

web/src/app/admin/connector/[ccPairId]/IndexingAttemptsTable.tsx

@@ -322,7 +322,8 @@ export function IndexingAttemptsTable({ ccPair }: { ccPair: CCPairFullInfo }) {
                       </Text>
                     )}
 
-                    {indexAttempt.status === "failed" &&
+                    {(indexAttempt.status === "failed" ||
+                      indexAttempt.status === "canceled") &&
                       indexAttempt.error_msg && (
                         <Text className="flex flex-wrap whitespace-normal">
                           {indexAttempt.error_msg}

web/src/components/Status.tsx

@@ -52,7 +52,7 @@ export function IndexAttemptStatus({
         popupContent={
           <div className="w-64 p-2 break-words overflow-hidden whitespace-normal">
             The indexing attempt completed, but some errors were encountered
-            during the rrun.
+            during the run.
             <br />
             <br />
             Click View Errors for more details.
@@ -78,6 +78,12 @@ export function IndexAttemptStatus({
         Scheduled
       </Badge>
     );
+  } else if (status === "canceled") {
+    badge = (
+      <Badge variant="canceled" icon={FiClock}>
+        Canceled
+      </Badge>
+    );
   } else {
     badge = (
       <Badge variant="outline" icon={FiMinus}>

web/src/components/ui/badge.tsx

@@ -8,6 +8,8 @@ const badgeVariants = cva(
   {
     variants: {
       variant: {
+        canceled:
+          "border-gray-200 bg-gray-50 text-gray-600 hover:bg-gray-75 dark:bg-gray-900 dark:text-neutral-50 dark:hover:bg-gray-850",
         orange:
           "border-orange-200 bg-orange-50 text-orange-600 hover:bg-orange-75 dark:bg-orange-900 dark:text-neutral-50 dark:hover:bg-orange-850",
         paused:

web/src/lib/types.ts

@@ -72,6 +72,7 @@ export type ValidInputTypes = "load_state" | "poll" | "event";
 export type ValidStatuses =
   | "success"
   | "completed_with_errors"
+  | "canceled"
   | "failed"
   | "in_progress"
   | "not_started";