Can I have a button on an LWC that launches a Quick Action for the object?

Question

I have a custom LWC that is rendered on a record page. I'd like to have some buttons on it that launch quick actions that launches another LWCs for the same record as modals. I haven't been able to find out if that's possible. There are so many hits from years ago saying LWC don't support quick actions year and use aura instead; and so many hits on launching LWCs from quick actions, the opposite of what I want. I haven't been able to find the answer by searching.

I know I can put an action on the Highlights panel and conditionally render it when the dynamic option is enabled. But I'd really like to keep all our buttons to launch various tasks in our own component.

I could add code to your LWC to render modals but I think it would be cleaner if I could simply launch an action that a launched they other LWC standalone so it doesn't have to be coded as a modal.

Answer 1

You can definitely achieve this but i didn't found any documented approach. I did it using URL hack approach and converting it to code.

Check the sample code for this specific to action on opportunity, you can change it to dynamic:-

<template>
    <lightning-button variant="brand" label="Invoke LWC button" title="Invoke LWC button" onclick={handleLwcClick}>
    </lightning-button>
    <lightning-button variant="brand" label="Invoke Aura button" title="Invoke Aura button" onclick={handleAuraClick}>
    </lightning-button>
    <lightning-button variant="brand" label="Invoke Standard Quick Action" title="Invoke Standard Quick Action" onclick={handleQuickClick}>
    </lightning-button>
</template>

JS

import { LightningElement, api } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
export default class InvokeCustomButton extends NavigationMixin(LightningElement) {
    apiName;
    @api recordId;
    @api objectApiName;
    get pagereference() {
        return {
            "type": "standard__quickAction",
            "attributes": {
                "apiName": this.apiName
            },
            "state": {
                "objectApiName": this.objectApiName,
                "context": "RECORD_DETAIL",
                "recordId": this.recordId,
                "backgroundContext": "/lightning/r/Opportunity/" + this.recordId + "/view"
            }
        }
    }
    handleLwcClick() {
        this.apiName = this.objectApiName+'.LWC_Button';
        this[NavigationMixin.Navigate](this.pagereference, true);
    }

    handleAuraClick() {
        this.apiName = this.objectApiName+'.Aura_comp';
        this[NavigationMixin.Navigate](this.pagereference, true);
    }

    handleQuickClick() {
        this.apiName = 'Global.NewNote';
        this[NavigationMixin.Navigate](this.pagereference, true);
    }
}

Read more here: https://salesforcediaries.com/2024/06/09/url-hack-open-button-and-action-from-lwc/