refactor: improve dashboard monitor health bar size

src/client/components/dashboard/items/MonitorHealthBarItem.tsx

@@ -4,6 +4,13 @@ import { MonitorHealthBar } from '../../monitor/MonitorHealthBar';
 export const MonitorHealthBarItem: React.FC<{
   monitorId: string;
 }> = React.memo((props) => {
-  return <MonitorHealthBar monitorId={props.monitorId} />;
+  return (
+    <MonitorHealthBar
+      monitorId={props.monitorId}
+      count={40}
+      size="large"
+      showCurrentStatus={true}
+    />
+  );
 });
 MonitorHealthBarItem.displayName = 'MonitorHealthBarItem';

src/client/components/dashboard/items/index.tsx

@@ -41,7 +41,7 @@ export const DashboardGridItem: React.FC<DashboardGridItemProps> = React.memo(
       <Card
         className="h-full w-full overflow-auto"
         title={title}
-        headStyle={{ padding: 10 }}
+        headStyle={{ padding: 10, minHeight: 40 }}
         bodyStyle={{ padding: 10 }}
         extra={
           isEditMode && (

src/client/store/dashboard.ts

@@ -75,7 +75,7 @@ export const useDashboardStore = create<DashboardState>((set, get) => ({
 export const defaultItemLayout: Record<DashboardItemType, Omit<Layout, 'i'>> = {
   websiteOverview: { x: Infinity, y: Infinity, w: 4, h: 12 },
   websiteEvent: { x: Infinity, y: Infinity, w: 2, h: 5 },
-  monitorHealthBar: { x: Infinity, y: Infinity, w: 1, h: 2 },
+  monitorHealthBar: { x: Infinity, y: Infinity, w: 2, h: 2 },
   monitorStatus: { x: Infinity, y: Infinity, w: 4, h: 2 },
   monitorChart: { x: Infinity, y: Infinity, w: 4, h: 2 },
   monitorEvent: { x: Infinity, y: Infinity, w: 4, h: 2 },