Merge pull request #158 from sqkkyzx/develop

refactory(i18n): Improve internationalization configuration and add new translations

application/src/components/services/LastCheckedTime.tsx

@@ -2,6 +2,7 @@
 import React from "react";
 import { Clock, TimerOff } from "lucide-react";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
+import { useLanguage } from "@/contexts/LanguageContext";
 
 interface LastCheckedTimeProps {
   lastCheckedTime: string;
@@ -10,6 +11,7 @@ interface LastCheckedTimeProps {
 }
 
 export const LastCheckedTime = ({ lastCheckedTime, status, interval }: LastCheckedTimeProps) => {
+	const { t } = useLanguage();
   // Format the time without seconds to display a static time
   const formatTimeWithoutSeconds = (timeString: string) => {
     try {
@@ -55,7 +57,7 @@ export const LastCheckedTime = ({ lastCheckedTime, status, interval }: LastCheck
               <Clock className="h-4 w-4" />
             )}
             <span>
-              {isPaused ? "Paused at " : ""}
+              {isPaused ? t("pausedAt") : ""}
               {formattedTime}
             </span>
           </div>
@@ -66,14 +68,14 @@ export const LastCheckedTime = ({ lastCheckedTime, status, interval }: LastCheck
         >
           <div className="flex flex-col gap-1 text-xs">
             <div className="font-medium">
-              {isPaused ? "Monitoring Paused" : "Last Check Details"}
+              {isPaused ? t("monitoringPaused") : t("lastCheckDetails")}
             </div>
             <div>
-              {isPaused ? "No automatic checks" : `Checked at ${formattedTime}`}
+              {isPaused ? t("noAutomaticChecks") : t("checkedAt") + `${formattedTime}`}
             </div>
             {interval && !isPaused && (
               <div>
-                Check interval: {formatInterval(interval)}
+	              {t("checkInterval")}: {formatInterval(interval)}
               </div>
             )}
             <div className="text-gray-400 text-[10px]">

application/src/components/services/ServiceEditDialog.tsx

@@ -11,6 +11,7 @@ import { Service } from "@/types/service.types";
 import { useQueryClient } from "@tanstack/react-query";
 import { useState, useEffect } from "react";
 import { ScrollArea } from "@/components/ui/scroll-area";
+import { useLanguage } from "@/contexts/LanguageContext";
 
 interface ServiceEditDialogProps {
   open: boolean;
@@ -19,6 +20,7 @@ interface ServiceEditDialogProps {
 }
 
 export function ServiceEditDialog({ open, onOpenChange, service }: ServiceEditDialogProps) {
+	const { t } = useLanguage();
   const queryClient = useQueryClient();
   const [isSubmitting, setIsSubmitting] = useState(false);
   
@@ -53,9 +55,9 @@ export function ServiceEditDialog({ open, onOpenChange, service }: ServiceEditDi
     }}>
       <DialogContent className="sm:max-w-[700px] max-h-[90vh] flex flex-col">
         <DialogHeader>
-          <DialogTitle className="text-xl">Edit Service</DialogTitle>
+          <DialogTitle className="text-xl">{t("editService")}</DialogTitle>
           <DialogDescription>
-            Update the details of your monitored service.
+	          {t("editServiceDesc")}
           </DialogDescription>
         </DialogHeader>
         {open && service && (

application/src/components/services/ServiceStatsCards.tsx

@@ -4,6 +4,7 @@ import { Service, UptimeData } from "@/types/service.types";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { useMemo } from "react";
 import { formatDistanceStrict } from "date-fns";
+import {useLanguage} from "@/contexts/LanguageContext.tsx";
 
 interface ServiceStatsCardsProps {
   service: Service;
@@ -11,6 +12,8 @@ interface ServiceStatsCardsProps {
 }
 
 export function ServiceStatsCards({ service, uptimeData }: ServiceStatsCardsProps) {
+
+	const { t } = useLanguage();
   // Calculate uptime percentage
   const calculateUptimePercentage = () => {
     if (uptimeData.length === 0) return 100;
@@ -109,41 +112,46 @@ export function ServiceStatsCards({ service, uptimeData }: ServiceStatsCardsProp
     <div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
       <Card className="border-blue-400 dark:border-blue-700 bg-blue-50 dark:bg-blue-900/50 shadow-md">
         <CardHeader className="pb-2">
-          <CardTitle className="text-sm font-medium text-blue-800 dark:text-blue-100">Response Time</CardTitle>
+          <CardTitle className="text-sm font-medium text-blue-800 dark:text-blue-100">{t('responseTime')}</CardTitle>
         </CardHeader>
         <CardContent>
           <div className="text-2xl font-bold text-blue-700 dark:text-white">
             {service.responseTime}ms
           </div>
-          <p className="text-xs text-blue-600 dark:text-blue-200 mt-1">Last checked at {service.lastChecked}</p>
+          <p className="text-xs text-blue-600 dark:text-blue-200 mt-1">{t('lastCheckedAt').replace('{datetime}', service.lastChecked)}</p>
           {avgResponseTime > 0 && avgResponseTime !== service.responseTime && (
-            <p className="text-xs text-blue-600 dark:text-blue-200 mt-1">Avg: {avgResponseTime}ms (last {upChecks.length} up checks)</p>
+            <p className="text-xs text-blue-600 dark:text-blue-200 mt-1">{t('avg')}: {avgResponseTime}ms ({t('lastUpChecksCount').replace('{count}', String(upChecks.length))})</p>
           )}
         </CardContent>
       </Card>
       
       <Card className="border-green-400 dark:border-green-700 bg-green-50 dark:bg-green-900/50 shadow-md">
         <CardHeader className="pb-2">
-          <CardTitle className="text-sm font-medium text-green-800 dark:text-green-100">Uptime</CardTitle>
+          <CardTitle className="text-sm font-medium text-green-800 dark:text-green-100">{t('uptime')}</CardTitle>
         </CardHeader>
         <CardContent>
           <div className="text-2xl font-bold text-green-700 dark:text-white">
             {uptimePercentage}%
           </div>
-          <p className="text-xs text-green-600 dark:text-green-200 mt-1">Based on last {uptimeData.length} checks</p>
+          <p className="text-xs text-green-600 dark:text-green-200 mt-1">{t('basedOnlastChecksCount').replace('{count}', String(uptimeData.length))}</p>
           <div className="flex flex-col space-y-1 mt-2">
             <div className="flex items-center text-xs text-green-600 dark:text-green-200">
               <ArrowUp className="h-3 w-3 mr-1 text-green-600 dark:text-green-400" />
-              <span>Total uptime: {uptimeStats.totalUptimeFormatted}</span>
+              <span>{t("totalUptime")}: {uptimeStats.totalUptimeFormatted}</span>
             </div>
             <div className="flex items-center text-xs text-red-600 dark:text-red-200">
               <ArrowDown className="h-3 w-3 mr-1 text-red-600 dark:text-red-400" />
-              <span>Total downtime: {uptimeStats.totalDowntimeFormatted}</span>
+              <span>{t("totalDowntime")}: {uptimeStats.totalDowntimeFormatted}</span>
             </div>
             {service.status !== "paused" && (
               <div className="flex items-center text-xs font-medium mt-1">
                 <span className={service.status === "up" ? "text-green-600 dark:text-green-400" : "text-red-600 dark:text-red-400"}>
-                  {service.status === "up" ? "Up" : "Down"} for {uptimeStats.currentStatusDuration}
+                  {
+										service.status === "up" ?
+											t('upStatusDuration').replace("{duration}", uptimeStats.currentStatusDuration)
+											:
+											t('downStatusDuration').replace("{duration}", uptimeStats.currentStatusDuration)
+									}
                 </span>
               </div>
             )}
@@ -153,16 +161,16 @@ export function ServiceStatsCards({ service, uptimeData }: ServiceStatsCardsProp
       
       <Card className="border-purple-400 dark:border-purple-700 bg-purple-50 dark:bg-purple-900/50 shadow-md">
         <CardHeader className="pb-2">
-          <CardTitle className="text-sm font-medium text-purple-800 dark:text-purple-100">Monitoring Settings</CardTitle>
+          <CardTitle className="text-sm font-medium text-purple-800 dark:text-purple-100">{t('monitoringSettings')}</CardTitle>
         </CardHeader>
         <CardContent>
           <div className="flex items-center text-sm text-purple-700 dark:text-purple-200">
             <Clock className="h-4 w-4 mr-2 text-purple-600 dark:text-purple-400" />
-            <span>Checked every {service.interval} seconds</span>
+            <span>{t('monitoringSettingsInterval').replace('{interval}', String(service.interval))}</span>
           </div>
           <div className="flex items-center text-sm text-purple-700 dark:text-purple-200 mt-1">
             <Server className="h-4 w-4 mr-2 text-purple-600 dark:text-purple-400" />
-            <span>{service.type} monitoring</span>
+            <span>{service.type} {t('monitoringSettingsType')}</span>
           </div>
         </CardContent>
       </Card>

application/src/components/services/UptimeBar.tsx

@@ -5,6 +5,7 @@ import { TooltipProvider } from '@/components/ui/tooltip';
 import { UptimeStatusItem } from './uptime/UptimeStatusItem';
 import { uptimeService } from '@/services/uptimeService';
 import { UptimeData } from '@/types/service.types';
+import {useLanguage} from "@/contexts/LanguageContext.tsx";
 
 interface UptimeBarProps {
   uptime: number;
@@ -15,6 +16,7 @@ interface UptimeBarProps {
 }
 
 const UptimeBarComponent = ({ uptime, status, serviceId, interval, serviceType = "HTTP" }: UptimeBarProps) => {
+	const { t } = useLanguage();
   // Calculate date range for last 20 checks with much more aggressive caching
   const endDate = useMemo(() => new Date(), []);
   const startDate = useMemo(() => {
@@ -84,7 +86,7 @@ const UptimeBarComponent = ({ uptime, status, serviceId, interval, serviceType =
       </div>
       
       <span className="text-xs text-muted-foreground">
-            Last 20 checks 
+            {t('last20Checks')}
       </span>    
     </TooltipProvider>
   );

application/src/components/services/add-service/ServiceFormActions.tsx

@@ -2,6 +2,7 @@
 import { Button } from "@/components/ui/button";
 import { Loader2 } from "lucide-react";
 import { MouseEvent } from "react";
+import {useLanguage} from "@/contexts/LanguageContext.tsx";
 
 interface ServiceFormActionsProps {
   isSubmitting: boolean;
@@ -14,6 +15,8 @@ export function ServiceFormActions({
   onCancel,
   submitLabel = "Create Service"
 }: ServiceFormActionsProps) {
+
+	const {t} = useLanguage();
   const handleCancel = (e: MouseEvent<HTMLButtonElement>) => {
     e.preventDefault();
     if (!isSubmitting) {
@@ -29,7 +32,7 @@ export function ServiceFormActions({
         variant="outline"
         disabled={isSubmitting}
       >
-        Cancel
+	      {t("cancel")}
       </Button>
       <Button 
         type="submit" 
@@ -38,7 +41,7 @@ export function ServiceFormActions({
         {isSubmitting ? (
           <>
             <Loader2 className="mr-2 h-4 w-4 animate-spin" />
-            Processing...
+	          {t("processing")}...
           </>
         ) : (
           submitLabel

application/src/components/services/incident-history/IncidentTable.tsx

@@ -25,8 +25,8 @@ export function IncidentTable({ incidents }: IncidentTableProps) {
           <TableHead className={theme === 'dark' ? 'text-gray-300' : 'text-gray-700'}>{t("time")}</TableHead>
           <TableHead className={theme === 'dark' ? 'text-gray-300' : 'text-gray-700'}>{t("status")}</TableHead>
           <TableHead className={theme === 'dark' ? 'text-gray-300' : 'text-gray-700'}>{t("responseTime")}</TableHead>
-          <TableHead className={theme === 'dark' ? 'text-gray-300' : 'text-gray-700'}>Error Message</TableHead>
+          <TableHead className={theme === 'dark' ? 'text-gray-300' : 'text-gray-700'}>{t("errorMessage")}</TableHead>
-          <TableHead className={theme === 'dark' ? 'text-gray-300' : 'text-gray-700'}>Details</TableHead>
+          <TableHead className={theme === 'dark' ? 'text-gray-300' : 'text-gray-700'}>{t("details")}</TableHead>
         </TableRow>
       </TableHeader>
       <TableBody>

application/src/components/services/incident-history/LatestChecksTable.tsx

@@ -9,10 +9,12 @@ import { IncidentTable } from "./IncidentTable";
 import { StatusFilter, PageSize } from "./types";
 import { getStatusChangeEvents } from "./utils";
 import { useTheme } from "@/contexts/ThemeContext";
+import { useLanguage } from "@/contexts/LanguageContext";
 
 export function LatestChecksTable({ uptimeData }: { uptimeData: UptimeData[] }) {
   // Get current theme
   const { theme } = useTheme();
+	const { t } = useLanguage();
   
   // Filter state
   const [statusFilter, setStatusFilter] = useState<StatusFilter>("all");
@@ -65,7 +67,7 @@ export function LatestChecksTable({ uptimeData }: { uptimeData: UptimeData[] })
       <CardHeader>
         <div className="flex flex-col md:flex-row md:items-center justify-between gap-4">
           <CardTitle className="text-card-foreground">
-            <span>Incident History</span>
+            <span>{t("incidentHistory")}</span>
           </CardTitle>
           <StatusFilterTabs statusFilter={statusFilter} onStatusFilterChange={setStatusFilter} />
         </div>

application/src/components/services/incident-history/TablePagination.tsx

@@ -15,6 +15,7 @@ import {
   SelectValue 
 } from "@/components/ui/select";
 import { PageSize } from "./types";
+import {useLanguage} from "@/contexts/LanguageContext.tsx";
 
 interface TablePaginationProps {
   currentPage: number;
@@ -35,6 +36,7 @@ export function TablePagination({
   onPageChange,
   onPageSizeChange,
 }: TablePaginationProps) {
+	const {t} = useLanguage()
   // Generate page numbers
   const getPageNumbers = () => {
     const pages = [];
@@ -58,7 +60,7 @@ export function TablePagination({
   return (
     <div className="mt-4 flex items-center justify-between">
       <div className="flex items-center space-x-2">
-        <span className="text-sm text-muted-foreground">Rows per page:</span>
+        <span className="text-sm text-muted-foreground">{t("rowsPerPage")}:</span>
         <Select
           value={pageSize}
           onValueChange={(value) => onPageSizeChange(value as PageSize)}

application/src/components/services/service-row/ServiceRowActions.tsx

@@ -12,6 +12,7 @@ import {
 import { Service } from "@/types/service.types";
 import { serviceService } from "@/services/serviceService";
 import { useToast } from "@/hooks/use-toast";
+import { useLanguage } from "@/contexts/LanguageContext";
 
 interface ServiceRowActionsProps {
   service: Service;
@@ -31,6 +32,7 @@ export const ServiceRowActions = ({
   onMuteAlerts
 }: ServiceRowActionsProps) => {
   const { toast } = useToast();
+	const { t } = useLanguage();
 
   // Handle pause/resume directly from dropdown
   const handlePauseResume = async (e: React.MouseEvent) => {
@@ -122,7 +124,7 @@ export const ServiceRowActions = ({
             }}
           >
             <Eye className="h-4 w-4" />
-            <span>View Detail</span>
+            <span>{t("viewDetail")}</span>
           </DropdownMenuItem>
           <DropdownMenuItem 
             className="flex items-center gap-2 cursor-pointer text-base py-2.5"
@@ -131,12 +133,12 @@ export const ServiceRowActions = ({
             {service.status === "paused" ? (
               <>
                 <Play className="h-4 w-4" />
-                <span>Resume Monitoring</span>
+                <span>{t("resumeMonitoring")}</span>
               </>
             ) : (
               <>
                 <Pause className="h-4 w-4" />
-                <span>Pause Monitoring</span>
+                <span>{t("pauseMonitoring")}</span>
               </>
             )}
           </DropdownMenuItem>
@@ -148,7 +150,7 @@ export const ServiceRowActions = ({
             }}
           >
             <Edit className="h-4 w-4" />
-            <span>Edit</span>
+            <span>{t("edit")}</span>
           </DropdownMenuItem>
           <DropdownMenuItem 
             className="flex items-center gap-2 cursor-pointer text-base py-2.5"
@@ -157,12 +159,12 @@ export const ServiceRowActions = ({
             {alertsMuted ? (
               <>
                 <Bell className="h-4 w-4" />
-                <span>Unmute Alerts</span>
+                <span>{t("unmuteAlerts")}</span>
               </>
             ) : (
               <>
                 <BellOff className="h-4 w-4" />
-                <span>Mute Alerts</span>
+                <span>{t("muteAlerts")}</span>
               </>
             )}
           </DropdownMenuItem>
@@ -175,7 +177,7 @@ export const ServiceRowActions = ({
             }}
           >
             <Trash2 className="h-4 w-4" />
-            <span>Delete</span>
+            <span>{t("delete")}</span>
           </DropdownMenuItem>
         </DropdownMenuContent>
       </DropdownMenu>

application/src/components/services/uptime/UptimeSummary.tsx

@@ -1,5 +1,6 @@
 
 import React from 'react';
+import {useLanguage} from "@/contexts/LanguageContext.tsx";
 
 interface UptimeSummaryProps {
   uptime: number;
@@ -7,13 +8,14 @@ interface UptimeSummaryProps {
 }
 
 export const UptimeSummary = ({ uptime, interval }: UptimeSummaryProps) => {
+	const { t } = useLanguage();
   return (
     <div className="flex items-center justify-between text-xs mt-1">
       <span className="text-muted-foreground">
         {Math.round(uptime)}% uptime
       </span>
       <span className="text-xs text-muted-foreground">
-        Last 20 checks
+	      {t('last20Checks')}
       </span>
     </div>
   );

application/src/components/settings/about-system/AboutSystem.tsx

@@ -355,9 +355,9 @@ export const AboutSystem: React.FC = () => {
         <CardHeader className="bg-muted/50 pb-4">
           <CardTitle className="flex items-center gap-2">
             <Database className={`h-5 w-5 ${theme === 'dark' ? 'text-blue-400' : 'text-blue-600'}`} />
-            <span>Update Schema</span>
+            <span>{t('updateSchema')}</span>
           </CardTitle>
-          <CardDescription className="font-medium text-base">Automatic import collections schema</CardDescription>
+          <CardDescription className="font-medium text-base">{t('updateSchemaDesc')}</CardDescription>
         </CardHeader>
         <CardContent className="space-y-4 pt-6">
           <div className="space-y-3">
@@ -368,7 +368,7 @@ export const AboutSystem: React.FC = () => {
                 onCheckedChange={(checked) => setMergeFields(checked === true)}
               />
               <Label htmlFor="merge-fields" className="text-sm font-medium">
-                Merge fields with existing collections (safe - preserves data)
+	              {t('mergeFieldsLabel')}
               </Label>
             </div>
           </div>
@@ -382,7 +382,7 @@ export const AboutSystem: React.FC = () => {
               }`}
             >
               <Database className={`h-4 w-4 ${isImporting ? 'animate-spin' : ''}`} />
-              {isImporting ? 'Importing...' : 'Click to update Schema'}
+              {isImporting ? t('importing') : t('clickToUpdateSchema')}
             </Button>
           </div>
 
@@ -403,7 +403,7 @@ export const AboutSystem: React.FC = () => {
                     ? 'text-green-800 dark:text-green-200' 
                     : 'text-red-800 dark:text-red-200'
                 }`}>
-                  {importResult.success ? 'Import Successful' : 'Import Failed'}
+                  {importResult.success ? t('importSuccessful') : t('importFailed')}
                 </span>
               </div>
               <div className={`mt-2 text-sm ${
@@ -411,21 +411,21 @@ export const AboutSystem: React.FC = () => {
                   ? 'text-green-700 dark:text-green-300' 
                   : 'text-red-700 dark:text-red-300'
               }`}>
-                {importResult.created > 0 && `${importResult.created} collections created`}
+                {importResult.created > 0 && t('collectionsCreatedCount').replace('{count}', String(importResult.created))}
-                {importResult.updated > 0 && (importResult.created > 0 ? ', ' : '') + `${importResult.updated} collections updated`}
+                {importResult.updated > 0 && (importResult.created > 0 ? ', ' : '') + t('collectionsUpdatedCount').replace('{count}', String(importResult.updated))}
-                {importResult.skipped > 0 && ((importResult.created > 0 || importResult.updated > 0) ? ', ' : '') + `${importResult.skipped} collections skipped`}
+                {importResult.skipped > 0 && ((importResult.created > 0 || importResult.updated > 0) ? ', ' : '') + t('collectionsSkippedCount').replace('{count}', String(importResult.skipped))}
               </div>
             </div>
           )}
 
           <div className="text-sm text-muted-foreground">
             <p className="mb-2">
-              <strong>Instructions:</strong>
+              <strong>{t('instructions')}:</strong>
             </p>
             <ul className="list-disc list-inside space-y-1 ml-2">
-              <li><strong>Merge fields:</strong> Safely add new fields to existing collections, preserves all data</li>
+              <li><strong>{t('mergeFields')}:</strong> {t('instructionsMergeFields')}</li>
-              <li>System collections (starting with _) and users collection will be skipped automatically</li>
+              <li>{t('instructionsCollections')}</li>
-              <li>Only authenticated admins can perform schema imports</li>
+              <li>{t('instructionsImportAuth')}</li>
             </ul>
           </div>
         </CardContent>

application/src/components/settings/alerts-templates/TemplateDialog.tsx

@@ -16,6 +16,7 @@ import { ScrollArea } from "@/components/ui/scroll-area";
 import { TemplateType, templateTypeConfigs } from "@/services/templateService";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Textarea } from "@/components/ui/textarea";
+import {z} from "zod";
 
 interface TemplateDialogProps {
   open: boolean;
@@ -81,6 +82,7 @@ export const TemplateDialog: React.FC<TemplateDialogProps> = ({
   };
 
   const renderPlaceholderGuide = () => {
+
     const config = templateTypeConfigs[selectedTemplateType];
     if (!config) return null;
 

application/src/components/settings/notification-settings/NotificationChannelDialog.tsx

@@ -27,6 +27,7 @@ import { Switch } from "@/components/ui/switch";
 import { Loader2, Copy } from "lucide-react";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { toast } from "@/hooks/use-toast";
+import { useLanguage } from "@/contexts/LanguageContext";
 
 interface NotificationChannelDialogProps {
   open: boolean;
@@ -34,6 +35,7 @@ interface NotificationChannelDialogProps {
   editingConfig: AlertConfiguration | null;
 }
 
+
 const baseSchema = z.object({
   notify_name: z.string().min(1, "Name is required"),
   notification_type: z.enum(["telegram", "discord", "slack", "signal", "google_chat", "email", "ntfy", "pushover", "notifiarr", "gotify", "webhook"]),

application/src/translations/en/about.ts

@@ -16,4 +16,19 @@ export const aboutTranslations: AboutTranslations = {
   quickActionsDescription: "Access common monitoring operations and features quickly. Select an action below to get started.",
   quickTips: "Quick Tips",
   releasedOn: "Released On",
+	updateSchema: "Update Schema",
+	updateSchemaDesc: "Automatic import collections schema",
+	mergeFieldsLabel: "Merge fields with existing collections (safe - preserves data)",
+	importing: "Importing...",
+	clickToUpdateSchema: "Click to update Schema",
+	importSuccessful: "Import Successful",
+	importFailed: "Import Failed",
+	instructions: "Instructions",
+	mergeFields: "Merge fields",
+	instructionsMergeFields: "Safely add new fields to existing collections, preserves all data",
+	instructionsCollections: "System collections (starting with _) and users collection will be skipped automatically",
+	instructionsImportAuth: "Only authenticated admins can perform schema imports",
+	collectionsUpdatedCount: "{count} collections updated",
+	collectionsCreatedCount: "{count} collections created",
+	collectionsSkippedCount: "{count} collections created",
 };

application/src/translations/en/services.ts

@@ -3,7 +3,6 @@ import { ServicesTranslations } from '../types/services';
 
 export const servicesTranslations: ServicesTranslations = {
   serviceStatus: "Service Status",
-  responseTime: "Response Time",
   uptime: "Uptime",
   lastChecked: "Last Checked",
   noServices: "No services match your filter criteria.",
@@ -95,4 +94,46 @@ export const servicesTranslations: ServicesTranslations = {
 	downServices: "DOWN SERVICES",
 	pausedServices: "PAUSED SERVICES",
 	warningServices: "WARNING SERVICES",
+
+	// ServiceRowActions.tsx
+	viewDetail: "View Detail",
+	resumeMonitoring: "Resume Monitoring",
+	pauseMonitoring: "Pause Monitoring",
+
+
+	//IncidentTable.tsx
+	responseTime: "Response Time",
+	errorMessage: "Error Message",
+	details: "Details",
+	unmuteAlerts: "Unmute Alerts",
+	muteAlerts: "Mute Alerts",
+
+	//LastCheckedTime.tsx
+	pausedAt: "Paused at ",
+	lastCheckDetails: "Last Check Details",
+	checkedAt: "Checked at ",
+	monitoringPaused: "Monitoring Paused",
+	noAutomaticChecks: "No automatic checks",
+
+	//ServiveEditDialog.tsx
+	editService: "Edit Service",
+	editServiceDesc: "Update the details of your monitored service.",
+
+	//ServiceStatsCards.tsx
+	lastCheckedAt: "Last checked at {datetime}",
+	avg: "Avg",
+	lastUpChecksCount: "last {count} up checks",
+	basedOnlastChecksCount: "Based on last {count} checks",
+	totalUptime: "Total Uptime",
+	totalDowntime: "Total Downtime",
+	monitoringSettings: "Monitoring Settings",
+	monitoringSettingsInterval: "Checked every {interval} seconds",
+	monitoringSettingsType: "monitoring",
+	upStatusDuration: "Up for {duration}",
+	downStatusDuration: "Down for {duration}",
+
+	incidentHistory: "Incident History",
+	processing: "Processing",
+	back: "Back",
+	last20Checks: "Last 20 checks",
 };

application/src/translations/types/about.ts

@@ -14,4 +14,19 @@ export interface AboutTranslations {
   quickActionsDescription: string;
   quickTips: string;
   releasedOn: string;
+	updateSchema: string;
+	updateSchemaDesc: string;
+	mergeFieldsLabel: string;
+	importing: string;
+	clickToUpdateSchema: string;
+	importSuccessful: string;
+	importFailed: string;
+	instructions: string;
+	mergeFields: string;
+	instructionsMergeFields: string;
+	instructionsCollections: string;
+	instructionsImportAuth: string;
+	collectionsUpdatedCount: string;
+	collectionsCreatedCount: string;
+	collectionsSkippedCount: string;
 }

application/src/translations/types/incident.ts

@@ -59,4 +59,5 @@ export interface IncidentTranslations {
   affectedSystems: string;
   enterAffectedSystems: string;
   separateSystemsWithComma: string;
+
 }

application/src/translations/types/services.ts

@@ -2,7 +2,6 @@
 export interface ServicesTranslations {
 
   serviceStatus: string;
-  responseTime: string;
   uptime: string;
   lastChecked: string;
   noServices: string;
@@ -93,5 +92,46 @@ export interface ServicesTranslations {
 	upServices: string;
 	downServices: string;
 	pausedServices: string;
-	warningServices: string;	
+	warningServices: string;
+
+	// ServiceRowActions.tsx
+	viewDetail: string;
+	resumeMonitoring: string;
+	pauseMonitoring: string;
+	unmuteAlerts: string;
+	muteAlerts: string;
+
+	//IncidentTable.tsx
+	responseTime: string;
+	errorMessage: string;
+	details: string;
+
+	//LastCheckedTime.tsx
+	pausedAt: string;
+	lastCheckDetails: string;
+	checkedAt: string;
+	monitoringPaused: string;
+	noAutomaticChecks: string;
+
+	//ServiveEditDialog.tsx
+	editService: string;
+	editServiceDesc: string;
+
+	//ServiceStatsCards.tsx
+	lastCheckedAt: string;
+	avg: string;
+	lastUpChecksCount: string;
+	basedOnlastChecksCount: string;
+	totalUptime: string;
+	totalDowntime: string;
+	monitoringSettings: string;
+	monitoringSettingsInterval: string;
+	monitoringSettingsType: string;
+	upStatusDuration: string;
+	downStatusDuration: string;
+
+	incidentHistory: string;
+	processing: string;
+	back: string;
+	last20Checks: string;
 }

application/src/translations/zhcn/about.ts

@@ -16,4 +16,19 @@ export const aboutTranslations: AboutTranslations = {
   quickActionsDescription: "快速访问常用的监控操作和功能。选择下面的操作开始。",
   quickTips: "快速提示",
   releasedOn: "发布于",
+	updateSchema: "更新架构",
+	updateSchemaDesc: "自动导入集合架构",
+	mergeFieldsLabel: "合并字段到现有集合（安全 - 保留数据）",
+	importing: "导入中...",
+	clickToUpdateSchema: "点击更新架构",
+	importSuccessful: "导入成功",
+	importFailed: "导入失败",
+	instructions: "说明",
+	mergeFields: "合并字段",
+	instructionsMergeFields: "安全地向现有集合添加新字段，保留所有数据",
+	instructionsCollections: "系统集合（以_开头的）和用户集合将被自动跳过",
+	instructionsImportAuth: "只有经过身份验证的管理员才能执行架构导入",
+	collectionsUpdatedCount: "已更新 {count} 个集合",
+	collectionsCreatedCount: "已创建 {count} 个集合",
+	collectionsSkippedCount: "已跳过 {count} 个集合",
 };

application/src/translations/zhcn/services.ts

@@ -3,7 +3,6 @@ import { ServicesTranslations } from '../types/services';
 
 export const servicesTranslations: ServicesTranslations = {
   serviceStatus: "服务状态",
-  responseTime: "响应时间",
   uptime: "在线时间",
   lastChecked: "最后检查时间",
   noServices: "没有符合您筛选条件的服务。",
@@ -95,4 +94,45 @@ export const servicesTranslations: ServicesTranslations = {
 	downServices: "下线服务",
 	pausedServices: "暂停服务",
 	warningServices: "告警服务",
+
+	// ServiceRowActions.tsx
+	viewDetail: "查看详情",
+	resumeMonitoring: "恢复监控",
+	pauseMonitoring: "暂停监控",
+	unmuteAlerts: "取消静音警报",
+	muteAlerts: "静音警报",
+
+	//IncidentTable.tsx
+	responseTime: "响应时间",
+	errorMessage: "错误信息",
+	details: "详情",
+
+	//LastCheckedTime.tsx
+	pausedAt: "暂停于 ",
+	lastCheckDetails: "最近检查详情",
+	checkedAt: "检查于 ",
+	monitoringPaused: "监控已暂停",
+	noAutomaticChecks: "无自动检查",
+
+	//ServiveEditDialog.tsx
+	editService: "编辑服务",
+	editServiceDesc: "更新您所监控服务的详细信息。",
+
+	//ServiceStatsCards.tsx
+	lastCheckedAt: "最新检查时间 {datetime}",
+	avg: "平均",
+	lastUpChecksCount: "最近 {count} 次检查",
+	basedOnlastChecksCount: "基于最近的 {count} 次检查",
+	totalUptime: "总在线时间",
+	totalDowntime: "总宕机时间",
+	monitoringSettings: "监控设置",
+	monitoringSettingsInterval: "每 {interval} 秒检查一次",
+	monitoringSettingsType: "监控",
+	upStatusDuration: "已在线 {duration}",
+	downStatusDuration: "已宕机 {duration}",
+
+	incidentHistory: "事件历史",
+	processing: "处理中",
+	back: "返回",
+	last20Checks: "最近 20 次检查",
 };