Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Internal link in the RichTextResolver is not rendering the entire URL but just the slug. #793

Open
Dawntraoz opened this issue Feb 26, 2024 · 3 comments
Labels
has-workaround [Issue] Temporary solutions available. p2-nice-to-have [Priority] Lower priority, beneficial enhancements that are not urgent.

Comments

@Dawntraoz
Copy link
Contributor


Expected Behavior

The link should be rendered as <a href="<URL>" ...>, instead of <a href="<slug>" ...>.

Current Behavior

A user (@mlalitthapa) using our Nuxt SDK reported this issue: storyblok/storyblok-nuxt#756.

He's using the internal link inside a rich text editor and rendering it using renderRichText function. But the anchor link is using the wrong URL in the href. Let's say his contact page has URL /contact and slug of contact. Then the anchor link is just using contact as URL, instead of /contact.

Steps to Reproduce

  1. Render the content of a RichText with an internal link
  2. Check the URL being added to href
    Internal Link Rendered incorrectly
@alvarosabu
Copy link
Contributor

Hi @Dawntraoz this will be really easy to achieve with the new richtext https://github.com/storyblok/richtext

@alvarosabu alvarosabu added p2-nice-to-have [Priority] Lower priority, beneficial enhancements that are not urgent. has-workaround [Issue] Temporary solutions available. labels Sep 16, 2024
@Dawntraoz
Copy link
Contributor Author

Hi @alvarosabu, that sounds amazing! Thanks for caring 🎉 Can you share here or in the Nuxt issue the workaround proposed, and when will it be stable to use?

@alvarosabu
Copy link
Contributor

Yes, @Dawntraoz they could do something like this:

// Vanilla
const options = {
      resolvers: {
        [MarkTypes.LINK]: (node) => {
          if node.attrs?.linktype === 'STORY' {
             return `<a href="/${node.attrs?.href}"`
          }  
      },
}

const html = richTextResolver<string>(options).render(doc)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
has-workaround [Issue] Temporary solutions available. p2-nice-to-have [Priority] Lower priority, beneficial enhancements that are not urgent.
Projects
None yet
Development

No branches or pull requests

2 participants