Add date & details to gallery card (#1763)

* Add date & details to gallery card

Make the gallery card visually consistent with the scenes card. So move
the "X images" to a button at the bottom (where tags, performers and
scenes are shown as well) and add the date & details to the card.

ui/v2.5/src/utils/navigation.ts

@@ -15,6 +15,7 @@ import {
   Criterion,
   CriterionValue,
 } from "src/models/list-filter/criteria/criterion";
+import { GalleriesCriterion } from "src/models/list-filter/criteria/galleries";
 
 function addExtraCriteria(
   dest: Criterion<CriterionValue>[],
@@ -206,6 +207,21 @@ const makeSceneMarkerUrl = (
   return `/scenes/${sceneMarker.scene.id}?t=${sceneMarker.seconds}`;
 };
 
+const makeGalleryImagesUrl = (
+  gallery: Partial<GQL.GalleryDataFragment | GQL.SlimGalleryDataFragment>,
+  extraCriteria?: Criterion<CriterionValue>[]
+) => {
+  if (!gallery.id) return "#";
+  const filter = new ListFilterModel(GQL.FilterMode.Images);
+  const criterion = new GalleriesCriterion();
+  criterion.value = [
+    { id: gallery.id, label: gallery.title || `Gallery ${gallery.id}` },
+  ];
+  filter.criteria.push(criterion);
+  addExtraCriteria(filter.criteria, extraCriteria);
+  return `/images?${filter.makeQueryParameters()}`;
+};
+
 export default {
   makePerformerScenesUrl,
   makePerformerImagesUrl,
@@ -222,4 +238,5 @@ export default {
   makeSceneMarkerUrl,
   makeMovieScenesUrl,
   makeChildStudiosUrl,
+  makeGalleryImagesUrl,
 };