feat: initialize Infra Manager with React, Tailwind CSS, and Inertia.js
- Added main application entry point (app.jsx) and bootstrap file for React setup. - Created Wiki index page (Index.jsx) for documentation and file management. - Implemented utility functions for formatting and status handling in utils.js. - Set up Blade template (app.blade.php) for Inertia.js integration. - Defined API routes for metrics and terminal access in api.php. - Established console commands for scheduled tasks in console.php. - Created web routes for various application features including authentication, hypervisors, containers, cloud accounts, security, backups, and wiki management in web.php. - Developed setup scripts for Windows (setup.ps1) and Linux (setup.sh) environments. - Configured Tailwind CSS for styling with custom themes and animations in tailwind.config.js. - Set up Vite for asset bundling and development server in vite.config.js.
This commit is contained in:
39
resources/js/Pages/Error.jsx
Normal file
39
resources/js/Pages/Error.jsx
Normal file
@@ -0,0 +1,39 @@
|
||||
import { Head } from '@inertiajs/react';
|
||||
import { motion } from 'framer-motion';
|
||||
import { Zap, AlertTriangle } from 'lucide-react';
|
||||
|
||||
const MESSAGES = {
|
||||
403: { title: 'Access Denied', desc: 'You do not have permission to access this resource.' },
|
||||
404: { title: 'Page Not Found', desc: 'The page you are looking for does not exist.' },
|
||||
500: { title: 'Server Error', desc: 'Something went wrong on our end. Please try again.' },
|
||||
503: { title: 'Unavailable', desc: 'The service is temporarily unavailable.' },
|
||||
};
|
||||
|
||||
export default function Error({ status }) {
|
||||
const { title, desc } = MESSAGES[status] ?? { title: 'Error', desc: 'An unexpected error occurred.' };
|
||||
|
||||
return (
|
||||
<>
|
||||
<Head title={`${status} — ${title}`} />
|
||||
<div className="min-h-screen bg-[#050a0e] flex items-center justify-center p-4">
|
||||
<div className="absolute inset-0 bg-grid-pattern opacity-30" />
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
className="text-center relative z-10"
|
||||
>
|
||||
<div className="inline-flex items-center justify-center w-20 h-20 rounded-2xl bg-red-500/10 border border-red-500/20 mb-6">
|
||||
<AlertTriangle className="w-10 h-10 text-red-400" />
|
||||
</div>
|
||||
<p className="text-8xl font-black text-white/10 mb-4">{status}</p>
|
||||
<h1 className="text-2xl font-bold text-white mb-2">{title}</h1>
|
||||
<p className="text-white/50 mb-8">{desc}</p>
|
||||
<a href="/" className="inline-flex items-center gap-2 px-6 py-3 rounded-xl bg-cyan-500 text-black font-semibold hover:bg-cyan-400 transition-colors">
|
||||
<Zap className="w-4 h-4" />
|
||||
Back to Dashboard
|
||||
</a>
|
||||
</motion.div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user