[Feature] Added slideshow to gallery in wall display mode (#1224)

ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx

@@ -16,6 +16,8 @@ const allMenuItems = [
   { id: "tags", label: "Tags" },
 ];
 
+const SECONDS_TO_MS = 1000;
+
 export const SettingsInterfacePanel: React.FC = () => {
   const Toast = useToast();
   const { data: config, error, loading } = useConfiguration();
@@ -27,6 +29,7 @@ export const SettingsInterfacePanel: React.FC = () => {
   const [wallPlayback, setWallPlayback] = useState<string>("video");
   const [maximumLoopDuration, setMaximumLoopDuration] = useState<number>(0);
   const [autostartVideo, setAutostartVideo] = useState<boolean>(false);
+  const [slideshowDelay, setSlideshowDelay] = useState<number>(0);
   const [showStudioAsText, setShowStudioAsText] = useState<boolean>(false);
   const [css, setCSS] = useState<string>();
   const [cssEnabled, setCSSEnabled] = useState<boolean>(false);
@@ -43,6 +46,7 @@ export const SettingsInterfacePanel: React.FC = () => {
     css,
     cssEnabled,
     language,
+    slideshowDelay,
   });
 
   useEffect(() => {
@@ -57,6 +61,7 @@ export const SettingsInterfacePanel: React.FC = () => {
     setCSS(iCfg?.css ?? "");
     setCSSEnabled(iCfg?.cssEnabled ?? false);
     setLanguage(iCfg?.language ?? "en-US");
+    setSlideshowDelay(iCfg?.slideshowDelay ?? 5000);
   }, [config]);
 
   async function onSave() {
@@ -187,6 +192,23 @@ export const SettingsInterfacePanel: React.FC = () => {
         </Form.Group>
       </Form.Group>
 
+      <Form.Group id="slideshow-delay">
+        <h5>Slideshow Delay</h5>
+        <Form.Control
+          className="col col-sm-6 text-input"
+          type="number"
+          value={slideshowDelay / SECONDS_TO_MS}
+          onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+            setSlideshowDelay(
+              Number.parseInt(e.currentTarget.value, 10) * SECONDS_TO_MS
+            );
+          }}
+        />
+        <Form.Text className="text-muted">
+          Slideshow is available in galleries when in wall view mode
+        </Form.Text>
+      </Form.Group>
+
       <Form.Group>
         <h5>Custom CSS</h5>
         <Form.Check