diff --git a/src/components/common/DeleteButton.tsx b/src/components/common/DeleteButton.tsx index 044f3c7f6..59fb3e1ad 100644 --- a/src/components/common/DeleteButton.tsx +++ b/src/components/common/DeleteButton.tsx @@ -46,7 +46,10 @@ const DeleteButton = ({ onClose?.(); }; - const text = translateBuilder(BUILDER.DELETE_BUTTON); + const text = + items.length > 1 + ? translateBuilder(BUILDER.DELETE_ALL_SELECTED_ITEMS_BUTTON) + : translateBuilder(BUILDER.DELETE_BUTTON); return ( <> diff --git a/src/components/common/QRCode.tsx b/src/components/common/QRCode.tsx index c6bf9d7d6..660c24e58 100644 --- a/src/components/common/QRCode.tsx +++ b/src/components/common/QRCode.tsx @@ -1,9 +1,10 @@ import { useState } from 'react'; import QR from 'react-qr-code'; -import { Close, QrCode2 } from '@mui/icons-material'; import { Box, Dialog, DialogContent, IconButton, Tooltip } from '@mui/material'; +import { QrCodeIcon, XIcon } from 'lucide-react'; + import { useBuilderTranslation } from '@/config/i18n'; import { SHARE_ITEM_QR_BTN_ID, @@ -28,7 +29,7 @@ const QRCode = ({ value, disabled = false }: Props): JSX.Element => { id={SHARE_ITEM_QR_BTN_ID} disabled={disabled} > - + { top: 8, }} > - + diff --git a/src/components/common/RestoreButton.tsx b/src/components/common/RestoreButton.tsx index 9bfd99d67..397d30755 100644 --- a/src/components/common/RestoreButton.tsx +++ b/src/components/common/RestoreButton.tsx @@ -1,6 +1,7 @@ -import { RestoreFromTrash } from '@mui/icons-material'; import { IconButton, IconButtonProps, Tooltip } from '@mui/material'; +import { Undo2Icon } from 'lucide-react'; + import { useBuilderTranslation } from '../../config/i18n'; import { mutations } from '../../config/queryClient'; import { RESTORE_ITEMS_BUTTON_CLASS } from '../../config/selectors'; @@ -28,7 +29,11 @@ const RestoreButton = ({ onClickFn?.(); }; - const title = translateBuilder(BUILDER.RESTORE_ITEM_BUTTON); + const title = + // adapt the tooltip to the number of items that will be restored + itemIds.length > 1 + ? translateBuilder(BUILDER.RESTORE_ALL_SELECTED_ITEMS_BUTTON) + : translateBuilder(BUILDER.RESTORE_ITEM_BUTTON); return ( @@ -40,7 +45,7 @@ const RestoreButton = ({ className={RESTORE_ITEMS_BUTTON_CLASS} onClick={onClick} > - + diff --git a/src/components/item/header/ItemHeaderActions.tsx b/src/components/item/header/ItemHeaderActions.tsx index 0bfb8214d..423aa30eb 100644 --- a/src/components/item/header/ItemHeaderActions.tsx +++ b/src/components/item/header/ItemHeaderActions.tsx @@ -79,7 +79,7 @@ const ItemHeaderActions = ({ itemId }: Props): JSX.Element | null => { { onClick={() => onChange(randomAlias())} id={SHORT_LINK_RANDOMIZE_BUTTON_ID} > - + diff --git a/src/components/item/sharing/shortLink/ConfirmDeleteLink.tsx b/src/components/item/sharing/shortLink/ConfirmDeleteLink.tsx index 1ae110b78..0f0927caa 100644 --- a/src/components/item/sharing/shortLink/ConfirmDeleteLink.tsx +++ b/src/components/item/sharing/shortLink/ConfirmDeleteLink.tsx @@ -51,38 +51,36 @@ const ConfirmDeleteLink = ({ const CONFIRM_DELETE_DIALOG_DESC = `alert-dialog-desc-delete-${shortLink}`; return ( -
- - - {translateBuilder(BUILDER.CONFIRM_DELETE_SHORT_LINK_TITLE)} - - - - {translateBuilder(BUILDER.CONFIRM_DELETE_SHORT_LINK_MSG, { - shortLink, - })} - - - - - - - -
+ + + {translateBuilder(BUILDER.CONFIRM_DELETE_SHORT_LINK_TITLE)} + + + + {translateBuilder(BUILDER.CONFIRM_DELETE_SHORT_LINK_MSG, { + shortLink, + })} + + + + + + + ); }; diff --git a/src/components/item/sharing/shortLink/ShortLinkMenu.tsx b/src/components/item/sharing/shortLink/ShortLinkMenu.tsx index a90ac1a77..9688784d2 100644 --- a/src/components/item/sharing/shortLink/ShortLinkMenu.tsx +++ b/src/components/item/sharing/shortLink/ShortLinkMenu.tsx @@ -1,10 +1,5 @@ import React, { useState } from 'react'; -import CreateIcon from '@mui/icons-material/Create'; -import DeleteIcon from '@mui/icons-material/Delete'; -import EditIcon from '@mui/icons-material/Edit'; -import FileCopyIcon from '@mui/icons-material/FileCopy'; -import MoreVertIcon from '@mui/icons-material/MoreVert'; import { IconButton, ListItemIcon, @@ -18,6 +13,8 @@ import { import { ShortLink, ShortLinkPayload } from '@graasp/sdk'; import { FAILURE_MESSAGES, SUCCESS_MESSAGES } from '@graasp/translations'; +import { CopyIcon, MoreVerticalIcon, PenIcon, TrashIcon } from 'lucide-react'; + import QRCode from '@/components/common/QRCode'; import { useBuilderTranslation, useMessagesTranslation } from '@/config/i18n'; import notifier from '@/config/notifier'; @@ -108,7 +105,7 @@ const ShortLinkMenu = ({ - + @@ -123,7 +120,7 @@ const ShortLinkMenu = ({ id={buildShortLinkMenuBtnId(alias)} onClick={handleMenuClick} > - + - + {translateBuilder(BUILDER.EDIT_SHORT_LINK_TITLE)} @@ -147,7 +144,7 @@ const ShortLinkMenu = ({ id={buildShortLinkDeleteBtnId(alias)} > - + {translateBuilder(BUILDER.DELETE_SHORT_LINK_TITLE)} @@ -164,7 +161,7 @@ const ShortLinkMenu = ({ id={buildShortLinkShortenBtnId(itemId, platform)} onClick={() => onCreate(platform)} > - + diff --git a/src/components/main/list/SelectionToolbar.tsx b/src/components/main/list/SelectionToolbar.tsx index 5cf6eb331..4589743b6 100644 --- a/src/components/main/list/SelectionToolbar.tsx +++ b/src/components/main/list/SelectionToolbar.tsx @@ -1,6 +1,7 @@ -import { Close } from '@mui/icons-material'; import { IconButton, Stack } from '@mui/material'; +import { XIcon } from 'lucide-react'; + import { useSelectionContext } from './SelectionContext'; const SelectionToolbar = ({ @@ -21,7 +22,7 @@ const SelectionToolbar = ({ > - + {selectedIds.length} selected diff --git a/src/config/env.ts b/src/config/env.ts index faed47996..348f78c58 100644 --- a/src/config/env.ts +++ b/src/config/env.ts @@ -31,7 +31,8 @@ export const GRAASP_ANALYZER_HOST = export const GRAASP_ACCOUNT_HOST = VITE_GRAASP_ACCOUNT_HOST || 'http://localhost:3114'; -export const GRAASP_REDIRECTION_HOST = VITE_GRAASP_REDIRECTION_HOST; +export const GRAASP_REDIRECTION_HOST = + VITE_GRAASP_REDIRECTION_HOST || 'http://localhost:3000/items/short-links'; export const H5P_INTEGRATION_URL = VITE_H5P_INTEGRATION_URL || `${API_HOST}/p/h5p-integration`; diff --git a/src/langs/constants.ts b/src/langs/constants.ts index 5e4fe22b0..c558d092c 100644 --- a/src/langs/constants.ts +++ b/src/langs/constants.ts @@ -42,6 +42,7 @@ export const BUILDER = { CROP_IMAGE_MODAL_IMAGE_ALT_TEXT: 'CROP_IMAGE_MODAL_IMAGE_ALT_TEXT', CROP_IMAGE_MODAL_UNEXPECTED_ERROR: 'CROP_IMAGE_MODAL_UNEXPECTED_ERROR', DELETE_BUTTON: 'DELETE_BUTTON', + DELETE_ALL_SELECTED_ITEMS_BUTTON: 'DELETE_ALL_SELECTED_ITEMS_BUTTON', DELETE_ITEM_MODAL_CONFIRM_BUTTON: 'DELETE_ITEM_MODAL_CONFIRM_BUTTON', DELETE_ITEM_MODAL_CONTENT: 'DELETE_ITEM_MODAL_CONTENT', DELETE_ITEM_MODAL_TITLE: 'DELETE_ITEM_MODAL_TITLE', @@ -104,6 +105,7 @@ export const BUILDER = { BOOKMARKS_NO_ITEM: 'BOOKMARKS_NO_ITEM', BOOKMARKS_NO_ITEM_SEARCH: 'BOOKMARKS_NO_ITEM_SEARCH', RESTORE_ITEM_BUTTON: 'RESTORE_ITEM_BUTTON', + RESTORE_ALL_SELECTED_ITEMS_BUTTON: 'RESTORE_ALL_SELECTED_ITEMS_BUTTON', SHARE_ITEM_BUTTON: 'SHARE_ITEM_BUTTON', ITEM_METADATA_CREATOR_TITLE: 'ITEM_METADATA_CREATOR_TITLE', ITEM_METADATA_TYPE_TITLE: 'ITEM_METADATA_TYPE_TITLE', diff --git a/src/langs/en.json b/src/langs/en.json index 86969882e..86282bb66 100644 --- a/src/langs/en.json +++ b/src/langs/en.json @@ -44,6 +44,7 @@ "CROP_IMAGE_MODAL_IMAGE_ALT_TEXT": "Crop me", "CROP_IMAGE_MODAL_UNEXPECTED_ERROR": "An unexpected error happened, please try again later. You can dismiss this modal, refresh the page and try again. If this issue persists please contact us.", "DELETE_BUTTON": "Delete", + "DELETE_ALL_SELECTED_ITEMS_BUTTON": "Delete all selected", "DELETE_ITEM_MODAL_CONFIRM_BUTTON": "Delete Permanently", "DELETE_ITEM_MODAL_CONTENT_one": "This item will be deleted permanently.", "DELETE_ITEM_MODAL_CONTENT_other": "These items will be deleted permanently.", @@ -258,6 +259,7 @@ "RECYCLE_BIN_TITLE": "Trash", "RECYCLE_ITEM_BUTTON": "Trash", "RESTORE_ITEM_BUTTON": "Restore", + "RESTORE_ALL_SELECTED_ITEMS_BUTTON": "Restore all selected", "SAVE_ACTIONS_TOGGLE_TOOLTIP": "Coming soon!", "SETTINGS_COLLAPSE_FOLDER_INFORMATION": "A folder cannot be collapsed", "SETTINGS_COLLAPSE_LABEL": "Set as collapsible item",