Add copy button for TD affordances (actions, properties, events) by AyushPrakash414 · Pull Request #181 · eclipse-editdor/editdor

AyushPrakash414 · 2026-01-09T13:38:48Z

Fixes #57

This PR adds a copy button for Thing Description affordances (actions, properties, and events) in the visual editor.

Users can now duplicate similar affordances directly from the UI without switching to the JSON editor, improving usability and workflow efficiency.

netlify · 2026-01-09T13:38:55Z

✅ Deploy Preview for editdor ready!

Name	Link
🔨 Latest commit	`6156d33`
🔍 Latest deploy log	https://app.netlify.com/projects/editdor/deploys/6964ce1c488bb40008b9d8c9
😎 Deploy Preview	https://deploy-preview-181--editdor.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

egekorkan

handleCopyXXX functions can be refactored to not copy paste the same thing
You need to sign your commits and link your Eclipse account. Make sure to read https://github.com/eclipse/editdor/blob/master/CONTRIBUTING.md
It would be muuuch better if the new affordance is just under the copied affordance. With longer TDs, it is very difficult to find it. Also, there is no visual confirmation that a new affordance is added.

Signed-off-by: Ayush <prakashayush414@gmail.com>

AyushPrakash414 · 2026-01-12T10:57:42Z

handleCopyXXX functions can be refactored to not copy paste the same thing

You need to sign your commits and link your Eclipse account. Make sure to read https://github.com/eclipse/editdor/blob/master/CONTRIBUTING.md

It would be muuuch better if the new affordance is just under the copied affordance. With longer TDs, it is very difficult to find it. Also, there is no visual confirmation that a new affordance is added.

Changes include:

Refactored affordance copy logic into a shared helper
Insert copied affordance directly below the original
Added visual confirmation via auto-expand and scroll

All commits are signed and Eclipse Contributor Agreement requirements are fulfilled.

AyushPrakash414 · 2026-01-16T12:25:22Z

Hi @egekorkan
Just a gentle follow-up on this PR.
Please let me know if any changes or improvements are needed from my side.
Thanks for your time!

egekorkan · 2026-01-19T11:17:57Z

@AyushPrakash414 much better, thank you! I think the visual confirmation should be a bit more pronounced. Even with the expectation how this should work, I had to double check (<1s for me). Maybe highlighting the new affordance would be nice, like an animation.

Also, code formatting check is failing :)

TejInaco · 2026-01-19T16:15:36Z

Hello @AyushPrakash414 thanks for your contribution. The initial feedback is:

Please run: yarn format to fix the formatting errors. To check if the pipeline will failed, locally you can do a double check by running yarn prettier --check .
Your account seems confirmed by the Eclipse Foudantion, then you have to edit your commits in this PR to sign them all, in your terminal git rebase --exec "git commit --amend --no-edit -S" HEAD~2 and then you can do a push --force-with-lease. Be aware there is a difference between the -s and -S flag in git commit 👍
We are pushing to increase the tests in our codebase. So far all the files under utils folder must have unit tests. Create a copyAffordance.test.ts file and do the unit tests for your function. If you are using vscode, the extension vite is very useful.

A review will follow. Thanks!

Signed-off-by: Ayush <prakashayush414@gmail.com>

netlify · 2026-02-23T17:20:47Z

✅ Deploy Preview for editdor ready!

Name	Link
🔨 Latest commit	`42099cd`
🔍 Latest deploy log	https://app.netlify.com/projects/editdor/deploys/699fe01bd82fe60008b68e0d
😎 Deploy Preview	https://deploy-preview-181--editdor.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

AyushPrakash414 · 2026-02-23T17:22:44Z

Hi @TejInaco and @egekorkan,

Thank you for the feedback.
I have now:

✅ Signed all commits using GPG (-S)
✅ Fixed formatting issues
✅ Added unit tests for copyAffordance
✅ Ensured all tests pass locally

Please let me know if any further improvements are needed.

TejInaco

Theres is some pending comments. Just small details. Good work @AyushPrakash414 . After the fix for those small details it is ready to be merged

TejInaco · 2026-01-20T10:54:19Z

src/utils/copyAffordance.ts

+ * SPDX-License-Identifier: EPL-2.0 OR W3C-20150513
+ ********************************************************************************/
+
+type Section = "actions" | "properties" | "events";


This type is defined in the IntersectionSection.tsx. You can move it to global.d.ts file now that is used in more files. And use the type InteractionKey in this file.

TejInaco · 2026-01-20T11:32:36Z

src/components/TDViewer/components/Action.tsx

+            </button>
+
+            <button
+              className="flex h-10 w-10 items-center justify-center self-stretch rounded-bl-md rounded-tr-md bg-gray-400 text-base"


Change to rounded-tr-lg instead of md. The rounded-bl-md should be in copy button, change it to -lg as well. The event.tsx and property.tsx files need the same updates

TejInaco · 2026-01-20T11:44:32Z

src/components/TDViewer/components/Event.tsx

+              <Copy size={16} color="white" />
+            </button>
+
+            {/* DELETE BUTTON */}


Delete these comment. it is unnecessary. Please update the other files as well

TejInaco · 2026-01-20T11:44:43Z

src/components/TDViewer/components/Event.tsx

-            <Trash2 size={16} color="white" />
-          </button>
+          <>
+            {/* COPY BUTTON */}


Delete these comment. it is unnecessary. Please update the other files as well

AyushPrakash414 · 2026-02-26T06:04:23Z

Hi @TejInaco,

Thanks for the review!

Moved InteractionKey type to global definitions
Updated button border radius
Removed unnecessary comments
All tests and formatting checks pass

The PR is now ready for review.

TejInaco

Good work @AyushPrakash414, almost there. See the pending comments and marked them when you commit your changes

TejInaco · 2026-02-27T11:32:02Z

src/components/TDViewer/components/Property.tsx

-    [key: string]: any;
-  };
-  propName: string;
-}


@AyushPrakash414 Can you explain why did you delete the IProperty?

TejInaco · 2026-02-27T11:33:34Z

src/components/TDViewer/components/Property.tsx

-    contentType: string;
-    actualIndex: number;
-    [key: string]: any;
-  }[] = separateForms(structuredClone(props.prop.forms));


Revert this change. Sometimes enforce typescript types is necessary.

TejInaco · 2026-02-27T11:35:54Z

src/components/TDViewer/components/Property.tsx

-          >
-            <Trash2 size={16} color="white" />
-          </button>
+          <>


Make a subcomponent with the buttons, to be able to reuse it in these 3 files. It will reduce the duplication of code

egekorkan requested changes Jan 9, 2026

View reviewed changes

Add copy button for TD affordances (actions, properties, events)

d2879cf

Signed-off-by: Ayush <prakashayush414@gmail.com>

AyushPrakash414 force-pushed the feature/copy-affordance branch from c92bfab to d2879cf Compare January 12, 2026 09:48

egekorkan requested a review from TejInaco January 19, 2026 11:18

TejInaco assigned AyushPrakash414 Jan 20, 2026

TejInaco marked this pull request as draft February 19, 2026 16:27

AyushPrakash414 added 3 commits February 23, 2026 22:49

Refactor affordance copy logic and improve UX

342a433

Signed-off-by: Ayush <prakashayush414@gmail.com>

chore: apply prettier formatting

1edd605

fix: finalize copy affordance logic and tests

49204b6

AyushPrakash414 force-pushed the feature/copy-affordance branch from 6156d33 to 49204b6 Compare February 23, 2026 17:20

TejInaco requested changes Feb 25, 2026

View reviewed changes

refactor: address review UI comments

42099cd

AyushPrakash414 marked this pull request as ready for review February 26, 2026 05:58

TejInaco requested changes Feb 27, 2026

View reviewed changes

TejInaco marked this pull request as draft February 27, 2026 11:37

Conversation

AyushPrakash414 commented Jan 9, 2026

Uh oh!

netlify bot commented Jan 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for editdor ready!

Uh oh!

egekorkan left a comment

Choose a reason for hiding this comment

Uh oh!

AyushPrakash414 commented Jan 12, 2026

Uh oh!

AyushPrakash414 commented Jan 16, 2026

Uh oh!

egekorkan commented Jan 19, 2026

Uh oh!

TejInaco commented Jan 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

netlify bot commented Feb 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for editdor ready!

Uh oh!

AyushPrakash414 commented Feb 23, 2026

Uh oh!

TejInaco left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

TejInaco Jan 20, 2026

Choose a reason for hiding this comment

Uh oh!

TejInaco Jan 20, 2026

Choose a reason for hiding this comment

Uh oh!

TejInaco Jan 20, 2026

Choose a reason for hiding this comment

Uh oh!

TejInaco Jan 20, 2026

Choose a reason for hiding this comment

Uh oh!

AyushPrakash414 commented Feb 26, 2026

Uh oh!

TejInaco left a comment

Choose a reason for hiding this comment

Uh oh!

TejInaco Feb 27, 2026

Choose a reason for hiding this comment

Uh oh!

TejInaco Feb 27, 2026

Choose a reason for hiding this comment

Uh oh!

TejInaco Feb 27, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

netlify bot commented Jan 9, 2026 •

edited

Loading

TejInaco commented Jan 19, 2026 •

edited

Loading

netlify bot commented Feb 23, 2026 •

edited

Loading

TejInaco left a comment •

edited

Loading