feat(): Secret feature to hide all the features.

Author: ar1603

src/components/CardComponent/CardExport.tsx

@@ -59,7 +59,7 @@ const Card = ({
         >
           {titleText}
         </Text>
-        <Button size="sm" py={0} px={1} as={Link} to={'/projects/' + icon}>
+        <Button size="sm" py={0} px={1} as={Link} to={'projects/' + icon}>
           Know More
         </Button>
       </HStack>

src/router/PublicRoutes.tsx

@@ -1,3 +1,4 @@
+import isEmpty from 'lodash/isEmpty';
 import {
   Navigate,
   Outlet,
@@ -11,6 +12,10 @@ import ArticlesScreen from '../screens/articles/ArticlesScreen';
 import ProjectsScreen from '../screens/projects/ProjectsScreen';
 import ArticleEditor from '@screens/articleEditor/ArticleEditor';
 
+export const BASE_URL = 'secret_path';
+export const BASE_URL_ROUTE = isEmpty(BASE_URL) ? '/' : `/${BASE_URL}`;
+export const BASE_NAV_ROUTE = isEmpty(BASE_URL) ? '/' : `/${BASE_URL}/`;
+
 const publicRouter = createBrowserRouter(
   createRoutesFromChildren(
     <Route
@@ -21,8 +26,8 @@ const publicRouter = createBrowserRouter(
         </>
       }
     >
-      <Route path="" element={<LazyHiderScreen />} />
-      <Route path="version2" element={<LazyHostScreen />}>
+      {!isEmpty(BASE_URL) && <Route path="" element={<LazyHiderScreen />} />}
+      <Route path={BASE_URL} element={<LazyHostScreen />}>
         <Route path="" element={<MainScreen />} />
         <Route path="articles" element={<ArticlesScreen />} />
         <Route path="privateRoute" element={<ArticleEditor />} />

src/screens/common/Footer.tsx

@@ -1,11 +1,12 @@
 import { Box, Text } from '@chakra-ui/react';
 import { HoverBorderGradient } from '@components';
+import { BASE_URL_ROUTE } from '@router';
 import { Link } from 'react-router-dom';
 
 const FooterEndText = () => (
   <Text fontSize={'md'}>
     © {new Date().getFullYear()}{' '}
-    <Link to={'/'} color="violet">
+    <Link to={BASE_URL_ROUTE} color="violet">
       Amit Raikwar
     </Link>{' '}
     | All rights reserved

src/screens/common/NavigationBar.tsx

@@ -6,6 +6,7 @@ import { useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useLocation, useNavigate } from 'react-router-dom';
 import { useMoveToTop } from '@hooks';
+import { BASE_URL_ROUTE } from '@router';
 
 const NavigationLink = [
   {
@@ -82,7 +83,7 @@ const NavigationBar = () => {
         alt={'logo'}
         w={8}
         onClick={() => {
-          navigate('/');
+          navigate(BASE_URL_ROUTE);
           moveToTop();
         }}
         _hover={{
@@ -101,7 +102,7 @@ const NavigationBar = () => {
         bg={'rgba(255, 255, 255, 0.1)'}
         backdropFilter={'blur(20px)'}
         transition={'background-color 0.3s'}
-        display={pathName !== '/' ? 'none' : 'flex'}
+        display={pathName !== BASE_URL_ROUTE ? 'none' : 'flex'}
       >
         {NavigationLink.map(({ name, href }) => (
           <LinkButton
@@ -123,7 +124,7 @@ const NavigationBar = () => {
           <LinkButton
             key={ArticleLink.name}
             text={t(ArticleLink.name)}
-            href={ArticleLink.href}
+            href={BASE_URL_ROUTE + '/' + ArticleLink.href}
             fontSize={'lg'}
             animationOnHover
           />

src/screens/hider/Hider.tsx

@@ -13,7 +13,8 @@ const Hider = () => {
         alignItems={'center'}
       >
         <Text color={'white'} textAlign={'center'} fontSize={'2xl'}>
-          You cannot access this website until you know the person personally 😝
+          You cannot 🚫access this website until you know the me personally 😝.
+          <br />
           <br />
           This is temporary🚧, I will remove this soon⏳.
         </Text>

src/screens/projects/ProjectsScreen.tsx

@@ -5,15 +5,18 @@ import { ProjectItem } from './components';
 import { useEffect, useRef } from 'react';
 import { useLocation } from 'react-router-dom';
 import { useCursor } from '@components';
+import { BASE_URL } from '@router';
 
 const Projects = () => {
   const { setCursorType } = useCursor();
   const location = useLocation();
-  const secondName = location.pathname.split('/')[2];
+  const name = location.pathname.split('/');
+
+  const projectName = name[1] === BASE_URL ? name[3] : name[2];
   const ref = useRef(null);
 
   const filteredProjects = PROJECT_DATA.filter((project) =>
-    project.icon === secondName ? project : null,
+    project.icon === projectName ? project : null,
   );
 
   useEffect(() => {