Skip to content

[Feature]: Implement B-spline SVG path component for workflow links #15

Description

@LudoBroche

Tip

The Feature

  • As a: developer working on the workflow visualization
  • I want to: implement an isolated SVG component/function that generates a smooth B-spline from a provided array of coordinates
  • So that: the rendering engine can draw smooth links between nodes by simply passing the start, turn, and end points to this object, without coupling it to the routing or JSON parsing logic.

Note

Scope & Boundaries

  • In Scope:
    • Creating the function/object that accepts an ordered list of coordinate tuples (e.g., [(x1, y1), (x2, y2), ... (xn, yn)])
    • Generating the SVG element string.
    • Translating the given coordinate points into the correct Bezier/B-spline path commands for the d attribute (e.g., M, C, S).
    • Applying basic necessary styling (e.g., fill="none", stroke="black").
  • Out of Scope: Parsing the ewoks JSON file.
    • Calculating the actual routing paths, start/end coordinates, or avoiding collisions.
    • Rendering the tasks/nodes themselves.

Important

Acceptance Criteria
The feature is considered complete and ready to ship when:

  • The component successfully accepts an array of coordinates and returns a syntactically valid SVG element.
  • The generated d attribute correctly formats a smooth curve (using bezier curve commands) that passes through or is guided by the provided control points.
  • The output can be dropped directly into an tag and renders the expected curve without errors.
  • Unit tests verify the component handles minimal inputs (e.g., just a start and end point) and complex inputs (multiple turns) without crashing.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Fields

No fields configured for feature.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions