fix: service block page

src/App.tsx

@@ -5,6 +5,7 @@ import Footer from "./components/Footer";
 import Server from "./pages/Server";
 import ServerDetail from "./pages/ServerDetail";
 import NotFound from "./pages/NotFound";
+import ErrorPage from "./pages/ErrorPage";
 
 const App: React.FC = () => {
   return (
@@ -15,6 +16,7 @@ const App: React.FC = () => {
           <Routes>
             <Route path="/" element={<Server />} />
             <Route path="/server/:id" element={<ServerDetail />} />
+            <Route path="/error" element={<ErrorPage />} />
             <Route path="*" element={<NotFound />} />
           </Routes>
           <Footer />

src/components/CycleTransferStats.tsx

@@ -14,14 +14,20 @@ export const CycleTransferStatsCard: React.FC<CycleTransferStatsProps> = ({
   return (
     <section className="grid grid-cols-1 md:grid-cols-2 gap-2 md:gap-4">
       {Object.entries(cycleStats).map(([cycleId, cycleData]) => {
-        const serverStats = Object.entries(cycleData.server_name).map(
-          ([serverId, serverName]) => ({
-            serverId,
-            serverName,
-            transfer: cycleData.transfer[serverId] || 0,
-            nextUpdate: cycleData.next_update[serverId],
-          }),
-        );
+        const serverStats = cycleData.server_name 
+          ? Object.entries(cycleData.server_name).map(
+              ([serverId, serverName]) => ({
+                serverId,
+                serverName,
+                transfer: cycleData.transfer?.[serverId] || 0,
+                nextUpdate: cycleData.next_update?.[serverId],
+              })
+            )
+          : [];
+
+          if (serverStats.length === 0) {
+            return null;
+          }
 
         return (
           <CycleTransferStatsClient

src/components/ServiceTracker.tsx

@@ -57,7 +57,7 @@ export const ServiceTracker: React.FC = () => {
           />
         </div>
       )}
-      {serviceData.data.services && (
+      {serviceData.data.services && Object.keys(serviceData.data.services).length > 0 && (
         <section className="grid grid-cols-1 md:grid-cols-2 mt-4 gap-2 md:gap-4">
           {Object.entries(serviceData.data.services).map(([name, data]) => {
             const { days, uptime, avgDelay } = processServiceData(data);

src/pages/ErrorPage.tsx

@@ -0,0 +1,32 @@
+import { Button } from "@/components/ui/button";
+import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+
+interface ErrorPageProps {
+  code?: string | number;
+  message?: string;
+}
+
+export default function ErrorPage({ code = "500", message }: ErrorPageProps) {
+  const navigate = useNavigate();
+  const { t } = useTranslation();
+
+  return (
+    <div className="flex flex-col items-center justify-center">
+      <div className="flex flex-col items-center gap-2">
+        <h1 className="text-4xl font-semibold">{code}</h1>
+        <p className="text-xl text-muted-foreground">
+          {message || t("error.somethingWentWrong")}
+        </p>
+        <div className="flex gap-2">
+          <Button onClick={() => window.location.reload()} variant="outline">
+            {t("error.tryAgain")}
+          </Button>
+          <Button onClick={() => navigate("/")} className="mt-2">
+            {t("error.backToHome")}
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+}