Skip to content

2920 - Add drag and drop support for data pills into property inputs#4212

Open
petrapaz wants to merge 2 commits intomasterfrom
2920
Open

2920 - Add drag and drop support for data pills into property inputs#4212
petrapaz wants to merge 2 commits intomasterfrom
2920

Conversation

@petrapaz
Copy link
Collaborator

fixes: #2920

  • Enable dragging data pills from the Data Pill Panel and dropping them into PropertyMentionsInput editors to insert mention nodes at the drop position. Extract shared validation logic into canInsertMentionForProperty utility to eliminate duplication between click and drop insertion paths.

  • Add visual drop-target feedback (green highlight) on property inputs during drag using isDraggingDataPill state in Zustand store

  • Extract shared validation logic (canInsertMentionForProperty) into encodingUtils.ts to eliminate duplication between click-to-insert and drop-to-insert code paths

  • dynamic value has to be enabled for drag & drop to work

Screencast.from.2026-02-16.16-43-47.webm

Copy link
Collaborator

@kresimir-coko kresimir-coko left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Evo jedan relativno bitan komentar od mog Claude-a (koji ja ne bi uvatija)

1. resolvePath can throw on invalid paths (Medium)

canInsertMentionForProperty calls resolvePath(parameters, resolvedPath), which throws on invalid paths (the object-resolve-path library throws on invalid paths). In the old code this would also bubble up unhandled, but in the new handleDrop code path this could silently break drop behavior. Consider wrapping in a try/catch:

export const canInsertMentionForProperty = (
    propertyType: string,
    parameters: Record<string, unknown>,
    path: string
): boolean => {
    if (propertyType === 'STRING') {
        return true;
    }

    try {
        const resolvedPath = transformPathForObjectAccess(encodePath(path));
        const existingValue = resolvePath(parameters, resolvedPath);

        return !existingValue || String(existingValue).startsWith('=');
    } catch {
        return true;
    }
};

@sonarqubecloud
Copy link

Quality Gate Failed Quality Gate failed for 'client'

Failed conditions
7.1% Coverage on New Code (required ≥ 80%)

See analysis details on SonarQube Cloud

};

const target = event.currentTarget;
const clone = target.cloneNode(true) as HTMLDivElement;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Zanima me, zašto nam triba ovaj clone? Je li možda draggable dovoljan? Prvi put vidin, i čini se okej ali bi volija da i ja i ti znamo zašto nam je cloneNode potreban

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[feature] Drag and drop data pills inside property inputs

2 participants