feat: add scroll top for when entering a case in mobile

Author: kemuru

web/src/pages/Cases/CaseDetails/Overview/index.tsx

@@ -1,11 +1,12 @@
-import React, { useMemo } from "react";
+import React, { useEffect, useMemo } from "react";
 import styled from "styled-components";
 
 import { useParams } from "react-router-dom";
 import { formatEther } from "viem";
 
 import { usePopulatedDisputeData } from "hooks/queries/usePopulatedDisputeData";
 import { useVotingHistory } from "hooks/queries/useVotingHistory";
+import { useScrollTop } from "hooks/useScrollTop";
 import { getLocalRounds } from "utils/getLocalRounds";
 
 import { useCourtPolicy } from "queries/useCourtPolicy";
@@ -40,12 +41,17 @@ const Overview: React.FC<IOverview> = ({ arbitrable, courtID, currentPeriodIndex
   const { data: dispute } = useDisputeDetailsQuery(id);
   const { data: courtPolicy } = useCourtPolicy(courtID);
   const { data: votingHistory } = useVotingHistory(id);
+  const scrollTop = useScrollTop();
   const localRounds = getLocalRounds(votingHistory?.dispute?.disputeKitDispute);
   const courtName = courtPolicy?.name;
   const court = dispute?.dispute?.court;
   const rewards = useMemo(() => (court ? `≥ ${formatEther(court.feeForJuror)} ETH` : undefined), [court]);
   const category = disputeDetails?.category;
 
+  useEffect(() => {
+    scrollTop();
+  }, [scrollTop]);
+
   return (
     <>
       <Container>