refactor: rename PageContainer --> PageWrapper

src/components/PageContainer/PageContainer.tsx → src/components/PageWrapper/PageWrapper.tsx

@@ -9,13 +9,13 @@ interface IProps extends ICompBaseProps {
   children: React.ReactNode;
 }
 
-export const PageContainer: React.FC<IProps> = (props) => {
+export const PageWrapper: React.FC<IProps> = (props) => {
   return (
     <div
       className={cx(
         styles['comp-wrapper'],
         { [styles['comp-wrapper--alwaysDarkMode']]: props.alwaysDarkMode },
-        `g-comp--${PageContainer.displayName}`,
+        `g-comp--${PageWrapper.displayName}`,
         props.className,
       )}
       style={props.style}

src/components/index.tsx

@@ -2,7 +2,7 @@
 export { LazyLoadingSpin } from './LazyLoadingSpin/LazyLoadingSpin';
 export { HeaderNavbar } from './HeaderNavbar/HeaderNavbar';
 export { HtmlMeta } from './HtmlMeta/HtmlMeta';
-export { PageContainer } from './PageContainer/PageContainer';
+export { PageWrapper } from './PageWrapper/PageWrapper';
 export { FooterNav } from './FooterNav/FooterNav';
 export { HugeIcon } from './HugeIcon/HugeIcon';
 export { LoadingSpinner } from './LoadingSpinner/LoadingSpinner';

src/page-components/about/About/About.tsx

@@ -3,15 +3,15 @@ import React from 'react';
 import { FiPercent } from 'react-icons/fi';
 
 import { IPageBaseProps } from '@/interfaces';
-import { HtmlMeta, HugeIcon, PageContainer } from '@/components';
+import { HtmlMeta, HugeIcon, PageWrapper } from '@/components';
 
 import styles from './styles.module.less';
 
 interface IProps extends IPageBaseProps {}
 
 export const About: React.FC<IProps> = (props) => {
   return (
-    <PageContainer
+    <PageWrapper
       className={cx(
         styles['comp-wrapper'],
         { [styles['comp-wrapper--alwaysDarkMode']]: props.alwaysDarkMode },
@@ -23,6 +23,6 @@ export const About: React.FC<IProps> = (props) => {
       <HtmlMeta title={props.routeProps?.name} />
 
       <HugeIcon icon={<FiPercent />} />
-    </PageContainer>
+    </PageWrapper>
   );
 };

src/page-components/about/AboutName/AboutName.tsx

@@ -6,7 +6,7 @@ import { FiMoon } from 'react-icons/fi';
 
 import { IPageBaseProps } from '@/interfaces';
 import { useDarkMode } from '@/hooks';
-import { HtmlMeta, HugeIcon, PageContainer } from '@/components';
+import { HtmlMeta, HugeIcon, PageWrapper } from '@/components';
 
 import styles from './styles.module.less';
 
@@ -18,7 +18,7 @@ export const AboutName: React.FC<IProps> = (props) => {
   const { name } = useRouter()?.query;
 
   return (
-    <PageContainer
+    <PageWrapper
       className={cx(
         styles['comp-wrapper'],
         { [styles['comp-wrapper--alwaysDarkMode']]: props.alwaysDarkMode },
@@ -34,6 +34,6 @@ export const AboutName: React.FC<IProps> = (props) => {
       <div className={styles['params-info']}>
         <code>{name}</code>
       </div>
-    </PageContainer>
+    </PageWrapper>
   );
 };

src/page-components/error/Error404/Error404.tsx

@@ -2,15 +2,15 @@ import cx from 'classnames';
 import React from 'react';
 
 import { IPageBaseProps } from '@/interfaces';
-import { HtmlMeta, PageContainer } from '@/components';
+import { HtmlMeta, PageWrapper } from '@/components';
 
 import styles from './styles.module.less';
 
 interface IProps extends IPageBaseProps {}
 
 export const Error404: React.FC<IProps> = (props) => {
   return (
-    <PageContainer
+    <PageWrapper
       className={cx(
         styles['comp-wrapper'],
         { [styles['comp-wrapper--alwaysDarkMode']]: props.alwaysDarkMode },
@@ -22,6 +22,6 @@ export const Error404: React.FC<IProps> = (props) => {
       <HtmlMeta title="Error 404" />
 
       <h2>Error 404</h2>
-    </PageContainer>
+    </PageWrapper>
   );
 };

src/page-components/home/Home/Home.tsx

@@ -3,15 +3,15 @@ import React from 'react';
 import { FiTriangle } from 'react-icons/fi';
 
 import { IPageBaseProps } from '@/interfaces';
-import { HtmlMeta, HugeIcon, PageContainer } from '@/components';
+import { HtmlMeta, HugeIcon, PageWrapper } from '@/components';
 
 import styles from './styles.module.less';
 
 interface IProps extends IPageBaseProps {}
 
 export const Home: React.FC<IProps> = (props) => {
   return (
-    <PageContainer
+    <PageWrapper
       className={cx(
         styles['comp-wrapper'],
         { [styles['comp-wrapper--alwaysDarkMode']]: props.alwaysDarkMode },
@@ -23,6 +23,6 @@ export const Home: React.FC<IProps> = (props) => {
       <HtmlMeta title={props.routeProps?.name} />
 
       <HugeIcon icon={<FiTriangle />} />
-    </PageContainer>
+    </PageWrapper>
   );
 };

src/page-components/test/Test/Test.tsx

@@ -2,7 +2,7 @@ import cx from 'classnames';
 import React from 'react';
 
 import { IPageBaseProps } from '@/interfaces';
-import { HtmlMeta, PageContainer } from '@/components';
+import { HtmlMeta, PageWrapper } from '@/components';
 
 import styles from './styles.module.less';
 
@@ -27,7 +27,7 @@ require('./non-module-less.less');
 interface IProps extends IPageBaseProps {}
 
 export const Test: React.FC<IProps> = (props) => (
-  <PageContainer className={cx(styles['comp-wrapper'], props.className)}>
+  <PageWrapper className={cx(styles['comp-wrapper'], props.className)}>
     <HtmlMeta title="Test" />
 
     <div className={styles['image-bg']}>IMAGE-BG</div>
@@ -37,5 +37,5 @@ export const Test: React.FC<IProps> = (props) => (
 
     <div className="test-non-module-less">TEST-NON-MODULE LESS</div>
     <div className="test-non-module-css">TEST-NON-MODULE CSS</div>
-  </PageContainer>
+  </PageWrapper>
 );

src/page-components/test/TestLazyLoadingSpin/TestLazyLoadingSpin.tsx

@@ -2,15 +2,15 @@ import cx from 'classnames';
 import React from 'react';
 
 import { IPageBaseProps } from '@/interfaces';
-import { HtmlMeta, LazyLoadingSpin, PageContainer } from '@/components';
+import { HtmlMeta, LazyLoadingSpin, PageWrapper } from '@/components';
 
 import styles from './styles.module.less';
 
 interface IProps extends IPageBaseProps {}
 
 export const TestLazyLoadingSpin: React.FC<IProps> = (props) => {
   return (
-    <PageContainer
+    <PageWrapper
       className={cx(
         styles['comp-wrapper'],
         { [styles['comp-wrapper--alwaysDarkMode']]: props.alwaysDarkMode },
@@ -23,6 +23,6 @@ export const TestLazyLoadingSpin: React.FC<IProps> = (props) => {
 
       <LazyLoadingSpin fullscreen />
       <LazyLoadingSpin style={{ color: 'red' }} />
-    </PageContainer>
+    </PageWrapper>
   );
 };