From 051fa379496ab0be5a1b9ea3627b14c71f9ababa Mon Sep 17 00:00:00 2001
From: Athou <jeremiepanzer@gmail.com>
Date: Fri, 19 Aug 2022 08:43:13 +0200
Subject: [PATCH] scroll only if the entry doesn't entirely fit on screen (same
 as commafeed v1)

---
 commafeed-client/src/app/constants.ts                   | 2 ++
 commafeed-client/src/components/content/FeedEntries.tsx | 6 ++----
 commafeed-client/src/components/content/FeedEntry.tsx   | 1 +
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/commafeed-client/src/app/constants.ts b/commafeed-client/src/app/constants.ts
index aa2541a8..5b335b40 100644
--- a/commafeed-client/src/app/constants.ts
+++ b/commafeed-client/src/app/constants.ts
@@ -8,6 +8,8 @@ export const Constants = {
         mobileBreakpoint: DEFAULT_THEME.breakpoints.md,
         headerHeight: 60,
         sidebarWidth: 350,
+        isTopVisible: (div: HTMLDivElement) => div.getBoundingClientRect().top >= Constants.layout.headerHeight,
+        isBottomVisible: (div: HTMLDivElement) => div.getBoundingClientRect().bottom <= window.innerHeight,
     },
     dom: {
         mainScrollAreaId: "main-scroll-area-id",
diff --git a/commafeed-client/src/components/content/FeedEntries.tsx b/commafeed-client/src/components/content/FeedEntries.tsx
index f77b7b2e..de4d479d 100644
--- a/commafeed-client/src/components/content/FeedEntries.tsx
+++ b/commafeed-client/src/components/content/FeedEntries.tsx
@@ -52,8 +52,7 @@ export function FeedEntries() {
         if (selectedEntry) {
             if (selectedEntry.expanded) {
                 const ref = refs.current[selectedEntry.id]
-                const bottomVisible = ref.getBoundingClientRect().bottom <= window.innerHeight
-                if (bottomVisible) {
+                if (Constants.layout.isBottomVisible(ref)) {
                     dispatch(selectNextEntry())
                 } else {
                     const scrollArea = document.getElementById(Constants.dom.mainScrollAreaId)
@@ -73,8 +72,7 @@ export function FeedEntries() {
         if (selectedEntry) {
             if (selectedEntry.expanded) {
                 const ref = refs.current[selectedEntry.id]
-                const topVisible = ref.getBoundingClientRect().top >= Constants.layout.headerHeight
-                if (topVisible) {
+                if (Constants.layout.isTopVisible(ref)) {
                     dispatch(selectPreviousEntry())
                 } else {
                     const scrollArea = document.getElementById(Constants.dom.mainScrollAreaId)
diff --git a/commafeed-client/src/components/content/FeedEntry.tsx b/commafeed-client/src/components/content/FeedEntry.tsx
index 72d0ae08..ddb8e9a6 100644
--- a/commafeed-client/src/components/content/FeedEntry.tsx
+++ b/commafeed-client/src/components/content/FeedEntry.tsx
@@ -58,6 +58,7 @@ export function FeedEntry(props: FeedEntryProps) {
         setTimeout(() => {
             if (!ref.current) return
             if (!props.expanded) return
+            if (Constants.layout.isTopVisible(ref.current) && Constants.layout.isBottomVisible(ref.current)) return
 
             document.getElementById(Constants.dom.mainScrollAreaId)?.scrollTo({
                 // having a small gap between the top of the content and the top of the page is sexier