Scroll to next image using lightbox (#2403)

* Scroll at end of image goes to next/previous
* Align bottom image when moving left

ui/v2.5/src/hooks/Lightbox/Lightbox.tsx

@@ -89,6 +89,7 @@ export const LightboxComponent: React.FC<IProps> = ({
   const [updateImage] = useImageUpdate();
 
   const [index, setIndex] = useState<number | null>(null);
+  const [movingLeft, setMovingLeft] = useState(false);
   const oldIndex = useRef<number | null>(null);
   const [instantTransition, setInstantTransition] = useState(false);
   const [isSwitchingPage, setIsSwitchingPage] = useState(true);
@@ -261,6 +262,8 @@ export const LightboxComponent: React.FC<IProps> = ({
     (isUserAction = true) => {
       if (isSwitchingPage || index === -1) return;
 
+      setMovingLeft(true);
+
       if (index === 0) {
         // go to next page, or loop back if no callback is set
         if (pageCallback) {
@@ -281,6 +284,8 @@ export const LightboxComponent: React.FC<IProps> = ({
     (isUserAction = true) => {
       if (isSwitchingPage) return;
 
+      setMovingLeft(false);
+
       if (index === images.length - 1) {
         // go to preview page, or loop back if no callback is set
         if (pageCallback) {
@@ -685,6 +690,7 @@ export const LightboxComponent: React.FC<IProps> = ({
                   scrollMode={scrollMode}
                   onLeft={handleLeft}
                   onRight={handleRight}
+                  alignBottom={movingLeft}
                   zoom={i === currentIndex ? zoom : 1}
                   setZoom={(v) => setZoom(v)}
                   resetPosition={resetPosition}