poprawki i zmiany ux

frontend/src/components/realtime/LiveHistoryChart.tsx

@@ -2,13 +2,15 @@ import type { EChartsOption } from "echarts";
 import { Card } from "../common/Card";
 import { EChart } from "../common/EChart";
 import type { HistoryPayload } from "../../types";
+import type { Language } from "../../i18n";
 
 interface LiveHistoryChartProps {
   history?: HistoryPayload;
   title?: string;
+  language?: Language;
 }
 
-export function LiveHistoryChart({ history, title = "Dane chwilowe" }: LiveHistoryChartProps) {
+export function LiveHistoryChart({ history, title = "Live data", language = "en" }: LiveHistoryChartProps) {
   const option: EChartsOption = {
     tooltip: {
       trigger: "axis",
@@ -33,7 +35,7 @@ export function LiveHistoryChart({ history, title = "Dane chwilowe" }: LiveHisto
       axisLabel: { color: "#94a3b8" },
       axisLine: { lineStyle: { color: "rgba(255,255,255,0.08)" } },
       data: history?.series[0]?.points.map((point) =>
-        new Date(point.timestamp).toLocaleTimeString("pl-PL", { hour: "2-digit", minute: "2-digit" })
+        new Date(point.timestamp).toLocaleTimeString(language === "en" ? "en-GB" : "pl-PL", { hour: "2-digit", minute: "2-digit" })
       ) ?? [],
     },
     yAxis: {
@@ -56,7 +58,7 @@ export function LiveHistoryChart({ history, title = "Dane chwilowe" }: LiveHisto
   return (
     <Card
       title={title}
-      subtitle="Moc AC, moce stringow DC i opcjonalnie temperatura falownika w jednym widoku live"
+      subtitle={language === "en" ? "AC power, DC string power and optional inverter temperature in one live view" : "Moc AC, moce stringów DC i opcjonalnie temperatura falownika w jednym widoku live"}
     >
       <EChart option={option} className="h-[340px] w-full" />
     </Card>

frontend/src/components/realtime/PhaseGrid.tsx

@@ -1,14 +1,16 @@
 import { Card } from "../common/Card";
 import { ValuePair } from "../common/ValuePair";
 import type { SnapshotGroupRow } from "../../types";
+import type { Language } from "../../i18n";
 
 interface PhaseGridProps {
   rows: SnapshotGroupRow[];
+  language?: Language;
 }
 
-export function PhaseGrid({ rows }: PhaseGridProps) {
+export function PhaseGrid({ rows, language = "en" }: PhaseGridProps) {
   return (
-    <Card title="Fazy AC" subtitle="Napiece, prady i moce pozorne na falowniku">
+    <Card title={language === "en" ? "AC phases" : "Fazy AC"} subtitle={language === "en" ? "Voltage, current and apparent power on the inverter" : "Napięcie, prądy i moce pozorne na falowniku"}>
       <div className="grid gap-4 md:grid-cols-3">
         {rows.map((row) => (
           <div key={row.id} className="rounded-3xl border border-white/10 bg-slate-950/40 p-4">

frontend/src/components/realtime/StringGrid.tsx

@@ -1,16 +1,18 @@
 import { Card } from "../common/Card";
 import { ValuePair } from "../common/ValuePair";
 import type { SnapshotGroupRow } from "../../types";
+import type { Language } from "../../i18n";
 
 interface StringGridProps {
   rows: SnapshotGroupRow[];
+  language?: Language;
 }
 
 const slotOrder = ["power", "voltage"] as const;
 
-export function StringGrid({ rows }: StringGridProps) {
+export function StringGrid({ rows, language = "en" }: StringGridProps) {
   return (
-    <Card title="Stringi DC" subtitle="Widok automatycznie skaluje sie do liczby stringow i dostepnych metryk z config.py">
+    <Card title={language === "en" ? "DC strings" : "Stringi DC"} subtitle={language === "en" ? "The layout automatically scales to the number of strings and available metrics from config.py" : "Widok automatycznie skaluje się do liczby stringów i dostępnych metryk z config.py"}>
       <div className="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
         {rows.map((row) => {
           const visibleSlots = slotOrder.filter((slot) => row.values[slot]);