ux: Responsive Auto-Approve

[brunobergher]

Addresses more feedback about the new auto-approve UI:

• That it was too wide in narrow setups
• Some way to see the currently enabled toggles without clicking

Description

• Makes 1 or 2-column layout dependent on available width for the extension
• Includes the currently enabled auto-approved actions in the tooltip. This shows all enabled toggles, which is better than before, where while always visible, it got quickly truncated after 2 or 3 were enabled.

Test Procedure

1. Open the auto-approve dropdown
2. Resize the extension to quite wide and quite narrow

Screenshots / Videos

---

Important

Enhances the auto-approve UI in AutoApproveDropdown.tsx by making it responsive and updating tooltips, with corresponding updates in multiple language files.

• UI Enhancements:
  • AutoApproveDropdown.tsx: Adjust layout to be responsive based on width, switching between 1 or 2 columns.
  • Update tooltip to show all enabled auto-approve actions, improving visibility over previous truncation.
• Internationalization:
  • Update chat.json files across multiple languages (e.g., ca, de, en) to reflect new tooltip text and layout changes.
• Miscellaneous:
  • Minor CSS changes to AutoApproveDropdown.tsx for width and layout adjustments.

^{This description was created by for 68c66f5. You can customize this summary. It will automatically update as commits are pushed.}

[roomote]

Thank you for your contribution! I've reviewed the changes and have some suggestions for improvement. Overall, this is a well-implemented responsive UI improvement that addresses the feedback mentioned in the PR description.