Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New column clipboard #5453

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

adriallongarriu
Copy link
Contributor

WHY

I need a be able to copy the content of the column to the clipboard. Basically is a text column with an icon and on click the span copy the content to the clipboard.
Maybe this can be and optional parameter on the basic column text buy for now i created a separated column.
Using a column this can be used in lists and in show view.
On click show a Noty to the user to report whether it was able to be copied or not
image

HOW

How did you achieve that, in technical terms?

Use javascript to copy text to clipboard using await navigator.clipboard.writeText(text);

Is it a breaking change?

No

How can we test the before & after?

Note: on localhost only show the error message. To work need https otherwise the browser will block the action.

  [
        'name'  => 'name',
        'label' => trans('backpack.name'),
        'type' => 'clipboard',
  ],

@o15a3d4l11s2
Copy link
Contributor

o15a3d4l11s2 commented Feb 23, 2024

It is much nicer than the workaround I have used 😅

CRUD::field('name')->type('text')->suffix('<button type="button" class="backpack-copy"><i class="lar la-clipboard"></i></button>')

and then created a clipboard.js file with

$(".backpack-copy").on("click", function () {
    const value = $(this).closest('.input-group').find('input').val();
    if (value) {
        navigator.clipboard.writeText(value);
    }
});

and added it to the CRUD with

Widget::add()->type('script')->content(basset(base_path('resources/js/admin/clipboard.js')));

Update
Just realised you have created a column, not a field.

@karandatwani92
Copy link
Contributor

Hey @adriallongarriu Thanks for coming up with this cool little useful feature. I appreciate your effort & the idea.

Hey @tabacitu @pxpm
How do find the implementation?

@pxpm pxpm removed request for tabacitu and pxpm April 3, 2024 14:05
@pxpm
Copy link
Contributor

pxpm commented Apr 3, 2024

Thanks @adriallongarriu for the PR 🙏

I like the copy feature. I've need it myself, and as @o15a3d4l11s2 showed, he also probably needed it in other contexts.

I am just not sure about the implementation. Should we add this as a new column, or add the copy ability to existing columns ?

I think the later is the most appropriate, as for example you can have a date column with a specific format, and when you copy you expect to copy the formatted date. Or in an upload copy the asset url, not only the displayed text.

I am postponing this decision to v7.

Cheers

@pxpm pxpm added next-version and removed Size: XS 1 hour labels Apr 3, 2024
@pxpm pxpm removed their assignment Apr 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants