diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json
index cdd4b20..ea13de5 100644
--- a/public/locales/en/translations.json
+++ b/public/locales/en/translations.json
@@ -38,7 +38,10 @@
"ViewColumns": {
"Title": "Show columns"
}
- }
+ },
+ "Edit": "Edit",
+ "More": "More",
+ "OpenInNewTab": "Open in new tab"
},
"Menu": {
"Dashboard": "Dashboard",
@@ -78,6 +81,10 @@
"Code": "Code contains: {{value}}",
"Name": "Name contains: {{value}}",
"Category": "Category: {{value}}"
+ },
+ "Actions": {
+ "CopyUrl": "Copy resource URL",
+ "LinkCopiedToClipboard": "The link has been copied to the clipboard."
}
}
}
diff --git a/public/locales/ro/translations.json b/public/locales/ro/translations.json
index 50d0a7c..8a3a6b2 100644
--- a/public/locales/ro/translations.json
+++ b/public/locales/ro/translations.json
@@ -29,7 +29,10 @@
"ViewColumns": {
"Title": "Afișați coloanele"
}
- }
+ },
+ "Edit": "Editează",
+ "More": "Mai mult",
+ "OpenInNewTab": "Deschide într-un tab nou"
},
"Menu": {
"Dashboard": "Dashboard",
@@ -69,6 +72,10 @@
"Code": "Codul conține: {{value}}",
"Name": "Numele conține: {{value}}",
"Category": "Categorie: {{value}}"
+ },
+ "Actions": {
+ "CopyUrl": "Copiați adresa URL a resursei",
+ "LinkCopiedToClipboard": "Linkul a fost copiat în clipboard."
}
}
}
diff --git a/src/features/resources/components/ResourcesContainer.js b/src/features/resources/components/ResourcesContainer.js
index 5b9990b..46e1184 100644
--- a/src/features/resources/components/ResourcesContainer.js
+++ b/src/features/resources/components/ResourcesContainer.js
@@ -1,5 +1,5 @@
import React, { useState, useEffect, useMemo, useCallback } from "react";
-import { Checkbox, FormLabel, Menu } from "@material-ui/core";
+import { Checkbox, FormLabel } from "@material-ui/core";
import MUIDataTable, { debounceSearchRender } from "mui-datatables";
import { LoadingText } from "../../../components";
import PageTitle from "../../../components/PageTitle";
@@ -7,12 +7,13 @@ import { useResourcesApi, useDictionariesApi } from "../../../api";
import { defaultResourcesFilters } from "../../../constants/resourcesConstants";
import { useTranslation } from "react-i18next";
import ActionButton from "./ActionButton";
+import SecondaryActionsGroup from "./SecondaryActionsGroup";
import {
EditOutlined,
FileCopyOutlined,
- MoreHorizOutlined,
OpenInNewOutlined
} from "@material-ui/icons";
+import { useToast } from "../../../context/ToastContext";
const __ROWS_PER_PAGE_OPTIONS = [10, 20, 50, 100];
const __RESOURCE_NAME_MAX_LENGTH = 35;
@@ -26,9 +27,9 @@ const ResourcesContainer = () => {
const [loading, setLoading] = useState(false);
const [filters, setFilters] = useState({ ...defaultResourcesFilters });
const [resourceCategories, setResourceCategories] = useState([]);
- const [secondaryActionsAnchor, setSecondaryActionsAnchor] = useState(null);
const { t } = useTranslation();
+ const { info } = useToast();
const { getResources } = useResourcesApi();
const { getResourceCategories } = useDictionariesApi();
@@ -74,24 +75,17 @@ const ResourcesContainer = () => {
code: "edit",
effect: () => alert("edit"),
icon: EditOutlined,
- tooltip: t("Resource.Actions.Edit"),
+ tooltip: t("Generic.Edit"),
top: true
},
{
code: "copy-url",
- effect: (event, resource) => {
- window.open(resource.url, "_blank");
- event.preventDefault();
+ effect: (_event, resource) => {
+ navigator.clipboard.writeText(resource.url);
+ info(t("Resource.List.Actions.LinkCopiedToClipboard"));
},
icon: FileCopyOutlined,
- tooltip: t("Resource.Actions.CopyUrl"),
- top: true
- },
- {
- code: "more",
- effect: (event) => setSecondaryActionsAnchor(event.currentTarget),
- icon: MoreHorizOutlined,
- tooltip: t("Resource.Actions.More"),
+ tooltip: t("Resource.List.Actions.CopyUrl"),
top: true
},
{
@@ -101,20 +95,11 @@ const ResourcesContainer = () => {
event.preventDefault();
},
icon: OpenInNewOutlined,
- tooltip: t("Resource.Actions.OpenInNewTab"),
+ tooltip: t("Generic.OpenInNewTab"),
top: false
}
],
- [t]
- );
-
- const topActions = useMemo(() => actions.filter((a) => a.top === true), [
- actions
- ]);
-
- const secondaryActions = useMemo(
- () => actions.filter((a) => a.top === false),
- [actions]
+ [t, info]
);
const columns = useMemo(
@@ -261,28 +246,19 @@ const ResourcesContainer = () => {
const resource = state.values[dataIndex];
return (
<>
- {topActions.map((action) => (
-