Creating HasIslands component with useRequestContext in react-renderer

[yossydev]

What is the feature you are proposing?

I would like to create a component called HasIslandWithReactRenderer so that island will work even when using react-renderer.

Currently there is only a HasIsland component that supports the hono/jsx context, so if I use reactRenderer I get an error: RequestContext is not provided.

For your information, I made it in my repository and it worked, how about you?

Reference implementation:

import { useRequestContext } from "@hono/react-renderer";

const HasIslandWithReactRenderer: FC<PropsWithChildren> = ({ children }) => {
  const c = useRequestContext();
  return <>{c.get(IMPORTING_ISLANDS_ID) ? children : <></>}</>;
};

[yusukebe]

Hi @yossydev

That will be very helpful for React-users! But honox/server should not export HasIslandWithReactRenderer as the same as HasIsland.

I'm planning to make the helper methods for using React as a renderer like this:

import { createClient } from 'honox/react/client'

Or creating a package:

import { createClient } from '@honox/react/client'

So, it's a good idea to make HasIslandWithReactRenderer or simply HasIsland in honox/react or @honox/react.

However we're in the process of designing it now, so we can't get started right away.

[yossydev]

Thank you for your comment! @yusukebe
I understand! Someone wanted to use shadcn/ui in honox, but shadcn/ui depends on react, so I was touching things up to make the development experience there better!