---
import type {
  QMLTypeLinkObject,
  QuickshellFunction,
} from "@config/io/types";
import { getQMLTypeLink } from "@config/io/helpers";
import { Tag } from "@icons";
import TypeDetails from "./TypeDetails.astro";
import TypeTitle from "./TypeTitle.astro";

export interface Props {
  funcData: QuickshellFunction[];
}

const { funcData } = Astro.props;
const { version } = Astro.params;
---
<ul class="typedata typefuncs">
  {
    funcData.map(item => {
      const functionParams = item.params.length > 0 ? item.params.map((funcparam,index) => `${funcparam.name}${index !== item.params.length -1 ? ", ":""}`) : undefined
      const retTypeLink = getQMLTypeLink(version!, item.ret as unknown as QMLTypeLinkObject)
      let genericType:string|undefined;
      let genericTypeLink:string|undefined;
      return (
        <li id={item.name} class="typedata-root typefunc-root">
          <TypeTitle
            typekind="func"
            typename={item.name}
            typelink={retTypeLink}
            typelink_text={item.ret.name || item.ret.type.toString()}
            typename_generic={genericType}
            typelink_generic={genericTypeLink}
            typedata_params={functionParams}
          />
          {
            item.params.length > 0 ? (
              <p class="typedata-params typefunc-params">
                {
                  item.params.map(param => {
                    const paramTypeLink = getQMLTypeLink(version!, param.type);
                    return (
                      <span class="typedata-param typefunc-param">
                        <Tag client:idle/>
                        {param.name}<span class="type-datatype">:&nbsp;<a
                          href={paramTypeLink}
                          target="_blank"
                        >{param.type.name}</a></span>
                      </span>
                    )
                  })
                }
              </p>
            )
            :null
          }
          <TypeDetails markdown={item.details} />
        </li>
      )
    })
  }
</ul>
