refactor PageCoverProvider

src/components/containers/PageCoverProvider/usePageCover.ts

@@ -1,13 +0,0 @@
-import { useEffect } from 'react';
-
-import { usePageCoverContext } from '~/components/containers/PageCoverProvider/index';
-import { IFile } from '~/types';
-
-export const usePageCover = (cover?: IFile) => {
-  const { setCover } = usePageCoverContext();
-
-  useEffect(() => {
-    setCover(cover || null);
-    return () => setCover(null);
-  }, [setCover, cover]);
-};

src/hooks/node/useNodeCoverImage.ts

@@ -1,5 +1,5 @@
-import { usePageCover } from '~/components/containers/PageCoverProvider/usePageCover';
 import { INode } from '~/types';
+import { usePageCover } from '~/utils/providers/PageCoverProvider';
 
 export const useNodeCoverImage = (node: INode) => {
   usePageCover(node.cover);

src/layouts/ProfileLayout/index.tsx

@@ -2,13 +2,13 @@ import { FC } from 'react';
 
 import { observer } from 'mobx-react-lite';
 
-import { usePageCover } from '~/components/containers/PageCoverProvider/usePageCover';
 import { FlowGrid } from '~/components/flow/FlowGrid';
 import { Container } from '~/containers/main/Container';
 import { ProfilePageLeft } from '~/containers/profile/ProfilePageLeft';
 import { useUser } from '~/hooks/auth/useUser';
 import { useGetProfile } from '~/hooks/profile/useGetProfile';
 import { useFlowStore } from '~/store/flow/useFlowStore';
+import { usePageCover } from '~/utils/providers/PageCoverProvider';
 
 import styles from './styles.module.scss';
 

src/pages/_app.tsx

@@ -1,7 +1,6 @@
 import App from 'next/app';
 import Head from 'next/head';
 
-import { PageCoverProvider } from '~/components/containers/PageCoverProvider';
 import { Modal } from '~/containers/dialogs/Modal';
 import { BottomContainer } from '~/containers/main/BottomContainer';
 import { DragDetectorProvider } from '~/hooks/dom/useDragDetector';
@@ -15,6 +14,7 @@ import { AudioPlayerProvider } from '~/utils/providers/AudioPlayerProvider';
 import { AuthProvider } from '~/utils/providers/AuthProvider';
 import { MetadataProvider } from '~/utils/providers/MetadataProvider';
 import { NotificationProvider } from '~/utils/providers/NotificationProvider';
+import { PageCoverProvider } from '~/utils/providers/PageCoverProvider';
 import { SWRConfigProvider } from '~/utils/providers/SWRConfigProvider';
 import { SearchProvider } from '~/utils/providers/SearchProvider';
 import { SidebarProvider } from '~/utils/providers/SidebarProvider';

src/utils/providers/PageCoverProvider/index.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, FC, useContext, useState } from 'react';
+import { createContext, FC, useContext, useState, useEffect } from 'react';
 
 import { createPortal } from 'react-dom';
 
@@ -41,4 +41,13 @@ const PageCoverProvider: FC = ({ children }) => {
 
 const usePageCoverContext = () => useContext(CoverContext);
 
+export const usePageCover = (cover?: IFile) => {
+  const { setCover } = usePageCoverContext();
+
+  useEffect(() => {
+    setCover(cover || null);
+    return () => setCover(null);
+  }, [setCover, cover]);
+};
+
 export { PageCoverProvider, usePageCoverContext };