diff --git a/app/actions/definitions/collections.tsx b/app/actions/definitions/collections.tsx
index 697364032..6733ccecc 100644
--- a/app/actions/definitions/collections.tsx
+++ b/app/actions/definitions/collections.tsx
@@ -4,6 +4,7 @@ import {
PadlockIcon,
PlusIcon,
StarredIcon,
+ TrashIcon,
UnstarredIcon,
} from "outline-icons";
import * as React from "react";
@@ -12,6 +13,7 @@ import Collection from "~/models/Collection";
import CollectionEdit from "~/scenes/CollectionEdit";
import CollectionNew from "~/scenes/CollectionNew";
import CollectionPermissions from "~/scenes/CollectionPermissions";
+import CollectionDeleteDialog from "~/components/CollectionDeleteDialog";
import DynamicCollectionIcon from "~/components/Icons/CollectionIcon";
import { createAction } from "~/actions";
import { CollectionSection } from "~/actions/sections";
@@ -158,9 +160,44 @@ export const unstarCollection = createAction({
},
});
+export const deleteCollection = createAction({
+ name: ({ t }) => t("Delete"),
+ analyticsName: "Delete collection",
+ section: CollectionSection,
+ icon: ,
+ visible: ({ activeCollectionId, stores }) => {
+ if (!activeCollectionId) {
+ return false;
+ }
+ return stores.policies.abilities(activeCollectionId).delete;
+ },
+ perform: ({ activeCollectionId, stores, t }) => {
+ if (!activeCollectionId) {
+ return;
+ }
+
+ const collection = stores.collections.get(activeCollectionId);
+ if (!collection) {
+ return;
+ }
+
+ stores.dialogs.openModal({
+ isCentered: true,
+ title: t("Delete collection"),
+ content: (
+
+ ),
+ });
+ },
+});
+
export const rootCollectionActions = [
openCollection,
createCollection,
starCollection,
unstarCollection,
+ deleteCollection,
];
diff --git a/app/menus/CollectionMenu.tsx b/app/menus/CollectionMenu.tsx
index 023e90717..fc5a79ce4 100644
--- a/app/menus/CollectionMenu.tsx
+++ b/app/menus/CollectionMenu.tsx
@@ -1,13 +1,10 @@
import { observer } from "mobx-react";
import {
NewDocumentIcon,
- TrashIcon,
ImportIcon,
ExportIcon,
AlphabeticalSortIcon,
ManualSortIcon,
- UnstarredIcon,
- StarredIcon,
} from "outline-icons";
import * as React from "react";
import { useTranslation } from "react-i18next";
@@ -16,15 +13,17 @@ import { useMenuState, MenuButton, MenuButtonHTMLProps } from "reakit/Menu";
import { VisuallyHidden } from "reakit/VisuallyHidden";
import { getEventFiles } from "@shared/utils/files";
import Collection from "~/models/Collection";
-import CollectionDeleteDialog from "~/components/CollectionDeleteDialog";
import ContextMenu, { Placement } from "~/components/ContextMenu";
import OverflowMenuButton from "~/components/ContextMenu/OverflowMenuButton";
import Template from "~/components/ContextMenu/Template";
import ExportDialog from "~/components/ExportDialog";
import { actionToMenuItem } from "~/actions";
import {
+ deleteCollection,
editCollection,
editCollectionPermissions,
+ starCollection,
+ unstarCollection,
} from "~/actions/definitions/collections";
import useActionContext from "~/hooks/useActionContext";
import useCurrentTeam from "~/hooks/useCurrentTeam";
@@ -139,37 +138,6 @@ function CollectionMenu({
[collection, menu]
);
- const handleDelete = React.useCallback(() => {
- dialogs.openModal({
- isCentered: true,
- title: t("Delete collection"),
- content: (
-
- ),
- });
- }, [dialogs, t, collection]);
-
- const handleStar = React.useCallback(
- (ev: React.SyntheticEvent) => {
- ev.preventDefault();
- ev.stopPropagation();
- collection.star();
- },
- [collection]
- );
-
- const handleUnstar = React.useCallback(
- (ev: React.SyntheticEvent) => {
- ev.preventDefault();
- ev.stopPropagation();
- collection.unstar();
- },
- [collection]
- );
-
const context = useActionContext({
isContextMenu: true,
activeCollectionId: collection.id,
@@ -180,20 +148,8 @@ function CollectionMenu({
const canUserInTeam = usePolicy(team);
const items: MenuItem[] = React.useMemo(
() => [
- {
- type: "button",
- title: t("Unstar"),
- onClick: handleUnstar,
- visible: collection.isStarred && !!can.unstar,
- icon: ,
- },
- {
- type: "button",
- title: t("Star"),
- onClick: handleStar,
- visible: !collection.isStarred && !!can.star,
- icon: ,
- },
+ actionToMenuItem(starCollection, context),
+ actionToMenuItem(unstarCollection, context),
{
type: "separator",
},
@@ -246,32 +202,20 @@ function CollectionMenu({
{
type: "separator",
},
- {
- type: "button",
- title: `${t("Delete")}…`,
- dangerous: true,
- visible: !!(collection && can.delete),
- onClick: handleDelete,
- icon: ,
- },
+ actionToMenuItem(deleteCollection, context),
],
[
t,
- handleUnstar,
collection,
- can.unstar,
- can.star,
can.createDocument,
can.update,
- can.delete,
- handleStar,
+ can.export,
handleNewDocument,
handleImportDocument,
context,
alphabeticalSort,
canUserInTeam.createExport,
handleExport,
- handleDelete,
handleChangeSort,
]
);
diff --git a/shared/i18n/locales/en_US/translation.json b/shared/i18n/locales/en_US/translation.json
index b45852345..36de57089 100644
--- a/shared/i18n/locales/en_US/translation.json
+++ b/shared/i18n/locales/en_US/translation.json
@@ -8,6 +8,8 @@
"Collection permissions": "Collection permissions",
"Star": "Star",
"Unstar": "Unstar",
+ "Delete": "Delete",
+ "Delete collection": "Delete collection",
"Delete IndexedDB cache": "Delete IndexedDB cache",
"IndexedDB cache deleted": "IndexedDB cache deleted",
"Developer": "Developer",
@@ -48,7 +50,6 @@
"Move {{ documentType }}": "Move {{ documentType }}",
"Archive": "Archive",
"Document archived": "Document archived",
- "Delete": "Delete",
"Delete {{ documentName }}": "Delete {{ documentName }}",
"Permanently delete": "Permanently delete",
"Permanently delete {{ documentName }}": "Permanently delete {{ documentName }}",
@@ -330,7 +331,6 @@
"Group member options": "Group member options",
"Remove": "Remove",
"Export collection": "Export collection",
- "Delete collection": "Delete collection",
"Sort in sidebar": "Sort in sidebar",
"Alphabetical sort": "Alphabetical sort",
"Manual sort": "Manual sort",