From 234760c1f4e15541d59bd58948f930f63fc09320 Mon Sep 17 00:00:00 2001 From: Tudor Stanciu Date: Tue, 13 Dec 2022 18:18:00 +0200 Subject: [PATCH] resources components refactoring --- src/components/Layout/Content.js | 4 +-- src/{ => features/resources}/api/index.js | 0 .../resources}/api/useDictionariesApi.js | 4 +-- .../resources}/api/useResourcesApi.js | 18 +++++++--- .../resources/components/ResourceContainer.js | 15 -------- .../edit/components/ResourceContainer.js | 36 +++++++++++++++++++ .../{ => list}/components/ActionButton.js | 0 .../components/ResourcesContainer.js | 10 +++--- .../components/SecondaryActionsGroup.js | 0 src/hooks/index.js | 3 +- src/{api => hooks}/useHttpRequest.js | 0 11 files changed, 61 insertions(+), 29 deletions(-) rename src/{ => features/resources}/api/index.js (100%) rename src/{ => features/resources}/api/useDictionariesApi.js (87%) rename src/{ => features/resources}/api/useResourcesApi.js (72%) delete mode 100644 src/features/resources/components/ResourceContainer.js create mode 100644 src/features/resources/edit/components/ResourceContainer.js rename src/features/resources/{ => list}/components/ActionButton.js (100%) rename src/features/resources/{ => list}/components/ResourcesContainer.js (97%) rename src/features/resources/{ => list}/components/SecondaryActionsGroup.js (100%) rename src/{api => hooks}/useHttpRequest.js (100%) diff --git a/src/components/Layout/Content.js b/src/components/Layout/Content.js index 36eb934..75d1f9e 100644 --- a/src/components/Layout/Content.js +++ b/src/components/Layout/Content.js @@ -14,8 +14,8 @@ import AppearancePage from "../../pages/settings/appearance/components/Appearanc import ContentFooter from "./ContentFooter"; // containers -import ResourcesContainer from "../../features/resources/components/ResourcesContainer"; -import ResourceContainer from "../../features/resources/components/ResourceContainer"; +import ResourcesContainer from "../../features/resources/list/components/ResourcesContainer"; +import ResourceContainer from "../../features/resources/edit/components/ResourceContainer"; // context import { useLayoutState } from "../../contexts/LayoutContext"; diff --git a/src/api/index.js b/src/features/resources/api/index.js similarity index 100% rename from src/api/index.js rename to src/features/resources/api/index.js diff --git a/src/api/useDictionariesApi.js b/src/features/resources/api/useDictionariesApi.js similarity index 87% rename from src/api/useDictionariesApi.js rename to src/features/resources/api/useDictionariesApi.js index 361e9f3..e30a62a 100644 --- a/src/api/useDictionariesApi.js +++ b/src/features/resources/api/useDictionariesApi.js @@ -1,6 +1,6 @@ import { useCallback } from "react"; -import useHttpRequest from "./useHttpRequest"; -import { get } from "../utils/axios"; +import useHttpRequest from "../../../hooks/useHttpRequest"; +import { get } from "../../../utils/axios"; const cdn = process.env.REACT_APP_CDN_URL; const endpoints = { diff --git a/src/api/useResourcesApi.js b/src/features/resources/api/useResourcesApi.js similarity index 72% rename from src/api/useResourcesApi.js rename to src/features/resources/api/useResourcesApi.js index 5906cc6..9dc1c1e 100644 --- a/src/api/useResourcesApi.js +++ b/src/features/resources/api/useResourcesApi.js @@ -1,7 +1,7 @@ import { useCallback } from "react"; -import useHttpRequest from "./useHttpRequest"; -import { get } from "../utils/axios"; -import { defaultResourcesFilters } from "../constants/resourcesConstants"; +import useHttpRequest from "../../../hooks/useHttpRequest"; +import { get } from "../../../utils/axios"; +import { defaultResourcesFilters } from "../../../constants/resourcesConstants"; const cdn = process.env.REACT_APP_CDN_URL; @@ -41,8 +41,18 @@ const useResourcesApi = () => { [exec] ); + const getResource = useCallback( + (resourceId, options) => { + const endpoint = `${cdn}/admin/resource?ResourceId=${resourceId}`; + const promise = exec(() => get(endpoint), options); + return promise; + }, + [exec] + ); + return { - getResources + getResources, + getResource }; }; diff --git a/src/features/resources/components/ResourceContainer.js b/src/features/resources/components/ResourceContainer.js deleted file mode 100644 index 72ecc50..0000000 --- a/src/features/resources/components/ResourceContainer.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; -import PageTitle from "../../../components/PageTitle"; -import { useParams } from "react-router-dom"; - -const ResourceContainer = () => { - const params = useParams(); - return ( - <> - - <>................. - - ); -}; - -export default ResourceContainer; diff --git a/src/features/resources/edit/components/ResourceContainer.js b/src/features/resources/edit/components/ResourceContainer.js new file mode 100644 index 0000000..06764ac --- /dev/null +++ b/src/features/resources/edit/components/ResourceContainer.js @@ -0,0 +1,36 @@ +import React, { useState, useMemo, useEffect } from "react"; +import PageTitle from "../../../../components/PageTitle"; +import { useParams } from "react-router-dom"; +import { useResourcesApi } from "../../api"; +import { LoadingText } from "../../../../components"; + +const ResourceContainer = () => { + const [state, setState] = useState(null); + const [loading, setLoading] = useState(false); + + const params = useParams(); + const { getResource } = useResourcesApi(); + + const isNew = useMemo(() => params.id === "new", [params.id]); + + useEffect(() => { + if (isNew) return; + const resourceId = parseInt(params.id); + setLoading(true); + getResource(resourceId).then((resource) => { + setState(resource); + setLoading(false); + }); + }, [getResource, isNew, params.id]); + + if (loading || state === null) return ; + + return ( + <> + + <>................. + + ); +}; + +export default ResourceContainer; diff --git a/src/features/resources/components/ActionButton.js b/src/features/resources/list/components/ActionButton.js similarity index 100% rename from src/features/resources/components/ActionButton.js rename to src/features/resources/list/components/ActionButton.js diff --git a/src/features/resources/components/ResourcesContainer.js b/src/features/resources/list/components/ResourcesContainer.js similarity index 97% rename from src/features/resources/components/ResourcesContainer.js rename to src/features/resources/list/components/ResourcesContainer.js index 99bf390..38f3ab2 100644 --- a/src/features/resources/components/ResourcesContainer.js +++ b/src/features/resources/list/components/ResourcesContainer.js @@ -1,10 +1,10 @@ import React, { useState, useEffect, useMemo, useCallback } from "react"; import { Checkbox, FormLabel } from "@material-ui/core"; import MUIDataTable, { debounceSearchRender } from "mui-datatables"; -import { LoadingText } from "../../../components"; -import PageTitle from "../../../components/PageTitle"; -import { useResourcesApi, useDictionariesApi } from "../../../api"; -import { defaultResourcesFilters } from "../../../constants/resourcesConstants"; +import { LoadingText } from "../../../../components"; +import PageTitle from "../../../../components/PageTitle"; +import { useResourcesApi, useDictionariesApi } from "../../api"; +import { defaultResourcesFilters } from "../../../../constants/resourcesConstants"; import { useTranslation } from "react-i18next"; import ActionButton from "./ActionButton"; import SecondaryActionsGroup from "./SecondaryActionsGroup"; @@ -13,7 +13,7 @@ import { FileCopyOutlined, OpenInNewOutlined } from "@material-ui/icons"; -import { useToast, useResourceSecurity } from "../../../hooks"; +import { useToast, useResourceSecurity } from "../../../../hooks"; import { useHistory } from "react-router-dom"; const __ROWS_PER_PAGE_OPTIONS = [10, 20, 50, 100]; diff --git a/src/features/resources/components/SecondaryActionsGroup.js b/src/features/resources/list/components/SecondaryActionsGroup.js similarity index 100% rename from src/features/resources/components/SecondaryActionsGroup.js rename to src/features/resources/list/components/SecondaryActionsGroup.js diff --git a/src/hooks/index.js b/src/hooks/index.js index 51d6f91..29909e5 100644 --- a/src/hooks/index.js +++ b/src/hooks/index.js @@ -1,4 +1,5 @@ import { useToast } from "../contexts/ToastContext"; +import useHttpRequest from "./useHttpRequest"; import useResourceSecurity from "./useResourceSecurity"; -export { useToast, useResourceSecurity }; +export { useToast, useHttpRequest, useResourceSecurity }; diff --git a/src/api/useHttpRequest.js b/src/hooks/useHttpRequest.js similarity index 100% rename from src/api/useHttpRequest.js rename to src/hooks/useHttpRequest.js