How do I check for user permissions within javascript code while using datatable server side processing and laravel

See more:

Javascript

PHP

I'm using Laravel 9 - PHP & Data Table server-side processing to display data, Now I'm getting a challenge in hiding action buttons based on the permissions of the logged-in user.

While using HTML I can simply use for example @can(edit-post) …. @endcan to achieve what I want, But now I want to achieve the same while using JavaScript.

Regards.

What I have tried:

This is my code in the controller;

public function index(Request $request)
    {
        if ($request->ajax()) {
            $data = Unit::all();
            return Datatables::of($data)
                ->addIndexColumn()
                ->addColumn('department', function($row){
                    $department = $row->department->department_name;
                    return $department;
                })

                ->addColumn('action', function($row){
                   $actionButtons = '<a href="#" id="'.$row->id.'" class="btn btn-info btn-sm edit_unit"
                    data-toggle="modal" data-backdrop="static" data-target="#editUnitModal">
                         Edit
                    </a>

                    <a href="#" id="'.$row->id.'" class="btn btn-danger btn-sm delete_unit">
                    ^__i class="fas fa-trash">  Delete
                    </a>';
                    return $actionButtons;
                })
                ->rawColumns(['action'])
                ->make(true);
        }

        $departments = Department::all();
        return view('company_structure.units.index', compact('departments'));
    }

and below is my JavaScript code where i want to apply the conditions;

var table = $('.table_units').DataTable({
        processing: true,
        serverSide: true,
        ajax: "{{ route('company_structure.units.index') }}",
        columns: [
            {data: 'id', name: 'id'},
            {data: 'unit_name', name: 'unit_name'},
            {data: 'about_unit', name: 'about_unit'},
            {data: 'department', name: 'department'},
            {data: 'action', name: 'action', orderable: false, searchable: false },
        ]
    });