Loading user-defined components? / Dynamic component registration

[josephguillaume]

Hi, I'm interested in defining and loading user-defined components at runtime for particular types and even particular objects. Do you have plans to implement something like this?

In the context of podos, this would be mostly web components, but I could also imagine displaying a specific Uri (e.g. a web page or image) as the default view of a given object.

Solidos allows dynamic registration of panes, and this can be done from an IFrame, but the registration is only for the current session and creating a component in the render method is a js-heavy task/needs the component to be built offline.

I understand the corresponding logic in podos is currently here:

PodOS/elements/src/components/pos-type-router/pos-type-router.tsx

Lines 29 to 30 in 5debca1

	const App = selectAppForTypes(this.types);
	return <App />;

I think what I am suggesting is 1) Loading (additional) type-component registrations from RDF, 2) Looking for the named custom component if not built-in, and loading it dynamically if needed.

The RDF registration could be in the same resource/named graph, same resource hierarchy, prefs, or simply defined in the current store (probably in that order of preference).

It would be nice to have some level of compatibility with forms vocabs and https://github.com/jeff-zucker/solid-ui-components, but I think neither quite fits this use case:

• the only registration currently provided for forms is ui:creationForm and ui:annotationForm, and the behaviour there still needs work Handling multiple form definitions (ui:annotationForm) SolidOS/solid-ui#474 Load form if it's defined in another document? SolidOS/solid-panes#322
• My understanding is that the approach used by solid-ui components ties components to specific data sources, so this could be built on to allow including podos apps, but it currently doesn't provide type-component registrations.

There are security issues to consider, but this is already the case with web pages loaded in an IFrame in both solidos and podos. Probably there will need some way to mark a URI/resource as safe to execute.

[angelo-v]

This is definetly a cool idea we will implement eventually. Are you interested in working on it? We could have a call if you like to participate.

[josephguillaume]

Good to know it's on the radar. My interest is because I mainly have time to write fragile, one off code that meets my immediate needs, so I'm probably not the person to work on something robust for pod-os :-)

[josephguillaume]

I now think my preference for implementation of this is through loading a user script from a trusted location, which then accesses hooks in the base code, similar to what Wikipedia does.
https://en.wikipedia.org/wiki/Wikipedia:User_scripts

The user script would register the custom component.
PodOS would need to securely call the user script on load, and provide a hook e.g. within selectAppForTypes to change which component is selected.

Edit: it looks like a minimal implementation of this involves:

• User creates their own pos-app-browser as a new entry point, following instructions in https://github.com/pod-os/PodOS/tree/main/elements . The web components provide the points of articulation for the user to change PodOS behaviour.
• pos-router would need to split out pos-type-router to allow it to be replaced without reimplementing all of pos-router
• User defines an app-selecting component that uses their custom component, and might also call pos-type-router internally

Essentially for the minimal case replacing index.html takes the role of a user script, and replacing pos-type-router provides the necessary hook.

[josephguillaume]

In creating dashboards, I've instead been using:

• a routing function that updates a root pos-resource
• conditional rendering within that pos-resource to display custom HTML for different cases

[josephguillaume]

Just documenting SolidOS' pane selection logic:

getRelevantPanes calls the label function on each registered pane in a pane registry
https://github.com/SolidOS/solid-panes/blob/b1bb05b37ddd3a9d21671be1f0a03a19639694fa/src/outline/manager.js#L543

The pane registry currently gets populated on load of SolidOS
https://github.com/SolidOS/solid-panes/blob/main/src/registerPanes.js

The disadvantage of this approach is that all panes need to be loaded in memory in order to determine whether it is used.
This makes sense when SolidOS (or PodOS) is used as a data browser within a long running browser session. It makes less sense if PodOS is used for a custom dashboard.