patternfly / patternfly/react-topology

Bug - Decorator - Cannot destructure property 'addDef' of 'undefined' as it is undefined

Open
#290 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
21
Forks
27
PR merge metrics
No merged PRs in 30d

Description

Describe the problem
Hi! I'm trying to add a decorator to a OpenShift Console dynamic plugin for use in their Topology page(s), but I'm running into the following error message when using the Decorator: TypeError: Cannot destructure property 'addDef' of 'undefined' as it is undefined

Example snippet: [Decorator x={x} y={y} radius={radius}][/Decorator]

My dev console is pointing here: https://github.com/patternfly/react-topology/blob/main/packages/module/src/components/defs/SVGDefs.tsx#L27

How do you reproduce the problem?

I've put together a branch to illustrate this: https://github.com/aptmac/console-plugin-template/tree/example-decorator

It's an OpenShift dynamic plugin, so you'll need a running instance of OpenShift or CRC to test against.

  1. In one terminal, install and run the plugin: yarn install && yarn run start
  2. In another terminal, run a local console frontend: yarn run start-console
  3. Have a running deployment. Quickest way would be to go to the Developer perspective -> +Add page, and under "Create applications using samples" select "Basic Quarkus" and follow the steps to create
  4. Go to the Topology page, and try to view the new deployment

The expected behaviour is that a new decorator should be present in the top left of the deployment node. The actual behaviour is the error message above.

Expected behavior
A clear and concise description of the expected behavior.

Is this issue blocking you?
List the workaround if there is one.

Screenshots

Actual: here's a screenshot of the error

image

Expected: I'm expecting a decorator and icon to be drawn in the top left of the node. Here I replaced the [Decorator] and used the icon directly instead and it appears, but it would look nicer with the decorator around it

image

What is your environment?

  • OS: Fedora 42

  • Browser: Chrome

  • Version: 140.0.7339.80


Jira Issue: PF-2650

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start at packages/module/src/components/defs/SVGDefs.tsx line 27 and inspect the Decorator usage in the example-decorator branch. Reproduce with yarn install && yarn run start, yarn run start-console, and the OpenShift Topology page. Done means the decorator renders on the deployment node without the destructuring error.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.