-
Notifications
You must be signed in to change notification settings - Fork 28
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
chore(Canvas): Extract ItemEnableAllSteps
- Loading branch information
Showing
5 changed files
with
213 additions
and
62 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
95 changes: 95 additions & 0 deletions
95
packages/ui/src/components/Visualization/Custom/ContextMenu/ItemEnableAllSteps.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,95 @@ | ||
| import catalogLibrary from '@kaoto/camel-catalog/index.json'; | ||
| import { CatalogLibrary } from '@kaoto/camel-catalog/types'; | ||
| import { Model, VisualizationProvider } from '@patternfly/react-topology'; | ||
| import { act, fireEvent, render, waitFor } from '@testing-library/react'; | ||
| import { CamelCatalogService, CatalogKind } from '../../../../models'; | ||
| import { CamelRouteResource } from '../../../../models/camel/camel-route-resource'; | ||
| import { camelRouteJson, camelRouteWithDisabledSteps } from '../../../../stubs/camel-route'; | ||
| import { getFirstCatalogMap } from '../../../../stubs/test-load-catalog'; | ||
| import { TestProvidersWrapper } from '../../../../stubs/TestProvidersWrapper'; | ||
| import { getVisualizationNodesFromGraph } from '../../../../utils'; | ||
| import { ControllerService } from '../../Canvas/controller.service'; | ||
| import { FlowService } from '../../Canvas/flow.service'; | ||
| import { ItemEnableAllSteps } from './ItemEnableAllSteps'; | ||
|
|
||
| describe('ItemEnableAllSteps', () => { | ||
| beforeAll(async () => { | ||
| const catalogsMap = await getFirstCatalogMap(catalogLibrary as CatalogLibrary); | ||
| CamelCatalogService.setCatalogKey(CatalogKind.Pattern, catalogsMap.patternCatalogMap); | ||
| CamelCatalogService.setCatalogKey(CatalogKind.Component, catalogsMap.componentCatalogMap); | ||
| }); | ||
|
|
||
| it('should NOT render an ItemEnableAllSteps if there are not at least 2 or more disabled steps', () => { | ||
| const camelResource = new CamelRouteResource(camelRouteJson); | ||
| const visualEntity = camelResource.getVisualEntities()[0]; | ||
| const { nodes, edges } = FlowService.getFlowDiagram(visualEntity.toVizNode()); | ||
|
|
||
| const model: Model = { | ||
| nodes, | ||
| edges, | ||
| graph: { | ||
| id: 'g1', | ||
| type: 'graph', | ||
| }, | ||
| }; | ||
| const visualizationController = ControllerService.createController(); | ||
| visualizationController.fromModel(model); | ||
|
|
||
| const { Provider } = TestProvidersWrapper({ camelResource }); | ||
| const wrapper = render( | ||
| <Provider> | ||
| <VisualizationProvider controller={visualizationController}> | ||
| <ItemEnableAllSteps data-testid="context-menu-item-enable-all" /> | ||
| </VisualizationProvider> | ||
| </Provider>, | ||
| ); | ||
|
|
||
| const item = wrapper.queryByTestId('context-menu-item-enable-all'); | ||
|
|
||
| expect(item).not.toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it('should call updateModel and updateEntitiesFromCamelResource on click', async () => { | ||
| const camelResource = new CamelRouteResource(camelRouteWithDisabledSteps); | ||
| const visualEntity = camelResource.getVisualEntities()[0]; | ||
| const { nodes, edges } = FlowService.getFlowDiagram(visualEntity.toVizNode()); | ||
|
|
||
| const model: Model = { | ||
| nodes, | ||
| edges, | ||
| graph: { | ||
| id: 'g1', | ||
| type: 'graph', | ||
| }, | ||
| }; | ||
| const visualizationController = ControllerService.createController(); | ||
| visualizationController.fromModel(model); | ||
| const disabledNodes = getVisualizationNodesFromGraph(visualizationController.getGraph(), (node) => { | ||
| return node.getComponentSchema()?.definition?.disabled; | ||
| }); | ||
|
|
||
| const { Provider, updateEntitiesFromCamelResourceSpy } = TestProvidersWrapper({ camelResource }); | ||
| const wrapper = render( | ||
| <Provider> | ||
| <VisualizationProvider controller={visualizationController}> | ||
| <ItemEnableAllSteps /> | ||
| </VisualizationProvider> | ||
| </Provider>, | ||
| ); | ||
|
|
||
| act(() => { | ||
| const item = wrapper.getByText('Enable All'); | ||
| fireEvent.click(item); | ||
| }); | ||
|
|
||
| await waitFor(async () => { | ||
| disabledNodes.forEach((node) => { | ||
| expect(node.getComponentSchema()?.definition?.disabled).toBe(false); | ||
| }); | ||
| }); | ||
|
|
||
| await waitFor(async () => { | ||
| expect(updateEntitiesFromCamelResourceSpy).toHaveBeenCalledTimes(1); | ||
| }); | ||
| }); | ||
| }); |
37 changes: 37 additions & 0 deletions
37
packages/ui/src/components/Visualization/Custom/ContextMenu/ItemEnableAllSteps.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| import { PowerOffIcon } from '@patternfly/react-icons'; | ||
| import { ContextMenuItem, useVisualizationController } from '@patternfly/react-topology'; | ||
| import { FunctionComponent, PropsWithChildren, useCallback, useContext, useMemo } from 'react'; | ||
| import { IDataTestID } from '../../../../models'; | ||
| import { EntitiesContext } from '../../../../providers/entities.provider'; | ||
| import { getVisualizationNodesFromGraph, setValue } from '../../../../utils'; | ||
|
|
||
| export const ItemEnableAllSteps: FunctionComponent<PropsWithChildren<IDataTestID>> = (props) => { | ||
| const entitiesContext = useContext(EntitiesContext); | ||
| const controller = useVisualizationController(); | ||
| const disabledNodes = useMemo(() => { | ||
| return getVisualizationNodesFromGraph(controller.getGraph(), (node) => { | ||
| return node.getComponentSchema()?.definition?.disabled; | ||
| }); | ||
| }, [controller]); | ||
| const isMultiDisabled = disabledNodes.length > 1; | ||
|
|
||
| const onClick = useCallback(() => { | ||
| disabledNodes.forEach((node) => { | ||
| const newModel = node.getComponentSchema()?.definition || {}; | ||
| setValue(newModel, 'disabled', false); | ||
| node.updateModel(newModel); | ||
| }); | ||
|
|
||
| entitiesContext?.updateEntitiesFromCamelResource(); | ||
| }, [disabledNodes, entitiesContext]); | ||
|
|
||
| if (!isMultiDisabled) { | ||
| return null; | ||
| } | ||
|
|
||
| return ( | ||
| <ContextMenuItem onClick={onClick} data-testid={props['data-testid']}> | ||
| <PowerOffIcon /> Enable All | ||
| </ContextMenuItem> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters