From 173728536adecf37636c070453147a15ca5f214c Mon Sep 17 00:00:00 2001 From: Lim Chee Aun Date: Sat, 28 Oct 2023 16:21:32 +0800 Subject: [PATCH] Extract out the fancy selector string --- src/pages/status.jsx | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/src/pages/status.jsx b/src/pages/status.jsx index 3b625c03..a0c55958 100644 --- a/src/pages/status.jsx +++ b/src/pages/status.jsx @@ -60,6 +60,12 @@ const scrollIntoViewOptions = { behavior: 'smooth', }; +// Select all statuses except those inside collapsed details/summary +// Hat-tip to @AmeliaBR@front-end.social +// https://front-end.social/@AmeliaBR/109784776146144471 +const STATUSES_SELECTOR = + '.status-link:not(details:not([open]) > summary ~ *, details:not([open]) > summary ~ * *), .status-focus:not(details:not([open]) > summary ~ *, details:not([open]) > summary ~ * *)'; + function StatusPage(params) { const { id } = params; const { masto, instance } = api({ instance: params.instance }); @@ -555,12 +561,7 @@ function StatusThread({ id, closeLink = '/', instance: propInstance }) { ); const activeStatusRect = activeStatus?.getBoundingClientRect(); const allStatusLinks = Array.from( - // Select all statuses except those inside collapsed details/summary - // Hat-tip to @AmeliaBR@front-end.social - // https://front-end.social/@AmeliaBR/109784776146144471 - scrollableRef.current.querySelectorAll( - '.status-link:not(details:not([open]) > summary ~ *, details:not([open]) > summary ~ * *), .status-focus:not(details:not([open]) > summary ~ *, details:not([open]) > summary ~ * *)', - ), + scrollableRef.current.querySelectorAll(STATUSES_SELECTOR), ); console.log({ allStatusLinks }); if ( @@ -593,9 +594,7 @@ function StatusThread({ id, closeLink = '/', instance: propInstance }) { ); const activeStatusRect = activeStatus?.getBoundingClientRect(); const allStatusLinks = Array.from( - scrollableRef.current.querySelectorAll( - '.status-link:not(details:not([open]) > summary ~ *, details:not([open]) > summary ~ * *), .status-focus:not(details:not([open]) > summary ~ *, details:not([open]) > summary ~ * *)', - ), + scrollableRef.current.querySelectorAll(STATUSES_SELECTOR), ); if ( activeStatus &&