Function VerifyQuestionScreen

components/approval/verifyAnswerScreen.tsx:45–870

(props: {
  data: {
    id: string;
    is_generating: boolean;
    approved: boolean;
    generation_failed: boolean;
    approval_answer_groups: { name: string }[];
    group_id: string;
  };
})

import { EditQuestionModal } from "./addQuestionModal";

export function VerifyQuestionScreen(props: {
  data: {
    id: string;
    is_generating: boolean;
    approved: boolean;
    generation_failed: boolean;
    approval_answer_groups: { name: string }[];
    group_id: string;
  };
}) {
  const { profile } = useProfile();
  const router = useRouter();
  const supabase = useSupabaseClient<Database>();

  const [questionText, setQuestionText] = useState<string>("");
  const [warningModalData, setWarningModalData] = useState<WarningModalData>({
    title: "",
    description: "",
    actionColour: "red",
    open: false,
    action: () => {},
    setOpen: () => setWarningModalData((p) => ({ ...p, open: false })),
    actionName: "Regenerate Answer",
  });
  const [messages, setMessages] = useState<StreamingStepInput[]>([]);
  const [allMessageData, setAllMessageData] = useState<UIMessageData[]>([]);
  const [followUps, setFollowups] = useState<
    (UIMessageData & { suggestions: string[] }) | null
  >(null);
  const [editFollowUpsModalText, setEditFollowUpsModalText] = useState<
    string[] | null
  >(null);
  const [answer, setAnswer] = useState<UIAnswerType>({
    ...props.data,
    approval_questions: [],
  });
  const [allVariables, setAllVariables] = useState<ApprovalVariable[]>([]);
  const [allActions, setAllActions] = useState<Action[] | null>(null);
  const [thoughtsVisible, setThoughtsVisible] = useState<boolean>(false);
  const [showModal, setShowModal] = useState<
    "code" | "filtering" | "routing" | "user" | "api-key" | "question" | null
  >(null);
  const [userApiKey, setUserApiKey] = useState(() => {
    // Grab API key from localstorage
    const userApiKeyFromLocalStorage = localStorage.getItem("userApiKey");
    if (!userApiKeyFromLocalStorage) {
      // TODO: Handle this much better
      console.error("No userApiKey in localstorage!");
      return;
    }
    return userApiKeyFromLocalStorage;
  });
  const [devMode, setDevMode] = useState<boolean>(false);
  const [loading, setLoading] = useState<boolean>(false);
  const scrollRef = useRef<HTMLDivElement | null>(null);

  useEffect(() => {
    if (!profile) return;