Hello, in my app I'm dynamically loading in all jsx files in a directory into a map, which I want to send to the client to choose components on the frontend. Essentially I want to have a text input determine the component to show below it on the screen if the text exactly matches the name of a file on the filesystem.

My plan to do this was to, in a server component load all of those components in a directory into a Map<String, React.FC>, then send that to a client component to be able to handle the form values and lookup the correct component in the map. However, when I do this it causes react to crash like in the screenshot below. I assume this is because I'm not really supposed to be sending functions like this across the server #Unknown Channel client boundary? Is there another way to do this that would be better in practice?