fix: Various tiny fixes/improvements (#2433)

src/components-lib/media-grid-controller.ts

@@ -156,7 +156,7 @@ export class MediaGridController {
       this._masonry
     ) {
       // Implementation note: With the latest version of the Masonry library
-      // (4.2.2) using the prepended() and appended() methods in quick sucession
+      // (4.2.2) using the prepended() and appended() methods in quick succession
       // causes the layout to not show the newly added items. Instead, access
       // the items in place and swap them around.
       const otherItems = existingItems?.filter((item) => item !== selectedItem);

src/components/gallery/gallery.ts

@@ -193,14 +193,14 @@ export class AdvancedCameraCardGallery extends LitElement {
     const hasItems =
       (this._controller.getItems()?.length ?? 0) > 0 || !!this._upFolderItem;
 
-    const showFilter =
+    const filterMode = this.galleryConfig?.controls.filter.mode;
-      this.galleryConfig && this.galleryConfig.controls.filter.mode !== 'none';
+    const showFilter = filterMode && filterMode !== 'none';
 
     return html`
       <advanced-camera-card-surround-basic
         .drawerIcons=${{
           ...(showFilter && {
-            [this.galleryConfig!.controls.filter.mode]: GALLERY_FILTER_MENU_ICONS,
+            [filterMode]: GALLERY_FILTER_MENU_ICONS,
           }),
         }}
       >
@@ -211,7 +211,7 @@ export class AdvancedCameraCardGallery extends LitElement {
               .foldersManager=${this.foldersManager}
               .viewManagerEpoch=${this.viewManagerEpoch}
               .cardWideConfig=${this.cardWideConfig}
-              slot=${this.galleryConfig.controls.filter.mode}
+              slot=${filterMode}
             >
             </advanced-camera-card-media-filter>`
           : ''}

src/utils/thumbnail.ts

@@ -20,20 +20,16 @@ const fetchThumbnail = async (
   if (thumbnailURL.startsWith('data:') || thumbnailURL.match(ABSOLUTE_URL_REGEX)) {
     return thumbnailURL;
   }
-  return new Promise((resolve, reject) => {
-    hass
-      .fetchWithAuth(thumbnailURL)
   // Since we are fetching with an authorization header, we cannot just put the
   // URL directly into the document; we need to embed the image. We could do this
   // using blob URLs, but then we would need to keep track of them in order to
   // release them properly. Instead, we embed the thumbnail using base64.
-      .then((response) => {
+  const response = await hass.fetchWithAuth(thumbnailURL);
   if (!response.ok) {
     throw new Error(response.statusText);
   }
-        return response.blob();
+  const blob = await response.blob();
-      })
+  return new Promise<string | null>((resolve, reject) => {
-      .then((blob) => {
     const reader = new FileReader();
     reader.onload = () => {
       const result = reader.result;
@@ -41,8 +37,6 @@ const fetchThumbnail = async (
     };
     reader.onerror = (e) => reject(e);
     reader.readAsDataURL(blob);
-      })
-      .catch((e) => reject(e));
   });
 };