Code review improvements: fix typo, validation, accessibility, and event handling

[Copilot]

Applied code review improvements to the context menu feature for tab buttons.

Changes

Critical fixes:

• Renamed tab-title-mdal.tsx → tab-title-modal.tsx (filename typo)
• Added validation to prevent empty/whitespace-only tab titles
• Fixed event propagation on close button preventing unintended context menu triggers

Code quality:

• Wrapped useClickOutside handler with useCallback to prevent unnecessary re-renders
• Wrapped modal inputs in proper <form> element with semantic submit handling

Accessibility:

• Added ARIA attributes: role="menu", role="dialog", aria-modal, aria-label, aria-labelledby
• Added required attribute to title input for native validation

Example

Before:

<button onClick={handleSubmit(handleChangeTabTitle)}>Save</button>

After:

<form onSubmit={handleSubmit(handleChangeTabTitle)}>
  <input aria-label="Tab title" required />
  <button type="submit">Save</button>
</form>

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.