frontend Map: Add register functions for the Map extension

Signed-off-by: Oleksandr Dubenko <[email protected]>

frontend/src/plugin/__snapshots__/pluginLib.snapshot

@@ -16104,6 +16104,9 @@
   "registerDetailsViewSectionsProcessor": [Function],
   "registerGetTokenFunction": [Function],
   "registerHeadlampEventCallback": [Function],
+  "registerKindDetailsPage": [Function],
+  "registerKindIcon": [Function],
+  "registerMapSource": [Function],
   "registerPluginSettings": [Function],
   "registerResourceTableColumnsProcessor": [Function],
   "registerRoute": [Function],

frontend/src/plugin/registry.tsx

@@ -17,6 +17,12 @@ import {
   DetailsViewsSectionProcessor,
   setDetailsViewSection,
 } from '../components/DetailsViewSection/detailsViewSectionSlice';
+import { GraphSource } from '../components/resourceMap/graph/graphModel';
+import {
+  DetailsPageDefinition,
+  graphViewSlice,
+  IconDefinition,
+} from '../components/resourceMap/graphViewSlice';
 import { DefaultSidebars, SidebarEntryProps } from '../components/Sidebar';
 import { setSidebarItem, setSidebarItemFilter } from '../components/Sidebar/sidebarSlice';
 import { getHeadlampAPIHeaders } from '../helpers';
@@ -97,6 +103,9 @@ export type {
   EventListEvent,
   PluginSettingsDetailsProps,
   PluginSettingsComponentType,
+  GraphSource,
+  DetailsPageDefinition,
+  IconDefinition,
 };
 export const DefaultHeadlampEvents = HeadlampEventType;
 export const DetailsViewDefaultHeaderActions = DefaultHeaderAction;
@@ -684,6 +693,60 @@ export function registerPluginSettings(
   store.dispatch(setPluginSettingsComponent({ name, component, displaySaveButton }));
 }
 
+/**
+ * Registers a new graph source in the store.
+ *
+ * @param {GraphSource} source - The graph source to be registered.
+ * @example
+ *
+ * ```tsx
+ * const mySource = {
+ *   id: 'my-source',
+ *   label: 'Sample source',
+ *   useData() {
+ *     return {
+ *       nodes: [{ id: 'my-node', type: 'kubeObject', data: { resource: myCustomResource } }],
+ *       edges: []
+ *     };
+ *   }
+ * }
+ *
+ * registerMapSource(mySource);
+ * ```
+ */
+export function registerMapSource(source: GraphSource) {
+  store.dispatch(graphViewSlice.actions.addGraphSource(source));
+}
+
+/**
+ * Register Icon for a resource kind
+ *
+ * @param kind - Resource kind
+ * @param {IconDefinition} definition - icon definition
+ * @param definition.icon - React Element of the icon
+ * @param definition.color - Color for the icon, optional
+ *
+ * @example
+ *
+ * ```tsx
+ * registerKindIcon("MyCustomResource", { icon: <MyIcon />, color: "#FF0000" })
+ * ```
+ */
+export function registerKindIcon(kind: string, definition: IconDefinition) {
+  store.dispatch(graphViewSlice.actions.addKindIcon({ kind, definition }));
+}
+
+/**
+ * Register Details page for a resource
+ *
+ * @param kind - kind of the resource
+ * @param {DetailsPageDefinition} definition - details page definition
+ * @param definition.component - React Component for the page, accepts name and namespace props
+ */
+export function registerKindDetailsPage(kind: string, definition: DetailsPageDefinition) {
+  store.dispatch(graphViewSlice.actions.addKindDetailsPage({ kind, definition }));
+}
+
 export {
   DefaultAppBarAction,
   DefaultDetailsViewSection,