|  |  | 
 |  |  | import React, { useState, useRef, useEffect, useMemo } from "react"; | 
 |  |  | import { useNavigate } from 'react-router-dom'; | 
 |  |  | import { useAuthProvider } from 'react-admin'; | 
 |  |  | import { useTheme } from '@mui/material/styles'; | 
 |  |  | import { useTranslate, useAuthProvider } from 'react-admin'; | 
 |  |  | import { WordEffect } from './WordEffect' | 
 |  |  |  | 
 |  |  | const Dashboard = () => { | 
 |  |  |     const authProvider = useAuthProvider(); | 
 |  |  |     const navigate = useNavigate(); | 
 |  |  |     const theme = useTheme(); | 
 |  |  |     const translate = useTranslate(); | 
 |  |  |  | 
 |  |  |     useEffect(() => { | 
 |  |  |         authProvider.checkAuth().catch(() => { | 
 |  |  | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <> | 
 |  |  |             <h1>Dashboard</h1> | 
 |  |  |             <div | 
 |  |  |                 style={{ | 
 |  |  |                     boxSizing: 'border-box', | 
 |  |  |                     display: 'flex', | 
 |  |  |                     width: '100%', | 
 |  |  |                     height: '100%', | 
 |  |  |                     flexDirection: 'column', | 
 |  |  |                     justifyContent: 'flex-start', | 
 |  |  |                     alignItems: 'flex-start', | 
 |  |  |                     padding: '2rem 1rem', | 
 |  |  |                 }} | 
 |  |  |             > | 
 |  |  |                 <WordEffect | 
 |  |  |                     words={translate('page.welcome.index')} | 
 |  |  |                     color={theme.palette.mode === 'light' ? '#666' : '#eeeeee'} | 
 |  |  |                 /> | 
 |  |  |                 <WordEffect | 
 |  |  |                     words={translate('page.welcome.tech')} | 
 |  |  |                     color={theme.palette.mode === 'light' ? '#666' : '#eeeeee'} | 
 |  |  |                 /> | 
 |  |  |             </div> | 
 |  |  |         </> | 
 |  |  |     ) | 
 |  |  | } |