AhmedTawfik/planka
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #1685 from symonbaikov/codex/icon-button-tooltips

Browse Source 
feat: add tooltips for icon buttons

Conflicts came from the branch predating the Pro banner work and the deleted
API key step. Resolved by keeping master's `onEdit` on the user actions popup
and wrapping it in the tooltip, and by leaving `ApiKeyStep.jsx` deleted.

The `switchToView` key is dropped in favour of one complete string per view.
Interpolating a view name into "Switch to {{view}} view" required
`t('common.' + view).toLowerCase()` at the call site, and lowercasing a
translated string is wrong wherever case carries meaning: German capitalises
nouns, and Turkish turns I into a dotless ı. The five replacements need no
interpolation and no lowercasing.
This commit is contained in:
Daniel Hiller
2026-09-17 00:41:33 +02:00
parent 26b512193a 4a70e995d3
commit 0e8a41adf8
38 changed files with 639 additions and 255 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/attachments/Attachments/ItemContent.jsx
+3
View File
@@ -9,6 +9,7 @@ import classNames from 'classnames';
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button, Icon, Label, Loader } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import entryActions from '../../../entry-actions';
@@ -161,9 +162,11 @@ const ItemContent = React.forwardRef(({ id, onOpen }, ref) => {
</div>
{canEdit && (
<EditPopup attachmentId={id}>
<Tooltip content={t('action.editAttachment', { context: 'title' })}>
<Button className={styles.editButton}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
</EditPopup>
)}
</div>
client/src/components/base-custom-field-groups/BaseCustomFieldGroupStep/CustomField.jsx
+5
View File
@@ -8,7 +8,9 @@ import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import { Draggable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button, Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
@@ -18,6 +20,7 @@ const CustomField = React.memo(({ id, index, onEdit }) => {
const selectCustomFieldById = useMemo(() => selectors.makeSelectCustomFieldById(), []);
const customField = useSelector((state) => selectCustomFieldById(state, id));
const [t] = useTranslation();
const handleEditClick = useCallback(() => {
onEdit(id);
@@ -36,6 +39,7 @@ const CustomField = React.memo(({ id, index, onEdit }) => {
{customField.showOnFrontOfCard && <Icon name="pin" className={styles.nameIcon} />}
{customField.name}
</span>
<Tooltip content={t('action.edit', { context: 'title' })}>
<Button
icon="pencil"
size="small"
@@ -44,6 +48,7 @@ const CustomField = React.memo(({ id, index, onEdit }) => {
className={styles.editButton}
onClick={handleEditClick}
/>
</Tooltip>
</div>
);
client/src/components/board-memberships/BoardMemberships/BoardMemberships.jsx
+5
View File
@@ -7,7 +7,9 @@ import groupBy from 'lodash/groupBy';
import React, { useMemo } from 'react';
import classNames from 'classnames';
import { useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import { usePopup } from '../../../lib/popup';
import selectors from '../../../selectors';
@@ -20,6 +22,7 @@ import styles from './BoardMemberships.module.scss';
const BoardMemberships = React.memo(() => {
const boardMemberships = useSelector(selectors.selectMembershipsForCurrentBoard);
const [t] = useTranslation();
const canAdd = useSelector((state) => {
const user = selectors.selectCurrentUser(state);
@@ -57,7 +60,9 @@ const BoardMemberships = React.memo(() => {
)}
{canAdd && (
<AddPopup>
<Tooltip content={t('action.addMember')}>
<Button icon="add user" className={classNames(styles.segment, styles.addButton)} />
</Tooltip>
</AddPopup>
)}
</>
client/src/components/boards/Board/GridView.jsx
+3 -1
View File
@@ -11,7 +11,7 @@ import { useInView } from 'react-intersection-observer';
import { useTranslation } from 'react-i18next';
import { Button, Icon, Loader } from 'semantic-ui-react';
import { useWindowWidth } from '../../../lib/hooks';
import { Masonry } from '../../../lib/custom-ui';
import { Masonry, Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import { BoardMembershipRoles } from '../../../constants/Enums';
@@ -81,6 +81,7 @@ const GridView = React.memo(
</span>
</Button>
{onCardPaste && clipboard && canPasteCard && (
<Tooltip content={t('action.paste')}>
<Button
type="button"
disabled={!onCardCreate}
@@ -89,6 +90,7 @@ const GridView = React.memo(
>
<Icon fitted name="paste" />
</Button>
</Tooltip>
)}
</div>
</div>
client/src/components/boards/Board/ListView.jsx
+3
View File
@@ -10,6 +10,7 @@ import { shallowEqual, useSelector } from 'react-redux';
import { useInView } from 'react-intersection-observer';
import { useTranslation } from 'react-i18next';
import { Button, Icon, Loader } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import { BoardMembershipRoles } from '../../../constants/Enums';
@@ -74,6 +75,7 @@ const ListView = React.memo(
</span>
</Button>
{onCardPaste && clipboard && canPasteCard && (
<Tooltip content={t('action.paste')}>
<Button
type="button"
disabled={!onCardCreate}
@@ -82,6 +84,7 @@ const ListView = React.memo(
>
<Icon fitted name="paste" />
</Button>
</Tooltip>
)}
</div>
))}
client/src/components/boards/BoardActions/Filters.jsx
+3 -1
View File
@@ -11,7 +11,7 @@ import { useTranslation } from 'react-i18next';
import { Icon } from 'semantic-ui-react';
import { useDidUpdate } from '../../../lib/hooks';
import { usePopup } from '../../../lib/popup';
import { Input } from '../../../lib/custom-ui';
import { Input, Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import entryActions from '../../../entry-actions';
@@ -162,11 +162,13 @@ const Filters = React.memo(() => {
</button>
</BoardMembershipsPopup>
{userIds.length === 0 && withCurrentUserSelector && (
<Tooltip content={t('action.filterByCurrentUser')}>
<button type="button" className={styles.filterButton} onClick={handleCurrentUserSelect}>
<span className={styles.filterLabel}>
<Icon fitted name="target" className={styles.filterLabelIcon} />
</span>
</button>
</Tooltip>
)}
{userIds.map((userId) => (
<span key={userId} className={styles.filterItem}>
client/src/components/boards/BoardActions/RightSide/RightSide.jsx
+16 -1
View File
@@ -5,7 +5,9 @@
import React, { useCallback } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../../lib/custom-ui';
import { usePopup } from '../../../../lib/popup';
import selectors from '../../../../selectors';
@@ -16,10 +18,20 @@ import ActionsStep from './ActionsStep';
import styles from './RightSide.module.scss';
// One complete sentence per view rather than a view name interpolated into a
// frame. A name that has to fit a slot has to be inflected to fit it, and the
// frame is not the same shape in every language.
const TOOLTIP_BY_VIEW = {
[BoardViews.KANBAN]: 'action.switchToKanbanView',
[BoardViews.GRID]: 'action.switchToGridView',
[BoardViews.LIST]: 'action.switchToListView',
};
const RightSide = React.memo(() => {
const board = useSelector(selectors.selectCurrentBoard);
const dispatch = useDispatch();
const [t] = useTranslation();
const handleSelectViewClick = useCallback(
({ currentTarget: { value: view } }) => {
@@ -40,8 +52,8 @@ const RightSide = React.memo(() => {
<div className={styles.action}>
<div className={styles.buttonGroup}>
{views.map((view) => (
<Tooltip key={view} content={t(TOOLTIP_BY_VIEW[view])} disabled={view === board.view}>
<button
key={view}
type="button"
value={view}
disabled={view === board.view}
@@ -50,14 +62,17 @@ const RightSide = React.memo(() => {
>
<Icon fitted name={BoardViewIcons[view]} />
</button>
</Tooltip>
))}
</div>
</div>
<div className={styles.action}>
<ActionsPopup>
<Tooltip content={t('common.openBoardActions')}>
<button type="button" className={styles.button}>
<Icon fitted name="ellipsis vertical" />
</button>
</Tooltip>
</ActionsPopup>
</div>
</>
client/src/components/boards/Boards/Boards.jsx
+5
View File
@@ -6,7 +6,9 @@
import React, { useCallback, useRef } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { DragDropContext, Droppable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import { closePopup, usePopup } from '../../../lib/popup';
import selectors from '../../../selectors';
@@ -32,6 +34,7 @@ const Boards = React.memo(() => {
});
const dispatch = useDispatch();
const [t] = useTranslation();
const tabsWrapperRef = useRef(null);
@@ -75,7 +78,9 @@ const Boards = React.memo(() => {
{placeholder}
{canAdd && (
<AddBoardPopup>
<Tooltip content={t('action.createBoard')}>
<Button icon="plus" className={styles.addButton} />
</Tooltip>
</AddBoardPopup>
)}
</div>
client/src/components/boards/Boards/Item.jsx
+5
View File
@@ -9,7 +9,9 @@ import classNames from 'classnames';
import { useDispatch, useSelector } from 'react-redux';
import { Link } from 'react-router';
import { Draggable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button, Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import entryActions from '../../../entry-actions';
@@ -40,6 +42,7 @@ const Item = React.memo(({ id, index }) => {
});
const dispatch = useDispatch();
const [t] = useTranslation();
const handleEditClick = useCallback(() => {
dispatch(entryActions.openBoardSettingsModal(id));
@@ -64,9 +67,11 @@ const Item = React.memo(({ id, index }) => {
<span className={styles.name}>{board.name}</span>
</Link>
{canEdit && (
<Tooltip content={t('action.edit', { context: 'title' })}>
<Button className={styles.editButton} onClick={handleEditClick}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
)}
</>
) : (
client/src/components/cards/Card/Card.jsx
+5
View File
@@ -7,7 +7,9 @@ import React, { useCallback, useContext, useMemo, useRef, useState } from 'react
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button, Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import { push } from '../../../lib/redux-router';
import { closePopup, usePopup } from '../../../lib/popup';
@@ -57,6 +59,7 @@ const Card = React.memo(({ id, isInline }) => {
});
const dispatch = useDispatch();
const [t] = useTranslation();
const [isEditNameOpened, setIsEditNameOpened] = useState(false);
const [, , handleCardMouseEnter, handleCardMouseLeave] = useContext(BoardShortcutsContext);
@@ -151,9 +154,11 @@ const Card = React.memo(({ id, isInline }) => {
</div>
{canUseActions && (
<CardActionsPopup ref={actionsPopupRef} cardId={id} onNameEdit={handleNameEdit}>
<Tooltip content={t('common.openCardActions')}>
<Button className={styles.actionsButton}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
</CardActionsPopup>
)}
</>
client/src/components/cards/CardModal/CardModal.jsx
+5
View File
@@ -6,7 +6,9 @@
import React, { useCallback, useEffect, useMemo } from 'react';
import classNames from 'classnames';
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import { push } from '../../../lib/redux-router';
import selectors from '../../../selectors';
@@ -45,6 +47,7 @@ const CardModal = React.memo(() => {
});
const dispatch = useDispatch();
const [t] = useTranslation();
const handleClose = useCallback(() => {
dispatch(push(Paths.BOARDS.replace(':id', card.boardId)));
@@ -102,9 +105,11 @@ const CardModal = React.memo(() => {
onClose={handleClose}
>
{prevCardId && (
<Tooltip content={t('action.goBack')} position="right center">
<button type="button" className={styles.prevButton} onClick={handlePrevClick}>
<Icon fitted name="arrow left" size="large" className={styles.prevButtonIcon} />
</button>
</Tooltip>
)}
{canEdit ? (
<AddAttachmentZone>
client/src/components/cards/CardModal/CustomFieldGroups/Item.jsx
+5
View File
@@ -7,7 +7,9 @@ import React, { useMemo } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button, Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../../lib/custom-ui';
import selectors from '../../../../selectors';
import { usePopupInClosableContext } from '../../../../hooks';
@@ -23,6 +25,7 @@ const Item = React.memo(({ id, dragHandleProps }) => {
const selectListById = useMemo(() => selectors.makeSelectListById(), []);
const customFieldGroup = useSelector((state) => selectCustomFieldGroupById(state, id));
const [t] = useTranslation();
const canEdit = useSelector((state) => {
if (customFieldGroup.boardId) {
@@ -51,9 +54,11 @@ const Item = React.memo(({ id, dragHandleProps }) => {
<div className={classNames(styles.moduleHeader, canEdit && styles.moduleHeaderEditable)}>
{customFieldGroup.isPersisted && canEdit && (
<CustomFieldGroupPopup id={customFieldGroup.id}>
<Tooltip content={t('action.editGroup')}>
<Button className={styles.editButton}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
</CustomFieldGroupPopup>
)}
<span className={styles.moduleHeaderTitle}>{customFieldGroup.name}</span>
client/src/components/cards/CardModal/ProjectContent.jsx
+11
View File
@@ -9,6 +9,7 @@ import { shallowEqual, useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button, Checkbox, Grid, Icon } from 'semantic-ui-react';
import { useDidUpdate } from '../../../lib/hooks';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import entryActions from '../../../entry-actions';
@@ -361,12 +362,14 @@ const ProjectContent = React.memo(() => {
onUserSelect={handleUserSelect}
onUserDeselect={handleUserDeselect}
>
<Tooltip content={t('action.addMember')}>
<button
type="button"
className={classNames(styles.attachment, styles.dueDate)}
>
<Icon name="add" size="small" className={styles.addAttachment} />
</button>
</Tooltip>
</BoardMembershipsPopup>
)}
</div>
@@ -401,12 +404,14 @@ const ProjectContent = React.memo(() => {
onSelect={handleLabelSelect}
onDeselect={handleLabelDeselect}
>
<Tooltip content={t('action.addLabel')}>
<button
type="button"
className={classNames(styles.attachment, styles.dueDate)}
>
<Icon name="add" size="small" className={styles.addAttachment} />
</button>
</Tooltip>
</LabelsPopup>
)}
</div>
@@ -465,6 +470,7 @@ const ProjectContent = React.memo(() => {
)}
</span>
{canEditStopwatch && (
<Tooltip content={t(card.stopwatch.startedAt ? 'action.stop' : 'action.start')}>
<button
type="button"
className={classNames(styles.attachment, styles.dueDate)}
@@ -476,6 +482,7 @@ const ProjectContent = React.memo(() => {
className={styles.addAttachment}
/>
</button>
</Tooltip>
)}
</div>
)}
@@ -507,9 +514,11 @@ const ProjectContent = React.memo(() => {
/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,
jsx-a11y/no-static-element-interactions */
<div className={styles.cursorPointer} onClick={handleEditDescriptionClick}>
<Tooltip content={t('action.editDescription', { context: 'title' })}>
<Button className={styles.editButton}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
<ExpandableMarkdown>{card.description}</ExpandableMarkdown>
</div>
) : (
@@ -554,6 +563,7 @@ const ProjectContent = React.memo(() => {
<div className={classNames(styles.text, styles.textList)}>{t('common.list')}</div>
{canUseLists ? (
<ListsPopup currentId={list.id} onSelect={handleListSelect}>
<Tooltip content={t('common.selectList')}>
<button type="button" className={styles.listButton}>
<span className={classNames(styles.list, styles.listHoverable)}>
<Icon name="columns" size="small" className={styles.listIcon} />
@@ -562,6 +572,7 @@ const ProjectContent = React.memo(() => {
</span>
</span>
</button>
</Tooltip>
</ListsPopup>
) : (
<span className={styles.list}>
client/src/components/cards/CardModal/StoryContent.jsx
+7
View File
@@ -10,6 +10,7 @@ import { useTranslation } from 'react-i18next';
import { Gallery, Item as GalleryItem } from 'react-photoswipe-gallery';
import { Button, Grid, Icon } from 'semantic-ui-react';
import { useDidUpdate } from '../../../lib/hooks';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import entryActions from '../../../entry-actions';
@@ -383,12 +384,14 @@ const StoryContent = React.memo(() => {
onSelect={handleLabelSelect}
onDeselect={handleLabelDeselect}
>
<Tooltip content={t('action.addLabel')}>
<button
type="button"
className={classNames(styles.attachment, styles.dueDate)}
>
<Icon name="add" size="small" className={styles.addAttachment} />
</button>
</Tooltip>
</LabelsPopup>
)}
</div>
@@ -419,9 +422,11 @@ const StoryContent = React.memo(() => {
className={classNames(styles.descriptionText, styles.cursorPointer)}
onClick={handleEditDescriptionClick}
>
<Tooltip content={t('action.editDescription', { context: 'title' })}>
<Button className={styles.editButton}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
<Markdown>{card.description}</Markdown>
</div>
) : (
@@ -477,6 +482,7 @@ const StoryContent = React.memo(() => {
<div className={classNames(styles.text, styles.textList)}>{t('common.list')}</div>
{canUseLists ? (
<ListsPopup currentId={list.id} onSelect={handleListSelect}>
<Tooltip content={t('common.selectList')}>
<button type="button" className={styles.listButton}>
<span className={classNames(styles.list, styles.listHoverable)}>
<Icon name="columns" size="small" className={styles.listIcon} />
@@ -485,6 +491,7 @@ const StoryContent = React.memo(() => {
</span>
</span>
</button>
</Tooltip>
</ListsPopup>
) : (
<span className={styles.list}>
client/src/components/cards/CardModal/TaskLists/Item.jsx
+11
View File
@@ -9,8 +9,10 @@ import PropTypes from 'prop-types';
import classNames from 'classnames';
import { useSelector } from 'react-redux';
import { Draggable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button, Icon } from 'semantic-ui-react';
import { useToggle } from '../../../../lib/hooks';
import { Tooltip } from '../../../../lib/custom-ui';
import selectors from '../../../../selectors';
import { usePopupInClosableContext } from '../../../../hooks';
@@ -24,6 +26,7 @@ const Item = React.memo(({ id, index }) => {
const selectTaskListById = useMemo(() => selectors.makeSelectTaskListById(), []);
const taskList = useSelector((state) => selectTaskListById(state, id));
const [t] = useTranslation();
const canEdit = useSelector((state) => {
const boardMembership = selectors.selectCurrentUserMembershipForCurrentBoard(state);
@@ -67,6 +70,11 @@ const Item = React.memo(({ id, index }) => {
{taskList.isPersisted && withActions && (
<div className={classNames(styles.actions)}>
{taskList.hideCompletedTasks && (
<Tooltip
content={t(
isCompletedVisible ? 'common.hideCompletedTasks' : 'action.showActive',
)}
>
<Button
className={styles.button}
onClick={handleToggleCompletedVisibleClick}
@@ -77,12 +85,15 @@ const Item = React.memo(({ id, index }) => {
size="small"
/>
</Button>
</Tooltip>
)}
{canEdit && (
<EditPopup taskListId={taskList.id}>
<Tooltip content={t('action.edit', { context: 'title' })}>
<Button className={styles.button}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
</EditPopup>
)}
</div>
client/src/components/common/AdministrationModal/UsersPane/Item.jsx
+3
View File
@@ -10,6 +10,7 @@ import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button, Icon, Table } from 'semantic-ui-react';
import { useEventCallback } from '../../../../lib/hooks';
import { Tooltip } from '../../../../lib/custom-ui';
import selectors from '../../../../selectors';
import entryActions from '../../../../entry-actions';
@@ -92,9 +93,11 @@ const Item = React.memo(({ id, onEdit }) => {
</Table.Cell>
<Table.Cell textAlign="right">
<ActionsPopup userId={id} onEdit={onEdit}>
<Tooltip content={t('common.userActions', { context: 'title' })}>
<Button className={styles.button}>
<Icon fitted name="pencil" />
</Button>
</Tooltip>
</ActionsPopup>
</Table.Cell>
</Table.Row>
client/src/components/common/Header/Header.jsx
+17
View File
@@ -7,7 +7,9 @@ import React, { useCallback } from 'react';
import classNames from 'classnames';
import { shallowEqual, useDispatch, useSelector } from 'react-redux';
import { Link } from 'react-router';
import { useTranslation } from 'react-i18next';
import { Button, Icon, Menu } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import { usePopup } from '../../../lib/popup';
import selectors from '../../../selectors';
@@ -72,6 +74,7 @@ const Header = React.memo(() => {
}, shallowEqual);
const dispatch = useDispatch();
const [t] = useTranslation();
const handleToggleFavoritesClick = useCallback(() => {
dispatch(entryActions.toggleFavorites(!isFavoritesEnabled));
@@ -102,6 +105,7 @@ const Header = React.memo(() => {
<Menu inverted size="large" className={styles.menu}>
{project && (
<Menu.Menu position="left">
<Tooltip content={t('action.returnToProjects')}>
<Menu.Item
as={Link}
to={Paths.ROOT}
@@ -109,18 +113,24 @@ const Header = React.memo(() => {
>
<Icon fitted name="arrow left" />
</Menu.Item>
</Tooltip>
<Menu.Item className={classNames(styles.item, styles.title)}>
{project.name}
{canEditProject && (
<Tooltip content={t('common.openProjectSettings')}>
<Button className={styles.editButton} onClick={handleProjectSettingsClick}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
)}
</Menu.Item>
</Menu.Menu>
)}
<Menu.Menu position="right">
{withFavoritesToggler && (
<Tooltip
content={t(isFavoritesEnabled ? 'action.hideProjectList' : 'action.showProjectList')}
>
<Menu.Item
className={classNames(styles.item, styles.itemHoverable)}
onClick={handleToggleFavoritesClick}
@@ -131,8 +141,12 @@ const Header = React.memo(() => {
className={classNames(isFavoritesEnabled && styles.itemIconEnabled)}
/>
</Menu.Item>
</Tooltip>
)}
{withEditModeToggler && (
<Tooltip
content={t(isEditModeEnabled ? 'action.disableEditMode' : 'action.enableEditMode')}
>
<Menu.Item
className={classNames(styles.item, styles.itemHoverable)}
onClick={handleToggleEditModeClick}
@@ -143,14 +157,17 @@ const Header = React.memo(() => {
className={classNames(isEditModeEnabled && styles.itemIconEnabled)}
/>
</Menu.Item>
</Tooltip>
)}
<NotificationsPopup>
<Tooltip content={t('common.openNotifications')}>
<Menu.Item className={classNames(styles.item, styles.itemHoverable)}>
<Icon fitted name="bell" />
{notificationIds.length > 0 && (
<span className={styles.notification}>{notificationIds.length}</span>
)}
</Menu.Item>
</Tooltip>
</NotificationsPopup>
<UserActionsPopup>
<Menu.Item className={classNames(styles.item, styles.itemHoverable)}>
client/src/components/common/HomeActions/RightSide/RightSide.jsx
+16 -1
View File
@@ -6,7 +6,9 @@
import React, { useCallback } from 'react';
import classNames from 'classnames';
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../../lib/custom-ui';
import { usePopup } from '../../../../lib/popup';
import selectors from '../../../../selectors';
@@ -17,12 +19,18 @@ import SelectOrderStep from './SelectOrderStep';
import styles from './RightSide.module.scss';
const TOOLTIP_BY_VIEW = {
[HomeViews.GRID_PROJECTS]: 'action.switchToGridProjectsView',
[HomeViews.GROUPED_PROJECTS]: 'action.switchToGroupedProjectsView',
};
const RightSide = React.memo(() => {
const currentView = useSelector(selectors.selectHomeView); // TODO: rename?
const currentOrder = useSelector(selectors.selectProjectsOrder); // TODO: rename?
const isHiddenVisible = useSelector(selectors.selectIsHiddenProjectsVisible);
const dispatch = useDispatch();
const [t] = useTranslation();
const handleSelectViewClick = useCallback(
({ currentTarget: { value: view } }) => {
@@ -47,6 +55,9 @@ const RightSide = React.memo(() => {
return (
<>
<div className={styles.action}>
<Tooltip
content={t(isHiddenVisible ? 'action.hideHiddenProjects' : 'common.showHiddenProjects')}
>
<button
type="button"
className={classNames(styles.button)}
@@ -54,19 +65,22 @@ const RightSide = React.memo(() => {
>
<Icon fitted name={isHiddenVisible ? 'eye slash' : 'eye'} />
</button>
</Tooltip>
</div>
<div className={styles.action}>
<SelectOrderPopup value={currentOrder} onSelect={handleOrderSelect}>
<Tooltip content={t('common.selectOrder', { context: 'title' })}>
<button type="button" className={styles.button}>
<Icon fitted name={ProjectOrderIcons[currentOrder]} />
</button>
</Tooltip>
</SelectOrderPopup>
</div>
<div className={styles.action}>
<div className={styles.buttonGroup}>
{[HomeViews.GRID_PROJECTS, HomeViews.GROUPED_PROJECTS].map((view) => (
<Tooltip key={view} content={t(TOOLTIP_BY_VIEW[view])} disabled={view === currentView}>
<button
key={view}
type="button"
value={view}
disabled={view === currentView}
@@ -75,6 +89,7 @@ const RightSide = React.memo(() => {
>
<Icon fitted name={HomeViewIcons[view]} />
</button>
</Tooltip>
))}
</div>
</div>
client/src/components/custom-field-groups/CustomFieldGroupStep/CustomField.jsx
+5
View File
@@ -8,7 +8,9 @@ import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import { Draggable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button, Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
@@ -18,6 +20,7 @@ const CustomField = React.memo(({ id, index, onEdit }) => {
const selectCustomFieldById = useMemo(() => selectors.makeSelectCustomFieldById(), []);
const customField = useSelector((state) => selectCustomFieldById(state, id));
const [t] = useTranslation();
const handleEditClick = useCallback(() => {
onEdit(id);
@@ -36,6 +39,7 @@ const CustomField = React.memo(({ id, index, onEdit }) => {
{customField.showOnFrontOfCard && <Icon name="pin" className={styles.nameIcon} />}
{customField.name}
</span>
<Tooltip content={t('action.edit', { context: 'title' })}>
<Button
icon="pencil"
size="small"
@@ -44,6 +48,7 @@ const CustomField = React.memo(({ id, index, onEdit }) => {
className={styles.editButton}
onClick={handleEditClick}
/>
</Tooltip>
</div>
);
client/src/components/custom-field-groups/CustomFieldGroupsStep/Item.jsx
+5
View File
@@ -8,7 +8,9 @@ import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import { Draggable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
@@ -18,6 +20,7 @@ const Item = React.memo(({ id, index, onEdit }) => {
const selectCustomFieldGroupById = useMemo(() => selectors.makeSelectCustomFieldGroupById(), []);
const customFieldGroup = useSelector((state) => selectCustomFieldGroupById(state, id));
const [t] = useTranslation();
const handleEditClick = useCallback(() => {
onEdit(id);
@@ -35,6 +38,7 @@ const Item = React.memo(({ id, index, onEdit }) => {
>
{customFieldGroup.name}
</span>
<Tooltip content={t('action.editGroup')}>
<Button
icon="pencil"
size="small"
@@ -43,6 +47,7 @@ const Item = React.memo(({ id, index, onEdit }) => {
className={styles.editButton}
onClick={handleEditClick}
/>
</Tooltip>
</div>
);
client/src/components/custom-fields/CustomField/CustomField.jsx
+5
View File
@@ -6,7 +6,9 @@
import React, { useCallback, useMemo, useState } from 'react';
import PropTypes from 'prop-types';
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button, Icon } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import entryActions from '../../../entry-actions';
@@ -49,6 +51,7 @@ const CustomField = React.memo(({ id, customFieldGroupId }) => {
});
const dispatch = useDispatch();
const [t] = useTranslation();
const [isCopied, setIsCopied] = useState(false);
const handleValueUpdate = useCallback(
@@ -95,9 +98,11 @@ const CustomField = React.memo(({ id, customFieldGroupId }) => {
</div>
)}
{customFieldValue && customFieldValue.content && (
<Tooltip content={t('action.copy')}>
<Button className={styles.copyButton} onClick={handleCopyClick}>
<Icon fitted name={isCopied ? 'check' : 'copy'} />
</Button>
</Tooltip>
)}
</div>
</div>
client/src/components/labels/LabelsStep/Item.jsx
+5
View File
@@ -11,7 +11,9 @@ import PropTypes from 'prop-types';
import classNames from 'classnames';
import { useSelector } from 'react-redux';
import { Draggable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import { BoardMembershipRoles } from '../../../constants/Enums';
@@ -23,6 +25,7 @@ const Item = React.memo(({ id, index, isActive, onSelect, onDeselect, onEdit })
const selectLabelById = useMemo(() => selectors.makeSelectLabelById(), []);
const label = useSelector((state) => selectLabelById(state, id));
const [t] = useTranslation();
const canEdit = useSelector((state) => {
const boardMembership = selectors.selectCurrentUserMembershipForCurrentBoard(state);
@@ -63,6 +66,7 @@ const Item = React.memo(({ id, index, isActive, onSelect, onDeselect, onEdit })
{label.name}
</span>
{canEdit && (
<Tooltip content={t('action.edit', { context: 'title' })}>
<Button
icon="pencil"
size="small"
@@ -71,6 +75,7 @@ const Item = React.memo(({ id, index, isActive, onSelect, onDeselect, onEdit })
className={styles.editButton}
onClick={handleEditClick}
/>
</Tooltip>
)}
</div>
);
client/src/components/lists/List/List.jsx
+7
View File
@@ -13,6 +13,7 @@ import { useTranslation } from 'react-i18next';
import { Draggable, Droppable } from 'react-beautiful-dnd';
import { Button, Icon } from 'semantic-ui-react';
import { useDidUpdate, useToggle, useTransitioning } from '../../../lib/hooks';
import { Tooltip } from '../../../lib/custom-ui';
import { usePopup } from '../../../lib/popup';
import selectors from '../../../selectors';
@@ -240,16 +241,20 @@ const List = React.memo(({ id, index }) => {
{list.isPersisted &&
(canEdit ? (
<ActionsPopup listId={id} onNameEdit={handleNameEdit} onCardAdd={handleCardAdd}>
<Tooltip content={t('common.openListActions')}>
<Button className={styles.headerButton}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
</ActionsPopup>
) : (
canArchiveCards && (
<ArchiveCardsPopup listId={id}>
<Tooltip content={t('action.archiveCards')}>
<Button className={styles.headerButton}>
<Icon fitted name="archive" size="small" />
</Button>
</Tooltip>
</ArchiveCardsPopup>
)
))}
@@ -275,6 +280,7 @@ const List = React.memo(({ id, index }) => {
</span>
</button>
{clipboard && canPasteCard && (
<Tooltip content={t('action.paste')}>
<button
type="button"
disabled={!list.isPersisted}
@@ -283,6 +289,7 @@ const List = React.memo(({ id, index }) => {
>
<Icon name="paste" />
</button>
</Tooltip>
)}
</div>
)}
client/src/components/notification-services/NotificationServices/Item.jsx
+12 -1
View File
@@ -6,8 +6,10 @@
import React, { useCallback, useMemo, useRef } from 'react';
import PropTypes from 'prop-types';
import { useDispatch, useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button, Dropdown, Form, Icon, Input } from 'semantic-ui-react';
import { useDidUpdate, usePrevious, useToggle } from '../../../lib/hooks';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import entryActions from '../../../entry-actions';
@@ -31,6 +33,7 @@ const Item = React.memo(({ id }) => {
const notificationService = useSelector((state) => selectNotificationServiceById(state, id));
const dispatch = useDispatch();
const [t] = useTranslation();
const defaultData = useMemo(
() => ({
@@ -183,6 +186,7 @@ const Item = React.memo(({ id }) => {
onChange={handleFieldChange}
onBlur={handleUrlBlur}
/>
<Tooltip content={t('action.sendTestEmail')}>
<Button
type="button"
loading={notificationService.isTesting}
@@ -192,15 +196,22 @@ const Item = React.memo(({ id }) => {
>
<Icon fitted name="paper plane outline" />
</Button>
</Tooltip>
<ConfirmationPopup
title="common.deleteNotificationService"
content="common.areYouSureYouWantToDeleteThisNotificationService"
buttonContent="action.deleteNotificationService"
onConfirm={handleDeleteConfirm}
>
<Button type="button" disabled={!notificationService.isPersisted} className={styles.button}>
<Tooltip content={t('action.deleteNotificationService')}>
<Button
type="button"
disabled={!notificationService.isPersisted}
className={styles.button}
>
<Icon fitted name="trash alternate outline" />
</Button>
</Tooltip>
</ConfirmationPopup>
</Form>
);
client/src/components/notification-services/NotificationServices/NotificationServices.jsx
+6 -1
View File
@@ -6,9 +6,10 @@
import React, { useCallback, useEffect } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { Trans } from 'react-i18next';
import { Trans, useTranslation } from 'react-i18next';
import { Button, Dropdown, Form, Icon, Input, Message } from 'semantic-ui-react';
import { useDidUpdate, useToggle } from '../../../lib/hooks';
import { Tooltip } from '../../../lib/custom-ui';
import { useEscapeInterceptor, useForm, useNestedRef } from '../../../hooks';
import { NotificationServiceFormats } from '../../../constants/Enums';
@@ -22,6 +23,8 @@ const DEFAULT_DATA = {
};
const NotificationServices = React.memo(({ ids, onCreate }) => {
const [t] = useTranslation();
const [data, handleFieldChange, setData] = useForm(DEFAULT_DATA);
const [focusUrlFieldState, focusUrlField] = useToggle();
@@ -117,9 +120,11 @@ const NotificationServices = React.memo(({ ids, onCreate }) => {
onChange={handleFieldChange}
onBlur={handleUrlBlur}
/>
<Tooltip content={t('common.addNotificationService', { context: 'title' })}>
<Button positive className={styles.button}>
<Icon fitted name="plus" />
</Button>
</Tooltip>
</Form>
)}
</>
client/src/components/project-managers/ProjectManagers/ProjectManagers.jsx
+5
View File
@@ -5,7 +5,9 @@
import React from 'react';
import { useSelector } from 'react-redux';
import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react';
import { Tooltip } from '../../../lib/custom-ui';
import selectors from '../../../selectors';
import { usePopupInClosableContext } from '../../../hooks';
@@ -18,6 +20,7 @@ import styles from './ProjectManagers.module.scss';
const ProjectManagers = React.memo(() => {
const projectManagers = useSelector(selectors.selectManagersForCurrentProject);
const [t] = useTranslation();
const canAdd = useSelector((state) => {
const user = selectors.selectCurrentUser(state);
@@ -47,7 +50,9 @@ const ProjectManagers = React.memo(() => {
))}
{canAdd && (
<AddPopup>
<Tooltip content={t('action.addMember')}>
<Button icon="add user" className={styles.addButton} />
</Tooltip>
</AddPopup>
)}
</div>
client/src/components/projects/ProjectSettingsModal/BackgroundPane/Image.jsx
+6
View File
@@ -5,7 +5,9 @@
import React, { useCallback } from 'react';
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Icon, Label } from 'semantic-ui-react';
import { Tooltip } from '../../../../lib/custom-ui';
import { usePopupInClosableContext } from '../../../../hooks';
import ConfirmationStep from '../../../common/ConfirmationStep';
@@ -13,6 +15,8 @@ import ConfirmationStep from '../../../common/ConfirmationStep';
import styles from './Image.module.scss';
const Image = React.memo(({ url, isActive, onSelect, onDeselect, onDelete }) => {
const [t] = useTranslation();
const handleClick = useCallback(() => {
if (isActive) {
onDeselect();
@@ -52,9 +56,11 @@ const Image = React.memo(({ url, isActive, onSelect, onDeselect, onDelete }) =>
buttonContent="action.deleteBackgroundImage"
onConfirm={onDelete}
>
<Tooltip content={t('action.deleteBackgroundImage')}>
<Button className={styles.deleteButton}>
<Icon fitted name="trash alternate" size="small" />
</Button>
</Tooltip>
</ConfirmationPopup>
)}
</div>
client/src/components/task-lists/TaskList/Task/Task.jsx
+7
View File
@@ -10,8 +10,10 @@ import classNames from 'classnames';
import { shallowEqual, useDispatch, useSelector } from 'react-redux';
import { Link } from 'react-router';
import { Draggable } from 'react-beautiful-dnd';
import { useTranslation } from 'react-i18next';
import { Button, Checkbox, Icon } from 'semantic-ui-react';
import { useDidUpdate } from '../../../../lib/hooks';
import { Tooltip } from '../../../../lib/custom-ui';
import selectors from '../../../../selectors';
import entryActions from '../../../../entry-actions';
@@ -60,6 +62,7 @@ const Task = React.memo(({ id, index }) => {
}, shallowEqual);
const dispatch = useDispatch();
const [t] = useTranslation();
const [isEditNameOpened, setIsEditNameOpened] = useState(false);
const [, , setIsClosableActive] = useContext(ClosableContext);
@@ -203,16 +206,20 @@ const Task = React.memo(({ id, index }) => {
className={styles.assigneeUserAvatar}
/>
) : (
<Tooltip content={t('common.selectAssignee', { context: 'title' })}>
<Button className={styles.button}>
<Icon fitted name="add user" size="small" />
</Button>
</Tooltip>
)}
</SelectAssigneePopup>
)}
<ActionsPopup taskId={id} onNameEdit={handleNameEdit}>
<Tooltip content={t('common.taskActions', { context: 'title' })}>
<Button className={styles.button}>
<Icon fitted name="pencil" size="small" />
</Button>
</Tooltip>
</ActionsPopup>
</>
) : (
client/src/hooks/use-closable-modal.jsx
+21 -2
View File
@@ -5,6 +5,7 @@
import React, { useCallback, useMemo } from 'react';
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Modal } from 'semantic-ui-react';
import useClosable from './use-closable';
@@ -22,6 +23,8 @@ export default (initialClosableValue) => {
const ClosableModal = useMemo(() => {
// eslint-disable-next-line no-shadow
const ClosableModal = React.memo(({ closeIcon, onClose, ...props }) => {
const [t] = useTranslation();
const handleClose = useCallback(
(event) => {
if (isClosableActiveRef.current) {
@@ -41,16 +44,32 @@ export default (initialClosableValue) => {
[closeIcon, onClose],
);
const semanticCloseIcon =
closeIcon === true
? {
name: 'close',
'aria-label': t('action.close'),
title: t('action.close'),
}
: closeIcon;
return (
<ClosableContext.Provider value={closableContextValue}>
{/* eslint-disable-next-line react/jsx-props-no-spreading */}
<Modal open {...props} closeIcon={closeIcon} onClose={handleClose} />
<Modal open {...props} closeIcon={semanticCloseIcon} onClose={handleClose} />
</ClosableContext.Provider>
);
});
ClosableModal.propTypes = {
closeIcon: PropTypes.bool,
closeIcon: PropTypes.oneOfType([
PropTypes.bool,
PropTypes.shape({
name: PropTypes.string,
'aria-label': PropTypes.string,
title: PropTypes.string,
}),
]),
onClose: PropTypes.func,
};
client/src/lib/custom-ui/components/Popup/PopupHeader.jsx
+13 -3
View File
@@ -5,16 +5,26 @@
import React from 'react';
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Popup as SemanticUIPopup } from 'semantic-ui-react';
import Tooltip from '../Tooltip';
import styles from './PopupHeader.module.css';
const PopupHeader = React.memo(({ children, onBack }) => (
const PopupHeader = React.memo(({ children, onBack }) => {
const [t] = useTranslation();
return (
<SemanticUIPopup.Header className={styles.wrapper}>
{onBack && <Button icon="angle left" onClick={onBack} className={styles.backButton} />}
{onBack && (
<Tooltip content={t('action.goBack')}>
<Button icon="angle left" onClick={onBack} className={styles.backButton} />
</Tooltip>
)}
<div className={styles.content}>{children}</div>
</SemanticUIPopup.Header>
));
);
});
PopupHeader.propTypes = {
children: PropTypes.node.isRequired,
client/src/lib/custom-ui/components/Tooltip/Tooltip.jsx
+69
View File
@@ -0,0 +1,69 @@
/*!
* Copyright (c) 2024 PLANKA Software GmbH
* Licensed under the Fair Use License: https://github.com/plankanban/planka/blob/master/LICENSE.md
*/
import React, { useMemo } from 'react';
import PropTypes from 'prop-types';
import { Popup as SemanticUIPopup } from 'semantic-ui-react';
import styles from './Tooltip.module.css';
const callAll =
(...callbacks) =>
(...args) => {
callbacks.forEach((callback) => {
if (callback) {
callback(...args);
}
});
};
const Tooltip = React.forwardRef(
({ children, content, disabled, position, 'aria-label': ariaLabel, onClick, ...props }, ref) => {
const trigger = useMemo(() => {
const contentAriaLabel = typeof content === 'string' ? content : undefined;
return React.cloneElement(children, {
...props,
ref,
'aria-label': children.props['aria-label'] || ariaLabel || contentAriaLabel,
onClick: callAll(children.props.onClick, onClick),
});
}, [children, content, props, ref, ariaLabel, onClick]);
if (disabled || !content) {
return trigger;
}
return (
<SemanticUIPopup
basic
inverted
trigger={trigger}
content={content}
on={['hover', 'focus']}
position={position}
className={styles.wrapper}
/>
);
},
);
Tooltip.propTypes = {
children: PropTypes.element.isRequired,
content: PropTypes.node.isRequired,
disabled: PropTypes.bool,
'aria-label': PropTypes.string,
onClick: PropTypes.func,
position: PropTypes.string,
};
Tooltip.defaultProps = {
disabled: false,
'aria-label': undefined,
onClick: undefined,
position: 'top center',
};
export default React.memo(Tooltip);
client/src/lib/custom-ui/components/Tooltip/Tooltip.module.css
+12
View File
@@ -0,0 +1,12 @@
/*!
* Copyright (c) 2024 PLANKA Software GmbH
* Licensed under the Fair Use License: https://github.com/plankanban/planka/blob/master/LICENSE.md
*/
:global(#app) .wrapper {
border-radius: 3px;
font-size: 12px;
font-weight: bold;
line-height: 16px;
padding: 6px 8px;
}
client/src/lib/custom-ui/components/Tooltip/index.js
+8
View File
@@ -0,0 +1,8 @@
/*!
* Copyright (c) 2024 PLANKA Software GmbH
* Licensed under the Fair Use License: https://github.com/plankanban/planka/blob/master/LICENSE.md
*/
import Tooltip from './Tooltip';
export default Tooltip;
client/src/lib/custom-ui/index.js
+2 -1
View File
@@ -7,5 +7,6 @@ import Input from './components/Input';
import Popup from './components/Popup';
import Masonry from './components/Masonry';
import FilePicker from './components/FilePicker';
import Tooltip from './components/Tooltip';
export { Input, Popup, Masonry, FilePicker };
export { Input, Popup, Masonry, FilePicker, Tooltip };
client/src/lib/popup/use-popup.jsx
+6
View File
@@ -6,13 +6,17 @@
import { ResizeObserver } from '@juggle/resize-observer';
import React, { useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Popup as SemanticUIPopup } from 'semantic-ui-react';
import { Tooltip } from '../custom-ui';
import styles from './Popup.module.css';
export default (Step, { position, onOpen, onClose } = {}) => {
return useMemo(() => {
const Popup = React.forwardRef(({ children, ...stepProps }, ref) => {
const [t] = useTranslation();
const [stepParams, setStepParams] = useState(null);
const wrapperRef = useRef(null);
@@ -116,7 +120,9 @@ export default (Step, { position, onOpen, onClose } = {}) => {
onClick={handleClick}
>
<div ref={handleContentRef}>
<Tooltip content={t('action.close')}>
<Button icon="close" onClick={handleClose} className={styles.closeButton} />
</Tooltip>
{/* eslint-disable-next-line react/jsx-props-no-spreading */}
<Step {...stepProps} {...stepParams} onClose={handleClose} />
</div>
client/src/locales/de-DE/core.js
+24
View File
@@ -32,6 +32,7 @@ export default {
addCustomField_title: 'Datenfeld hinzufügen',
addManager_title: 'Projektleiter hinzufügen',
addMember_title: 'Mitglied hinzufügen',
addNotificationService_title: 'Benachrichtigungsdienst hinzufügen',
addTaskList_title: 'Aufgaben hinzufügen',
addUser_title: 'Benutzer hinzufügen',
admin: 'Administrator',
@@ -187,6 +188,12 @@ export default {
lastUsed: 'Zuletzt verwendet',
never: 'Nie',
noTrustedDevices: 'Keine vertrauenswürdigen Geräte.',
openBoardActions: 'Arbeitsbereich-Aktionen öffnen',
openCardActions: 'Kartenaktionen öffnen',
openListActions: 'Listenaktionen öffnen',
openNotifications: 'Benachrichtigungen öffnen',
openProjectActions: 'Projektaktionen öffnen',
openProjectSettings: 'Projekteinstellungen öffnen',
orEnterSecretManually: 'Oder geben Sie dieses Geheimnis manuell ein:',
recoveryCodesExhausted:
'Alle Wiederherstellungscodes wurden verwendet. Erzeugen Sie neue Codes, um einen Fallback zu haben.',
@@ -206,6 +213,7 @@ export default {
scanQrCodeWithApp:
'Scannen Sie diesen QR-Code mit einer Authenticator-App wie Google Authenticator oder Authy.',
security_title: 'Sicherheit',
showHiddenProjects: 'Ausgeblendete Projekte anzeigen',
totpCode: 'TOTP-Code',
totpOrRecoveryCode: 'TOTP- oder Wiederherstellungscode',
trustedDevices_title: 'Vertrauenswürdige Browser',
@@ -469,6 +477,7 @@ export default {
addComment: 'Kommentar hinzufügen',
addCustomField: 'Datenfeld hinzufügen',
addCustomFieldGroup: 'Feldgruppe hinzufügen',
addLabel: 'Label hinzufügen',
addList: 'Liste hinzufügen',
addMember: 'Mitglied hinzufügen',
addMoreDetailedDescription: 'Eine detaillierte Beschreibung hinzufügen',
@@ -486,6 +495,7 @@ export default {
back: 'Zurück',
cancel: 'Abbrechen',
changePassword: 'Passwort ändern',
close: 'Schließen',
copy: 'Kopieren',
copyAll: 'Alle kopieren',
copyCard_title: 'Karte Kopieren',
@@ -528,6 +538,7 @@ export default {
deleteUser_title: 'Benutzer löschen',
deleteWebhook: 'Webhook löschen',
disable2fa: '2FA deaktivieren',
disableEditMode: 'Bearbeitungsmodus beenden',
dismissAll: 'Alle verwerfen',
done: 'Fertig',
download: 'Herunterladen',
@@ -550,6 +561,11 @@ export default {
emptyTrash: 'Papierkorb leeren',
emptyTrash_title: 'Papierkorb leeren',
enable2fa: '2FA aktivieren',
enableEditMode: 'Bearbeitungsmodus starten',
filterByCurrentUser: 'Nach aktuellem Benutzer filtern',
goBack: 'Zurück',
hideHiddenProjects: 'Ausgeblendete Projekte verbergen',
hideProjectList: 'Projektliste ausblenden',
import: 'Import',
join: 'Beitreten',
leave: 'Verlassen',
@@ -565,6 +581,7 @@ export default {
move: 'Verschieben',
moveCard_title: 'Karte bewegen',
moveList_title: 'Liste verschieben',
paste: 'Einfügen',
regenerate: 'Neu generieren',
regenerateApiKey: 'API-Schlüssel neu generieren',
regenerateRecoveryCodes: 'Wiederherstellungscodes neu generieren',
@@ -579,6 +596,7 @@ export default {
reset2fa: '2FA zurücksetzen',
restoreToList: 'Wiederherstellen in {{list}}',
returnToBoard: 'Zurück zum Arbeitsbereich',
returnToProjects: 'Zurück zu den Projekten',
revoke: 'Widerrufen',
save: 'Speichern',
sendTestEmail: 'Test-E-Mail senden',
@@ -589,11 +607,17 @@ export default {
showFewerAttachments: 'Weniger Anhänge anzeigen',
showLess: 'Weniger anzeigen',
showMore: 'Mehr anzeigen',
showProjectList: 'Projektliste anzeigen',
sortList_title: 'Liste sortieren',
start: 'Start',
stayLoggedIn: 'Angemeldet bleiben',
stop: 'Stopp',
subscribe: 'Abonnieren',
switchToGridProjectsView: 'Projekte als Raster anzeigen',
switchToGridView: 'Zur Rasteransicht wechseln',
switchToGroupedProjectsView: 'Projekte gruppiert anzeigen',
switchToKanbanView: 'Zur Kanban-Ansicht wechseln',
switchToListView: 'Zur Listenansicht wechseln',
unsubscribe: 'De-abonnieren',
uploadNewAvatar: 'Neuen Avatar hochladen',
uploadNewImage: 'Neues Bild hochladen',
client/src/locales/en-US/core.js
+24
View File
@@ -27,6 +27,7 @@ export default {
addCustomField_title: 'Add Custom Field',
addManager_title: 'Add Manager',
addMember_title: 'Add Member',
addNotificationService_title: 'Add Notification Service',
addTaskList_title: 'Add Task List',
addUser_title: 'Add User',
admin: 'Admin',
@@ -166,6 +167,12 @@ export default {
lastUsed: 'Last used',
never: 'Never',
noTrustedDevices: 'No trusted devices.',
openBoardActions: 'Open board actions',
openCardActions: 'Open card actions',
openListActions: 'Open list actions',
openNotifications: 'Open notifications',
openProjectActions: 'Open project actions',
openProjectSettings: 'Open project settings',
orEnterSecretManually: 'Or enter this secret manually:',
recoveryCodesExhausted:
'All recovery codes have been used. Regenerate a new set to keep a fallback in case you lose your authenticator app.',
@@ -184,6 +191,7 @@ export default {
scanQrCodeWithApp:
'Scan this QR code with an authenticator app such as Google Authenticator or Authy.',
security_title: 'Security',
showHiddenProjects: 'Show hidden projects',
totpCode: 'TOTP code',
totpOrRecoveryCode: 'TOTP or recovery code',
trustedDevices_title: 'Trusted Browsers',
@@ -443,6 +451,7 @@ export default {
addComment: 'Add comment',
addCustomField: 'Add custom field',
addCustomFieldGroup: 'Add custom field group',
addLabel: 'Add label',
addList: 'Add list',
addMember: 'Add member',
addMoreDetailedDescription: 'Add more detailed description',
@@ -460,6 +469,7 @@ export default {
back: 'Back',
cancel: 'Cancel',
changePassword: 'Change password',
close: 'Close',
copy: 'Copy',
copyAll: 'Copy all',
copyCard_title: 'Copy Card',
@@ -502,6 +512,7 @@ export default {
deleteUser_title: 'Delete User',
deleteWebhook: 'Delete webhook',
disable2fa: 'Disable 2FA',
disableEditMode: 'Disable edit mode',
dismissAll: 'Dismiss all',
done: 'Done',
download: 'Download',
@@ -524,6 +535,11 @@ export default {
emptyTrash: 'Empty trash',
emptyTrash_title: 'Empty Trash',
enable2fa: 'Enable 2FA',
enableEditMode: 'Enable edit mode',
filterByCurrentUser: 'Filter by current user',
goBack: 'Go back',
hideHiddenProjects: 'Hide hidden projects',
hideProjectList: 'Hide project list',
import: 'Import',
join: 'Join',
leave: 'Leave',
@@ -539,6 +555,7 @@ export default {
move: 'Move',
moveCard_title: 'Move Card',
moveList_title: 'Move List',
paste: 'Paste',
regenerate: 'Regenerate',
regenerateApiKey: 'Regenerate API key',
regenerateRecoveryCodes: 'Regenerate recovery codes',
@@ -553,6 +570,7 @@ export default {
reset2fa: 'Reset 2FA',
restoreToList: 'Restore to {{list}}',
returnToBoard: 'Return to board',
returnToProjects: 'Return to projects',
revoke: 'Revoke',
save: 'Save',
sendTestEmail: 'Send test email',
@@ -563,11 +581,17 @@ export default {
showFewerAttachments: 'Show fewer attachments',
showLess: 'Show less',
showMore: 'Show more',
showProjectList: 'Show project list',
sortList_title: 'Sort List',
start: 'Start',
stayLoggedIn: 'Stay logged in',
stop: 'Stop',
subscribe: 'Subscribe',
switchToGridProjectsView: 'Show projects as a grid',
switchToGridView: 'Switch to grid view',
switchToGroupedProjectsView: 'Show projects grouped',
switchToKanbanView: 'Switch to kanban view',
switchToListView: 'Switch to list view',
unsubscribe: 'Unsubscribe',
uploadNewAvatar: 'Upload new avatar',
uploadNewImage: 'Upload new image',
client/src/locales/ru-RU/core.js
+26
View File
@@ -32,6 +32,7 @@ export default {
addCustomField_title: 'Добавить настраиваемое поле',
addManager_title: 'Добавление менеджера',
addMember_title: 'Добавление участника',
addNotificationService_title: 'Добавить сервис уведомлений',
addTaskList_title: 'Добавить список задач',
addUser_title: 'Добавление пользователя',
admin: 'Админ',
@@ -300,6 +301,12 @@ export default {
onlyOneManagerShouldRemainToMakeThisProjectPrivate:
'Должен остаться только один менеджер, чтобы сделать этот проект частным',
openBoard_title: 'Откройте доску',
openBoardActions: 'Открыть действия доски',
openCardActions: 'Открыть действия карточки',
openListActions: 'Открыть действия списка',
openNotifications: 'Открыть уведомления',
openProjectActions: 'Открыть действия проекта',
openProjectSettings: 'Открыть настройки проекта',
optional_inline: 'необязательно',
orEnterSecretManually: 'Или введите этот секретный ключ вручную:',
organization: 'Организация',
@@ -367,6 +374,7 @@ export default {
settings: 'Настройки',
shared: 'Общий',
sharedWithMe_title: 'Общие со мной',
showHiddenProjects: 'Показать скрытые проекты',
showOnFrontOfCard: 'Показать на лицевой стороне карточки',
smtp: 'SMTP',
sortList_title: 'Сортировка списка',
@@ -459,6 +467,7 @@ export default {
addCustomField: 'Добавить настраиваемое поле',
addCustomFieldGroup: 'Добавить группу настраиваемых полей',
addList: 'Добавить список',
addLabel: 'Добавить метку',
addMember: 'Добавить участника',
addMoreDetailedDescription: 'Добавить более подробное описание',
addTask: 'Добавить задачу',
@@ -475,6 +484,7 @@ export default {
back: 'Назад',
cancel: 'Отменить',
changePassword: 'Изменить пароль',
close: 'Закрыть',
copy: 'Копировать',
copyAll: 'Копировать все',
copyCard_title: 'Копировать карточку',
@@ -536,9 +546,15 @@ export default {
editTitle_title: 'Изменить название',
editType_title: 'Изменить тип',
editUsername_title: 'Изменить имя пользователя',
enableEditMode: 'Включить режим редактирования',
emptyTrash: 'Очистить корзину',
emptyTrash_title: 'Очистить корзину',
disableEditMode: 'Выключить режим редактирования',
enable2fa: 'Включить 2FA',
filterByCurrentUser: 'Фильтр по текущему пользователю',
goBack: 'Назад',
hideHiddenProjects: 'Скрыть скрытые проекты',
hideProjectList: 'Скрыть список проектов',
import: 'Импорт',
join: 'Присоединиться',
leave: 'Покинуть',
@@ -554,6 +570,7 @@ export default {
move: 'Переместить',
moveCard_title: 'Переместить карточку',
moveList_title: 'Переместить список',
paste: 'Вставить',
regenerate: 'Перегенерировать',
regenerateApiKey: 'Перегенерировать ключ API',
regenerateRecoveryCodes: 'Перегенерировать коды восстановления',
@@ -568,9 +585,11 @@ export default {
reset2fa: 'Сбросить 2FA',
restoreToList: 'Восстановить в {{list}}',
returnToBoard: 'Вернуться на доску',
returnToProjects: 'Вернуться к проектам',
revoke: 'Отозвать',
save: 'Сохранить',
sendTestEmail: 'Отправить тестовое письмо',
showProjectList: 'Показать список проектов',
showActive: 'Показать активные',
showAllAttachments: 'Показать все вложения ({{hidden}} скрыто)',
showCardsWithThisUser: 'Показать карточки с этим пользователем',
@@ -583,6 +602,13 @@ export default {
stayLoggedIn: 'Остаться в системе',
stop: 'Остановить',
subscribe: 'Подписаться',
switchToGridProjectsView: 'Показать проекты сеткой',
switchToGridView: 'Переключиться на вид сетки',
switchToGroupedProjectsView: 'Показать проекты по группам',
switchToKanbanView: 'Переключиться на вид канбана',
switchToListView: 'Переключиться на вид списка',
unlinkSso: 'Отвязать SSO',
unlinkSso_title: 'Отвязать SSO',
unsubscribe: 'Отписаться',
uploadNewAvatar: 'Загрузить новый аватар',
uploadNewImage: 'Загрузить новое изображение',