---
import { getQMLTypeLink } from "@config/io/helpers";
import { processMarkdown } from "@config/io/markdown";
import { getVersionsData } from "@config/io/generateTypeData";
import DocsLayout from "@layouts/DocsLayout.astro";
import TOC from "@components/navigation/sidebars/TOC.astro";
import Properties from "@components/type/Properties.astro";
import Functions from "@components/type/Functions.astro";
import Signals from "@components/type/Signals.astro";
import Variants from "@components/type/Variants.astro";
import Badge from "@components/Badge.astro";

export async function getStaticPaths() {
  return (await getVersionsData()).versions.flatMap(version => {
    return version.modules.flatMap(module => {
      return module.types.map(type => ({
        params: {
          version: version.name,
          module: module.name,
          type: type.name,
        },
        props: { version, module, type },
      }));
    });
  });
}

const { version, module, type } = Astro.props;

const superLink = type.super
  ? getQMLTypeLink(version.name, type.super)
  : null;

const details = type.details
  ? await processMarkdown(version.name, type.details)
  : null;
---
<DocsLayout title={`${module.name} - ${type.name}`} description={type.description ?? ""} type={type}>
  <div class="docs">
    <div class="docs-content typedocs-content">
      <hr />
      <section class="typedocs-title">
      <h2 class="typedocs-title-text" data-pagefind-weight="10">
        {type.name}:
          {type.super?.name ? (
            <a
              href={superLink!}
              data-pagefind-ignore
            >
            {type.super.name}
            </a>
          ):(
            <span class="type-datatype" data-pagefind-ignore>{type.name}</span>
          )
          }
      </h2>
      {type.flags && (
        <div class="type-flags" data-pagefind-ignore>{type.flags.map(flag => (
          <Badge badgeText={flag}/>
        ))}</div>
      )}
      </section>
      <code class="type-module" data-pagefind-ignore>import {module.name}</code>
      <section class="typedocs-data typedata">
        <subheading class="typedocs-subheading">
          {details ? <span class="parsedMD" set:html={details}/> : (<span class="toparse">{type.description}</span>)}
        </subheading>
        { Object.keys(type.properties ?? {}).length != 0 && (
          <h2>Properties <a href={`/docs/${version.name}/guide/qml-language#properties`}>[?]</a></h2>
          <Properties props={type.properties!}/>
        )}
        { (type.functions?.length ?? 0) != 0 && (
          <h2>Functions <a href={`/docs/${version.name}guide/qml-language#functions`}>[?]</a></h2>
          <Functions
            funcData={type.functions!}
          />
        )}
        { Object.keys(type.signals ?? {}).length != 0 && (
          <h2>Signals <a href={`/docs/${version.name}guide/qml-language#signals`}>[?]</a></h2>
          <Signals
            signals={type.signals!}
          />
        )}
        { Object.keys(type.variants ?? {}).length != 0 && (
          <h2>Variants</h2>
          <Variants
            variants={type.variants!}
          />
        )}
      </section>
    </div>
    <TOC mobile={false} type={type} data-pagefind-ignore/>
  </div>
</DocsLayout>

