Add Opacity to Untouched Nodes

[mitchspano]

Description

When reviewing flow changes in a git diff context, it can be challenging to quickly focus on the modified elements. Adding opacity to untouched nodes would make the changes even more apparent during code review.

Proposed Solution

Add 50% opacity to all nodes that weren't added, modified, or deleted in the diff. Implementation varies by diagram tool:

Mermaid

• Add opacity:.50 to the style class for untouched nodes

Graphviz

• Modify the fillcolor attribute to include alpha channel
• Change from: fillcolor="#F9548A"
• To: fillcolor="#F9548A80" (80 = 50% opacity)

PlantUML

• Similar to Graphviz, add alpha channel to colors
• Change from: #F9548A
• To: #F9548A80

Expected Behavior

• Added nodes: Full opacity + green border
• Modified nodes: Full opacity + orange border
• Deleted nodes: Full opacity + red border
• Unchanged nodes: 50% opacity, no special border

Benefits

• Easier visual distinction between changed and unchanged elements
• Faster code review process
• Better focus on the actual changes in complex flows

Example

Implementation Notes

• This change would only affect diff mode
• The opacity modification should be applied after determining node diff status
• We may need to change the flow parsing logic and introduce a new diff status enum - UNCHANGED

Related Files

• src/main/mermaid_generator.ts
• src/main/graphviz_generator.ts
• src/main/plantuml_generator.ts
• src/main/uml_generator.ts

[soileaud]

Thanks for considering this! I think it would help a lot.