Function initExtensionsPage

website/src/scripts/pages/extensions.ts:410–492

()

}

export async function initExtensionsPage(): Promise<void> {
  const list = document.getElementById("resource-list");
  const clearFiltersBtn = document.getElementById("clear-filters");
  const sortSelect = document.getElementById(
    "sort-select"
  ) as HTMLSelectElement;

  if (!modalReady) {
    setupModal();
    modalReady = true;
  }

  setupActionHandlers(list as HTMLElement | null);

  const data = await fetchData<ExtensionsData>("extensions.json");
  if (!data || !data.items) {
    if (list)
      list.innerHTML =
        '<div class="empty-state"><h3>Failed to load data</h3></div>';
    return;
  }

  allItems = data.items;
  extensionById = new Map(allItems.map((item) => [item.id, item]));

  const availableKeywords = (
    data.filters?.keywords ||
    Array.from(
      new Set(
        data.items.flatMap((item) =>
          Array.isArray(item.keywords) ? item.keywords : []
        )
      )
    )
  ).sort((a, b) => a.localeCompare(b));

  keywordSelect = createChoices("#filter-keyword", {
    placeholderValue: "All Keywords",
  });
  keywordSelect.setChoices(
    availableKeywords.map((keyword) => ({ value: keyword, label: keyword })),
    "value",
    "label",
    true
  );

  const initialKeywords = getQueryParamValues("keyword").filter((keyword) =>
    availableKeywords.includes(keyword)
  );
  const initialSort = getQueryParam("sort");
  if (initialKeywords.length > 0) {
    currentFilters.keywords = initialKeywords;
    setChoicesValues(keywordSelect, initialKeywords);
  }
  if (initialSort === "lastUpdated") {
    currentSort = initialSort;
    if (sortSelect) sortSelect.value = initialSort;
  }