fix: more tooltips (#6767)

2025-01-23 03:49:49 +00:00 · 2024-09-30 20:46:49 +07:00 · 2024-09-30 20:46:49 +07:00 · 9fac238d56
commit 9fac238d56
parent 6b68b7f90a
13 changed files with 57 additions and 11 deletions
--- a/packages/ui/lang/en.json
+++ b/packages/ui/lang/en.json
@ -89,6 +89,9 @@
    "Selected": "Selected:",
    "Submit": "Submit",
    "NextStep": "Next step",
-    "TypeHere": "Type here..."
+    "TypeHere": "Type here...",
+    "FullSize": "Full size",
+    "UseMaxWidth": "Max width",
+    "Sidebar": "Sidebar"
  }
 }
--- a/packages/ui/lang/es.json
+++ b/packages/ui/lang/es.json
@ -89,6 +89,9 @@
    "Selected": "Seleccionado:",
    "Submit": "Enviar",
    "NextStep": "Siguiente paso",
-    "TypeHere": "Escribe aquí..."
+    "TypeHere": "Escribe aquí...",
+    "FullSize": "Tamaño completo",
+    "UseMaxWidth": "Ancho máximo",
+    "Sidebar": "Barra lateral"
  }
 }
--- a/packages/ui/lang/fr.json
+++ b/packages/ui/lang/fr.json
@ -89,6 +89,9 @@
    "Selected": "Sélectionné :",
    "Submit": "Soumettre",
    "NextStep": "Étape suivante",
-    "TypeHere": "Tapez ici..."
+    "TypeHere": "Tapez ici...",
+    "FullSize": "Taille réelle",
+    "UseMaxWidth": "Largeur maximale",
+    "Sidebar": "Barre latérale"
  }
 }
--- a/packages/ui/lang/pt.json
+++ b/packages/ui/lang/pt.json
@ -89,6 +89,9 @@
    "Selected": "Selecionado:",
    "Submit": "Enviar",
    "NextStep": "Seguinte passo",
-    "TypeHere": "Escreva aqui..."
+    "TypeHere": "Escreva aqui...",
+    "FullSize": "Tamanho completo",
+    "UseMaxWidth": "Largura máxima",
+    "Sidebar": "Barra lateral"
  }
 }
--- a/packages/ui/lang/ru.json
+++ b/packages/ui/lang/ru.json
@ -89,6 +89,9 @@
    "Selected": "Выбрано:",
    "Submit": "Отправить",
    "NextStep": "Следующий шаг",
-    "TypeHere": "Вводите здесь..."
+    "TypeHere": "Вводите здесь...",
+    "FullSize": "Полный размер",
+    "UseMaxWidth": "Максимальная ширина",
+    "Sidebar": "Боковая панель"
  }
 }
--- a/packages/ui/lang/zh.json
+++ b/packages/ui/lang/zh.json
@ -89,6 +89,9 @@
    "Selected": "已选：",
    "Submit": "提交",
    "NextStep": "下一步",
-    "TypeHere": "在此输入..."
+    "TypeHere": "在此输入...",
+    "FullSize": "全尺寸",
+    "UseMaxWidth": "使用最大宽度",
+    "Sidebar": "侧边栏"
  }
 }
--- a/packages/ui/src/components/Panel.svelte
+++ b/packages/ui/src/components/Panel.svelte
@ -34,6 +34,8 @@
  import IconScale from './icons/Scale.svelte'
  import IconScaleFull from './icons/ScaleFull.svelte'

+  import plugin from '../plugin'
+
  export let innerWidth: number = 0
  export let panelWidth: number = 0
  export let isHeader: boolean = true
@ -209,6 +211,7 @@
          iconProps={{ size: 'medium' }}
          kind={'icon'}
          selected={useMaxWidth}
+          showTooltip={{ label: plugin.string.UseMaxWidth, direction: 'bottom' }}
          on:click={() => {
            useMaxWidth = !useMaxWidth
            dispatch('maxWidth', useMaxWidth)
@ -222,6 +225,7 @@
          iconProps={{ size: 'medium' }}
          kind={'icon'}
          selected={fullSize}
+          showTooltip={{ label: plugin.string.FullSize, direction: 'bottom' }}
          on:click={() => {
            fullSize = !fullSize
            dispatch('fullsize')
@ -244,6 +248,7 @@
            iconProps={{ size: 'medium', filled: asideShown }}
            kind={'icon'}
            selected={asideShown}
+            showTooltip={{ label: plugin.string.Sidebar, direction: 'bottom' }}
            on:click={handleAside}
          />
        {/if}
--- a/packages/ui/src/plugin.ts
+++ b/packages/ui/src/plugin.ts
@ -115,7 +115,11 @@ export const uis = plugin(uiId, {
    Selected: '' as IntlString,
    Submit: '' as IntlString,
    NextStep: '' as IntlString,
-    TypeHere: '' as IntlString
+    TypeHere: '' as IntlString,
+
+    FullSize: '' as IntlString,
+    UseMaxWidth: '' as IntlString,
+    Sidebar: '' as IntlString
  },
  metadata: {
    DefaultApplication: '' as Metadata<AnyComponent>,
--- a/plugins/document-resources/src/components/EditDoc.svelte
+++ b/plugins/document-resources/src/components/EditDoc.svelte
@ -186,11 +186,13 @@
  const aside: ButtonItem[] = [
    {
      id: 'references',
-      icon: document.icon.References
+      icon: document.icon.References,
+      showTooltip: { label: document.string.Backlinks, direction: 'bottom' }
    },
    {
      id: 'activity',
-      icon: activity.icon.Activity
+      icon: activity.icon.Activity,
+      showTooltip: { label: activity.string.Activity, direction: 'bottom' }
    }
  ]
  let selectedAside: string | boolean = false
@ -282,6 +284,7 @@
          icon={IconMoreH}
          iconProps={{ size: 'medium' }}
          kind={'icon'}
+          showTooltip={{ label: view.string.MoreActions, direction: 'bottom' }}
          on:click={showContextMenu}
        />
        {#each actions as action}
@ -311,6 +314,7 @@
                  fill: doc.color !== undefined ? getPlatformColorDef(doc.color, $themeStore.dark).icon : 'currentColor'
                }}
            disabled={readonly}
+            showTooltip={{ label: document.string.Icon, direction: 'bottom' }}
            on:click={chooseIcon}
          />
        </div>
--- a/plugins/document-resources/src/components/navigator/DocTreeElement.svelte
+++ b/plugins/document-resources/src/components/navigator/DocTreeElement.svelte
@ -19,6 +19,7 @@
  import type { Action, AnySvelteComponent } from '@hcengineering/ui'
  import { IconMoreH, Menu, navigate, showPopup, NavItem, ButtonIcon } from '@hcengineering/ui'
  import { getDocumentLink } from '../../utils'
+  import view from '@hcengineering/view'

  export let doc: Document
  export let icon: Asset | AnySvelteComponent | undefined = undefined
@ -87,6 +88,7 @@
      size={'extra-small'}
      pressed={hovered}
      dataId={'btnDocMore'}
+      tooltip={{ label: view.string.MoreActions, direction: 'top' }}
      on:click={onMenuClick}
    />
  </svelte:fragment>
--- a/plugins/drive-resources/src/components/FolderBrowser.svelte
+++ b/plugins/drive-resources/src/components/FolderBrowser.svelte
@ -16,7 +16,7 @@
  import { type Doc, type DocumentQuery, type Ref, type WithLookup } from '@hcengineering/core'
  import drive, { type Drive, type Folder } from '@hcengineering/drive'
  import { Scroller, SearchInput, Panel, Button, IconMoreH } from '@hcengineering/ui'
-  import { Viewlet, ViewOptions } from '@hcengineering/view'
+  import view, { Viewlet, ViewOptions } from '@hcengineering/view'
  import {
    FilterBar,
    FilterButton,
@ -83,6 +83,7 @@
        icon={IconMoreH}
        iconProps={{ size: 'medium' }}
        kind={'icon'}
+        showTooltip={{ label: view.string.MoreActions, direction: 'bottom' }}
        on:click={(ev) => {
          showMenu(ev, { object })
        }}
--- a/plugins/drive-resources/src/components/GridItem.svelte
+++ b/plugins/drive-resources/src/components/GridItem.svelte
@ -17,6 +17,7 @@
  import { type Resource } from '@hcengineering/drive'
  import { getClient } from '@hcengineering/presentation'
  import { Button, IconMoreH } from '@hcengineering/ui'
+  import view from '@hcengineering/view'
  import { ObjectPresenter, TimestampPresenter, openDoc, showMenu } from '@hcengineering/view-resources'
  import { createEventDispatcher } from 'svelte'

@ -71,6 +72,7 @@
            icon={IconMoreH}
            kind="ghost"
            size="medium"
+            showTooltip={{ label: view.string.MoreActions, direction: 'bottom' }}
            on:click={(evt) => {
              hovered = true
              showMenu(evt, { object }, () => {
--- a/plugins/view-resources/src/components/navigator/TreeElement.svelte
+++ b/plugins/view-resources/src/components/navigator/TreeElement.svelte
@ -27,6 +27,7 @@
    NavGroup,
    ButtonIcon
  } from '@hcengineering/ui'
+  import view from '@hcengineering/view'

  export let _id: Ref<Doc> | string | undefined = undefined
  export let icon: Asset | AnySvelteComponent | undefined = undefined
@ -115,6 +116,7 @@
            icon={action.icon ?? ActionIcon}
            size={'extra-small'}
            kind={'tertiary'}
+            tooltip={{ label: action.label, direction: 'top' }}
            on:click={(ev) => onInlineClick(ev, action)}
          />
        {/each}
@ -131,7 +133,14 @@
          }}
        />
      {:else if popupMenuActions.length > 0}
-        <ButtonIcon icon={IconMoreH} size={'extra-small'} kind={'tertiary'} {pressed} on:click={onMenuClick} />
+        <ButtonIcon
+          icon={IconMoreH}
+          size={'extra-small'}
+          kind={'tertiary'}
+          tooltip={{ label: view.string.MoreActions, direction: 'top' }}
+          {pressed}
+          on:click={onMenuClick}
+        />
      {/if}
    </svelte:fragment>
    <svelte:fragment slot="visible"><slot name="visible" /></svelte:fragment>
@ -170,6 +179,7 @@
            icon={action.icon ?? ActionIcon}
            size={'extra-small'}
            kind={'tertiary'}
+            tooltip={{ label: action.label, direction: 'bottom' }}
            on:click={(ev) => onInlineClick(ev, action)}
          />
        {/each}