From 2ba653429fadc7455538cf7fc0196c13701bfa0f Mon Sep 17 00:00:00 2001 From: vitorRibeiro7 Date: Thu, 16 Jan 2025 18:20:08 -0300 Subject: [PATCH 1/6] fix: fix css bug on requirements details style --- src/renderer/src/pages/game-details/sidebar/sidebar.css.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts b/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts index aa27cd42..8242e7c9 100644 --- a/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts +++ b/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts @@ -34,6 +34,7 @@ export const requirementButton = style({ }); export const requirementsDetails = style({ + minHeight: "500px", padding: `${SPACING_UNIT * 2}px`, lineHeight: "22px", fontSize: "16px", From 049c27cdb7d8e7e104a722327a220e8e785633bf Mon Sep 17 00:00:00 2001 From: vitorRibeiro7 Date: Fri, 17 Jan 2025 11:32:28 -0300 Subject: [PATCH 2/6] fix; revert minHeight --- src/renderer/src/pages/game-details/sidebar/sidebar.css.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts b/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts index 8242e7c9..aa27cd42 100644 --- a/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts +++ b/src/renderer/src/pages/game-details/sidebar/sidebar.css.ts @@ -34,7 +34,6 @@ export const requirementButton = style({ }); export const requirementsDetails = style({ - minHeight: "500px", padding: `${SPACING_UNIT * 2}px`, lineHeight: "22px", fontSize: "16px", From 4e34f41ee0d60a1c2138475a8cc36028131dad13 Mon Sep 17 00:00:00 2001 From: vitorRibeiro7 Date: Fri, 17 Jan 2025 11:33:44 -0300 Subject: [PATCH 3/6] ench: remove maxHeight on sidebar section --- .../src/pages/game-details/sidebar-section/sidebar-section.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx index da9d078f..adbc5930 100644 --- a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx +++ b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx @@ -26,8 +26,6 @@ export function SidebarSection({ title, children }: SidebarSectionProps) {
Date: Fri, 17 Jan 2025 11:54:14 -0300 Subject: [PATCH 4/6] fix: reset overflow hidden --- .../src/pages/game-details/sidebar-section/sidebar-section.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx index adbc5930..4858cc0a 100644 --- a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx +++ b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx @@ -26,6 +26,7 @@ export function SidebarSection({ title, children }: SidebarSectionProps) {
Date: Fri, 17 Jan 2025 11:55:03 -0300 Subject: [PATCH 5/6] ench: add dynamic height --- .../game-details/sidebar-section/sidebar-section.tsx | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx index 4858cc0a..4b01adeb 100644 --- a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx +++ b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx @@ -1,5 +1,5 @@ import { ChevronDownIcon } from "@primer/octicons-react"; -import { useRef, useState } from "react"; +import { useEffect, useRef, useState } from "react"; import * as styles from "./sidebar-section.css"; @@ -11,6 +11,13 @@ export interface SidebarSectionProps { export function SidebarSection({ title, children }: SidebarSectionProps) { const content = useRef(null); const [isOpen, setIsOpen] = useState(true); + const [height, setHeight] = useState(0); + + useEffect(() => { + if (content.current) { + setHeight(isOpen ? content.current.scrollHeight : 0); + } + }, [isOpen, children]); return (
@@ -26,6 +33,7 @@ export function SidebarSection({ title, children }: SidebarSectionProps) {
Date: Fri, 17 Jan 2025 12:25:35 -0300 Subject: [PATCH 6/6] refactor: add non re-render rules to useEffect --- .../pages/game-details/sidebar-section/sidebar-section.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx index 4b01adeb..e24f677b 100644 --- a/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx +++ b/src/renderer/src/pages/game-details/sidebar-section/sidebar-section.tsx @@ -14,10 +14,12 @@ export function SidebarSection({ title, children }: SidebarSectionProps) { const [height, setHeight] = useState(0); useEffect(() => { - if (content.current) { + if (content.current && content.current.scrollHeight !== height) { setHeight(isOpen ? content.current.scrollHeight : 0); + } else if (!isOpen) { + setHeight(0); } - }, [isOpen, children]); + }, [isOpen, children, height]); return (