diff --git a/website/README.md b/website/README.md index 37f6991b..30ea3154 100644 --- a/website/README.md +++ b/website/README.md @@ -188,10 +188,10 @@ new tasks: 1. For any task that involves writing a free-form response, put the page under `website/src/pages/create` with a page name matching the task type, such as - `summarize_story.tsx`. + `initial_prompt.tsx`. 1. For any task that evaluates, rates, or ranks content, put the page under `website/src/pages/evaluate` with a page name matching the task type such as - `rate_summary.tsx`. + `rank_initial_prompts.tsx`. With this we'll be able to ensure these contribution pages are hidden from logged out users but accessible to logged in users. diff --git a/website/src/components/RatingRadioGroup.tsx b/website/src/components/RatingRadioGroup.tsx deleted file mode 100644 index 6a63d1ec..00000000 --- a/website/src/components/RatingRadioGroup.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { Box, HStack, useRadio, useRadioGroup } from "@chakra-ui/react"; - -const RatingRadioButton = (props) => { - const { getInputProps, getCheckboxProps } = useRadio(props); - - const input = getInputProps(); - const checkbox = getCheckboxProps(); - - return ( - - - - {props.children} - - - ); -}; - -const RatingRadioGroup = (props) => { - const { min, max, onChange } = props; - const { getRadioProps, getRootProps } = useRadioGroup({ - name: "rating", - defaultValue: `${min}`, - onChange: onChange, - }); - const group = getRootProps(); - - const options = Array.from(new Array(1 + max - min), (x, i) => `${i + min}`); - - return ( - - {options.map((option) => { - const radio = getRadioProps({ value: option }); - return ( - - {option} - - ); - })} - - ); -}; - -export default RatingRadioGroup; diff --git a/website/src/pages/create/summarize_story.tsx b/website/src/pages/create/summarize_story.tsx deleted file mode 100644 index 15d7d99e..00000000 --- a/website/src/pages/create/summarize_story.tsx +++ /dev/null @@ -1,102 +0,0 @@ -import { useColorMode } from "@chakra-ui/react"; -import { useState } from "react"; -import { LoadingScreen } from "src/components/Loading/LoadingScreen"; -import { TaskControls } from "src/components/Survey/TaskControls"; -import { TrackedTextarea } from "src/components/Survey/TrackedTextarea"; -import { TwoColumnsWithCards } from "src/components/Survey/TwoColumnsWithCards"; -import fetcher from "src/lib/fetcher"; -import poster from "src/lib/poster"; -import useSWRImmutable from "swr/immutable"; -import useSWRMutation from "swr/mutation"; - -const SummarizeStory = () => { - // Use an array of tasks that record the sequence of steps until a task is - // deemed complete. - const [tasks, setTasks] = useState([]); - const [inputText, setInputText] = useState(""); - - // Fetch the very fist task. We can ignore everything except isLoading - // because the onSuccess handler will update `tasks` when ready. - const { isLoading, mutate } = useSWRImmutable("/api/new_task/summarize_story", fetcher, { - onSuccess: (data) => { - setTasks([data]); - }, - }); - - // Every time we submit an answer to the latest task, let the backend handle - // all the interactions then add the resulting task to the queue. This ends - // when we hit the done task. - const { trigger } = useSWRMutation("/api/update_task", poster, { - onSuccess: async (data) => { - const newTask = await data.json(); - // This is the more efficient way to update a react state array. - setTasks((oldTasks) => [...oldTasks, newTask]); - }, - }); - - // Trigger a mutation that updates the current task. We should probably - // signal somewhere that this interaction is being processed. - const submitResponse = () => { - const text = inputText.trim(); - trigger({ - id: tasks[0].id, - update_type: "text_reply_to_message", - content: { - text, - }, - }); - }; - - const fetchNextTask = () => { - setInputText(""); - mutate(); - }; - - const textChangeHandler = (event: React.ChangeEvent) => { - setInputText(event.target.value); - }; - - const { colorMode } = useColorMode(); - const mainBgClasses = colorMode === "light" ? "bg-slate-300 text-gray-800" : "bg-slate-900 text-white"; - - if (isLoading) { - return ; - } - - if (tasks.length === 0) { - return
No tasks found...
; - } - - return ( -
-
- - <> -
Instruction
-

Summarize the following story

-
{tasks[0].task.story}
- - <> -
Provide the assistant`s reply
- - - - - -
-
- ); -}; - -export default SummarizeStory; diff --git a/website/src/pages/evaluate/rate_summary.tsx b/website/src/pages/evaluate/rate_summary.tsx deleted file mode 100644 index 3ea2448e..00000000 --- a/website/src/pages/evaluate/rate_summary.tsx +++ /dev/null @@ -1,190 +0,0 @@ -import { Textarea } from "@chakra-ui/react"; -import { useColorMode } from "@chakra-ui/react"; -import { QuestionMarkCircleIcon } from "@heroicons/react/20/solid"; -import Head from "next/head"; -import { useState } from "react"; -import { LoadingScreen } from "src/components/Loading/LoadingScreen"; -import RatingRadioGroup from "src/components/RatingRadioGroup"; -import { TaskControls } from "src/components/Survey/TaskControls"; -import { TwoColumnsWithCards } from "src/components/Survey/TwoColumnsWithCards"; -import fetcher from "src/lib/fetcher"; -import poster from "src/lib/poster"; -import useSWRImmutable from "swr/immutable"; -import useSWRMutation from "swr/mutation"; - -const RateSummary = () => { - // Use an array of tasks that record the sequence of steps until a task is - // deemed complete. - const [tasks, setTasks] = useState([]); - const [rating, setRating] = useState(0); - - // Fetch the very fist task. We can ignore everything except isLoading - // because the onSuccess handler will update `tasks` when ready. - const { isLoading, mutate } = useSWRImmutable("/api/new_task/rate_summary", fetcher, { - onSuccess: (data) => { - setTasks([data]); - }, - }); - - // Every time we submit an answer to the latest task, let the backend handle - // all the interactions then add the resulting task to the queue. This ends - // when we hit the done task. - const { trigger } = useSWRMutation("/api/update_task", poster, { - onSuccess: async (data) => { - const newTask = await data.json(); - // This is the more efficient way to update a react state array. - setTasks((oldTasks) => [...oldTasks, newTask]); - }, - }); - - // Trigger a mutation that updates the current task. We should probably - // signal somewhere that this interaction is being processed. - const submitResponse = () => { - trigger({ - id: tasks[0].task.id, - update_type: "message_rating", - content: { - rating: rating, - }, - }); - }; - - const fetchNextTask = () => { - mutate(); - }; - - const { colorMode } = useColorMode(); - const mainBgClasses = colorMode === "light" ? "bg-slate-300 text-gray-800" : "bg-slate-900 text-white"; - - if (isLoading) { - return ; - } - - if (tasks.length === 0) { - return ( -
-
-
No tasks found...
-
-
- ); - } - - return ( - <> - - Rate A Summary - - -
- - <> -
Instruction
-
{tasks[0].task.full_text}
- - -
-
Output
-

{tasks[0].task.summary}

-

Rating

-

- ({tasks[0].task.scale.min} = worst, {tasks[0].task.scale.max} = best) -

-
- -
-
    - {ANNOTATION_FLAGS.map((option, i) => ( - - ))} -
-