Remove Authentication

This page describes how to remove auth from a theme

Disable Authentication Temporary

Disabling authentication temporarily is generally not recommended due to security risks. However, if you have a specific scenario where you need to disable authentication for a short period, here are some steps you can follow:

1. Comment out the AuthGuard wrapper for the routes within the MainLayout element:

MainRoutes.tsx

// import AuthGuard from 'utils/route-guard/AuthGuard';

...
...
element: (
  // <AuthGuard>
  <MainLayout />
  // </AuthGuard>
),
...
...

In the code snippet above, the <AuthGuard> component is commented out, allowing the routes within the MainLayout component to be rendered without authentication protection. To enable the AuthGuard wrapper again, remove the comment markers (//) surrounding the <AuthGuard> component.

Remove Authentication Permanent

If you want to permanently remove authentication from a system or application, here are the steps to follow:

1. Remove below authentication keys from .env file.

.env

...
...
## Firebase - Google Auth 

REACT_APP_FIREBASE_API_KEY=
REACT_APP_FIREBASE_AUTH_DOMAIN=
REACT_APP_FIREBASE_PROJECT_ID=
REACT_APP_FIREBASE_STORAGE_BUCKET=
REACT_APP_FIREBASE_MESSAGING_SENDER_ID=
REACT_APP_FIREBASE_APP_ID=
REACT_APP_FIREBASE_MEASUREMENT_ID=

## AWS

REACT_APP_AWS_POOL_ID=
REACT_APP_AWS_APP_CLIENT_ID=

## Auth0

REACT_APP_AUTH0_CLIENT_ID=
REACT_APP_AUTH0_DOMAIN=
...
...

2. Removed below list of files and directory.

mantis-material-react
..
├── src
│   ├── components\cards               
│   │   ├── AuthFooter.tsx
│   ├── context
│   │   ├── Auth0Context.tsx
│   │   ├── AWSCognitoContext.tsx
│   │   ├── FirebaseContext.tsx
│   │   ├── JWTContext.tsx
│   ├── hooks
│   │   ├── useAuth.ts
│   ├── pages
│   │   ├── auth (remove directory with all sub files)
│   ├── routes
│   │   ├── LoginRoutes.tsx
│   ├── sections
│   │   ├── auth (remove directory with all sub files)
│   ├── utils
│   │   ├── route-guard (remove directory with all sub files)

3. Remove LoginRoutes - Open file ./src/routes/index.tsx, and remove LoginRoutes import.

routes/index.tsx

import { lazy } from 'react';
import { createBrowserRouter } from 'react-router-dom';

// project import
import MainRoutes from './MainRoutes';
import ComponentsRoutes from './ComponentsRoutes';

import CommonLayout from 'layout/CommonLayout';
import Loadable from 'components/Loadable';

import { APP_BASENAME } from 'config';

// render - landing page
const PagesLanding = Loadable(lazy(() => import('pages/landing')));

// ==============================|| ROUTING RENDER ||============================== //

const router = createBrowserRouter(
  [
    {
      path: '/',
      element: <CommonLayout layout="landing" />,
      children: [
        {
          path: '/',
          element: <PagesLanding />
        }
      ]
    },
    ComponentsRoutes,
    MainRoutes
  ],
  { basename: APP_BASENAME }
);

export default router;

4. Remove or change /login routes.

   • If you want to remove routes - remove router component RouterLink or Link with to='' props.

   • If you want to change url - set the home page URL like, to={APP_DEFAULT_PATH} , And import APP_DEFAULT_PATH from config file.

5. Remove useAuth hook - Remove the below imports from throughout the project and set static values for user profile props.

import useAuth from 'hooks/useAuth';

6. Remove axios interceptors response from ./src/utils/axios.ts file

utils/axios.ts

import axios from 'axios';

// ==============================|| AXIOS - FOR MOCK SERVICES ||============================== //

const axiosServices = axios.create({ baseURL: process.env.REACT_APP_API_URL || 'http://localhost:3010/' });

export default axiosServices;