diff --git a/src/components/gallery.ts b/src/components/gallery.ts
index 3ada96bd..6ac59663 100644
--- a/src/components/gallery.ts
+++ b/src/components/gallery.ts
@@ -19,25 +19,15 @@ import {
 } from '../types.js';
 import { stopEventFromActivatingCardWideActions } from '../utils/action.js';
 import {
-  getFullDependentBrowseMediaQueryParametersOrDispatchError,
-} from '../utils/ha/browse-media';
-import { changeViewToRecentEventsForCameraAndDependents, changeViewToRecentRecordingForCameraAndDependents } from '../utils/media-to-view.js';
+  changeViewToRecentEventsForCameraAndDependents,
+  changeViewToRecentRecordingForCameraAndDependents,
+} from '../utils/media-to-view.js';
 import { CameraManager } from '../camera/manager.js';
 import { View } from '../view/view.js';
 import { renderProgressIndicator } from './message.js';
 import './thumbnail.js';
 import { THUMBNAIL_DETAILS_WIDTH_MIN } from './thumbnail.js';
-
-interface GalleryViewContext {
-  // Keep track of the previous view to allow returning to a higher-level folder.
-  previous?: View;
-}
-
-declare module 'view' {
-  interface ViewContext {
-    gallery?: GalleryViewContext;
-  }
-}
+import './media-filter';
 
 @customElement('frigate-card-gallery')
 export class FrigateCardGallery extends LitElement {
@@ -64,54 +54,55 @@ export class FrigateCardGallery extends LitElement {
    * @returns A rendered template.
    */
   protected render(): TemplateResult | void {
-    // const mediaType = this.view?.getMediaType();
-    // if (
-    //   !this.hass ||
-    //   !this.view ||
-    //   !this.cameras ||
-    //   !this.view.isGalleryView() ||
-    //   !mediaType ||
-    //   !this.cameraManager
-    // ) {
-    //   return;
-    // }
+    if (
+      !this.hass ||
+      !this.view ||
+      !this.cameras ||
+      !this.view.isGalleryView() ||
+      !this.cameraManager
+    ) {
+      return;
+    }
 
-    // if (!this.view.query) {
-    //   if (mediaType === 'recordings') {
-    //     changeViewToRecentRecordingForCameraAndDependents(
-    //       this,
-    //       this.hass,
-    //       this.cameraManager,
-    //       this.cameras,
-    //       this.view,
-    //       {
-    //         targetView: 'recordings',
-    //       },
-    //     );
-    //   } else {
-    //     changeViewToRecentEventsForCameraAndDependents(
-    //       this,
-    //       this.hass,
-    //       this.cameraManager,
-    //       this.cameras,
-    //       this.view,
-    //       {
-    //         targetView: mediaType,
-    //       },
-    //     );
-    //   }
-    //   return renderProgressIndicator({ cardWideConfig: this.cardWideConfig });
-    // }
+    if (!this.view.query) {
+      if (this.view.is('recordings')) {
+        changeViewToRecentRecordingForCameraAndDependents(
+          this,
+          this.hass,
+          this.cameraManager,
+          this.cameras,
+          this.view,
+        );
+      } else {
+        const mediaType = this.view.is('snapshots')
+          ? 'snapshots'
+          : this.view.is('clips')
+          ? 'clips'
+          : null;
+        changeViewToRecentEventsForCameraAndDependents(
+          this,
+          this.hass,
+          this.cameraManager,
+          this.cameras,
+          this.view,
+          {
+            ...(mediaType && { mediaType: mediaType }),
+          },
+        );
+      }
+      return renderProgressIndicator({ cardWideConfig: this.cardWideConfig });
+    }
 
-    // return html`
-    //   <frigate-card-gallery-core
-    //     .hass=${this.hass}
-    //     .view=${this.view}
-    //     .galleryConfig=${this.galleryConfig}
-    //     .cameras=${this.cameras}
-    //   >
-    //   </frigate-card-gallery-core>
-    // `;
+    return html`
+      <frigate-card-gallery-core
+        .hass=${this.hass}
+        .view=${this.view}
+        .galleryConfig=${this.galleryConfig}
+        .cameras=${this.cameras}
+        .cameraManager=${this.cameraManager}
+      >
+      </frigate-card-gallery-core>
+    `;
   }
 
   /**
@@ -128,206 +119,149 @@ export class FrigateCardGallery extends LitElement {
   }
 }
 
-// @customElement('frigate-card-gallery-core')
-// export class FrigateCardGalleryCore extends LitElement {
-//   @property({ attribute: false })
-//   public hass?: ExtendedHomeAssistant;
+@customElement('frigate-card-gallery-core')
+export class FrigateCardGalleryCore extends LitElement {
+  @property({ attribute: false })
+  public hass?: ExtendedHomeAssistant;
 
-//   @property({ attribute: false })
-//   public view?: Readonly<View>;
+  @property({ attribute: false })
+  public view?: Readonly<View>;
 
-//   @property({ attribute: false })
-//   public galleryConfig?: GalleryConfig;
+  @property({ attribute: false })
+  public galleryConfig?: GalleryConfig;
 
-//   @property({ attribute: false })
-//   public cameras?: Map<string, CameraConfig>;
+  @property({ attribute: false })
+  public cameras?: Map<string, CameraConfig>;
 
-//   protected _resizeObserver: ResizeObserver;
+  @property({ attribute: false })
+  public cameraManager?: CameraManager;
 
-//   constructor() {
-//     super();
-//     this._resizeObserver = new ResizeObserver(this._resizeHandler.bind(this));
-//   }
+  protected _resizeObserver: ResizeObserver;
 
-//   /**
-//    * Component connected callback.
-//    */
-//   connectedCallback(): void {
-//     super.connectedCallback();
-//     this._resizeObserver.observe(this);
-//   }
+  constructor() {
+    super();
+    this._resizeObserver = new ResizeObserver(this._resizeHandler.bind(this));
+  }
 
-//   /**
-//    * Component disconnected callback.
-//    */
-//   disconnectedCallback(): void {
-//     this._resizeObserver.disconnect();
-//     super.disconnectedCallback();
-//   }
+  /**
+   * Component connected callback.
+   */
+  connectedCallback(): void {
+    super.connectedCallback();
+    this._resizeObserver.observe(this);
+  }
 
-//   /**
-//    * Set gallery columns.
-//    */
-//   protected _setColumnCount(): void {
-//     const thumbnailSize =
-//       this.galleryConfig?.controls.thumbnails.size ??
-//       frigateCardConfigDefaults.event_gallery.controls.thumbnails.size;
-//     const columns = this.galleryConfig?.controls.thumbnails.show_details
-//       ? Math.max(1, Math.floor(this.clientWidth / THUMBNAIL_DETAILS_WIDTH_MIN))
-//       : Math.max(
-//           1,
-//           Math.ceil(this.clientWidth / THUMBNAIL_WIDTH_MAX),
-//           Math.ceil(this.clientWidth / thumbnailSize),
-//         );
+  /**
+   * Component disconnected callback.
+   */
+  disconnectedCallback(): void {
+    this._resizeObserver.disconnect();
+    super.disconnectedCallback();
+  }
 
-//     this.style.setProperty('--frigate-card-gallery-columns', String(columns));
-//   }
+  /**
+   * Set gallery columns.
+   */
+  protected _setColumnCount(): void {
+    const thumbnailSize =
+      this.galleryConfig?.controls.thumbnails.size ??
+      frigateCardConfigDefaults.event_gallery.controls.thumbnails.size;
+    const columns = this.galleryConfig?.controls.thumbnails.show_details
+      ? Math.max(1, Math.floor(this.clientWidth / THUMBNAIL_DETAILS_WIDTH_MIN))
+      : Math.max(
+          1,
+          Math.ceil(this.clientWidth / THUMBNAIL_WIDTH_MAX),
+          Math.ceil(this.clientWidth / thumbnailSize),
+        );
 
-//   /**
-//    * Handle gallery resize.
-//    */
-//   protected _resizeHandler(): void {
-//     this._setColumnCount();
-//   }
+    this.style.setProperty('--frigate-card-gallery-columns', String(columns));
+  }
 
-//   /**
-//    * Determine whether the back arrow should be displayed.
-//    * @returns `true` if the back arrow should be displayed, `false` otherwise.
-//    */
-//   protected _shouldShowBackArrow(): boolean {
-//     return (
-//       !!this.view?.context?.gallery?.previous &&
-//       !!this.view.context.gallery.previous.query &&
-//       this.view.context.gallery.previous.view === this.view.view
-//     );
-//   }
+  /**
+   * Handle gallery resize.
+   */
+  protected _resizeHandler(): void {
+    this._setColumnCount();
+  }
 
-//   /**
-//    * Called when an update will occur.
-//    * @param changedProps The changed properties
-//    */
-//   protected willUpdate(changedProps: PropertyValues): void {
-//     if (changedProps.has('galleryConfig')) {
-//       if (this.galleryConfig?.controls.thumbnails.show_details) {
-//         this.setAttribute('details', '');
-//       } else {
-//         this.removeAttribute('details');
-//       }
-//       this._setColumnCount();
-//       if (this.galleryConfig?.controls.thumbnails.size) {
-//         this.style.setProperty(
-//           '--frigate-card-thumbnail-size',
-//           `${this.galleryConfig.controls.thumbnails.size}px`,
-//         );
-//       }
-//     }
-//   }
+  /**
+   * Called when an update will occur.
+   * @param changedProps The changed properties
+   */
+  protected willUpdate(changedProps: PropertyValues): void {
+    if (changedProps.has('galleryConfig')) {
+      if (this.galleryConfig?.controls.thumbnails.show_details) {
+        this.setAttribute('details', '');
+      } else {
+        this.removeAttribute('details');
+      }
+      this._setColumnCount();
+      if (this.galleryConfig?.controls.thumbnails.size) {
+        this.style.setProperty(
+          '--frigate-card-thumbnail-size',
+          `${this.galleryConfig.controls.thumbnails.size}px`,
+        );
+      }
+    }
+  }
 
-//   // TODO: This is still going to show the gallery view (akin to HA media
-//   // browser). 
+  /**
+   * Master render method.
+   * @returns A rendered template.
+   */
+  protected render(): TemplateResult | void {
+    const results = this.view?.queryResults?.getResults();
 
-//   /**
-//    * Master render method.
-//    * @returns A rendered template.
-//    */
-//   protected render(): TemplateResult | void {
-//     const results = this.view?.queryResults?.getResults();
+    if (
+      !results ||
+      !this.hass ||
+      !this.view ||
+      !this.view.isGalleryView() ||
+      !this.cameras
+    ) {
+      return html``;
+    }
 
-//     if (
-//       !results ||
-//       !this.hass ||
-//       !this.view ||
-//       !this.view.isGalleryView() ||
-//       !this.cameras
-//     ) {
-//       return html``;
-//     }
+    return html` ${results.map(
+      (media, index) =>
+        html`<frigate-card-thumbnail
+          .hass=${this.hass}
+          .cameraManager=${this.cameraManager}
+          .media=${media}
+          .cameraConfig=${this.cameras?.get(media.getCameraID())}
+          .view=${this.view}
+          ?details=${!!this.galleryConfig?.controls.thumbnails.show_details}
+          ?show_favorite_control=${!!this.galleryConfig?.controls.thumbnails
+            .show_favorite_control}
+          ?show_timeline_control=${!!this.galleryConfig?.controls.thumbnails
+            .show_timeline_control}
+          @click=${(ev: Event) => {
+            if (this.view) {
+              this.view
+                .evolve({
+                  view: 'media',
+                  queryResults: this.view.queryResults?.clone().selectResult(index),
+                })
+                .dispatchChangeEvent(this);
+            }
+            stopEventFromActivatingCardWideActions(ev);
+          }}
+        >
+        </frigate-card-thumbnail>`,
+    )}`;
+  }
 
-//     return html`
-//       ${this._shouldShowBackArrow()
-//         ? html` <ha-card
-//             @click=${(ev) => {
-//               if (this.view && this.view.context?.gallery?.previous) {
-//                 this.view.context.gallery.previous.dispatchChangeEvent(this);
-//               }
-//               stopEventFromActivatingCardWideActions(ev);
-//             }}
-//             outlined=""
-//           >
-//             <ha-icon .icon=${'mdi:arrow-left'}></ha-icon>
-//           </ha-card>`
-//         : ''}
-//       ${results.map((child, index) =>
-//           html`
-//             ${child.can_expand
-//               ? html`
-//                   <ha-card
-//                     @click=${(ev) => {
-//                       if (this.hass && this.view) {
-//                         fetchChildMediaAndDispatchViewChange(
-//                           this,
-//                           this.hass,
-//                           this.view,
-//                           child,
-//                           {
-//                             gallery: {
-//                               previous: this.view,
-//                             },
-//                           },
-//                         );
-//                       }
-//                       stopEventFromActivatingCardWideActions(ev);
-//                     }}
-//                     outlined=""
-//                   >
-//                     <div>${child.title}</div>
-//                   </ha-card>
-//                 `
-//               : html`<frigate-card-thumbnail
-//                   .view=${this.view}
-//                   .target=${this.view?.target ?? null}
-//                   .childIndex=${index}
-//                   .hass=${this.hass}
-//                   .cameraConfig=${child.frigate?.cameraID
-//                     ? this.cameras?.get(child.frigate.cameraID)
-//                     : undefined}
-//                   ?details=${!!this.galleryConfig?.controls.thumbnails.show_details}
-//                   ?show_favorite_control=${!!this.galleryConfig?.controls.thumbnails
-//                     .show_favorite_control}
-//                   ?show_timeline_control=${!!this.galleryConfig?.controls.thumbnails
-//                     .show_timeline_control}
-//                   @click=${(ev: Event) => {
-//                     if (this.view) {
-//                       const targetView = this.view.getViewerViewForGalleryView();
-//                       if (targetView) {
-//                         this.view
-//                           .evolve({
-//                             view: targetView,
-//                             childIndex: index,
-//                           })
-//                           .dispatchChangeEvent(this);
-//                       }
-//                     }
-//                     stopEventFromActivatingCardWideActions(ev);
-//                   }}
-//                 >
-//                 </frigate-card-thumbnail>`}
-//           `,
-//       )}
-//     `;
-//   }
-
-//   /**
-//    * Get styles.
-//    */
-//   static get styles(): CSSResultGroup {
-//     return unsafeCSS(galleryStyle);
-//   }
-// }
+  /**
+   * Get styles.
+   */
+  static get styles(): CSSResultGroup {
+    return unsafeCSS(galleryStyle);
+  }
+}
 
 declare global {
   interface HTMLElementTagNameMap {
-    //'frigate-card-gallery-core': FrigateCardGalleryCore;
+    'frigate-card-gallery-core': FrigateCardGalleryCore;
     'frigate-card-gallery': FrigateCardGallery;
   }
 }