From 93e43067de6aa48d71e1fbb0cbb4168a6949a926 Mon Sep 17 00:00:00 2001 From: Eugene Date: Mon, 16 Jun 2025 23:23:37 +0200 Subject: [PATCH] fixed #9953 - use ng-bootstrap tooltips --- tabby-core/src/components/appRoot.component.pug | 11 ++++++----- tabby-core/src/components/tabHeader.component.pug | 1 - tabby-core/src/components/transfersMenu.component.pug | 2 +- tabby-core/src/index.ts | 7 ++++++- .../src/components/searchPanel.component.pug | 10 +++++----- 5 files changed, 18 insertions(+), 13 deletions(-) diff --git a/tabby-core/src/components/appRoot.component.pug b/tabby-core/src/components/appRoot.component.pug index c3480079..59ef961f 100644 --- a/tabby-core/src/components/appRoot.component.pug +++ b/tabby-core/src/components/appRoot.component.pug @@ -35,7 +35,8 @@ title-bar( [@animateTab]='{value: "in", params: {size: targetTabSize}}', [@.disabled]='hasVerticalTabs() || !config.store.accessibility.animations', (click)='app.selectTab(tab)', - [class.fully-draggable]='hostApp.platform !== Platform.macOS' + [class.fully-draggable]='hostApp.platform !== Platform.macOS', + [ngbTooltip]='tab.customTitle || tab.title' ) .btn-group.background @@ -43,7 +44,7 @@ title-bar( *ngFor='let button of leftToolbarButtons' ) button.btn.btn-secondary.btn-tab-bar( - [title]='button.label', + [ngbTooltip]='button.label', (click)='button.run && button.run()', [fastHtmlBind]='button.icon' ) @@ -55,7 +56,7 @@ title-bar( ) button.btn.btn-secondary.btn-tab-bar( [hidden]='activeTransfers.length == 0', - title='File transfers', + [ngbTooltip]='"File transfers"|translate', ngbDropdownToggle ) !{require('../icons/transfers.svg')} transfers-menu( @@ -75,14 +76,14 @@ title-bar( *ngFor='let button of rightToolbarButtons' ) button.btn.btn-secondary.btn-tab-bar( - [title]='button.label', + [ngbTooltip]='button.label', (click)='button.run && button.run()', [fastHtmlBind]='button.icon' ) button.btn.btn-secondary.btn-tab-bar.btn-update( *ngIf='updatesAvailable', - title='Update available - Click to install', + [ngbTooltip]='"Update available - Click to install"|translate', (click)='updater.update()' ) !{require('../icons/gift.svg')} diff --git a/tabby-core/src/components/tabHeader.component.pug b/tabby-core/src/components/tabHeader.component.pug index c4884b72..52115417 100644 --- a/tabby-core/src/components/tabHeader.component.pug +++ b/tabby-core/src/components/tabHeader.component.pug @@ -13,7 +13,6 @@ profile-icon( ) .name( - [title]='tab.customTitle || tab.title', [class.no-hover]='config.store.terminal.hideCloseButton && config.store.terminal.hideTabOptionsButton' cdkDrag, cdkDragRootElement='tab-header', diff --git a/tabby-core/src/components/transfersMenu.component.pug b/tabby-core/src/components/transfersMenu.component.pug index ca73a41f..9f1e9814 100644 --- a/tabby-core/src/components/transfersMenu.component.pug +++ b/tabby-core/src/components/transfersMenu.component.pug @@ -5,7 +5,7 @@ .icon(*ngIf='isDownload(transfer)') !{require('../icons/download.svg')} .icon(*ngIf='!isDownload(transfer)') !{require('../icons/upload.svg')} .main - label.no-wrap([title]='transfer.getName()') {{transfer.getName()}} + label.no-wrap([ngbTooltip]='transfer.getName()') {{transfer.getName()}} ngb-progressbar([type]='transfer.isComplete() ? "success" : transfer.isCancelled() ? "danger" : "info"', [value]='getProgress(transfer)') .metadata .size {{transfer.getSize()|filesize}} diff --git a/tabby-core/src/index.ts b/tabby-core/src/index.ts index 79a02f58..4854f7f5 100644 --- a/tabby-core/src/index.ts +++ b/tabby-core/src/index.ts @@ -2,7 +2,7 @@ import { NgModule, ModuleWithProviders, LOCALE_ID } from '@angular/core' import { BrowserAnimationsModule } from '@angular/platform-browser/animations' import { CommonModule } from '@angular/common' import { FormsModule } from '@angular/forms' -import { NgbModule } from '@ng-bootstrap/ng-bootstrap' +import { NgbModule, NgbTooltipConfig } from '@ng-bootstrap/ng-bootstrap' import { NgxFilesizeModule } from 'ngx-filesize' import { DragDropModule } from '@angular/cdk/drag-drop' import { TranslateModule, TranslateCompiler, TranslateService, MissingTranslationHandler } from '@ngx-translate/core' @@ -155,6 +155,7 @@ export default class AppModule { // eslint-disable-line @typescript-eslint/no-ex platform: PlatformService, hotkeys: HotkeysService, commands: CommandService, + ngbTooltipConfig: NgbTooltipConfig, public locale: LocaleService, private translate: TranslateService, private profilesService: ProfilesService, @@ -201,6 +202,10 @@ export default class AppModule { // eslint-disable-line @typescript-eslint/no-ex commands.run('core:profile-selector', {}) } }) + + ngbTooltipConfig.openDelay = 750 + ngbTooltipConfig.placement = 'top bottom auto' + ngbTooltipConfig.container = 'body' } async showSelector (provider: ProfileProvider): Promise { diff --git a/tabby-terminal/src/components/searchPanel.component.pug b/tabby-terminal/src/components/searchPanel.component.pug index c532d31a..55820df1 100644 --- a/tabby-terminal/src/components/searchPanel.component.pug +++ b/tabby-terminal/src/components/searchPanel.component.pug @@ -16,14 +16,14 @@ ng-container(*ngIf='state.resultCount > 0') button.btn.btn-link( (click)='findPrevious()', - ngbTooltip='Search up', + [ngbTooltip]='"Search up"|translate', placement='bottom', [fastHtmlBind]='icons.arrowUp' ) button.btn.btn-link( (click)='findNext()', - ngbTooltip='Search down', + [ngbTooltip]='"Search down"|translate', placement='bottom', [fastHtmlBind]='icons.arrowDown' ) @@ -34,7 +34,7 @@ button.btn( (click)='options.caseSensitive = !options.caseSensitive; saveSearchOptions()', [class.btn-link]='!options.caseSensitive', [class.btn-info]='options.caseSensitive', - ngbTooltip='Case sensitivity', + [ngbTooltip]='"Case sensitivity"|translate', placement='bottom', [fastHtmlBind]='icons.case' ) @@ -43,7 +43,7 @@ button.btn( (click)='options.regex = !options.regex; saveSearchOptions()', [class.btn-link]='!options.regex', [class.btn-info]='options.regex', - ngbTooltip='Regular expression', + [ngbTooltip]='"Regular expression"|translate', placement='bottom', [fastHtmlBind]='icons.regexp' ) @@ -52,7 +52,7 @@ button.btn( (click)='options.wholeWord = !options.wholeWord; saveSearchOptions()', [class.btn-link]='!options.wholeWord', [class.btn-info]='options.wholeWord', - ngbTooltip='Whole word', + [ngbTooltip]='"Whole word"|translate', placement='bottom', [fastHtmlBind]='icons.wholeWord' )