fix(web): parse string readiness checks on monitoring System tab

Исправляет ложные «Ошибки проверок»: GET /v1/ready отдаёт строки ok/memory, а не boolean. Уплотнён ReUI Frame/donut layout на вкладке Система.

Co-authored-by: Cursor <[email protected]>

apps/web/src/components/patterns/donut-breakdown-card.tsx

@@ -8,7 +8,7 @@ import {
 } from '@evobgp/ui/components/chart'
 import type { BreakdownSlice } from '@/lib/metrics'
 
-/** chart-27 / chart-13 inspired donut in PanelCard. */
+/** chart-27 / chart-13 inspired donut in PanelCard (Frame surface). */
 export function DonutBreakdownCard({
   title,
   description,
@@ -30,13 +30,24 @@ export function DonutBreakdownCard({
   const data = slices.map((slice) => ({ ...slice, fill: slice.color, share: slice.count }))
 
   return (
-    <PanelCard title={title} description={description} className="h-full">
-      <div className="flex flex-col gap-4 p-4 sm:flex-row sm:items-center">
+    <PanelCard
+      title={title}
+      description={description}
+      className="h-full"
+      actions={
+        badge ? (
+          <Badge variant="success-light" className="hidden sm:inline-flex">
+            {badge}
+          </Badge>
+        ) : undefined
+      }
+    >
+      <div className="flex flex-col items-center justify-start gap-4 p-4 sm:flex-row sm:items-center sm:justify-start sm:gap-6">
         {total === 0 ? (
           <p className="text-muted-foreground w-full py-8 text-center text-sm">Нет данных</p>
         ) : (
           <>
-            <div className="relative mx-auto size-36 shrink-0">
+            <div className="relative mx-auto size-36 shrink-0 sm:mx-0">
               <ChartContainer config={chartConfig} className="aspect-square size-36">
                 <PieChart>
                   <Pie
@@ -59,11 +70,11 @@ export function DonutBreakdownCard({
                 <span className="text-lg font-semibold tabular-nums">{total}</span>
               </div>
             </div>
-            <ul className="min-w-0 flex-1 space-y-2">
+            <ul className="flex w-full min-w-0 max-w-xs flex-col gap-2 sm:w-auto sm:min-w-[10rem]">
               {slices.map((slice) => {
                 const pct = total > 0 ? ((slice.count / total) * 100).toFixed(1) : '0'
                 return (
-                  <li key={slice.key} className="flex items-center justify-between gap-2 text-sm">
+                  <li key={slice.key} className="flex items-center justify-between gap-3 text-sm">
                     <span className="flex min-w-0 items-center gap-2">
                       <span
                         className="size-2.5 shrink-0 rounded-full"
@@ -81,11 +92,6 @@ export function DonutBreakdownCard({
             </ul>
           </>
         )}
-        {badge ? (
-          <Badge variant="success-light" className="absolute top-4 right-4 hidden sm:flex">
-            {badge}
-          </Badge>
-        ) : null}
       </div>
     </PanelCard>
   )