wikijs-metabot/metapage.js.html

<script>
  // https://git.ctdo.de/ctdo/wikijs-metabot/

  async function graphql(query) {
    const res = await fetch('/graphql', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({ query }),
    });
    return await res.json();
  }

  async function loadPagelists() {
    console.log('populating pagelists');

    const pagelists = [...document.getElementsByClassName('pagelist')];
    pagelists.forEach(async (element) => {
      console.log('processing', element);
      const parameters = element
        .getAttribute('data-query')
        .replaceAll("'", '"');
      const query = `query { pages { list(${parameters}) { path, title } }}`;
      const result = await graphql(query);
      console.log({ query, result });
      const pages = result.data.pages.list.filter(
        (page) => !page.path.includes('/_')
      );
      const pagelist = pages.map((page) => {
        const link = document.createElement('a');
        link.href = `/${page.path}`;
        link.classList.add('is-internal-link');
        link.classList.add('is-valid-page');
        link.textContent = page.title;

        const listItem = document.createElement('li');
        listItem.appendChild(link);
        return listItem;
      });

      pagelist.forEach((page) => element.appendChild(page));
    });
  }

  async function isElementLoaded(selector) {
    while (document.querySelector(selector) === null) {
      await new Promise((resolve) => requestAnimationFrame(resolve));
    }
    return document.querySelector(selector);
  }

  isElementLoaded('.contents').then(() => loadPagelists());
</script>