Comment afficher gallerie triée

Bonjour à tous,

je parcours le site depuis quelques mois et franchement, quel mine d'information, BRAVO et surtout merci !
Cependant, j'ai une question dont je ne trouve pas de réponse.

Je suis entrain de coder galerie d'images et de videos, tout fonctionne parfaitement, sauf le tri de la galerie.
Je vous explique (voici mon code JS) :

async function getGalleryItems() {
  //Récupération de l'ID de la page
  const queryString_url_id = window.location.search;
  const urlSearchParams = new URLSearchParams(queryString_url_id);
  const id = urlSearchParams.get("id");
  const response = await fetch(json_url);
  const data = await response.json();
  const mediasArray = data.media;
  let filteredMedia = mediasArray.filter(function (el) {
    console.log(el.photographerId == id);
    return el.photographerId == id;
  }); //! ICI TABLEAU FILTRE DU PHOTOGRAPHE
  console.log({ media: [...filteredMedia] });

  // Filtered by likes
  //============================================
  // filteredMedia.sort(function compare(a, b) {
  //   if (a.likes < b.likes) return -1;
  //   if (a.likes > b.likes) return 1;
  //   return 0;
  // });
  //============================================
  // Filtered by title
  //============================================
  // filteredMedia.sort(function compare(a, b) {
  //   if (a.title < b.title) return -1;
  //   if (a.title > b.title) return 1;
  //   return 0;
  // });
  //============================================
  for (let i = 0; i < filteredMedia.length; i++) {
    return { media: [...filteredMedia] };
  }
}
//Affichage des données des photographes
async function displayGallery(medias) {
  const gallerySection = document.querySelector("#photograph_gallery");
  medias.forEach((media) => {
    const photographerGallery = galleryFactory(media);
    const galleryCardDOM = photographerGallery.getImageDOM();
    gallerySection.appendChild(galleryCardDOM);
  });
}
async function initGallery() {
  const { media } = await getGalleryItems();
  await displayGallery(media);
}

Si je décommente un des blocs commenté (filtered by title par exemple), la galerie s'affiche bien triée.
Seulement, ce que je voudrais, c'est le faire dynamiquement, quand un utilisateur clique sur un bouton de tri (par date, titre, etc..), la galerie se mette a jour ! Et la impossible, je n'arrive pas a sortir ces blocs de tri et les placer dans une fonction qui au clic fait le tri et met a jour la galerie.

Quelqu'un aurait-il une piste ? Un façon de procéder ? La je sèche complètement, je n'arrive pas a visualiser la logique !

Merci d'avance à tous !

CodeBash