From 530d3e1d1d76145404e3dd4f4f67a245acb3a5d5 Mon Sep 17 00:00:00 2001
From: Adrian Cowan <othrayte@gmail.com>
Date: Wed, 1 Feb 2023 19:34:58 +1100
Subject: [PATCH] website: Add missing message features in label initial prompt

Now the backend passes a single message conversation for the label initial prompt task,
this allows us to just show the conversation the same way we do for the other labelling tasks.

The MessageView component was now no longer used and all messages shown are using MessageTableEntry.
---
 website/src/components/Messages.tsx           | 23 -------------------
 .../components/Tasks/LabelTask/LabelTask.tsx  | 14 +++--------
 website/src/types/Tasks.ts                    |  3 +--
 3 files changed, 4 insertions(+), 36 deletions(-)
 delete mode 100644 website/src/components/Messages.tsx

diff --git a/website/src/components/Messages.tsx b/website/src/components/Messages.tsx
deleted file mode 100644
index 58e0d2be..00000000
--- a/website/src/components/Messages.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { Box, forwardRef, useColorMode } from "@chakra-ui/react";
-import { useMemo } from "react";
-import { Message } from "src/types/Conversation";
-
-export const MessageView = forwardRef<Partial<Message>, "div">((message: Partial<Message>, ref) => {
-  const { colorMode } = useColorMode();
-
-  const bgColor = useMemo(() => {
-    if (colorMode === "light") {
-      return message.is_assistant ? "gray.800" : "blue.600";
-    } else {
-      return message.is_assistant ? "black" : "blue.600";
-    }
-  }, [colorMode, message.is_assistant]);
-
-  return (
-    <Box bg={bgColor} ref={ref} className={`p-4 rounded-md text-white whitespace-pre-wrap`}>
-      {message.text}
-    </Box>
-  );
-});
-
-MessageView.displayName = "MessageView";
diff --git a/website/src/components/Tasks/LabelTask/LabelTask.tsx b/website/src/components/Tasks/LabelTask/LabelTask.tsx
index 33152ba1..33369757 100644
--- a/website/src/components/Tasks/LabelTask/LabelTask.tsx
+++ b/website/src/components/Tasks/LabelTask/LabelTask.tsx
@@ -1,13 +1,11 @@
 import { Box, useBoolean, useColorModeValue } from "@chakra-ui/react";
 import { useTranslation } from "next-i18next";
 import { useEffect, useState } from "react";
-import { MessageView } from "src/components/Messages";
 import { LabelInputGroup } from "src/components/Messages/LabelInputGroup";
 import { MessageTable } from "src/components/Messages/MessageTable";
 import { TwoColumnsWithCards } from "src/components/Survey/TwoColumnsWithCards";
 import { TaskSurveyProps } from "src/components/Tasks/Task";
 import { TaskHeader } from "src/components/Tasks/TaskHeader";
-import { TaskType } from "src/types/Task";
 import { LabelTaskType } from "src/types/Tasks";
 
 const isRequired = (labelName: string, requiredLabels?: string[]) => {
@@ -56,15 +54,9 @@ export const LabelTask = ({
       <TwoColumnsWithCards>
         <>
           <TaskHeader taskType={taskType} />
-          {task.type !== TaskType.label_initial_prompt ? (
-            <Box mt="4" p={[4, 6]} borderRadius="lg" bg={cardColor}>
-              <MessageTable messages={task.conversation.messages} highlightLastMessage />
-            </Box>
-          ) : (
-            <Box mt="4">
-              <MessageView text={task.prompt} is_assistant={false} id={task.message_id} emojis={{}} user_emojis={[]} />
-            </Box>
-          )}
+          <Box mt="4" p={[4, 6]} borderRadius="lg" bg={cardColor}>
+            <MessageTable messages={task.conversation.messages} highlightLastMessage />
+          </Box>
         </>
         <LabelInputGroup
           labels={task.labels}
diff --git a/website/src/types/Tasks.ts b/website/src/types/Tasks.ts
index 737392bd..af6590cf 100644
--- a/website/src/types/Tasks.ts
+++ b/website/src/types/Tasks.ts
@@ -46,6 +46,7 @@ export interface Label {
 
 export interface BaseLabelTask extends BaseTask {
   message_id: string;
+  conversation: Conversation;
   labels: Label[];
   valid_labels: string[];
   disposition: "spam" | "quality";
@@ -55,14 +56,12 @@ export interface BaseLabelTask extends BaseTask {
 
 export interface LabelAssistantReplyTask extends BaseLabelTask {
   type: TaskType.label_assistant_reply;
-  conversation: Conversation;
   reply_message: Message;
   reply: string;
 }
 
 export interface LabelPrompterReplyTask extends BaseLabelTask {
   type: TaskType.label_prompter_reply;
-  conversation: Conversation;
   reply_message: Message;
   reply: string;
 }