Component Cards - Add copy to clipboard from 3-dot menu

[jmakowski1123]

The Component Cards have a three-dot menu icon. One of the actions from this menu is to "Copy to Clipboard". When a user clicks "copy to clipboard", the component is copied to the clipboard and can be pasted into any course.

[ChrisChV]

@bradenmacdonald @yusuf-musleh Since you have more copy-paste context, can this be done with the copy-paste implemented in edx-platform?

[yusuf-musleh]

@ChrisChV The current copy-paste implementation does not support Libraries it seems, so we would need to extend it (and possible other parts of the codebase) to support it.

[bradenmacdonald]

@ChrisChV Yes, the clipboard/staging API will require some small modifications before it works with library content. Mostly around the problem of static assets, which will work much differently in courses vs. libraries. For the MVP we may just ignore static assets, but it's something we'll have to resolve soon. So if we ignore static assets, it should be pretty easy to get the API to work.

[ChrisChV]

So if we ignore static assets, it should be pretty easy to get the API to work.

Ok, we're going to handle it that way. What do you think @jmakowski1123?

[jmakowski1123]

So if we ignore static assets, it should be pretty easy to get the API to work.

Ok, we're going to handle it that way. What do you think @jmakowski1123?

I think this is ok to get an MVP out the door. I created a story placeholder so we don't forget to prioritize it quickly after the MVP. #1170

[rpenido]

@jmakowski1123 @lizc577 @sdaitzman @marcotuts This is ready for AC testing on the sandbox

[jmakowski1123]

Can we implement the same toast notification as in the course? The notification is in the lower righthand corner, it pops up automatically, and it disappears automatically as soon as the content is in the clipboard. Designs below.

[bradenmacdonald]

@jmakowski1123 We're using Paragon toasts for this project, which always appear in the bottom left and will be consistent with any other toasts in Studio other than on the legacy pages. The design you're showing is a custom thing from the legacy page. If you want us to update the Paragon toasts to propose moving them to the right or something else, we can, but it would be good to make a consistent change for all toasts in Studio and not just this one thing.

[jmakowski1123]

I'm a little confused, I'm currently on the Redwood demo, which is using the new Course Outline MFE, and the experience I'm seeing mirrors the designs rather than the Paragon Toasts...

[bradenmacdonald]

@jmakowski1123 Oh, my mistake. I guess someone implemented the same animation from studio on the outline pages etc. OK, we can show that same animation if you want! Though originally it was a workaround, and I thought you had said a "Copied!" notification that persists for a few seconds was better than a "Copying..." animation that appears so briefly on the screen that you may not be able to read it. We do also have to fix the issue we have now where the animation is on the right but other toasts are on the left.

[jmakowski1123]

For now, let's just focus on getting the copy/paste notification consistent across courses and libraries. We can come back to getting notifications consistent with paragon across the entire studio experience later.

[rpenido]

Hi @jmakowski1123! We updated the sandbox with the new design.
Could you review the change? CC @bradenmacdonald

[jmakowski1123]

Yes, thank you - looks consistent now.

[ChrisChV]

Yes, thank you - looks consistent now.

Thanks @jmakowski1123, It's ready to move this to Done?