fix: load 30 (max-limit) images per API call instead of 10

Author: devvaannsh

src/extensionsIntegrated/phoenix-pro/browser-context/image-gallery.js

@@ -10,7 +10,7 @@ const PHCODE_INTERNAL_ATTR = GLOBALS.PHCODE_INTERNAL_ATTR;
 
 // image ribbon gallery cache, to store th  e last query and its results
 const CACHE_EXPIRY_TIME = 168 * 60 * 60 * 1000; // 7 days
-const CACHE_MAX_IMAGES = 50; // max number of images that we store in the localStorage
+const CACHE_MAX_IMAGES = 60; // max number of images that we store in the localStorage
 
 // initialized from config, defaults to true if not set
 let imageGallerySelected = config.imageGalleryState !== undefined ? config.imageGalleryState : true;
@@ -367,7 +367,7 @@ ImageRibbonGallery.prototype = {
         }
 
         const apiUrl = `https://images.phcode.dev/api/images/search?` +
-            `q=${encodeURIComponent(searchQuery)}&per_page=10&page=${page}&safe=true`;
+            `q=${encodeURIComponent(searchQuery)}&per_page=30&page=${page}&safe=true`;
 
         if (!append) {
             this._showLoading();
@@ -483,10 +483,10 @@ ImageRibbonGallery.prototype = {
         if (
             searchQuery === _imageGalleryCache.currentQuery &&
             cachedImages &&
-            page <= Math.ceil(cachedImages.length / 10)
+            page <= Math.ceil(cachedImages.length / 30)
         ) {
-            const startIdx = (page - 1) * 10;
-            const endIdx = startIdx + 10;
+            const startIdx = (page - 1) * 30;
+            const endIdx = startIdx + 30;
             const pageImages = cachedImages.slice(startIdx, endIdx);
 
             if (pageImages.length > 0) {