tutorialkit icon indicating copy to clipboard operation
tutorialkit copied to clipboard

feat: access current lesson from Astro.locals

Open eric-burel opened this issue 1 year ago • 2 comments

This PR introduces a way to access the current lesson frontmatter / collection entry from any component, using Astro.locals as a server context.

I've tried to find simpler alternatives:

  • frontmatter object accessible in Markdown files can help avoiding repetitions when a component needs the current lesson title etc. However it won't enjoy the parsing logic from TutorialKit getTutorial function in packages/astro/src/default/utils/content.ts
  • We can't seem to pass props to the rendered <Markdown /> component in packages/astro/src/default/components/TutorialContent.astro. I didn't actually try but found no documentation regarding such an usage, all the more that Astro.render() has already been called to generate this component so I suspect that even it was possible, it would be too late to pass it some props.
  • Markdown layout are great and can access a lot of context like the current page URL... but they are layouts. You can't access a similar context within a component. I've tried accessing the url value in a MDX page but it points to the file and not the actual URL (it had no chance to work since using a collection decorelates the URL and the entry). We can only access the frontmatter prop

I needed to pass an additional entrySlug to be able to call getEntry later on. I focused on lessons at the moment.

Use cases would be crafting reusable lesson-specific component, that are able to figure the lesson URL, reuse the frontmatter config etc. For instance I am trying to wrap up a "Share on Bluesky" component.

eric-burel avatar Oct 28 '24 17:10 eric-burel

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

Alright ! So the TutorialStore is a stateful singleton as far as I can tell from the code.

However I see setLesson being called only in WorkspacePanelWrapper in a useEffect hook: is this value available in server-side Astro components as well? I feel like it only works in islands, and is strongly tied to the WorkspacePanel component loading first.

eric-burel avatar Nov 05 '24 15:11 eric-burel