Fixed instagram template issue when maxEntries is not a number

CHANGELOG.md

@@ -4,9 +4,10 @@ All notable changes to this project will be documented in this file.
 
 ## Unrelased
 
+- [#167](https://github.com/os2display/display-templates/pull/167)
+  - Fixed issue where instagram template crashes if maxEntries is not a number.
 - [#166](https://github.com/os2display/display-templates/pull/166)
   - Css for instagram template in aakb.css theme file
-
 - [#172](https://github.com/os2display/display-templates/pull/172)
   - Added PR github template.
 

build/instagram-feed-config-develop.json

@@ -4,9 +4,9 @@
   "id": "01FTZC0RKJYHG4JVZG5K709G46",
   "description": "Mulighed for at vise instagram indhold.",
   "resources": {
-    "component": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/instagram-feed.js?ts=1733136815096",
-    "admin": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/instagram-feed-admin.json?ts=1733136815096",
-    "schema": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/instagram-feed-schema.json?ts=1733136815096",
+    "component": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/instagram-feed.js?ts=1741180108950",
+    "admin": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/instagram-feed-admin.json?ts=1741180108950",
+    "schema": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/instagram-feed-schema.json?ts=1741180108950",
     "assets": [],
     "options": {},
     "content": {}

build/instagram-feed-config-main.json

@@ -4,9 +4,9 @@
   "id": "01FTZC0RKJYHG4JVZG5K709G46",
   "description": "Mulighed for at vise instagram indhold.",
   "resources": {
-    "component": "https://raw.githubusercontent.com/os2display/display-templates/main/build/instagram-feed.js?ts=1733136815096",
-    "admin": "https://raw.githubusercontent.com/os2display/display-templates/main/build/instagram-feed-admin.json?ts=1733136815096",
-    "schema": "https://raw.githubusercontent.com/os2display/display-templates/main/build/instagram-feed-schema.json?ts=1733136815096",
+    "component": "https://raw.githubusercontent.com/os2display/display-templates/main/build/instagram-feed.js?ts=1741180108950",
+    "admin": "https://raw.githubusercontent.com/os2display/display-templates/main/build/instagram-feed-admin.json?ts=1741180108950",
+    "schema": "https://raw.githubusercontent.com/os2display/display-templates/main/build/instagram-feed-schema.json?ts=1741180108950",
     "assets": [],
     "options": {},
     "content": {}

src/instagram-feed/instagram-feed.js

@@ -42,12 +42,14 @@ function InstagramFeed({ slide, content, run, slideDone, executionId }) {
 
   const { maxEntries = 5 } = content;
 
+  const maxEntriesToShow = Number.isInteger(maxEntries) ? maxEntries : 5;
+
   /** Setup feed entry switch and animation, if there is more than one post. */
   useEffect(() => {
     const timer = setTimeout(() => {
       const currentIndex = feedData.indexOf(currentPost);
       const nextIndex =
-        (currentIndex + 1) % Math.min(feedData.length, maxEntries);
+        (currentIndex + 1) % Math.min(feedData.length, maxEntriesToShow);
 
       if (nextIndex === 0) {
         slideDone(slide);

src/slides.js

@@ -1471,6 +1471,40 @@ const slides = [
       mediaContain: true,
     },
   },
+  {
+    id: "slide25-instagram-no-max-entries",
+    type: "instagram-feed",
+    darkModeEnabled: false,
+    content: {
+      duration: 5000,
+      hashtagText: "#myhashtag",
+      orientation: "landscape",
+      imageWidth: 40.0,
+      entryDuration: 10,
+      maxEntries: "",
+      mediaContain: true,
+    },
+    feedData: [
+      {
+        text: "#mountains #horizon",
+        textMarkup:
+          '<div class="text">Sed nulla lorem, varius sodales justo ac, ultrices placerat nunc.</div>\n<div class="tags"><span class="tag">#mountains</span> <span class="tag">#horizon</span> Lorem ipsum ...</div>',
+        mediaUrl: "./fixtures/images/mountain1.jpeg",
+        videoUrl: null,
+        username: "username",
+        createdTime: "2022-02-03T08:50:07",
+      },
+      {
+        text: "#mountains #horizon #sky",
+        textMarkup:
+          '<div class="text">Aenean consequat sem ut tortor auctor, eget volutpat libero consequat. Donec lacinia varius quam, ut efficitur diam ultrices et. Aliquam eget augue at felis rhoncus egestas. Sed porttitor elit a tellus tempus, sed tempus sapien finibus. Nam at dapibus sem. Aliquam sit amet feugiat ex. Ut dapibus, mi eu fermentum dignissim, sem ipsum vulputate est, sit amet euismod orci odio pharetra massa.</div>\n<div class="tags"><span class="tag">#mountains</span> <span class="tag">#horizon</span> <span class="tag">#sky</span> Lorem ipsum and mountains ...</div>',
+        mediaUrl: "./fixtures/images/mountain2.jpeg",
+        videoUrl: null,
+        username: "username2",
+        createdTime: "2022-01-03T08:50:07",
+      },
+    ],
+  },
 ];
 
 export default slides;