refactor PageCoverProvider

src/components/containers/PageCoverProvider/index.tsx

@@ -1,44 +0,0 @@
-import React, { createContext, FC, useContext, useState } from 'react';
-
-import { createPortal } from 'react-dom';
-
-import { imagePresets } from '~/constants/urls';
-import { IFile } from '~/types';
-import { getURL } from '~/utils/dom';
-
-import styles from './styles.module.scss';
-
-interface CoverContextValue {
-  cover: IFile | null;
-  setCover: (cover: IFile | null) => void;
-}
-
-const CoverContext = createContext<CoverContextValue>({
-  cover: null,
-  setCover: () => {},
-});
-
-const PageCoverProvider: FC = ({ children }) => {
-  const [cover, setCover] = useState<IFile | null>(null);
-
-  return (
-    <CoverContext.Provider value={{ cover, setCover }}>
-      {!!cover &&
-        createPortal(
-          <div
-            className={styles.wrap}
-            style={{
-              backgroundImage: `url("${getURL(cover, imagePresets.cover)}")`,
-            }}
-          />,
-          document.body,
-        )}
-
-      {children}
-    </CoverContext.Provider>
-  );
-};
-
-const usePageCoverContext = () => useContext(CoverContext);
-
-export { PageCoverProvider, usePageCoverContext };

src/components/containers/PageCoverProvider/styles.module.scss

@@ -1,38 +0,0 @@
-@import 'src/styles/variables';
-
-@keyframes fadeIn {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-.wrap {
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: -1;
-  background: 50% 50% no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100%;
-  animation: fadeIn 2s;
-  will-change: transform, opacity;
-  filter: blur(10px);
-
-  &::after {
-    content: ' ';
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: $content_bg_backdrop;
-  }
-
-  @include tablet {
-    display: none;
-  }
-}

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]);
-};