Scroll to top on submit

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

@@ -27,6 +27,8 @@ export const Task = ({ frontendId, task, trigger, mutate }) => {
   const replyContent = useRef<TaskContent>(null);
   const [showUnchangedWarning, setShowUnchangedWarning] = useState(false);
 
+  const rootEl = useRef<HTMLDivElement>(null);
+
   const taskType = TaskTypes.find((taskType) => taskType.type === task.type && taskType.mode === task.mode);
 
   const { trigger: sendRejection } = useSWRMutation("/api/reject_task", post, {
@@ -89,6 +91,7 @@ export const Task = ({ frontendId, task, trigger, mutate }) => {
           content: replyContent.current,
         });
         setTaskStatus("SUBMITTED");
+        scrollToTop(rootEl.current);
         break;
       }
       default:
@@ -138,7 +141,7 @@ export const Task = ({ frontendId, task, trigger, mutate }) => {
   }
 
   return (
-    <div>
+    <div ref={rootEl}>
       {taskTypeComponent()}
       <TaskControls
         task={task}
@@ -164,3 +167,10 @@ export const Task = ({ frontendId, task, trigger, mutate }) => {
     </div>
   );
 };
+
+const scrollToTop = (element: HTMLElement) => {
+  while (element) {
+    element.scrollTop = 0;
+    element = element.parentElement;
+  }
+};