Revert "updates on the ui changes"

This reverts commit 298fc603a0.

src/App.jsx

@@ -1,5 +1,6 @@
 import { Suspense, lazy } from 'react';
 import { Routes, Route, Navigate } from 'react-router-dom';
+import { Box, CircularProgress } from '@mui/material';
 
 import MainLayout from '@/layout/MainLayout';
 import MinimalLayout from '@/layout/MinimalLayout';
@@ -11,10 +12,9 @@ const load = (factory) => {
   return (
     <Suspense
       fallback={
-        <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', minHeight: '60vh' }}>
-          <div className="spinner" style={{ width: '32px', height: '32px', border: '3px solid #f1f5f9', borderTop: '3px solid #C01227', borderRadius: '50%', animation: 'spin 1s linear infinite' }} />
-          <style>{`@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }`}</style>
-        </div>
+        <Box sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center', minHeight: '60vh' }}>
+          <CircularProgress color="primary" />
+        </Box>
       }
     >
       <C />
@@ -29,7 +29,7 @@ export default function App() {
       <Route element={<AuthGuard><MainLayout /></AuthGuard>}>
         <Route path="/dashboard" element={load(() => import('@/pages/Dashboard'))} />
 
-        <Route path="/clients" element={load(() => import('@/pages/tenants/Tenants'))} />
+        <Route path="/tenants" element={load(() => import('@/pages/tenants/Tenants'))} />
         
         <Route path="/survey" element={load(() => import('@/pages/survey/Survey.jsx'))} />