The accessible name for the "Prompts Panel" button is unclear and not unique.

[derekjackson-das]

Issue Description

The button to open the panel for editing saved prompts is currently labeled as "prompts-menu-trigger". This label is not descriptive of the button's purpose and does not uniquely identify individual prompt buttons among other saved prompts. This can create challenges for screen reader users in identifying and navigating the buttons.

WCAG Criteria

2.4.6 Headings and Labels (Level AA)

Screenshot or Screen Recording

Snippet

html

<button 
    id="prompts-menu-trigger" 
    aria-label="prompts-menu-trigger" 
    class="z-50 inline-flex h-7 w-7 items-center justify-center rounded-md border border-border-medium bg-transparent p-0 text-sm font-medium transition-all duration-300 ease-in-out hover:border-border-heavy hover:bg-surface-secondary focus:border-border-heavy focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" 
    type="button" 
    aria-haspopup="menu" 
    aria-expanded="false" 
    data-state="closed">
    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu icon-md text-text-secondary">
        <line x1="4" x2="20" y1="12" y2="12"></line>
        <line x1="4" x2="20" y1="6" y2="6"></line>
        <line x1="4" x2="20" y1="18" y2="18"></line>
    </svg>
</button>

Notes

The names for these buttons need to be more descriptive and unique, for example:

Descriptive: "Prompt Actions"
Unique: "{{prompt name}} Prompt Actions"
This will ensure clarity and distinguishability for screen reader users.

This is an issue identified by Accessibility issues for screenreader users #5187