From a2baad9c7fb731f80329d94b3eddd81de88ad934 Mon Sep 17 00:00:00 2001
From: Yifei Zhang <yidadaa@qq.com>
Date: Thu, 16 Mar 2023 16:08:16 +0000
Subject: [PATCH] fix: scroll ux on ios device

---
 app/components/home.module.scss |  6 ++++++
 app/components/home.tsx         | 14 +++++++++-----
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/app/components/home.module.scss b/app/components/home.module.scss
index 6b3ee91ca..3a5365aa5 100644
--- a/app/components/home.module.scss
+++ b/app/components/home.module.scss
@@ -317,6 +317,12 @@
   outline: none;
 }
 
+@media only screen and (max-width: 600px) {
+  .chat-input {
+    font-size: 16px;
+  }
+}
+
 .chat-input:focus {
   border: 1px solid var(--primary);
 }
diff --git a/app/components/home.tsx b/app/components/home.tsx
index 931ebe609..4ff72ab7e 100644
--- a/app/components/home.tsx
+++ b/app/components/home.tsx
@@ -177,10 +177,14 @@ export function Chat(props: { showSideBar?: () => void }) {
     );
 
   useEffect(() => {
-    latestMessageRef.current?.scrollIntoView({
-      behavior: "smooth",
-      block: "end",
-    });
+    const dom = latestMessageRef.current;
+    const rect = dom?.getBoundingClientRect();
+    if (dom && rect && rect?.top >= document.documentElement.clientHeight - 120) {
+      dom.scrollIntoView({
+        behavior: "smooth",
+        block: "end"
+      });
+    }
   });
 
   return (
@@ -322,7 +326,7 @@ export function Home() {
   const loading = !useChatStore?.persist?.hasHydrated();
   const [showSideBar, setShowSideBar] = useState(true);
 
-  // settings
+  // setting
   const [openSettings, setOpenSettings] = useState(false);
   const config = useChatStore((state) => state.config);