diff --git a/application/src/components/dashboard/Header.tsx b/application/src/components/dashboard/Header.tsx index 9e0a9df..747dca4 100644 --- a/application/src/components/dashboard/Header.tsx +++ b/application/src/components/dashboard/Header.tsx @@ -9,6 +9,7 @@ import { useEffect, useState } from "react"; import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import { useNavigate } from "react-router-dom"; import { useSystemSettings } from "@/hooks/useSystemSettings"; +import QuickActionsDialog from "./QuickActionsDialog"; interface HeaderProps { currentUser: AuthUser | null; @@ -28,6 +29,7 @@ export const Header = ({ const [greeting, setGreeting] = useState(""); const { systemName } = useSystemSettings(); const navigate = useNavigate(); + const [quickActionsOpen, setQuickActionsOpen] = useState(false); // Set greeting based on time of day useEffect(() => { @@ -88,8 +90,18 @@ export const Header = ({ -
+ + {/* Quick Actions Button */} + + +

{greeting}, {currentUser?.name || currentUser?.email?.split('@')[0] || 'User'} 👋 ✨

@@ -205,6 +217,9 @@ export const Header = ({ + + {/* Quick Actions Dialog */} + ); }; \ No newline at end of file diff --git a/application/src/components/dashboard/QuickActionsDialog.tsx b/application/src/components/dashboard/QuickActionsDialog.tsx new file mode 100644 index 0000000..6bd6a90 --- /dev/null +++ b/application/src/components/dashboard/QuickActionsDialog.tsx @@ -0,0 +1,145 @@ + +import React from 'react'; +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, + DialogClose +} from "@/components/ui/dialog"; +import { Button } from "@/components/ui/button"; +import { X } from "lucide-react"; +import { useLanguage } from "@/contexts/LanguageContext"; + +interface QuickActionsDialogProps { + isOpen: boolean; + setIsOpen: (open: boolean) => void; +} + +export const QuickActionsDialog: React.FC = ({ isOpen, setIsOpen }) => { + const { t } = useLanguage(); + + return ( + + + + + Close + + + {t('quickActions')} + + {t('quickActionsDescription')} + + + +
+ {/* Website Monitoring Card */} +
+

{t('monitorWebsite')}

+

+ {t('monitorWebsiteDesc')} +

+
+

{t('quickTips')}:

+
    +
  • {t('monitorMultipleEndpoints')}
  • +
  • {t('trackResponseTimes')}
  • +
  • {t('setCustomAlerts')}
  • +
+
+
+ + {/* Server Monitoring Card */} +
+

{t('monitorServer')}

+

+ {t('monitorServerDesc')} +

+
+

{t('quickTips')}:

+
    +
  • {t('monitorCPURam')}
  • +
  • {t('trackNetworkMetrics')}
  • +
  • {t('viewProcesses')}
  • +
+
+
+ + {/* SSL Certificate Card */} +
+

{t('sslCertificate')}

+

+ {t('sslCertificateDesc')} +

+
+

{t('quickTips')}:

+
    +
  • {t('trackSSLExpiration')}
  • +
  • {t('getEarlyRenewal')}
  • +
  • {t('monitorMultipleDomains')}
  • +
+
+
+ + {/* Incidents Management Card */} +
+

{t('incidentsManagement')}

+

+ {t('incidentsManagementDesc')} +

+
+

{t('quickTips')}:

+
    +
  • {t('createTrackIncidents')}
  • +
  • {t('assignIncidents')}
  • +
  • {t('monitorResolution')}
  • +
+
+
+ + {/* Operational Status Card */} +
+

{t('operationalStatus')}

+

+ {t('operationalStatusDesc')} +

+
+

{t('quickTips')}:

+
    +
  • {t('createCustomStatus')}
  • +
  • {t('displayRealTime')}
  • +
  • {t('shareIncidentUpdates')}
  • +
+
+
+ + {/* Reports & Analytics Card */} +
+

{t('reportsAnalytics')}

+

+ {t('reportsAnalyticsDesc')} +

+
+

{t('quickTips')}:

+
    +
  • {t('generateUptimeReports')}
  • +
  • {t('analyzePerformance')}
  • +
  • {t('exportMonitoringData')}
  • +
+
+
+
+ +
+ +
+
+
+ ); +}; + +export default QuickActionsDialog; \ No newline at end of file