Merge pull request #1078 from LAION-AI/hook-types

Add TaskReply types for task hooks

website/src/components/Tasks/CreateTask.tsx

@@ -8,6 +8,7 @@ import { TaskSurveyProps } from "src/components/Tasks/Task";
 import { TaskHeader } from "src/components/Tasks/TaskHeader";
 import { getTypeSafei18nKey } from "src/lib/i18n";
 import { TaskType } from "src/types/Task";
+import { CreateTaskReply } from "src/types/TaskResponses";
 import { CreateTaskType } from "src/types/Tasks";
 
 export const CreateTask = ({
@@ -17,7 +18,7 @@ export const CreateTask = ({
   isDisabled,
   onReplyChanged,
   onValidityChanged,
-}: TaskSurveyProps<CreateTaskType, { text: string }>) => {
+}: TaskSurveyProps<CreateTaskType, CreateTaskReply>) => {
   const { t, i18n } = useTranslation(["tasks", "common"]);
   const cardColor = useColorModeValue("gray.50", "gray.800");
   const titleColor = useColorModeValue("gray.800", "gray.300");

website/src/components/Tasks/EvaluateTask.tsx

@@ -6,6 +6,7 @@ import { SurveyCard } from "src/components/Survey/SurveyCard";
 import { TaskSurveyProps } from "src/components/Tasks/Task";
 import { TaskHeader } from "src/components/Tasks/TaskHeader";
 import { TaskType } from "src/types/Task";
+import { EvaluateTaskReply } from "src/types/TaskResponses";
 import { RankTaskType } from "src/types/Tasks";
 
 export const EvaluateTask = ({
@@ -15,7 +16,7 @@ export const EvaluateTask = ({
   isDisabled,
   onReplyChanged,
   onValidityChanged,
-}: TaskSurveyProps<RankTaskType, { ranking: number[] }>) => {
+}: TaskSurveyProps<RankTaskType, EvaluateTaskReply>) => {
   const cardColor = useColorModeValue("gray.50", "gray.800");
   const [ranking, setRanking] = useState<number[]>(null);
 

website/src/components/Tasks/LabelTask/LabelTask.tsx

@@ -6,6 +6,7 @@ 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 { LabelTaskReply } from "src/types/TaskResponses";
 import { LabelTaskType } from "src/types/Tasks";
 
 const isRequired = (labelName: string, requiredLabels?: string[]) => {
@@ -18,7 +19,7 @@ export const LabelTask = ({
   isEditable,
   onReplyChanged,
   onValidityChanged,
-}: TaskSurveyProps<LabelTaskType, { text: string; labels: Record<string, number>; message_id: string }>) => {
+}: TaskSurveyProps<LabelTaskType, LabelTaskReply>) => {
   const { t } = useTranslation("labelling");
   const [values, setValues] = useState<number[]>(new Array(task.labels.length).fill(null));
   const [userInputMade, setUserInputMade] = useBoolean(false);

website/src/components/Tasks/Task/Task.tsx

@@ -53,12 +53,12 @@ interface UpdateValidity {
   replyValidity: TaskReplyValidity;
 }
 
-export interface TaskSurveyProps<TaskType extends BaseTask, T> {
+export interface TaskSurveyProps<TaskType extends BaseTask, ReplyContent> {
   task: TaskType;
   taskType: TaskInfo;
   isEditable: boolean;
   isDisabled?: boolean;
-  onReplyChanged: (content: T) => void;
+  onReplyChanged: (content: ReplyContent) => void;
   onValidityChanged: (validity: TaskReplyValidity) => void;
 }
 

website/src/hooks/tasks/useCreateReply.ts

@@ -1,8 +1,11 @@
+import { useGenericTaskAPI } from "src/hooks/tasks/useGenericTaskAPI";
 import { TaskType } from "src/types/Task";
+import { CreateTaskReply } from "src/types/TaskResponses";
 import { CreateAssistantReplyTask, CreateInitialPromptTask, CreatePrompterReplyTask } from "src/types/Tasks";
 
-import { useGenericTaskAPI } from "./useGenericTaskAPI";
-
-export const useCreateAssistantReply = () => useGenericTaskAPI<CreateAssistantReplyTask>(TaskType.assistant_reply);
-export const useCreatePrompterReply = () => useGenericTaskAPI<CreatePrompterReplyTask>(TaskType.prompter_reply);
-export const useCreateInitialPrompt = () => useGenericTaskAPI<CreateInitialPromptTask>(TaskType.initial_prompt);
+export const useCreateAssistantReply = () =>
+  useGenericTaskAPI<CreateAssistantReplyTask, CreateTaskReply>(TaskType.assistant_reply);
+export const useCreatePrompterReply = () =>
+  useGenericTaskAPI<CreatePrompterReplyTask, CreateTaskReply>(TaskType.prompter_reply);
+export const useCreateInitialPrompt = () =>
+  useGenericTaskAPI<CreateInitialPromptTask, CreateTaskReply>(TaskType.initial_prompt);

website/src/hooks/tasks/useEvaluateReplies.ts

@@ -0,0 +1,13 @@
+import { useGenericTaskAPI } from "src/hooks/tasks/useGenericTaskAPI";
+import { TaskType } from "src/types/Task";
+import { EvaluateTaskReply } from "src/types/TaskResponses";
+import { RankAssistantRepliesTask, RankInitialPromptsTask, RankPrompterRepliesTask } from "src/types/Tasks";
+
+export const useRankAssistantRepliesTask = () =>
+  useGenericTaskAPI<RankAssistantRepliesTask, EvaluateTaskReply>(TaskType.rank_assistant_replies);
+
+export const useRankPrompterRepliesTask = () =>
+  useGenericTaskAPI<RankPrompterRepliesTask, EvaluateTaskReply>(TaskType.rank_prompter_replies);
+
+export const useRankInitialPromptsTask = () =>
+  useGenericTaskAPI<RankInitialPromptsTask, EvaluateTaskReply>(TaskType.rank_initial_prompts);

website/src/hooks/tasks/useGenericTaskAPI.tsx

@@ -3,11 +3,11 @@ import { TaskInfos } from "src/components/Tasks/TaskTypes";
 import { get, post } from "src/lib/api";
 import { TaskApiHook } from "src/types/Hooks";
 import { BaseTask, ServerTaskResponse, TaskResponse, TaskType as TaskTypeEnum } from "src/types/Task";
+import { AllTaskReplies } from "src/types/TaskResponses";
 import useSWRImmutable from "swr/immutable";
 import useSWRMutation from "swr/mutation";
 
-// TODO: provide type for the content reply, this will be much harder since the replies vary vastly
-export const useGenericTaskAPI = <TaskType extends BaseTask, ResponseContent = any>(
+export const useGenericTaskAPI = <TaskType extends BaseTask, ResponseContent = AllTaskReplies>(
   taskType: TaskTypeEnum
 ): TaskApiHook<TaskType, ResponseContent> => {
   const [response, setResponse] = useState<TaskResponse<TaskType>>({ taskAvailability: "AWAITING_INITIAL" });
@@ -71,5 +71,5 @@ export const useGenericTaskAPI = <TaskType extends BaseTask, ResponseContent = a
     [response, sendTaskContent]
   );
 
-  return { response, isLoading, rejectTask, completeTask, skipTask };
+  return { response, isLoading, rejectTask, completeTask };
 };

website/src/hooks/tasks/useLabelingTask.ts

@@ -1,9 +1,11 @@
+import { useGenericTaskAPI } from "src/hooks/tasks/useGenericTaskAPI";
 import { TaskType } from "src/types/Task";
+import { LabelTaskReply } from "src/types/TaskResponses";
 import { LabelAssistantReplyTask, LabelInitialPromptTask, LabelPrompterReplyTask } from "src/types/Tasks";
 
-import { useGenericTaskAPI } from "./useGenericTaskAPI";
-
 export const useLabelAssistantReplyTask = () =>
-  useGenericTaskAPI<LabelAssistantReplyTask>(TaskType.label_assistant_reply);
-export const useLabelInitialPromptTask = () => useGenericTaskAPI<LabelInitialPromptTask>(TaskType.label_initial_prompt);
-export const useLabelPrompterReplyTask = () => useGenericTaskAPI<LabelPrompterReplyTask>(TaskType.label_prompter_reply);
+  useGenericTaskAPI<LabelAssistantReplyTask, LabelTaskReply>(TaskType.label_assistant_reply);
+export const useLabelInitialPromptTask = () =>
+  useGenericTaskAPI<LabelInitialPromptTask, LabelTaskReply>(TaskType.label_initial_prompt);
+export const useLabelPrompterReplyTask = () =>
+  useGenericTaskAPI<LabelPrompterReplyTask, LabelTaskReply>(TaskType.label_prompter_reply);

website/src/hooks/tasks/useRankReplies.ts

@@ -1,12 +0,0 @@
-import { TaskType } from "src/types/Task";
-import { RankAssistantRepliesTask, RankInitialPromptsTask, RankPrompterRepliesTask } from "src/types/Tasks";
-
-import { useGenericTaskAPI } from "./useGenericTaskAPI";
-
-export const useRankAssistantRepliesTask = () =>
-  useGenericTaskAPI<RankAssistantRepliesTask>(TaskType.rank_assistant_replies);
-
-export const useRankPrompterRepliesTask = () =>
-  useGenericTaskAPI<RankPrompterRepliesTask>(TaskType.rank_prompter_replies);
-
-export const useRankInitialPromptsTask = () => useGenericTaskAPI<RankInitialPromptsTask>(TaskType.rank_initial_prompts);

website/src/lib/constants.ts

@@ -3,17 +3,17 @@ import {
   useCreateInitialPrompt,
   useCreatePrompterReply,
 } from "src/hooks/tasks/useCreateReply";
+import {
+  useRankAssistantRepliesTask,
+  useRankInitialPromptsTask,
+  useRankPrompterRepliesTask,
+} from "src/hooks/tasks/useEvaluateReplies";
 import { useGenericTaskAPI } from "src/hooks/tasks/useGenericTaskAPI";
 import {
   useLabelAssistantReplyTask,
   useLabelInitialPromptTask,
   useLabelPrompterReplyTask,
 } from "src/hooks/tasks/useLabelingTask";
-import {
-  useRankAssistantRepliesTask,
-  useRankInitialPromptsTask,
-  useRankPrompterRepliesTask,
-} from "src/hooks/tasks/useRankReplies";
 import { TaskApiHooks } from "src/types/Hooks";
 import { TaskType } from "src/types/Task";
 

website/src/types/Hooks.ts

@@ -4,7 +4,6 @@ export type TaskApiHook<Task extends BaseTask, ResponseContent> = {
   response: TaskResponse<Task>;
   isLoading: boolean;
   completeTask: (interaction: ResponseContent) => Promise<void>;
-  skipTask: () => Promise<void>;
   rejectTask: (reason: string) => Promise<void>;
 };
 

website/src/types/TaskResponses.ts

@@ -0,0 +1,15 @@
+export interface CreateTaskReply {
+  text: string;
+}
+
+export interface EvaluateTaskReply {
+  ranking: number[];
+}
+
+export interface LabelTaskReply {
+  text: string;
+  labels: Record<string, number>;
+  message_id: string;
+}
+
+export type AllTaskReplies = CreateTaskReply | EvaluateTaskReply | LabelTaskReply;