Hello everyone,
I want to create a search mechanism where I can show all the contact related to an account, In that I want an extra column too. In that column I want to give an edit button.
I am able to create the search mechanism but not the edit button part.
Can anyone help me, below is my code.


Vs code for getting Data\


public with sharing class AccountContacts {
    @AuraEnabled(cacheable=true)
   public static List<Contact> fetchContact(String search){
        String searchkey='%'+search+'%';
      return [SELECT FirstName, LastName, Email, Phone, AM_Asgn_Office_Country_c__c  FROM Contact WHERE Account.Name LIKE :searchkey];
       
    }
}



Code for creating search mechanism

Html part

<template>
   
    <lightning-input placeholder="Enter the Account Name" onkeyup={handleinput}></lightning-input>
    <lightning-datatable key-field="id" data={ContactData} columns={columns}></lightning-datatable>


</template>

js part

import { LightningElement } from 'lwc';
import getContact from '@salesforce/apex/AccountContacts.fetchContact';

const cols = [

    {
        label : "FirstName",
        fieldName: "FirstName",
        type: 'text'
    },
    {
        label : "LastName",
        fieldName: "LastName",    
        type: 'text'
    },
    {
        label : "Email",
        fieldName: "Email",
        type:"Email"
    },
    {
        label : "Mobile",
        fieldName: "Phone",
        type:"Phone"
    },
   
    {
        label : "Office Country",
        fieldName: "AM_Asgn_Office_Country_c__c",
        type:"text"
    },
    {
        label : "Action",
        fieldName: "contactName",
        type:"url",
        typeAttributes: { label: { fieldName: 'Name' },  tooltip:"Name", target: '_blank'}
    }

];
export default class AccountContacts extends LightningElement
{
    ContactData;
    ContactError;
    columns=cols;
    key;

    handleinput(event)
    {
        this.key=event.target.value;
        this.fetchContactinfo();
    }
    fetchContactinfo()
    {
        getContact({search : this.key})
        .then(data=>
        {
            let resultdata=[];
            data.forEach(dataitem =>{
                let tempdata={};
                tempdata=Object.assign({},dataitem);
               
               
                //to hyperlink the contact itself
                tempdata.contactName = '/'+dataitem.Id;

                //to hyperlink the account
                // if(dataitem.Account){
                //     tempdata.accountName = '/'+dataitem.AccountId;
                //     tempdata.accName=dataitem.Account.Name;
                // }
               
                resultdata.push(tempdata);
            });
            console.table(resultdata);
            this.ContactData=resultdata;
           
        })
        .catch(error=>
            {
                this.ContactError=error;
        })
    }

}