Microfrontend types and props
Mfe Type | Props |
---|
Attribute view widget |
TYPESCRIPT
// The value of the specific attribute
attribute: StateObservable<string | number | boolean | null | undefined>;
// The value of the entire asset or area that the attribute belongs to, including all the custom_data
// Note: Entity is only undefined when your plugin is used as a preview of what your view widget will look like
entity: StateObservable<Asset['frontend'] | Area['frontend']> | undefined;
// The settings associated with your attribute view widget
// Note: There is no UI yet to allow setting values for these, but you can modify the asset_types collection (schema.custom_view_settings) to include your properties and values
settings: any; (this will match whatever interface you use)
StateObservable comes from React-RxJs |
Attribute edit widget |
TYPESCRIPT
// The value of the specific attribute
attribute: StateObservable<string | number | boolean | null | undefined>;
// The value of the entire asset or area that the attribute belongs to, including all the custom_data
entity: StateObservable<Asset['frontend'] | Area['frontend']>;
// A setter for updating the specific attribute value
setAttributeValue: (value: string | number | boolean | null | undefined) => void;
// A setter for updating any value on the entire asset or area that the attribute belongs to
setEntity: (entity: Partial<Asset['frontend']> | Partial<Area['frontend']>) => void;
// The settings associated with your attribute view widget
// Note: There is no UI yet to allow setting values for these, but you can modify the asset_types collection (schema.custom_edit_settings) to include your properties and values
settings: any; (this will match whatever interface you use)
StateObservable comes from React-RxJs |
Dashboard | No customProps are passed to dashboard microfrontends at this time |
Observable State
Suppose the mfe type you are building receives an observable prop, and you are building your mfe using React. In that case, we recommend leveraging the useStateObservable
hook and <Subscribe>
from React-RxJs to easily access the observable's value.
For mfe applications, see https://github.com/ClearBlade/ia-microfrontends