How to access the slug of a reference to a route in a CTA object within a hero element

export default {
  title: "Call to action",
  name: "cta",
  type: "object",
  validation: (Rule) =>
    Rule.custom(
      (fields = {}) =>
        !fields.route || !fields.link || "Only one link type is allowed"
    ),
  fieldsets: [
    {
      title: "Link",
      name: "link",
    },
  ],
  fields: [
    {
      title: "Tittel",
      name: "title",
      type: "string",
    },
    {
      title: "Intern lenke",
      description: "Bruk dette feltet for å lenke til en side som tilhører dette nettstedet.",
      name: "route",
      type: "reference",
      to: [{ type: "route" }],
      fieldset: "link",
    },
    {
      title: "Ekstern lenke",
      name: "link",
      type: "url",
      fieldset: "link",
    },
    {
      title: 'Åpne i ny fane?',
      name: 'blank',
      type: 'boolean',
      fieldset: "link",
    }
  ],
};

export default {
  type: "object",
  name: "hero",
  title: "Hero",
  fields: [
    {
      name: "heading",
      type: "string",
      title: "Heading",
    },
    {
      name: "tagline",
      type: "portableText",
      title: "Tagline",
    },
    {
      name: "backgroundImage",
      type: "image",
      title: "Background image",
      options: {
        hotspot: true,
      },
    },
    {
      name: "imagePlacement",
      type: "string",
      title: "Bildeplassering",
      options: {
        list: [
          {title: "Venstre", value: "last"},
          {title: "Høyre", value: "first"}
        ]
      }
    },
    {
      name: "ctas",
      type: "array",
      title: "Call to actions",
      of: [
        {
          title: "Call to action",
          type: "cta",
        },
      ],
    },
  ],
};

function Cta(props) {
  const { title, route, link } = props;

  if (route && route.slug && route.slug.current) {
    return (
      <Link href={`/${route.slug.current}`}>{title}</Link>
    );
  }

  if (link) {
    return <a href={link}>{title}</a>;
  }
  return <a>{title}</a>;
}

Cta.propTypes = {
  title: PropTypes.string.isRequired,
  route: PropTypes.shape({
    slug: PropTypes.shape({
      current: PropTypes.string,
    }),
  }),
  link: PropTypes.string,
};

export default Cta;

page-> {
  content[] {
    ctas[] {
      ...,
      route->{slug}
    }
  }
}