diff --git a/package.json b/package.json index 2d802faa..6e706168 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "redux-saga": "^1.1.1", "sticky-sidebar": "^3.3.1", "swiper": "^6.8.4", + "swr": "^1.0.1", "throttle-debounce": "^2.1.0", "typescript": "^4.0.5", "typograf": "^6.11.3", diff --git a/src/containers/App.tsx b/src/containers/App.tsx index 115bf213..2120ef19 100644 --- a/src/containers/App.tsx +++ b/src/containers/App.tsx @@ -10,25 +10,28 @@ import { MainRouter } from '~/containers/main/MainRouter'; import { DragDetectorProvider } from '~/utils/hooks/useDragDetector'; import { useUser } from '~/utils/hooks/user/userUser'; import { UserContextProvider } from '~/utils/context/UserContextProvider'; +import { SWRProvider } from '~/utils/providers/SWRProvider'; const App: VFC = () => { const user = useUser(); return ( - - - + + + + - - - + + + - - - - - + + + + + + ); }; diff --git a/src/pages/node/[id].tsx b/src/pages/node/[id].tsx index 90bb6209..0ac92aa4 100644 --- a/src/pages/node/[id].tsx +++ b/src/pages/node/[id].tsx @@ -11,7 +11,7 @@ import { NodeContextProvider } from '~/utils/context/NodeContextProvider'; import { CommentContextProvider } from '~/utils/context/CommentContextProvider'; import { TagsContextProvider } from '~/utils/context/TagsContextProvider'; import { useNodePermissions } from '~/utils/hooks/node/useNodePermissions'; -import { NodeRelatedContextProvider } from '~/utils/context/NodeRelatedContextProvider'; +import { NodeRelatedProvider } from '~/utils/providers/NodeRelatedProvider'; type Props = RouteComponentProps<{ id: string }> & {}; @@ -42,7 +42,7 @@ const NodePage: FC = ({ return ( - + = ({ - + ); }; diff --git a/src/utils/providers/NodeRelatedProvider.tsx b/src/utils/providers/NodeRelatedProvider.tsx index 26576c3d..5c2cbf7a 100644 --- a/src/utils/providers/NodeRelatedProvider.tsx +++ b/src/utils/providers/NodeRelatedProvider.tsx @@ -1,18 +1,35 @@ -import { INodeRelated } from '~/redux/node/types'; -import React, { createContext, FC, useContext } from 'react'; +import React, { FC } from 'react'; +import { INode } from '~/redux/types'; +import { NodeRelatedContextProvider } from '~/utils/context/NodeRelatedContextProvider'; +import { ApiGetNodeRelatedResult, INodeRelated } from '~/redux/node/types'; +import useSWR from 'swr'; +import { API } from '~/constants/api'; +import { api } from '~/utils/api'; +import { AxiosResponse } from 'axios'; interface NodeRelatedProviderProps { - related: INodeRelated; - isLoading: boolean; + id: INode['id']; } -const NodeRelatedContext = createContext({ - related: { albums: {}, similar: [] }, - isLoading: false, -}); +const defaultValue: INodeRelated = { + albums: {}, + similar: [], +}; -export const NodeRelatedProvider: FC = ({ children, ...rest }) => ( - {children} -); +const NodeRelatedProvider: FC = ({ id, children }) => { + const { data, isValidating } = useSWR>( + API.NODE.RELATED(id), + api.get + ); -export const useNodeRelatedContext = () => useContext(NodeRelatedContext); + return ( + + {children} + + ); +}; + +export { NodeRelatedProvider }; diff --git a/src/utils/providers/SWRProvider.tsx b/src/utils/providers/SWRProvider.tsx new file mode 100644 index 00000000..1f73051b --- /dev/null +++ b/src/utils/providers/SWRProvider.tsx @@ -0,0 +1,8 @@ +import React, { FC } from 'react'; +import { SWRConfig, SWRConfiguration } from 'swr'; + +const config: SWRConfiguration = { + revalidateOnFocus: false, +}; + +export const SWRProvider: FC = ({ children }) => {children}; diff --git a/yarn.lock b/yarn.lock index 1caf0701..e655e787 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4016,6 +4016,11 @@ depd@~1.1.2: resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9" integrity sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak= +dequal@2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.2.tgz#85ca22025e3a87e65ef75a7a437b35284a7e319d" + integrity sha512-q9K8BlJVxK7hQYqa6XISGmBZbtQQWVXSrRrWreHC94rMt1QL/Impruc+7p2CYSYuVIUr+YCt6hjrs1kkdJRTug== + des.js@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/des.js/-/des.js-1.0.1.tgz#5382142e1bdc53f85d86d53e5f4aa7deb91e0843" @@ -10917,6 +10922,13 @@ swiper@^6.8.4: dom7 "^3.0.0" ssr-window "^3.0.0" +swr@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/swr/-/swr-1.0.1.tgz#15f62846b87ee000e52fa07812bb65eb62d79483" + integrity sha512-EPQAxSjoD4IaM49rpRHK0q+/NzcwoT8c0/Ylu/u3/6mFj/CWnQVjNJ0MV2Iuw/U+EJSd2TX5czdAwKPYZIG0YA== + dependencies: + dequal "2.0.2" + symbol-observable@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"