fixup! Wrap album entries in an <ElementScroller> element to record t…

…he scroll position
steinarb · Jan 1, 2023 · b758fc6 · b758fc6
1 parent 33ebd06
commit b758fc6
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 25 deletions.
diff --git a/oldalbum.web.frontend/src/main/frontend/src/components/AlbumEntryOfTypeAlbum.js b/oldalbum.web.frontend/src/main/frontend/src/components/AlbumEntryOfTypeAlbum.js
@@ -16,22 +16,20 @@ export default function AlbumEntryOfTypeAlbum(props) {
     const noOfThumbnails = title.length > 21 ? 3 : 2;
     const childrenWithThumbnails = findChildrenThumbnails(entry, children, childentries).slice(0, noOfThumbnails);
     const widthInCols =  noOfThumbnails===2 ? ' col-sm-12 col-md-4 col-lg-3 col-xl-2' : ' col-sm-12 col-md-5 col-lg-4 col-xl-3';
-    const anchor = 'entry' + entry.id.toString();
+    const anchor = ' entry' + entry.id.toString();
 
     return (
         <ElementScroller scrollKey={anchor}>
-            <div className={anchor}>
-                <div className={className + widthInCols + ' album-entry-album btn btn-primary mx-1 my-1'}>
-                    <LeftButton item={entry} />
-                    <div className="col-auto">
-                        <NavLink className="btn-primary p-2 text-left" to={entry.path}>Album: {title}</NavLink>
-                        <div className="d-none d-md-flex">
-                            { childrenWithThumbnails.map(c => <Thumbnail key={'entry_' + c.id} entry={c} />) }
-                        </div>
+            <div className={className + anchor + widthInCols + ' album-entry-album btn btn-primary mx-1 my-1'}>
+                <LeftButton item={entry} />
+                <div className="col-auto">
+                    <NavLink className="btn-primary p-2 text-left" to={entry.path}>Album: {title}</NavLink>
+                    <div className="d-none d-md-flex">
+                        { childrenWithThumbnails.map(c => <Thumbnail key={'entry_' + c.id} entry={c} />) }
                     </div>
-                    <RightButton item={entry} />
-                    <UpDownButton item={entry} />
                 </div>
+                <RightButton item={entry} />
+                <UpDownButton item={entry} />
             </div>
         </ElementScroller>
     );

diff --git a/oldalbum.web.frontend/src/main/frontend/src/components/AlbumEntryOfTypePicture.js b/oldalbum.web.frontend/src/main/frontend/src/components/AlbumEntryOfTypePicture.js
@@ -12,23 +12,21 @@ function AlbumEntryOfTypePicture(props) {
     const { entry, className='' } = props;
     const title = pictureTitle(entry);
     const metadata = formatMetadata(entry);
-    const anchor = 'entry' + entry.id.toString();
+    const anchor = ' entry' + entry.id.toString();
 
     return (
         <ElementScroller scrollKey={anchor}>
-            <div className={anchor}>
-                <div className={className + ' col-sm-12 col-md-4 col-lg-3 col-XL-2 album-entry btn btn-primary mx-1 my-1'}>
-                    <LeftButton item={entry} />
-                    <NavLink className=' btn btn-primary btn-block left-align-cell' to={entry.path}>
-                        <ThumbnailImg entry={entry} />
-                        <div className="mx-1 container">
-                            <div className="row">{title}</div>
-                            <div className="row text-nowrap">{metadata}</div>
-                        </div>
-                    </NavLink>
-                    <RightButton item={entry} />
-                    <UpDownButton item={entry} />
-                </div>
+            <div className={className + anchor + ' col-sm-12 col-md-4 col-lg-3 col-XL-2 album-entry btn btn-primary mx-1 my-1'}>
+                <LeftButton item={entry} />
+                <NavLink className=' btn btn-primary btn-block left-align-cell' to={entry.path}>
+                    <ThumbnailImg entry={entry} />
+                    <div className="mx-1 container">
+                        <div className="row">{title}</div>
+                        <div className="row text-nowrap">{metadata}</div>
+                    </div>
+                </NavLink>
+                <RightButton item={entry} />
+                <UpDownButton item={entry} />
             </div>
         </ElementScroller>
     );