diff --git a/admin/src/pages/HomePage/index.js b/admin/src/pages/HomePage/index.js index 49f9b10..4b0c480 100644 --- a/admin/src/pages/HomePage/index.js +++ b/admin/src/pages/HomePage/index.js @@ -1,7 +1,6 @@ import React, { useCallback, useEffect, useMemo, useState } from "react"; -import { useFetchClient } from "@strapi/helper-plugin"; +import { useFetchClient, usePersistentState } from "@strapi/helper-plugin"; import { HeaderLayout, Icon, LinkButton } from "@strapi/design-system"; -// import explorerRequests from "../../api/explorer-api"; import { Question, Search, Drag } from "@strapi/icons"; import { useTheme } from "styled-components"; import { @@ -33,20 +32,24 @@ import "./styles.css"; const HomePage = () => { const theme = useTheme(); const { get } = useFetchClient(); - const [contentTypes, setContentTypes] = useState([]); - const [options, setOptions] = useState({ - snapToGrid: false, - showTypes: true, - showIcons: true, - showRelationsOnly: false, - showAdminTypes: false, - showDefaultFields: false, - showPluginTypes: false, - showEdges: false, - scrollMode: true, - edgeType: "smartbezier", - backgroundPattern: "dots", - }); + const [contentTypesData, setContentTypesData] = useState([]); + + const [options, setOptions] = usePersistentState( + "content-type-explorer-options", + { + snapToGrid: false, + showTypes: true, + showIcons: true, + showRelationsOnly: false, + showAdminTypes: false, + showDefaultFields: false, + showPluginTypes: false, + showEdges: false, + scrollMode: true, + edgeType: "smartbezier", + backgroundPattern: "dots", + } + ); function toggleOption(optionName, optionValue = null) { setOptions({ @@ -76,17 +79,15 @@ const HomePage = () => { // get (and filter) content-types useEffect(() => { const fetchData = async () => { - const data = await get(`/strapi-content-type-explorer/get-types`); - // console.log("fetching data"); - // let allTypes = await explorerRequests.getContentTypes(); - console.log("Data is", data); - // if (!options.showAdminTypes) { - // allTypes = allTypes.filter((x) => !x.name.startsWith("admin::")); - // } - // if (!options.showPluginTypes) { - // allTypes = allTypes.filter((x) => !x.name.startsWith("plugin::")); - // } - // setContentTypes(allTypes); + const { data } = await get(`/strapi-content-type-explorer/get-types`); + let allTypes = data; + if (!options.showAdminTypes) { + allTypes = allTypes.filter((x) => !x.name.startsWith("admin::")); + } + if (!options.showPluginTypes) { + allTypes = allTypes.filter((x) => !x.name.startsWith("plugin::")); + } + setContentTypesData(allTypes); }; fetchData(); @@ -94,13 +95,13 @@ const HomePage = () => { // create nodes & edges useEffect(() => { - if (contentTypes.length > 0) { - let newNodes = createNodes(contentTypes, options); + if (contentTypesData.length > 0) { + let newNodes = createNodes(contentTypesData, options); setNodes(newNodes); - let newEdges = createEdegs(contentTypes, options); + let newEdges = createEdegs(contentTypesData, options); setEdges(newEdges); } - }, [contentTypes]); + }, [contentTypesData]); useEffect(() => { let newEdges = updateEdges(edges, options); @@ -119,7 +120,7 @@ const HomePage = () => { ]); return ( - <> +