feat: implement tab close functionality with i18n support #2049
Conversation
losingle
commented
Apr 17, 2025
losingle
commented
- Add right-click close functionality for tabs
- Add 'Close tab' translations for multiple languages including:
- English
- Chinese (Simplified & Traditional)
- Japanese
- Korean
- French
- Spanish
- German
- Russian
- Improve UI button text (simplify Home/Back/Switch buttons) - Refine Experitest related translations - Update refresh source related text to be more intuitive - Keep data center names in English (US-West/East, EU-Central) - Improve clarity and consistency of translations
- Add right-click close functionality for tabs - Add 'Close tab' translations for multiple languages including: - English - Chinese (Simplified & Traditional) - Japanese - Korean - French - Spanish - German - Russian
github-actions
bot
added
enhancement
| "Key": "Key", | ||
| "Secret": "Secret" | ||
| "Secret": "Secret", | ||
| "Close tab": "Close tab" |
There was a problem hiding this comment.
It is enough to only add English resources. localized resources are synchronized automatically to crowdin as soon as the PR is merged and should not be changed manually.
There was a problem hiding this comment.
First of all, thank you for the PR!
It looks like you are mixing up two different sets of tabs - one is used for switching between server types (Appium server & any cloud providers), and the other is used for session builder tabs (session builder, saved sets, attach to session). I would suggest only including changes for the former in this PR.
I do think the added functionality is useful, but a) it changes the regular right-click behavior that applies elsewhere in the app, and b) it may be less hacky to implement antd's own tab close button functionality.
| const [activeTab, setActiveTab] = useState(SESSION_BUILDER_TABS.CAPS_BUILDER); | ||
|
|
||
| const isAttaching = tabKey === 'attach'; | ||
| const isAttaching = serverType === 'attach'; |
There was a problem hiding this comment.
Not sure why this was changed. tabKey is used for session builder tabs, but serverType is used for the server type tabs.
| bindWindowClose(); | ||
| switchTabs(SESSION_BUILDER_TABS.CAPS_BUILDER); | ||
| await getSavedSessions(); | ||
| await setVisibleProviders(); |
There was a problem hiding this comment.
Is there a reason why this was removed?
| } = props; | ||
|
|
||
| const navigate = useNavigate(); | ||
| const [activeTab, setActiveTab] = useState(SESSION_BUILDER_TABS.CAPS_BUILDER); |
There was a problem hiding this comment.
I don't quite see the reason in adding this, along with handleTabChange and handleSwitchTabs. Switching session builder tabs is also not related to the server type tab closing functionality.
| tabKey, | ||
| switchTabs, | ||
| serverType, | ||
| setServerType, |
There was a problem hiding this comment.
No such function exists. You probably wanted to use changeServerType
| { | ||
| key: 'closeTab', | ||
| label: t('Close tab'), | ||
| onClick: () => handleCloseTab(tabKey), |
There was a problem hiding this comment.
Unfortunately this action will also trigger handleSelectServerTab, which will try to select the same tab that was just removed
3 participants
