[v6] RichText Internal links not resolving

[jodiedoubleday]

Versions

• gatsby-source-prismic: 6.0.0
• gatsby-plugin-prismic-previews: 6.0.0
• @prismicio/react: 2.7.1
• gatsby: 5.11.0
• Node.js: 18.16.0

Reproduction

Repo is private but can give access if requested

Steps to reproduce

I'm using the latest gatsby-source-prismicand @rismicio/react plugins. Whenever I add a link in a richText field the link doesn't resolve, instead it just links to the page you are on. This works if I downgrade @prismicio/react to 2.5.2 it works correctly, I'm not sure if it's an issue with this repo or prismic react.

Im using the plugin in the following way...

<PrismicLink field={slice.primary.button_link}>
  LINK
</PrismicLink>

I think previously it was mentioned that this might be the incorrect way of using this plugin and instead using...

<PrismicLink href={slice.primary.button_link.url}>
  LINK
</PrismicLink>

If I'm using it incorrectly, lease let me know and I'll adjust the code.

What is expected?

richText links would resolve to the correct lace as with previous versions.

What is actually happening?

The link doesn't resolve and instead links to itself.

[a-rbsn]

I'm encountering the same bug, using a custom wrapper doesn't seem to help, it seems that all links coming through from Prismic were being treat as 'external' instead of using the internalLinkComponent:

import React from "react";
import { PrismicRichText as BasePrismicRichText } from "@prismicio/react";
import { Link } from "gatsby";

export const PrismicRichText = ({ components, ...props }) => {
  return (
    <BasePrismicRichText
      internalLinkComponent={({ href, ...props }) => {
        return <Link to={href} {...props} />;
      }}
      externalLinkComponent={(props) => {
        return (
          <a
            className='external'
            target='_blank'
            rel='noreferrer noopener'
            href={props.href}
            children={props.children}
          />
        );
      }}
      components={{ ...components }}
      {...props}
    />
  );
};

When I revert to @2.5.2 — the external links are rendered properly, but the internal links disappear/don't render.

[a-rbsn]

This was solved by providing a routes: [] to the options in gatsby-config.js — wasn't made very clear in the docs that this was required.

[jodiedoubleday]

Empty Routes routes: [] causes the error: "routes" does not contain 1 required value(s)

[kieranstartup]

Hey @jodiedoubleday, I ran into this the other day and managed to solve it by adding the routes into my gatsby-config.js like so:

routes: [
  {
    type: "home",
    path: "/",
  },
  {
    type: "artist",
    path: "/artists/:uid/",
  },
  {
    type: "exhibition",
    path: "/exhibitions/:uid",
  },
  {
    type: "edition",
    path: "/editions/:uid",
  },
  {
    type: "page",
    path: "/:uid",
  },
],

And I'm also still inserting this code into my layout.js (not sure whether required or not):

<PrismicProvider
  linkResolver={linkResolver}
  internalLinkComponent={({ href, ...props }) => (
    <Link to={href} {...props} />
  )}
>
... rest of code
</PrismicProvider>

Hope that helps fix your issue!