From 30c0d748d1779d3fc2b47c43c7f10f8736cf5a38 Mon Sep 17 00:00:00 2001
From: Duckhee Lee <shldhee@yahoo.co.kr>
Date: Mon, 27 Jun 2022 21:02:37 +0900
Subject: [PATCH] fix: resolve conflict

---
 .../Team2/src/components/Bullets.tsx          | 29 ++++++++++++++++---
 1 file changed, 25 insertions(+), 4 deletions(-)

diff --git a/PetitProjects/Team2/src/components/Bullets.tsx b/PetitProjects/Team2/src/components/Bullets.tsx
index e898526..30e95a3 100644
--- a/PetitProjects/Team2/src/components/Bullets.tsx
+++ b/PetitProjects/Team2/src/components/Bullets.tsx
@@ -33,6 +33,27 @@ const BulletItem = styled.li`
 `;
 
 const LIST_ITEM_HEIGHT = 72;
+let rafCache: number | null = null;
+
+const smoothMoveTo = (y: number) => {
+  let speed = Math.abs(window.scrollY - y) / 15;
+  const move = () => {
+    const diff = (window.scrollY - y);
+    if (diff === 0) return;
+
+    if (diff > 0) {
+      window.scrollTo(0, window.scrollY - Math.min(diff, speed));
+    } else {
+      window.scrollTo(0, window.scrollY + Math.min(Math.abs(diff), speed));
+    }
+    rafCache = requestAnimationFrame(move);
+  };
+  if (rafCache) {
+    cancelAnimationFrame(rafCache);
+    rafCache = null;
+  }
+  move();
+};
 
 const Bullets = () => {
   const [focused, setFocused] = useState<string>(
@@ -41,10 +62,10 @@ const Bullets = () => {
 
   const scrollToElement = (id: string) => {
     const target = document.querySelector(`#${id}`) as HTMLElement;
-    window.scrollTo({
-      top: target.offsetTop,
-      behavior: "smooth",
-    });
+    // window.scrollTo({
+    //   top: target.offsetTop,
+    // });
+    smoothMoveTo(target.offsetTop);
     window.history.pushState(null, "", "#" + id);
   };