Make slack periodic use the DB

web/src/app/admin/connectors/github/page.tsx

@@ -2,10 +2,6 @@
 
 import * as Yup from "yup";
 import { IndexForm } from "@/components/admin/connectors/Form";
-import {
-  ConnectorStatus,
-  ConnectorStatusEnum,
-} from "@/components/admin/connectors/ConnectorStatus";
 import { GithubIcon } from "@/components/icons/icons";
 import { TextFormField } from "@/components/admin/connectors/Field";
 

web/src/app/admin/connectors/slack/page.tsx

@@ -6,6 +6,7 @@ import useSWR, { useSWRConfig } from "swr";
 import { SlackConfig } from "../../../../components/admin/connectors/types";
 import { LoadingAnimation } from "@/components/Loading";
 import { InitialSetupForm } from "./InitialSetupForm";
+import { useRouter } from "next/navigation";
 
 const MainSection = () => {
   // TODO: add back in once this is ready
@@ -13,6 +14,8 @@ const MainSection = () => {
   //   "/api/admin/connectors/web/index-attempt",
   //   fetcher
   // );
+  const router = useRouter();
+
   const { mutate } = useSWRConfig();
   const { data, isLoading, error } = useSWR<SlackConfig>(
     "/api/admin/connectors/slack/config",

web/src/app/admin/indexing/status/page.tsx

@@ -12,7 +12,7 @@ import {
   ListIndexingResponse,
 } from "@/components/admin/connectors/types";
 import { getSourceMetadata } from "@/components/source";
-import { CheckCircle } from "@phosphor-icons/react";
+import { CheckCircle, XCircle } from "@phosphor-icons/react";
 import { submitIndexRequest } from "@/components/admin/connectors/Form";
 import { useState } from "react";
 import { Popup } from "@/components/admin/connectors/Popup";
@@ -88,6 +88,25 @@ export default function Status() {
                 latestSuccessfulIndexAttemptsBySource.get(
                   getModifiedSource(indexAttempt)
                 );
+
+              let statusDisplay = (
+                <div className="text-gray-400">In Progress...</div>
+              );
+              if (indexAttempt.status === "success") {
+                statusDisplay = (
+                  <div className="text-green-600 flex">
+                    <CheckCircle className="my-auto mr-1" size="18" />
+                    Success
+                  </div>
+                );
+              } else if (indexAttempt.status === "failed") {
+                statusDisplay = (
+                  <div className="text-red-600 flex">
+                    <XCircle className="my-auto mr-1" size="18" />
+                    Error
+                  </div>
+                );
+              }
               return {
                 indexed_at:
                   timeAgo(successfulIndexAttempt?.time_updated) || "-",
@@ -108,15 +127,7 @@ export default function Status() {
                     </div>
                   </a>
                 ),
-                status:
-                  indexAttempt.status === "success" ? (
-                    <div className="text-green-600 flex">
-                      <CheckCircle className="my-auto mr-1" size="18" />
-                      Success
-                    </div>
-                  ) : (
-                    <div className="text-gray-400">In Progress...</div>
-                  ),
+                status: statusDisplay,
                 reindex: (
                   <button
                     className={

web/src/components/Header.tsx

@@ -69,7 +69,7 @@ export const Header: React.FC<HeaderProps> = ({ user }) => {
               }
             >
               {user.role === "admin" && (
-                <Link href="/admin/connectors/slack">
+                <Link href="/admin/indexing/status">
                   <div className="flex py-2 px-3 cursor-pointer hover:bg-gray-500 border-b border-gray-500">
                     Connectors
                   </div>

web/src/components/admin/connectors/types.ts

@@ -8,7 +8,7 @@ export interface SlackConfig {
 
 export interface IndexAttempt {
   connector_specific_config: { [key: string]: any };
-  status: "success" | "failure" | "in_progress" | "not_started";
+  status: "success" | "failed" | "in_progress" | "not_started";
   source: ValidSources;
   time_created: string;
   time_updated: string;