fix: scroll issues

This commit is contained in:
averel10
2026-04-02 08:26:33 +02:00
parent bdbfe04e7e
commit 01c95658f4
4 changed files with 36 additions and 4 deletions

View File

@@ -49,10 +49,16 @@ export default function CalibrationEntryView({
setSelectedDialect(existingAnswer?.dialectLabel || null);
setSelectedConfidence(existingAnswer?.confidence || null);
setFullyPlayed(existingAnswer ? true : false);
// Scroll to top when entry changes with smooth animation
window.scrollTo({ top: 0, behavior: 'smooth' });
}, [entry, existingAnswer]);
useEffect(() => {
// Scroll to top when entry changes
window.scrollTo({
top: 0,
behavior: 'smooth',
});
}, [entry.id]);
return (
<div
className={`border rounded-xl p-5 bg-white shadow-sm transition-colors duration-300 ${

View File

@@ -1,5 +1,7 @@
'use client';
import { useEffect } from 'react';
interface CalibrationInfoViewProps {
onContinue: () => void;
hasExistingAnswers: boolean;
@@ -9,6 +11,13 @@ export default function CalibrationInfoView({
onContinue,
hasExistingAnswers,
}: CalibrationInfoViewProps) {
useEffect(() => {
window.scrollTo({
top: 0,
behavior: 'smooth',
});
}, []);
const handleContinue = () => {
onContinue();
};

View File

@@ -6,6 +6,13 @@ import { ExperimentCalibration } from '@/lib/model/experiment_calibration';
import CalibrationPageView from './CalibrationPageView';
import CalibrationInfoView from './CalibrationInfoView';
const scrollToTop = () => {
window.scrollTo({
top: 0,
behavior: 'smooth',
});
};
interface CalibrationPhaseProps {
experimentId: number;
}
@@ -61,12 +68,14 @@ export default function CalibrationPhase({ experimentId }: CalibrationPhaseProps
if (showInfoPage) {
return (
<CalibrationInfoView
onContinue={() => setShowInfoPage(false)}
onContinue={() => {
scrollToTop();
setShowInfoPage(false);
}}
hasExistingAnswers={hasExistingAnswers}
/>
);
}
// Show calibration page
return <CalibrationPageView entries={entries} experimentId={experimentId} />;
}