Client routing for internal `content` links

Description

Right now an internal link found in content.rendered triggers a new SSR. It should be captured in Frontity and switched to a client route.

User Stories

As a Frontity developer
I want to use Frontity’s router for all the internal links found in content.rendered
so that when readers click, the route change is done in the client

Possible solution

We have to add a processor for this.

Also, as noted by @mmczaplinski, we should check for absolute links and change them to relative links.

For example, in a site www.mydomain.com with a WordPress URL wp.mydomain.com we need to do this change:

<a href="https://wp.mydomain.com/some-post">

<a href="/some-post">

@luisherranz now that we have a <Link /> we could simply add a processor to replace all anchor tags with our <Link /> component. It already checks for external links. We would only need to add a check for internal absolute links and convert to relative links.

Absolutely. Great idea.

The only thing missing here is that the WordPress bakend URL is only on state.source.api now, and it may (or may not) contain a prefix, usually /wp-json.

We have seen lately that many packages need to know the “WordPress URL”, not only for the wp-source package.

I’m not 100% sure yet how that should be handled. One idea is to move it to state.frontity, similar to url:

export default {
  state: {
    frontity: {
      url: "https://mars.frontity.org",
      title: "Test Frontity Blog",
      description: "Useful content for Frontity development",
      backend: "https://test.frontity.org",
    },
  },
  packages: [
    {
      name: "@frontity/wp-source",
      state: {
        source: {
          prefix: "/wp-json", // This will be the default.
          prefix: false, // This could be use to use `?rest_route=`.
          isWpCom: true, // To support the WP.com API.
        },
      },
    },
  ],
};

For example the @frontity/head-tags plugin is extracting the backend URL from state.source.api using this function: https://github.com/frontity/frontity/blob/dev/packages/head-tags/src/utils/index.ts#L29-L38

I’ll open a new FD to discuss this.

This is the new FD: Make the backend URL a global setting

Let’s move the conversation there :slightly_smiling_face:

I’ve started working on this here: https://github.com/frontity/frontity/pull/520

@luisherranz Do you think it’s worth relying on state.source.api for now and change it later?

I’m not sure we’re at a point where Make the backend URL a global setting can be implemented.

Hey, sorry for the delay in my answer @nicholasio.oliveira (I’m on holiday although I try to stay up to date).

To be honest, I’d prefer to try to do it now, because… well, the sooner the better for this type of change. If we keep delaying it it’s going to be more difficult.

And I think we can make it 100% backward compatible using derived state: Make the backend URL a global setting