@uploadcare/file-uploader 1.15.0-alpha.15 → 1.15.0-alpha.16

package/blocks/Thumb/Thumb.d.ts

@@ -7,6 +7,7 @@ export class Thumb extends FileItemConfig {
      */
     private _thumbRect;
     _isIntersecting: boolean;
+    _firstViewMode: string;
     init$: {
         thumbUrl: string;
         badgeIcon: string;
@@ -38,6 +39,11 @@ export class Thumb extends FileItemConfig {
      * @param {IntersectionObserverEntry[]} entries
      */
     private _observerCallback;
+    /**
+     * @private
+     * @param {String} id
+     */
+    private _handleEntryId;
     _observer: IntersectionObserver | undefined;
 }
 export namespace Thumb {

package/blocks/Thumb/Thumb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["Thumb.js"],"names":[],"mappings":"AAQA;IACE,eAAe;IACf,0BAA0B;IAE1B;;;OAGG;IACH,mBAAkB;IAElB,yBAAwB;IAKtB;;;;;;;+CAEU,gBACV;mCAMF,gBAAQ;6BAEa,2BACJ;;wCAKH,wCACD;;;;;;MAbV;IAGH,+BAA+B;IAC/B,oBADY,MAAM,gBAgBjB;IAED,6CAgBC;IAED,eAAe;IACf,2BA2CG;IAEH;;MAA4E;IAE5E;;;OAGG;IACH,0BAaC;IA4CC,4CAAuG;CAY1G;;;;+BAzL8B,+BAA+B"}
+{"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["Thumb.js"],"names":[],"mappings":"AAQA;IACE,eAAe;IACf,0BAA0B;IAE1B;;;OAGG;IACH,mBAAkB;IAElB,yBAAwB;IAExB,uBAAoB;IAKlB;;;;;;;+CACO,gBACX;mCAMU,gBAAU;6BAGd,2BAAoB;;wCAKpB,wCACa;;;;;;MAZd;IAGH,+BAA+B;IAC/B,oBADY,MAAM,gBAgBjB;IAED,6CAgBC;IAED,eAAe;IACf,2BA2CG;IAEH;;MAA4E;IAE5E;;;OAGG;IACH,0BAaC;IAED;;;OAGG;IACH,uBA0BC;IAgCC,4CAAuG;CAY1G;;;;+BA/M8B,+BAA+B"}

package/blocks/Thumb/Thumb.js

@@ -18,6 +18,8 @@ export class Thumb extends FileItemConfig {
 
   _isIntersecting = false;
 
+  _firstViewMode = '';
+
   constructor() {
     super();
 
@@ -132,18 +134,16 @@ export class Thumb extends FileItemConfig {
     }
   }
 
-  initCallback() {
-    super.initCallback();
-
-    this.defineAccessor('badgeIcon', (/** @type {string} */ val) => (this.$.badgeIcon = val));
-
-    this.defineAccessor('uid', (/** @type {string} */ value) => {
-      this.set$({ uid: value });
-    });
-
-    this.sub('uid', (value) => {
-      this._entry = this.uploadCollection.read(value);
-    });
+  /**
+   * @private
+   * @param {String} id
+   */
+  _handleEntryId(id) {
+    let entry = this.uploadCollection?.read(id);
+    this._entry = entry;
+    if (!entry) {
+      return;
+    }
 
     this._subEntry('fileInfo', (fileInfo) => {
       if (fileInfo?.isImage && this._isIntersecting) {
@@ -161,9 +161,31 @@ export class Thumb extends FileItemConfig {
       }
     });
 
+    if (this._isIntersecting) {
+      this._debouncedGenerateThumb();
+    }
+  }
+
+  initCallback() {
+    super.initCallback();
+
+    this._firstViewMode = this.cfg.filesViewMode;
+
+    this.defineAccessor('badgeIcon', (/** @type {string} */ val) => (this.$.badgeIcon = val));
+
+    this.defineAccessor('uid', (/** @type {string} */ value) => {
+      this.set$({ uid: value });
+    });
+
+    this.sub('uid', (uid) => {
+      this._handleEntryId(uid);
+    });
+
     this.subConfigValue('filesViewMode', (viewMode) => {
-      if (!this._renderedGridOnce && viewMode === 'grid') {
-        this._debouncedGenerateThumb(true);
+      if (viewMode === 'grid' && !this._renderedGridOnce) {
+        if (this._firstViewMode === 'list') {
+          this._debouncedGenerateThumb(true);
+        }
         this._renderedGridOnce = true;
       }
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uploadcare/file-uploader",
-  "version": "1.15.0-alpha.15",
+  "version": "1.15.0-alpha.16",
   "description": "Building blocks for Uploadcare products integration",
   "keywords": [
     "web components",