feat(frontend): automatically scroll to bottom of container on plan content update (#11808)

Co-authored-by: amanape <83104063+amanape@users.noreply.github.com>
This commit is contained in:
Hiep Le 2025-12-01 11:23:48 -05:00 committed by GitHub
parent 6c2862ae08
commit 33eec7cb09
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -1,19 +1,28 @@
import React from "react";
import { useTranslation } from "react-i18next";
import { I18nKey } from "#/i18n/declaration";
import LessonPlanIcon from "#/icons/lesson-plan.svg?react";
import { useConversationStore } from "#/state/conversation-store";
import { useScrollToBottom } from "#/hooks/use-scroll-to-bottom";
import { MarkdownRenderer } from "#/components/features/markdown/markdown-renderer";
import { useHandlePlanClick } from "#/hooks/use-handle-plan-click";
function PlannerTab() {
const { t } = useTranslation();
const { scrollRef: scrollContainerRef, onChatBodyScroll } = useScrollToBottom(
React.useRef<HTMLDivElement>(null),
);
const { planContent } = useConversationStore();
const { handlePlanClick } = useHandlePlanClick();
if (planContent !== null && planContent !== undefined) {
return (
<div className="flex flex-col w-full h-full p-4 overflow-auto">
<div
ref={scrollContainerRef}
onScroll={(e) => onChatBodyScroll(e.currentTarget)}
className="flex flex-col w-full h-full p-4 overflow-auto"
>
<MarkdownRenderer includeStandard includeHeadings>
{planContent}
</MarkdownRenderer>