arsenal.scenarios
/
20.0.0
arsenal.scenarios 20.0.0
Install from the command line:
Learn more about npm packages
$ npm install @dhi/arsenal.scenarios@20.0.0
Install via package.json:
"@dhi/arsenal.scenarios": "20.0.0"
About this version
- Reusable between projects
- CRUD scenario operations
- Scenario config editor
- Scenario job event injesting
- Scenario UI components
// - Create the state store
// - Wire it up to your own apps state
class MyAppState {
scenarios = new ScenariosState<MyScenarioObject>({
data: () => ({
activeScenarioId: () => this.route.pathname?.scenarioId,
setScenario: this.setScenario,
activeSection: () => this.activeEditorSection,
setSection: this.setEditorSection,
createScenario: this.data.scenarioCreateQuery,
deleteScenario: this.data.scenarioDeleteQuery,
scenarioList: this.data.scenarioListQuery,
updateScenario: this.data.scenarioUpdateQuery,
executeJob: this.data.scenarioJobExecuteQuery,
jobsList: this.data.scenarioJobListQuery,
cancelJob: this.data.scenarioJobCancelQuery,
}),
})
}
// Fetch data & connect streams when your api is ready to
useEffect(() => {
if (!apiAndAuthIsReady) return
myAppState.scenarios.initializeQuery()
}, apiAndAuthIsReady)
// - Provide the state store via React context
// - Utilize the components
<ScenariosStoreContext.Provider value={myAppState.scenarios}>
<ScenariosPanels
sections={{
// - This adds an extra tab to the active scenario panel
// - The `config` section is provided by default, but can be overriden
results: MyOwnScenarioResultsSection,
}}
/>
</ScenariosStoreContext.Provider>
Feel free to use each component on its own
import {
ScenarioPanels,
ScenarioListPanel,
ActiveScenarioPanel,
SidebarPanel,
ScenarioListItem,
ScenarioConfigEditor,
} from '@dhi/arsenal.scenarios';
Check the source code & Typescript types for details on how components are used.