Refactor task page routes and repetition

Remove blank line

Lint add blank line

Link pre-commit
This commit is contained in:
rjmacarthy
2023-01-26 13:13:46 +00:00
parent 639722b0f4
commit 24f4c08796
17 changed files with 147 additions and 271 deletions
@@ -0,0 +1,23 @@
describe("no tasks available", () => {
it("displays an empty state when no tasks are available", () => {
cy.signInWithEmail("cypress@example.com");
cy.intercept(
{
method: "GET",
url: "/api/new_task/prompter_reply",
},
{
statusCode: 500,
body: {
message: "No tasks of type 'label_prompter_reply' are currently available.",
errorCode: 1006,
httpStatusCode: 503,
},
}
).as("newTaskPrompterReply");
cy.visit("/create/user_reply");
cy.wait("@newTaskPrompterReply").then(() => {
cy.get('[data-cy="cy-no-tasks"]').should("exist");
});
});
});
+3 -2
View File
@@ -9,11 +9,12 @@
"docs": "Docs",
"github": "GitHub",
"legal": "Legal",
"loading": "Loading...",
"more_information": "More Information",
"privacy_policy": "Privacy Policy",
"report_a_bug": "Report a Bug",
"sign_in": "Sign In",
"sign_out": "Sign Out",
"terms_of_service": "Terms of Service",
"title": "Open Assistant",
"more_information": "More Information"
"title": "Open Assistant"
}
+1 -1
View File
@@ -15,7 +15,7 @@ export const EmptyState = (props: EmptyStateProps) => {
<Box data-cy={props["data-cy"]} bg={backgroundColor} p="10" borderRadius="xl" shadow="base">
<Box display="flex" flexDirection="column" alignItems="center" gap="8" fontSize="lg">
<props.icon size="30" color="DarkOrange" />
<Text>{props.text}</Text>
<Text data-cy="cy-no-tasks">{props.text}</Text>
<NextLink href="/dashboard">
<Text color="blue.500">Go back to the dashboard</Text>
</NextLink>
@@ -0,0 +1,40 @@
import Head from "next/head";
import { useTranslation } from "next-i18next";
import { TaskEmptyState } from "src/components/EmptyState";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { TaskInfos } from "src/components/Tasks/TaskTypes";
import { apiHooksByType, ERROR_CODES } from "src/lib/constants";
import { getTypeSafei18nKey } from "src/lib/i18n";
import { TaskType } from "src/types/Task";
type TaskPageProps = {
type: TaskType;
};
export const TaskPage = ({ type }: TaskPageProps) => {
const { t } = useTranslation(["tasks", "common"]);
const apiHook = apiHooksByType[type];
const { tasks, isLoading, reset, trigger, error } = apiHook(type);
const taskType = TaskInfos.find((taskType) => taskType.type === type);
if (isLoading) {
return <LoadingScreen text={t("common:loading")} />;
}
if (tasks.length === 0 || error?.errorCode === ERROR_CODES.TASK_REQUESTED_TYPE_NOT_AVAILABLE) {
return <TaskEmptyState />;
}
const task = tasks[0];
return (
<>
<Head>
<title>{t(getTypeSafei18nKey(`${taskType.id}.label`))}</title>
<meta name="description" content={t(getTypeSafei18nKey(`${taskType.id}.desc`))} />
</Head>
<Task key={task.task.id} frontendId={task.id} task={task.task} trigger={trigger} mutate={reset} />
</>
);
};
+2 -1
View File
@@ -17,7 +17,8 @@ export const post = (url: string, { arg: data }) => api.post(url, data).then((re
api.interceptors.response.use(
(response) => response,
(error) => {
throw new OasstError(error.message ?? error, error.error_code, error?.response?.status || -1);
const err = error?.response?.data;
throw new OasstError(err?.message ?? error, err?.errorCode, error?.response?.httpStatusCode || -1);
}
);
+42
View File
@@ -0,0 +1,42 @@
import {
useCreateAssistantReply,
useCreateInitialPrompt,
useCreatePrompterReply,
} from "src/hooks/tasks/useCreateReply";
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 { TaskType } from "src/types/Task";
export const ERROR_CODES = {
TASK_REQUESTED_TYPE_NOT_AVAILABLE: 1006,
TASK_INVALID_REQUEST_TYPE: 1000,
TASK_ACK_FAILED: 1001,
TASK_NACK_FAILED: 1002,
TASK_INVALID_RESPONSE_TYPE: 1003,
TASK_INTERACTION_REQUEST_FAILED: 1004,
TASK_GENERATION_FAILED: 1005,
TASK_AVAILABILITY_QUERY_FAILED: 1007,
TASK_MESSAGE_TOO_LONG: 1008,
};
export const apiHooksByType = {
[TaskType.random]: useGenericTaskAPI,
[TaskType.assistant_reply]: useCreateAssistantReply,
[TaskType.initial_prompt]: useCreateInitialPrompt,
[TaskType.label_assistant_reply]: useLabelAssistantReplyTask,
[TaskType.label_initial_prompt]: useLabelInitialPromptTask,
[TaskType.label_prompter_reply]: useLabelPrompterReplyTask,
[TaskType.prompter_reply]: useCreatePrompterReply,
[TaskType.rank_assistant_replies]: useRankAssistantRepliesTask,
[TaskType.rank_initial_prompts]: useRankInitialPromptsTask,
[TaskType.rank_prompter_replies]: useRankPrompterRepliesTask,
};
+3 -26
View File
@@ -1,32 +1,9 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useCreateAssistantReply } from "src/hooks/tasks/useCreateReply";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const AssistantReply = () => {
const { tasks, isLoading, reset, trigger } = useCreateAssistantReply();
if (isLoading) {
return <LoadingScreen text="Loading..." />;
}
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Reply as Assistant</title>
<meta name="description" content="Reply as Assistant." />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
const AssistantReply = () => <TaskPage type={TaskType.assistant_reply} />;
AssistantReply.getLayout = getDashboardLayout;
+3 -26
View File
@@ -1,32 +1,9 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useCreateInitialPrompt } from "src/hooks/tasks/useCreateReply";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const InitialPrompt = () => {
const { tasks, isLoading, reset, trigger } = useCreateInitialPrompt();
if (isLoading) {
return <LoadingScreen text="Loading..." />;
}
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Initial Prompt</title>
<meta name="description" content="Add an initial Prompt." />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
const InitialPrompt = () => <TaskPage type={TaskType.initial_prompt} />;
InitialPrompt.getLayout = getDashboardLayout;
+5 -28
View File
@@ -1,33 +1,10 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useCreatePrompterReply } from "src/hooks/tasks/useCreateReply";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const UserReply = () => {
const { tasks, isLoading, reset, trigger } = useCreatePrompterReply();
const PrompterReply = () => <TaskPage type={TaskType.prompter_reply} />;
if (isLoading) {
return <LoadingScreen text="Loading..." />;
}
PrompterReply.getLayout = getDashboardLayout;
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Reply as User</title>
<meta name="description" content="Reply as User." />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
UserReply.getLayout = getDashboardLayout;
export default UserReply;
export default PrompterReply;
@@ -1,32 +1,9 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useRankAssistantRepliesTask } from "src/hooks/tasks/useRankReplies";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const RankAssistantReplies = () => {
const { tasks, isLoading, reset, trigger } = useRankAssistantRepliesTask();
if (isLoading) {
return <LoadingScreen text="Loading..." />;
}
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Rank Assistant Replies</title>
<meta name="description" content="Rank Assistant Replies." />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
const RankAssistantReplies = () => <TaskPage type={TaskType.rank_assistant_replies} />;
RankAssistantReplies.getLayout = getDashboardLayout;
@@ -1,32 +1,9 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useRankInitialPromptsTask } from "src/hooks/tasks/useRankReplies";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const RankInitialPrompts = () => {
const { tasks, isLoading, reset, trigger } = useRankInitialPromptsTask();
if (isLoading) {
return <LoadingScreen text="Loading..." />;
}
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Rank Initial Prompts</title>
<meta name="description" content="Rank initial prompts." />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
const RankInitialPrompts = () => <TaskPage type={TaskType.rank_initial_prompts} />;
RankInitialPrompts.getLayout = getDashboardLayout;
@@ -1,33 +1,10 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useRankPrompterRepliesTask } from "src/hooks/tasks/useRankReplies";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const RankUserReplies = () => {
const { tasks, isLoading, reset, trigger } = useRankPrompterRepliesTask();
const RankPrompterReplies = () => <TaskPage type={TaskType.rank_prompter_replies} />;
if (isLoading) {
return <LoadingScreen text="Loading..." />;
}
RankPrompterReplies.getLayout = getDashboardLayout;
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Rank User Replies</title>
<meta name="description" content="Rank User Replies." />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
RankUserReplies.getLayout = getDashboardLayout;
export default RankUserReplies;
export default RankPrompterReplies;
@@ -1,32 +1,9 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useLabelAssistantReplyTask } from "src/hooks/tasks/useLabelingTask";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const LabelAssistantReply = () => {
const { tasks, isLoading, trigger, reset } = useLabelAssistantReplyTask();
if (isLoading) {
return <LoadingScreen />;
}
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Label Assistant Reply</title>
<meta name="description" content="Label Assistant Reply" />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
const LabelAssistantReply = () => <TaskPage type={TaskType.label_assistant_reply} />;
LabelAssistantReply.getLayout = getDashboardLayout;
@@ -1,32 +1,9 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useLabelInitialPromptTask } from "src/hooks/tasks/useLabelingTask";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const LabelInitialPrompt = () => {
const { tasks, isLoading, trigger, reset } = useLabelInitialPromptTask();
if (isLoading) {
return <LoadingScreen />;
}
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Label Initial Prompt</title>
<meta name="description" content="Label Initial Prompt" />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
const LabelInitialPrompt = () => <TaskPage type={TaskType.label_initial_prompt} />;
LabelInitialPrompt.getLayout = getDashboardLayout;
@@ -1,32 +1,9 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useLabelPrompterReplyTask } from "src/hooks/tasks/useLabelingTask";
import { TaskPage } from "src/components/TaskPage/TaskPage";
import { TaskType } from "src/types/Task";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
const LabelPrompterReply = () => {
const { tasks, isLoading, trigger, reset } = useLabelPrompterReplyTask();
if (isLoading) {
return <LoadingScreen />;
}
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Label Prompter Reply</title>
<meta name="description" content="Label Prompter Reply" />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
const LabelPrompterReply = () => <TaskPage type={TaskType.label_prompter_reply} />;
LabelPrompterReply.getLayout = getDashboardLayout;
+4 -28
View File
@@ -1,34 +1,10 @@
import Head from "next/head";
import { TaskEmptyState } from "src/components/EmptyState";
import { getDashboardLayout } from "src/components/Layout";
import { LoadingScreen } from "src/components/Loading/LoadingScreen";
import { Task } from "src/components/Tasks/Task";
import { useGenericTaskAPI } from "src/hooks/tasks/useGenericTaskAPI";
import { TaskPage } from "src/components/TaskPage/TaskPage";
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
import { TaskType } from "src/types/Task";
const RandomTask = () => {
const { tasks, isLoading, trigger, reset } = useGenericTaskAPI(TaskType.random);
const Random = () => <TaskPage type={TaskType.random} />;
if (isLoading) {
return <LoadingScreen text="Loading..." />;
}
Random.getLayout = getDashboardLayout;
if (tasks.length === 0) {
return <TaskEmptyState />;
}
return (
<>
<Head>
<title>Random Task</title>
<meta name="description" content="Random Task." />
</Head>
<Task key={tasks[0].task.id} frontendId={tasks[0].id} task={tasks[0].task} trigger={trigger} mutate={reset} />
</>
);
};
RandomTask.getLayout = (page) => getDashboardLayout(page);
export default RandomTask;
export default Random;
+1 -1
View File
@@ -1,4 +1,4 @@
export const enum TaskType {
export enum TaskType {
initial_prompt = "initial_prompt",
assistant_reply = "assistant_reply",
prompter_reply = "prompter_reply",