diff --git a/app/components/Sidebar/Main.js b/app/components/Sidebar/Main.js index cecaba4da..6ad929cc9 100644 --- a/app/components/Sidebar/Main.js +++ b/app/components/Sidebar/Main.js @@ -1,15 +1,13 @@ // @flow import { observer } from "mobx-react"; import { - ArchiveIcon, - HomeIcon, EditIcon, - SearchIcon, - StarredIcon, - ShapesIcon, - TrashIcon, + HomeIcon, PlusIcon, + SearchIcon, SettingsIcon, + ShapesIcon, + StarredIcon, } from "outline-icons"; import * as React from "react"; import { DndProvider } from "react-dnd"; @@ -23,16 +21,22 @@ import Flex from "components/Flex"; import Modal from "components/Modal"; import Scrollable from "components/Scrollable"; import Sidebar from "./Sidebar"; +import ArchiveLink from "./components/ArchiveLink"; import Collections from "./components/Collections"; import Section from "./components/Section"; import SidebarLink from "./components/SidebarLink"; import TeamButton from "./components/TeamButton"; +import TrashLink from "./components/TrashLink"; +import useCurrentTeam from "hooks/useCurrentTeam"; +import useCurrentUser from "hooks/useCurrentUser"; import useStores from "hooks/useStores"; import AccountMenu from "menus/AccountMenu"; function MainSidebar() { const { t } = useTranslation(); - const { policies, auth, documents } = useStores(); + const { policies, documents } = useStores(); + const team = useCurrentTeam(); + const user = useCurrentUser(); const [inviteModalOpen, setInviteModalOpen] = React.useState(false); const [ createCollectionModalOpen, @@ -71,9 +75,6 @@ function MainSidebar() { dndArea, ]); - const { user, team } = auth; - if (!user || !team) return null; - const can = policies.abilities(team.id); return ( @@ -151,27 +152,8 @@ function MainSidebar() { documents.active ? documents.active.template : undefined } /> - } - exact={false} - label={t("Archive")} - active={ - documents.active - ? documents.active.isArchived && - !documents.active.isDeleted - : undefined - } - /> - } - exact={false} - label={t("Trash")} - active={ - documents.active ? documents.active.isDeleted : undefined - } - /> + + )} { + const document = documents.get(item.id); + await document.archive(); + showToast(t("Document archived"), { type: "success" }); + }, + canDrop: (item, monitor) => policies.abilities(item.id).archive, + collect: (monitor) => ({ + isDocumentDropping: monitor.isOver(), + }), + }); + + return ( +
+ } + exact={false} + label={t("Archive")} + active={documents.active?.isArchived && !documents.active?.isDeleted} + isActiveDrop={isDocumentDropping} + /> +
+ ); +} + +export default observer(ArchiveLink); diff --git a/app/components/Sidebar/components/DocumentLink.js b/app/components/Sidebar/components/DocumentLink.js index d813c08ea..1c6d67985 100644 --- a/app/components/Sidebar/components/DocumentLink.js +++ b/app/components/Sidebar/components/DocumentLink.js @@ -133,7 +133,11 @@ function DocumentLink( isDragging: !!monitor.isDragging(), }), canDrag: (monitor) => { - return policies.abilities(node.id).move; + return ( + policies.abilities(node.id).move || + policies.abilities(node.id).archive || + policies.abilities(node.id).delete + ); }, }); diff --git a/app/components/Sidebar/components/TrashLink.js b/app/components/Sidebar/components/TrashLink.js new file mode 100644 index 000000000..687b24434 --- /dev/null +++ b/app/components/Sidebar/components/TrashLink.js @@ -0,0 +1,62 @@ +// @flow +import { observer } from "mobx-react"; +import { TrashIcon } from "outline-icons"; +import * as React from "react"; +import { useState } from "react"; +import { useDrop } from "react-dnd"; +import { useTranslation } from "react-i18next"; +import DocumentDelete from "scenes/DocumentDelete"; +import Modal from "components/Modal"; +import useStores from "../../../hooks/useStores"; +import SidebarLink from "./SidebarLink"; + +function TrashLink({ documents }) { + const { policies } = useStores(); + const { t } = useTranslation(); + const [document, setDocument] = useState(); + + const [{ isDocumentDropping }, dropToTrashDocument] = useDrop({ + accept: "document", + drop: (item, monitor) => { + const doc = documents.get(item.id); + // without setTimeout it was not working in firefox v89.0.2-ubuntu + // on dropping mouseup is considered as clicking outside the modal, and it immediately closes + setTimeout(() => setDocument(doc), 1); + }, + canDrop: (item, monitor) => policies.abilities(item.id).delete, + collect: (monitor) => ({ + isDocumentDropping: monitor.isOver(), + }), + }); + + return ( + <> +
+ } + exact={false} + label={t("Trash")} + active={documents.active?.isDeleted} + isActiveDrop={isDocumentDropping} + /> +
+ {document && ( + setDocument(undefined)} + isOpen + > + setDocument(undefined)} + /> + + )} + + ); +} + +export default observer(TrashLink); diff --git a/package.json b/package.json index 3edb63eca..95325cb40 100644 --- a/package.json +++ b/package.json @@ -112,7 +112,7 @@ "mobx-react": "^6.3.1", "natural-sort": "^1.0.0", "nodemailer": "^6.4.16", - "outline-icons": "^1.27.0", + "outline-icons": "^1.27.2", "oy-vey": "^0.10.0", "passport": "^0.4.1", "passport-google-oauth2": "^0.2.0", diff --git a/shared/i18n/locales/en_US/translation.json b/shared/i18n/locales/en_US/translation.json index feda1c99a..4e7022d93 100644 --- a/shared/i18n/locales/en_US/translation.json +++ b/shared/i18n/locales/en_US/translation.json @@ -119,11 +119,13 @@ "Dismiss": "Dismiss", "Keyboard shortcuts": "Keyboard shortcuts", "Back": "Back", + "Document archived": "Document archived", "Collections could not be loaded, please reload the app": "Collections could not be loaded, please reload the app", "New collection": "New collection", "Collections": "Collections", "Untitled": "Untitled", "Document not supported – try Markdown, Plain text, HTML, or Word": "Document not supported – try Markdown, Plain text, HTML, or Word", + "Delete {{ documentName }}": "Delete {{ documentName }}", "Home": "Home", "Starred": "Starred", "Settings": "Settings", @@ -177,7 +179,6 @@ "Alphabetical sort": "Alphabetical sort", "Manual sort": "Manual sort", "Document duplicated": "Document duplicated", - "Document archived": "Document archived", "Document restored": "Document restored", "Document unpublished": "Document unpublished", "Document options": "Document options", @@ -197,7 +198,6 @@ "Download": "Download", "Print": "Print", "Move {{ documentName }}": "Move {{ documentName }}", - "Delete {{ documentName }}": "Delete {{ documentName }}", "Permanently delete {{ documentName }}": "Permanently delete {{ documentName }}", "Edit group": "Edit group", "Delete group": "Delete group", diff --git a/yarn.lock b/yarn.lock index 7d04dc6ff..527802664 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9817,10 +9817,10 @@ os-name@^3.1.0: macos-release "^2.2.0" windows-release "^3.1.0" -outline-icons@^1.26.1, outline-icons@^1.27.0: - version "1.27.0" - resolved "https://registry.yarnpkg.com/outline-icons/-/outline-icons-1.27.0.tgz#0d923a0b81fe2f3eac1ee5ffe9617158d41e4c29" - integrity sha512-YGm0IjCGO3+dduESI4aU/VMmu5uVJwsbStGn6+fRVZLryv2HEFcfofgF93AvPnc8AdFgF9xwzyYisnzpLjhPbA== +outline-icons@^1.26.1, outline-icons@^1.27.2: + version "1.27.2" + resolved "https://registry.yarnpkg.com/outline-icons/-/outline-icons-1.27.2.tgz#9ff2ba209ba77a94f6a2a19ae0cbee403973d7c2" + integrity sha512-cvvJ3Ockcqsj5zphTCK5OzKGBMXmFVCe0OhuiNdtt1gVS+/yAE2fIs93RlW2ERIEIDsAlWrK6oBvDFpIgEHiQw== oy-vey@^0.10.0: version "0.10.0"