How to Add Internal Links to Top Level Singletons

export default {
  title: "Call to action",
  name: "cta",
  type: "object",
  validation: (Rule) =>
    Rule.custom(
      (fields = {}) =>
        !<http://fields.post|fields.post> || !fields.link || "Only one link type is allowed"
    ),
  fieldsets: [
    {
      title: "Link",
      name: "link",
    },
  ],
  fields: [
    {
      title: "Title",
      name: "title",
      type: "string",
    },
    {
      name: "show",
      title: "Show (leave unchecked to hide CTA)",
      type: "boolean",
    },
    {
      title: "Internal link",
      description: "Use this to link between pages on the website",
      name: "post",
      type: "reference",
      to: [{ type: "post" },{ type: "project" }],
      fieldset: "link",
    },
    {
      title: "External link",
      name: "link",
      type: "url",
      fieldset: "link",
    },
  ],

{
  title: "Internal link",
  description: "Use this to link between pages on the website",
  name: "post",
  type: "reference",
  to: [
    { type: 'home' },
    { type: 'about' },
    { type: 'info' },
    { type: "post" },
    { type: "project" }
  ],
  fieldset: "link",
},

/* groq */`
  title,
  link,
  post->_type == "project" => {
    "link": "/project/" + post->slug.current
  },
  post->_type == "post" => {
    "link": "/post/" + post->slug.current
  },
  post->_type == "about" => {
    "link": "/about
  }
`

  const serializers = {
    marks: {
      link: ({ children, value }) =>
        value.blank === false ? (
          <Link href={value.href}>
            <a className={styles["internal-link"]}>{children}</a>
          </Link>
        ) : (
          <>
            <a
              className={styles["external-link"]}
              href={value.href}
              target="_blank"
              rel="noopener noreferrer"
            >
              {`${children}↗`}
            </a>{" "}
          </>
        ),
    },