diff --git a/CHANGELOG.md b/CHANGELOG.md index 82b0e36..f4d50f9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Added - Configure node by clicking in workflow config toml text ([#20](https://github.com/i-VRESSE/workflow-builder/issues/20)) +- Allow to configure node legend in catalog ([#151](https://github.com/i-VRESSE/workflow-builder/issues/151)) ## @i-vresse/wb-core 3.2.1 - 2024-08-26 diff --git a/README.md b/README.md index 04399de..c5da65f 100644 --- a/README.md +++ b/README.md @@ -171,6 +171,7 @@ The catalog is a YAML formatted file which tells the app what nodes are availabl 4. examples: Title and link to example workflows * map with title as key and link as value 5. title: Title of the catalog +6. nodeLegend: Legend of the node in the app. Default is 'Node' ### schema diff --git a/packages/core/README.md b/packages/core/README.md index 0b4c218..ded8425 100644 --- a/packages/core/README.md +++ b/packages/core/README.md @@ -64,6 +64,7 @@ function App() { useEffect(() => { const catalog = { title: "Some title", + nodeLegend: "Workflow node", global: { schema: { type: "object", diff --git a/packages/core/src/CatalogPanel.stories.tsx b/packages/core/src/CatalogPanel.stories.tsx index 0f4dd66..5b798b7 100644 --- a/packages/core/src/CatalogPanel.stories.tsx +++ b/packages/core/src/CatalogPanel.stories.tsx @@ -108,3 +108,19 @@ export const WithExample: ComponentStory = () => { }) return } + +export const WithNodeLegend: ComponentStory = () => { + const setCatalog = useSetCatalog() + setCatalog({ + title: 'Some title', + nodeLegend: 'My custom node label', + categories: [], + global: { + schema: {}, + uiSchema: {} + }, + nodes: [], + examples: {} + }) + return +} diff --git a/packages/core/src/CatalogPanel.tsx b/packages/core/src/CatalogPanel.tsx index 8517d7a..eef0bbd 100644 --- a/packages/core/src/CatalogPanel.tsx +++ b/packages/core/src/CatalogPanel.tsx @@ -18,7 +18,7 @@ export const CatalogPanel = ({ children }: PropsWithChildren<{}>): JSX.Element = Catalog Loading catalog...}> {children} -

Nodes

+

{catalog.nodeLegend ?? 'Node'}s

    {catalog.categories.map((category) => ( diff --git a/packages/core/src/NodePanel.stories.tsx b/packages/core/src/NodePanel.stories.tsx index 9fae6b4..7e65dfb 100644 --- a/packages/core/src/NodePanel.stories.tsx +++ b/packages/core/src/NodePanel.stories.tsx @@ -87,3 +87,32 @@ export const NodeSelected: ComponentStory = () => { }, []) return } + +export const CustomNodeLegend: ComponentStory = () => { + const setCatalog = useSetCatalog() + // const { setEditingGlobal } = useWorkflow() + useEffect(() => { + const catalog = prepareCatalog({ + title: 'Some title', + nodeLegend: 'My custom node label', + categories: [], + global: { + schema: { + type: 'object', + properties: { + parameter1: { + type: 'string' + } + }, + additionalProperties: false + }, + uiSchema: {} + }, + nodes: [], + examples: {} + }) + setCatalog(catalog) + // toggleGlobalEdit() + }, []) + return +} diff --git a/packages/core/src/NodePanel.tsx b/packages/core/src/NodePanel.tsx index de09c61..e265069 100644 --- a/packages/core/src/NodePanel.tsx +++ b/packages/core/src/NodePanel.tsx @@ -3,7 +3,7 @@ import React from 'react' import { FormProps } from './FormProps' import { GlobalForm } from './GlobalForm' import { NodeForm } from './NodeForm' -import { useSelectNodeIndex } from './store' +import { useCatalog, useSelectNodeIndex } from './store' /** * Panel which renders the form for the selected node or the global parameters. @@ -11,8 +11,9 @@ import { useSelectNodeIndex } from './store' */ export const NodePanel = ({ fields, widgets }: FormProps): JSX.Element => { const selectedNodeIndex = useSelectNodeIndex() + const { nodeLegend } = useCatalog() - const legend = 'Node' + const legend = nodeLegend ?? 'Node' return (
    diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts index 367dad1..53c4da0 100644 --- a/packages/core/src/types.ts +++ b/packages/core/src/types.ts @@ -53,6 +53,7 @@ export interface IGlobal { export interface ICatalog { title: string + nodeLegend?: string global: IGlobal categories: ICategory[] nodes: ICatalogNode[] diff --git a/packages/haddock3_catalog/generate_haddock3_catalog.py b/packages/haddock3_catalog/generate_haddock3_catalog.py index 3996588..2fa268e 100755 --- a/packages/haddock3_catalog/generate_haddock3_catalog.py +++ b/packages/haddock3_catalog/generate_haddock3_catalog.py @@ -534,6 +534,7 @@ def process_level(level_fn: Path, level: str): catalog = { "title": f"Haddock 3 on {level} level", + "nodeLegend": "Module", "categories": categories, 'global': process_global(level), "nodes": nodes, diff --git a/packages/haddock3_catalog/public/catalog/haddock3.easy.yaml b/packages/haddock3_catalog/public/catalog/haddock3.easy.yaml index 798cca9..d595e25 100644 --- a/packages/haddock3_catalog/public/catalog/haddock3.easy.yaml +++ b/packages/haddock3_catalog/public/catalog/haddock3.easy.yaml @@ -1,4 +1,5 @@ title: Haddock 3 on easy level +nodeLegend: Module categories: - name: topology description: HADDOCK3 modules to create topologies. diff --git a/packages/haddock3_catalog/public/catalog/haddock3.expert.yaml b/packages/haddock3_catalog/public/catalog/haddock3.expert.yaml index 1379be0..54387bf 100644 --- a/packages/haddock3_catalog/public/catalog/haddock3.expert.yaml +++ b/packages/haddock3_catalog/public/catalog/haddock3.expert.yaml @@ -1,4 +1,5 @@ title: Haddock 3 on expert level +nodeLegend: Module categories: - name: topology description: HADDOCK3 modules to create topologies. diff --git a/packages/haddock3_catalog/public/catalog/haddock3.guru.yaml b/packages/haddock3_catalog/public/catalog/haddock3.guru.yaml index d923a96..9be7367 100644 --- a/packages/haddock3_catalog/public/catalog/haddock3.guru.yaml +++ b/packages/haddock3_catalog/public/catalog/haddock3.guru.yaml @@ -1,4 +1,5 @@ title: Haddock 3 on guru level +nodeLegend: Module categories: - name: topology description: HADDOCK3 modules to create topologies.