+ Start a Discussion
Jacob KillianJacob Killian 

Invalid config for "deleteRecord"

HTML
<template>

    <lightning-card>
    
        <div class="container">

            <main class="main">
                
                <template if:true={artworkData}>
                    
                    <lightning-datatable
                        key-field="artworkID"
                        data={artworkData}
                        columns={columns}
                        hide-checkbox-column="true"
                        onsort={updateColumnSorting}
                        sorted-by={sortedBy}
                        sorted-direction={sortedDirection}
                        onrowaction={handleRowAction}
                    ></lightning-datatable>
                </template>
               
            </main>

        </div>

    </lightning-card>

</template>

Relevent JS (cut out methods for loading/sorting the lighting datatable):
import { LightningElement, api, wire, track } from 'lwc';

import  getWorks  from '@salesforce/apex/ListExhibitionWorks.getWorks';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { deleteRecord } from 'lightning/uiRecordApi';

const ACTIONS = [
    { label: 'Delete', name: 'delete'}
];

const COLUMNS = [
    { label: 'Artwork Title', fieldName: 'artworkURL', type: 'url', sortable: true,
      typeAttributes: {
          label: {fieldName:'artworkTitle'},
          target: '_top'
      }
    },
    { label: 'Artist', fieldName: 'artistURL', type: 'url', sortable: true,
      typeAttributes: {
          label: {fieldName:'artistName'},
          target: '_top'
      }
    },
    { type: 'action',
      typeAttributes: {
          rowActions: ACTIONS,
          menuAlignment: 'right'
      }
    }
];

export default class ListExhibitionArtworks extends LightningElement {
    @api recordId;
    @track columns = COLUMNS;
    artworkTitle;
    artworkURL;
    artistName;
    artistURL;
    artworkData = [];

    handleRowAction(event) {
        try {
            const action = event.detail.action;
            const row = event.detail.row;
            console.log("Action: " + action.name);
            let thisExhibitionWorkId = JSON.stringify(row['exhibitionWorkId']);
            console.log("Exhibition Work Id to delete: " + thisExhibitionWorkId);
            
            switch(action.name) {
                case 'delete':
                    console.log("deleting..." + thisExhibitionWorkId);
                    try {
                        deleteRecord(thisExhibitionWorkId).then(result => {
                            console.log("Deleted." + result);
                            this.dispatchEvent(
                                new ShowToastEvent({
                                    title: 'Success',
                                    message: 'Record deleted successfully',
                                    variant: 'success'
                                })
                            );
                
                            // To delete the record from UI
                            for(let work in this.artworkData){
                                if(this.artworkData[work].Id == thisExhibitionWorkId){
                                    this.artworkData.splice(work, 1);
                                    break;
                                }
                            }
                        }).catch(error => {
                            console.log("Error deleting: " + error.message);
                        });
                    }catch(ex) {
                        console.log(ex.message);
                    }
                    break;
            }
        } catch(ex) {
            console.log(ex.message);
        }
    }

}

thisExhibitionWorkId is making it to the handleRowAction callback.

But I keep getting "Invalid config" error message.  I'm not sure what I'm missing here.