feat(plugin-tech-radar): export stateless ui component #2156
Conversation
Missing ChangesetsThe following package(s) are changed by this PR but do not have a changeset:
See CONTRIBUTING.md for more information about how to add changesets. Unexpected ChangesetsThe following changeset(s) reference packages that have not been changed in this PR:
Note that only changes that affect the published package require changesets, for example changes to tests and storybook stories do not require changesets. Changed Packages
|
Allow upstream consumers to manage state independent of Backstage by exporting a stateless ui component of the tech radar. Co-authored-by: Harley Lang <[email protected]> Signed-off-by: Harley Lang <[email protected]>
harley-davidson
force-pushed
the
harley-stateless-radar
branch
from
ce1161e to
4ed8d4b
Compare
| @@ -283,6 +283,19 @@ export const app = createApp({ | |||
| }); | |||
| ``` | |||
|
|
|||
| #### Option C: Opt-out of statefullness and manage state independently | |||
|
|
|||
| In situations where you need to integrate a radar and manage state independently of Backstage, use the stateless UI component: | |||
There was a problem hiding this comment.
it's already possible to do that. Have you tried providing your own implementation of techRadarApiRef by adding the following to apis.ts?
createApiFactory({
api: techRadarApiRef,
deps: {},
factory: () =>
new (class MyApi implements TechRadarApi {
async load(): Promise<TechRadarLoaderResponse> {
return { entries: [], quadrants: [], rings: [] };
}
})(),
}),There was a problem hiding this comment.
My use case does not use Backstage though I would like to take advantage of the amazing component that is written in this plugin. In such cases unless I am misunderstanding I don't believe createApiFactory will be available, and it will be up to the upstream consumer to manage state for the radar chart.
There was a problem hiding this comment.
in your Backstage app you should have a packages/app/src/apis.ts file where you can add the code above that loads the data from whatever data source you want. The data will be injected into tech-radar plugin once loaded.
There was a problem hiding this comment.
Hi @vinzscam, my use case is not with a Backstage app. I would like to use this component with an independent application with it's own state management and api logic. This is why this PR exports a stateless radar component.
There was a problem hiding this comment.
I see! Thx for clarifying @harley-davidson, it makes sense 👍
There was a problem hiding this comment.
in that case I'm not sure we need to explain this in the README, but calling @awanlin as he can have a better opinion on this
There was a problem hiding this comment.
Sorry, not going to like my answer. I don't like the idea of this going outside of Backstage as we have no way to know how it's being used and the impact other changes might have on this down the road. I'll defer to @vinzscam for final say on this but that's my thoughts.
There was a problem hiding this comment.
Appreciate that @awanlin - I imagine the integrity of the plugin is more important than the underlying UI. On our end we could look to develop this type of component independently, but to offer a counterpoint, I don't think that the impact of exporting a stateless component would be a huge risk. Even if the API changed, upstream consumers could just pin to a version of the plugin until they have capacity to upgrade. However, I do understand that you want the focus to be on the plugin and the UI's usage within Backstage itself.
There was a problem hiding this comment.
What are your thoughts @vinzscam ?
Co-authored-by: Harley Lang <[email protected]> Signed-off-by: Harley Lang <[email protected]>
Co-authored-by: Harley Lang <[email protected]> Signed-off-by: Harley Lang <[email protected]>
Allow upstream consumers to manage state independent of Backstage by exporting a stateless ui component of the tech radar. This PR includes new exports and documentation to support this functionality.