Commit Graph

65 Commits

Author SHA1 Message Date
376291a193 fix(canvas): cover drop regressions and lint 2026-04-03 23:19:58 +02:00
1bf1fd4a1b refactor(canvas): extract drop handling hook 2026-04-03 23:12:30 +02:00
59658cb8be refactor(canvas): extract connection handling hook 2026-04-03 22:59:47 +02:00
81edfa6da7 fix(canvas): reject invalid edge splits before mutation 2026-04-03 22:38:20 +02:00
dee10405d2 refactor(canvas): extract node interaction hook 2026-04-03 22:18:42 +02:00
9fb850f2a4 fix(canvas): align flow reconciliation hook with task plan
Rename the hook test to the planned path, revert the persistent Vitest config tweak, and narrow the hook inputs to reconciliation data plus shared refs. Keep verification working with a temporary test config instead of expanding the repo-level include list.
2026-04-03 22:01:18 +02:00
d1c14c93e5 refactor(canvas): extract flow reconciliation hook
Move Convex-to-local node and edge reconciliation into a dedicated hook so canvas.tsx has a cleaner sync boundary during modularization. Add hook-level tests for optimistic edge carry and drag-lock behavior to preserve the existing UX.
2026-04-03 21:36:02 +02:00
c060c57ad8 refactor(canvas): extract sync engine hook 2026-04-03 21:11:04 +02:00
928fd81904 refactor(canvas): extract flow reconciliation helpers 2026-04-03 20:42:47 +02:00
16ad9e48f4 docs(canvas): remove extraction scratch note 2026-04-03 20:32:33 +02:00
859aad4438 docs(canvas): annotate modularization seams 2026-04-03 20:30:35 +02:00
4fad69a151 fix(canvas): ensure valid source and target node IDs when creating synthetic edges 2026-04-03 20:15:23 +02:00
d320ff47b0 refactor(canvas): extract data and storage url orchestration from canvas 2026-04-03 19:31:05 +02:00
7e1a77c38c refactor(canvas): debounce and extract local snapshot persistence 2026-04-03 19:10:07 +02:00
2542748e82 fix(canvas): align optimistic edge id typing with queue payloads 2026-04-03 18:07:59 +02:00
6cbdfdcb79 Merge branch 'codex/canvas-anpassung' 2026-04-03 14:52:56 +02:00
1fb8fd2863 Refactor canvas storage URL handling and integrate adjustment presets
- Introduced a new `CanvasPresetsProvider` to manage adjustment presets for nodes, enhancing state management and reducing reactivity.
- Updated storage URL resolution to utilize a mutation instead of a reactive query, improving performance and reducing unnecessary re-renders.
- Refactored adjustment nodes (color-adjust, curves, detail-adjust, light-adjust) to use the new preset context for fetching user presets.
- Improved overall canvas functionality by streamlining storage ID collection and URL resolution processes.
2026-04-03 14:52:34 +02:00
3aaad38e06 Enhance canvas sidebar and toolbar with improved UI and state management
- Integrated NextImage for logo display in the canvas sidebar, enhancing visual consistency.
- Updated canvas name handling in the toolbar to ensure proper display and accessibility.
- Refactored sidebar layout for better responsiveness and user experience.
- Improved state management for category collapsibility in the sidebar, allowing for a more intuitive navigation experience.
2026-04-03 13:51:41 +02:00
Matthias
ef98acd0de Enhance adjustment nodes with localized labels and improved state management
- Integrated localization for slider labels and prompts in color-adjust, curves, detail-adjust, and light-adjust nodes.
- Updated preset handling to include user-friendly prompts for saving presets.
- Improved state management for slider values and preset selections, enhancing user experience.
- Added reset actions to adjustment nodes for better control over user adjustments.
2026-04-02 23:56:45 +02:00
Matthias
f5f9753288 Enhance authentication flow with username support and social login placeholders
- Updated sign-in and sign-up pages to allow users to log in with either email or username.
- Added social login options for Google and Apple, currently implemented as placeholders.
- Improved error handling with localized messages for authentication failures.
- Refactored input fields and validation logic to enhance user experience and accessibility.
2026-04-02 23:10:40 +02:00
Matthias
9fa0b8452e Merge origin/master: combine compare URL pipeline with storage fallback
Made-with: Cursor
2026-04-02 22:29:11 +02:00
Matthias
519caefae2 Enhance canvas connection validation and image resolution handling
- Introduced new functions for validating canvas connections, ensuring proper source and target node types.
- Updated edge and node mutation logic to enforce connection policies and improve error handling.
- Enhanced image resolution handling by integrating a new image source resolution function for better URL retrieval.
- Refactored existing validation logic to streamline connection checks and improve maintainability.
2026-04-02 22:27:05 +02:00
8703387617 Enhance canvas functionality with storage URL resolution and debugging improvements
- Added a fallback mechanism for resolving storage URLs in `canvas-helpers.ts`, improving reliability when URLs are not directly available.
- Introduced new utility functions in `canvas.tsx` for summarizing update and resize payloads, enhancing debugging capabilities during canvas operations.
- Updated `compare-node.tsx` to improve state management and rendering logic, allowing for better handling of incoming edges and display modes.
- Refactored `render-node.tsx` to streamline the rendering process and include detailed logging for debugging render operations.
- Updated `.gitignore` to exclude `.kilo` files, ensuring cleaner repository management.
2026-04-02 16:12:56 +02:00
Matthias
f3c5c2d8f1 Enhance canvas functionality with new node types and validation
- Added support for new canvas node types: curves, color-adjust, light-adjust, detail-adjust, and render.
- Implemented validation for adjustment nodes to restrict incoming edges to one.
- Updated canvas connection validation to improve user feedback on invalid connections.
- Enhanced node creation and rendering logic to accommodate new node types and their properties.
- Refactored related components and utilities for better maintainability and performance.
2026-04-02 11:39:05 +02:00
43e3e0544a Add storage ID handling and optimize canvas storage URL retrieval
- Introduced `hasStorageId` function to check for valid storage IDs in canvas nodes.
- Updated `batchGetUrlsForCanvas` query to utilize helper functions for improved readability and maintainability.
- Implemented `assertCanvasOwner`, `listNodesForCanvas`, `collectStorageIds`, and `resolveStorageUrls` to streamline the process of fetching storage URLs associated with a canvas.
- Enhanced query logic to skip unnecessary database calls when no valid storage IDs are present.
2026-04-01 18:41:42 +02:00
79d9092d43 Implement internationalization support across components
- Integrated `next-intl` for toast messages and locale handling in various components, including `Providers`, `CanvasUserMenu`, and `CreditOverview`.
- Replaced hardcoded strings with translation keys to enhance localization capabilities.
- Updated `RootLayout` to dynamically set the language attribute based on the user's locale.
- Ensured consistent user feedback through localized toast messages in actions such as sign-out, canvas operations, and billing notifications.
2026-04-01 18:16:52 +02:00
Matthias
37a346a2b1 Fix spawn-delete race and keep node deletion locked until synced 2026-04-01 11:22:11 +02:00
Matthias
eb5ed06ced Enable offline edge split sync and stabilize local edge state 2026-04-01 11:04:40 +02:00
Matthias
b6187210c7 Enable offline delete and reconnect queue sync 2026-04-01 10:37:20 +02:00
Matthias
da576c1400 Enable offline canvas create sync with optimistic ID remapping 2026-04-01 10:19:50 +02:00
Matthias
32bd188d89 Implement local-first canvas sync and fix drag edge stability 2026-04-01 09:40:31 +02:00
b428f5f4df refactor: modularize canvas component by extracting low-level logic into dedicated helper modules
- Removed unused imports and functions from canvas.tsx to streamline the codebase.
- Introduced several helper modules for improved organization and maintainability, including canvas-helpers, canvas-node-change-helpers, and canvas-media-utils.
- Updated documentation in CLAUDE.md to reflect changes in the canvas architecture and the purpose of new internal modules.
2026-03-31 21:39:15 +02:00
Matthias
3ac8857025 feat: enhance layout and error handling in canvas component
- Added suppressHydrationWarning to RootLayout for improved hydration handling.
- Updated error logging in CanvasInner to use more descriptive parameters, enhancing debugging capabilities.
2026-03-31 15:39:06 +02:00
db98fabcc6 feat: introduce image editing capabilities and enhance canvas component organization
- Added new image editing node types including curves, color adjustment, light adjustment, detail adjustment, and render, expanding the functionality of the canvas.
- Updated the canvas command palette and sidebar to categorize and display new image editing nodes, improving user navigation and accessibility.
- Implemented collapsible categories in the sidebar for better organization of node types, enhancing the overall user experience.
- Refactored canvas components to support the new image editing features, ensuring seamless integration with existing functionalities.
2026-03-29 22:33:59 +02:00
Matthias
81f0b1d7a3 feat: enhance canvas operations with local persistence and optimistic updates
- Introduced local persistence for canvas state, enabling snapshot reading and writing for improved user experience during interactions.
- Added new functions for handling node movement, resizing, and edge creation/removal with optimistic updates, ensuring immediate feedback in the UI.
- Refactored existing logic to streamline node and edge operations, enhancing overall responsiveness and synchronization with the server.
2026-03-29 21:21:39 +02:00
Matthias
5d4ddd3f78 feat: enhance canvas node management with position handling and optimistic updates
- Introduced functions for managing optimistic edge and node IDs, improving synchronization during updates.
- Added position pinning logic to maintain local node positions until server confirmation, enhancing user experience during drag-and-drop operations.
- Implemented signature normalization for edge connections, ensuring consistent handling of node relationships.
- Refactored node merging logic to prioritize local positions, improving responsiveness during user interactions.
2026-03-29 20:37:28 +02:00
Matthias
75ed27b1c3 feat: enhance image handling and node deletion logic in canvas
- Introduced a new function to determine acceptable geometry for node deletion, improving synchronization checks with Convex.
- Added image dimension retrieval for uploaded files, enhancing the handling of image nodes during drag-and-drop operations.
- Updated drag-and-drop functionality to support image uploads, including error handling and user feedback for failed uploads.
- Refactored existing logic to ensure better management of optimistic node states and improve overall user experience on the canvas.
2026-03-28 23:42:12 +01:00
Matthias
2a645b9489 feat: implement node deletion handling and geometry synchronization in canvas
- Added functionality to block node deletion based on synchronization status with Convex, providing user feedback through toast notifications.
- Introduced helper functions to determine reasons for blocking deletions, enhancing user experience during canvas interactions.
- Updated asset node styling to improve visual consistency and adjusted minimum dimensions for asset nodes to ensure better layout management.
2026-03-28 23:07:27 +01:00
Matthias
acb5bca3b8 fix: update canvas toolbar and canvas settings for improved usability
- Updated the CanvasToolbar to provide a clearer label for the scissors tool, enhancing user understanding of its functionality.
- Modified the CanvasInner component to disable grid snapping, allowing for more flexible positioning of elements on the canvas.
2026-03-28 22:47:30 +01:00
Matthias
4e55460792 feat: enhance canvas components with improved sidebar and toolbar functionality
- Updated CanvasSidebar to accept canvasId as a prop, enabling dynamic content based on the current canvas.
- Refactored CanvasToolbar to implement a dropdown menu for adding nodes, improving usability and organization.
- Introduced new node types and updated existing ones in the node template picker for better categorization and searchability.
- Enhanced AssetNode to utilize context for asset browser interactions, streamlining asset management on the canvas.
- Improved overall layout and styling for better user experience across canvas components.
2026-03-28 22:35:44 +01:00
Matthias
e41d3c03b0 feat: add minimum zoom level for canvas to enhance usability
- Introduced a constant for minimum zoom level, allowing users to zoom out further on large boards.
- Updated the CanvasInner component to apply the new minimum zoom setting, improving the overall user experience during canvas interactions.
2026-03-28 22:07:21 +01:00
Matthias
cbfa14a40b feat: enhance canvas functionality with scissors mode and node template updates
- Implemented visual feedback and cursor changes for scissors mode in dark and light themes, improving user interaction during edge manipulation.
- Updated node template picker to include new keywords for AI image generation, enhancing searchability.
- Renamed and categorized node types for clarity, including updates to asset and prompt nodes.
- Added support for video nodes and adjusted related components for improved media handling on the canvas.
2026-03-28 21:11:52 +01:00
Matthias
02f36fdc7b feat: implement scissors mode for edge manipulation on canvas
- Introduced a new scissors mode that allows users to cut edges by clicking or dragging on the canvas.
- Added keyboard shortcuts for toggling scissors mode and canceling actions, enhancing user interaction.
- Implemented visual feedback for the scissors mode, including a preview of the cutting path.
- Refactored edge handling logic to support edge removal during scissors mode, improving dynamic edge management.
2026-03-28 17:56:27 +01:00
Matthias
9694c50195 feat: implement createNodeWithEdgeToTarget mutation for enhanced node connections
- Added a new mutation to create nodes connected to existing nodes, allowing for more dynamic interactions on the canvas.
- Updated the CanvasPlacementContext to include the new mutation, improving the workflow for node creation and edge management.
- Enhanced optimistic updates for immediate UI feedback during node and edge creation processes.
- Refactored related components to support the new connection method, streamlining user interactions.
2026-03-28 17:50:45 +01:00
Matthias
b3a1ed54db feat: implement edge splitting at existing nodes with position updates
- Added a new mutation to split edges at existing nodes, allowing for dynamic edge management during canvas interactions.
- Enhanced the logic to update node positions in a single transaction, improving user experience during edge manipulations.
- Refactored edge handling to support optimistic updates, ensuring smoother UI feedback during edge splits.
- Introduced error handling for edge and node validation to maintain data integrity during operations.
2026-03-28 13:31:41 +01:00
Matthias
fb24205da0 feat: enhance canvas connection handling with custom animation and edge management
- Added a custom connection line component with animation for improved visual feedback during node interactions.
- Implemented CSS animations for temporary connection lines, enhancing the user experience in the canvas.
- Refactored edge creation and removal logic to support optimistic updates, improving performance during node manipulations.
- Introduced a utility function to compute edge reconnections after node deletions, streamlining edge management.
2026-03-28 13:26:47 +01:00
Matthias
4b4d784768 feat: enhance canvas styling and edge handling with glow effects
- Added custom CSS variables for edge stroke and connection line styles in light and dark modes to improve visual consistency.
- Updated edge rendering logic to utilize new styles, enhancing the appearance of temporary edges during interactions.
- Introduced a new utility function for applying glow effects based on source node types, improving the visual feedback of connections.
- Refactored edge mapping to support glow effects, enhancing user experience during node interactions.
2026-03-28 11:02:19 +01:00
Matthias
b243443431 feat: implement createNodeConnectedFromSource functionality for enhanced node creation
- Added a new mutation to create nodes connected to existing nodes, improving the canvas interaction model.
- Updated the CanvasPlacementContext to include createNodeConnectedFromSource, allowing for seamless node connections.
- Refactored the PromptNode component to utilize the new connection method, enhancing the workflow for AI image generation.
- Introduced optimistic updates for immediate UI feedback during node creation and connection processes.
2026-03-28 00:06:45 +01:00
Matthias
83c0073d51 feat: enhance canvas components with clientRequestId for optimistic updates
- Added clientRequestId to various canvas components to support optimistic UI updates during node creation and manipulation.
- Updated the canvas command palette, toolbar, and node components to generate unique clientRequestIds for better tracking of user actions.
- Enhanced the canvas placement context to handle clientRequestId for improved correlation between optimistic and real node IDs.
- Refactored node duplication and creation logic to utilize clientRequestId, ensuring smoother user interactions and state management.
2026-03-27 23:52:51 +01:00
Matthias
6e866f2df6 feat: add cmdk dependency and enhance canvas node creation with edge splitting functionality
- Introduced the cmdk package for improved command palette capabilities.
- Enhanced the canvas placement context to support creating nodes with edge splitting, allowing for more dynamic node interactions.
- Updated the canvas inner component to utilize optimistic updates for node creation, improving user experience during interactions.
- Refactored node handling logic to incorporate new mutation types and streamline data management.
2026-03-27 23:40:31 +01:00