Implement configurable line types with independent force, color, and thickness controls #63
Conversation
This file contains hidden or 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
…thickness controls Added a comprehensive line type system that allows users to create multiple independent connection types with separate controls for: **Force Configuration:** - Enable/disable force for node positioning - Adjustable strength (0-100%) - Configurable base distance (30-200px) **Visual Configuration:** - Color picker for line appearance - Opacity control (0-100%, allows invisible lines) - Thickness multiplier (0-100%) **Data Source Mapping:** - Each line type can use different relationship data sources - Weighted combination of semantic similarity, filesystem proximity, code references **Default Line Types:** - Code Connections: Visible imports/calls with strong force - Semantic Clustering: Invisible semantic grouping with moderate force - Filesystem Structure: Optional filesystem-based connections **UI Enhancements:** - Tabbed controls interface (Visual Features | Line Types) - Dynamic add/remove line types - Live configuration updates - Comprehensive controls for each line type This enables scenarios like invisible semantic clustering that positions nodes without visual clutter, while visible call graphs show relationships without affecting layout. Mentat precommit script failed. Log: https://mentat.ai/gh/AbanteAI/repo-visualizer/log/d7019731-55ec-4f90-888e-05ebaa150f26 Co-authored-by: jakethekoenig <[email protected]>
Fixed critical JSX syntax errors in UnifiedVisualizationControls.tsx and updated RepositoryGraph.tsx to use the new line type system consistently. Key fixes: - Properly structured React components with correct JSX closing tags - Updated config update effect to use new generateLinksForLineTypes function - Fixed link visual properties to use getLinkVisualProperties helper - Removed references to deprecated getLinkColor function The line types system now works correctly with: - Independent force and visual configuration - Tabbed interface for features vs line types - Real-time updates when changing line type settings - Default line types for common use cases Successfully tested - the application builds and runs without errors. Mentat precommit script passed. Log: https://mentat.ai/gh/AbanteAI/repo-visualizer/log/e94382ae-b4f0-4eb7-8ca5-b0f29d7d14dd Co-authored-by: jakethekoenig <[email protected]>
Removed unused imports (calculateEdgeStrength, calculateEdgeWidth) from RepositoryGraph.tsx that were causing TypeScript warnings. Fixed D3 link key function to include lineTypeId, preventing conflicts when multiple line types connect the same source-target pair. This ensures each line type renders independently even when they share the same endpoints. Changes: - Removed calculateEdgeStrength and calculateEdgeWidth from imports - Updated D3 data key function to include lineTypeId for unique link identification - TypeScript compilation passes without errors or warnings This completes the line types implementation with proper handling of multiple independent connection types. Mentat precommit script passed. Log: https://mentat.ai/gh/AbanteAI/repo-visualizer/log/ba1da941-ca4b-4a0c-8dab-67411e6072d4 Co-authored-by: jakethekoenig <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Adds a comprehensive line type system that allows users to create multiple independent connection types with separate controls for positioning and visual appearance.
Key Features
Independent Configuration per Line Type:
Default Line Types:
Enhanced UI:
Use Cases Enabled
Technical Implementation
LineTypeinterface with force/visual/data source configurationgenerateLinksForLineTypesfunction replacing legacy edge processingThis enables the requested functionality where users can have "as many kinds of lines as they want" with independent control over force (positioning), color (visibility), and thickness (visual weight) attributes.
🤖 This PR was created with Mentat. See my steps and cost here ✨