Don't get rid of answer if something goes wrong during quote generation

web/src/components/search/results/AnswerSection.tsx

@@ -29,55 +29,47 @@ interface AnswerSectionProps {
   isFetching: boolean;
 }
 
-const AnswerHeader = ({
-  answer,
-  error,
-  quotes,
-  nonAnswerableReason,
-  isFetching,
-}: AnswerSectionProps) => {
-  if (error) {
-    return <>Error while building answer</>;
-  } else if ((answer && quotes !== null) || !isFetching) {
-    if (nonAnswerableReason) {
-      return <>Best effort AI answer</>;
-    }
-    return <>AI answer</>;
-  }
-  if (nonAnswerableReason) {
-    return <>Building best effort AI answer...</>;
-  }
-  return <>Building answer...</>;
-};
-
-const AnswerBody = ({ answer, error, isFetching }: AnswerSectionProps) => {
-  if (error) {
-    return (
-      <div className="flex">
-        <div className="text-error my-auto ml-1">{error}</div>
-      </div>
-    );
-  } else if (answer) {
-    return (
-      <ReactMarkdown className="prose text-sm max-w-full">
-        {replaceNewlines(answer)}
-      </ReactMarkdown>
-    );
-  } else if (!isFetching) {
-    return <div>Information not found</div>;
-  }
-
-  return null;
-};
-
 export const AnswerSection = (props: AnswerSectionProps) => {
   let status = "in-progress" as StatusOptions;
-  if (props.error) {
+  let header = <>Building answer...</>;
-    status = "failed";
+  let body = null;
-  } else if (props.nonAnswerableReason) {
+
-    status = "warning";
+  // finished answer
-  } else if ((props.quotes !== null && props.answer) || !props.isFetching) {
+  if (props.quotes !== null || !props.isFetching) {
     status = "success";
+    header = <>AI answer</>;
+    if (props.answer) {
+      body = (
+        <ReactMarkdown className="prose text-sm max-w-full">
+          {replaceNewlines(props.answer)}
+        </ReactMarkdown>
+      );
+    } else {
+      body = <div>Information not found</div>;
+    }
+    // error while building answer (NOTE: if error occurs during quote generation
+    // the above if statement will hit and the error will not be displayed)
+  } else if (props.error) {
+    status = "failed";
+    header = <>Error while building answer</>;
+    body = (
+      <div className="flex">
+        <div className="text-error my-auto ml-1">{props.error}</div>
+      </div>
+    );
+    // answer is streaming
+  } else if (props.answer) {
+    status = "success";
+    header = <>AI answer</>;
+    body = (
+      <ReactMarkdown className="prose text-sm max-w-full">
+        {replaceNewlines(props.answer)}
+      </ReactMarkdown>
+    );
+  }
+  if (props.nonAnswerableReason) {
+    status = "warning";
+    header = <>Building best effort AI answer...</>;
   }
 
   return (
@@ -85,12 +77,12 @@ export const AnswerSection = (props: AnswerSectionProps) => {
       status={status}
       header={
         <div className="flex">
-          <div className="ml-2 text-strong">{<AnswerHeader {...props} />}</div>
+          <div className="ml-2 text-strong">{header}</div>
         </div>
       }
       body={
         <div className="">
-          <AnswerBody {...props} />
+          {body}
           {props.nonAnswerableReason && !props.isFetching && (
             <div className="mt-4 text-sm">
               <b className="font-medium">Warning:</b> the AI did not think this