diff --git a/AppImage/components/hardware.tsx b/AppImage/components/hardware.tsx
index 5e41eb2..4e7ee1c 100644
--- a/AppImage/components/hardware.tsx
+++ b/AppImage/components/hardware.tsx
@@ -3,7 +3,18 @@
 import { Card } from "@/components/ui/card"
 import { Badge } from "@/components/ui/badge"
 import { Progress } from "@/components/ui/progress"
-import { Thermometer, CpuIcon, ChevronDown, ChevronUp, Zap } from "lucide-react"
+import {
+  Thermometer,
+  CpuIcon,
+  ChevronDown,
+  ChevronUp,
+  Zap,
+  HardDrive,
+  Network,
+  FanIcon,
+  PowerIcon,
+  Battery,
+} from "lucide-react"
 import useSWR from "swr"
 import { useState } from "react"
 import { type HardwareData, fetcher } from "@/types/hardware"
@@ -94,9 +105,62 @@ export default function Hardware() {
         </Card>
       )}
 
-      {/* Network Summary */}
-
       {/* Storage Summary */}
+      {hardwareData?.storage_devices && hardwareData.storage_devices.length > 0 && (
+        <Card className="border-border/50 bg-card/50 p-6">
+          <div className="mb-4 flex items-center gap-2">
+            <HardDrive className="h-5 w-5 text-primary" />
+            <h2 className="text-lg font-semibold">Storage Summary</h2>
+            <Badge variant="outline" className="ml-auto">
+              {hardwareData.storage_devices.length} devices
+            </Badge>
+          </div>
+
+          <div className="grid gap-3 md:grid-cols-2 lg:grid-cols-3">
+            {hardwareData.storage_devices.map((device, index) => (
+              <div key={index} className="rounded-lg border border-border/30 bg-background/50 p-3">
+                <div className="flex items-center justify-between">
+                  <span className="text-sm font-medium">{device.name}</span>
+                  <Badge className="bg-orange-500/10 text-orange-500 border-orange-500/20">{device.type}</Badge>
+                </div>
+                {device.size && <p className="mt-1 text-xs text-muted-foreground">{device.size}</p>}
+                {device.model && <p className="mt-1 text-xs text-muted-foreground">{device.model}</p>}
+              </div>
+            ))}
+          </div>
+        </Card>
+      )}
+
+      {/* Network Summary */}
+      {hardwareData?.pci_devices &&
+        hardwareData.pci_devices.filter((d) => d.type.toLowerCase().includes("network")).length > 0 && (
+          <Card className="border-border/50 bg-card/50 p-6">
+            <div className="mb-4 flex items-center gap-2">
+              <Network className="h-5 w-5 text-primary" />
+              <h2 className="text-lg font-semibold">Network Summary</h2>
+              <Badge variant="outline" className="ml-auto">
+                {hardwareData.pci_devices.filter((d) => d.type.toLowerCase().includes("network")).length} interfaces
+              </Badge>
+            </div>
+
+            <div className="grid gap-3 md:grid-cols-2 lg:grid-cols-3">
+              {hardwareData.pci_devices
+                .filter((d) => d.type.toLowerCase().includes("network"))
+                .map((device, index) => (
+                  <div key={index} className="rounded-lg border border-border/30 bg-background/50 p-3">
+                    <div className="flex items-center justify-between">
+                      <span className="text-sm font-medium">{device.device}</span>
+                      <Badge className="bg-blue-500/10 text-blue-500 border-blue-500/20">Ethernet</Badge>
+                    </div>
+                    <p className="mt-1 text-xs text-muted-foreground">{device.vendor}</p>
+                  </div>
+                ))}
+            </div>
+            <p className="mt-4 text-xs text-muted-foreground">
+              For detailed network information, see the Network section
+            </p>
+          </Card>
+        )}
 
       {/* PCI Devices */}
       {hardwareData?.pci_devices && hardwareData.pci_devices.length > 0 && (
@@ -218,7 +282,122 @@ export default function Hardware() {
         </Card>
       )}
 
-      {/* ... existing code for Fans, Power Supply, UPS sections ... */}
+      {/* Fans */}
+      {hardwareData?.fans && hardwareData.fans.length > 0 && (
+        <Card className="border-border/50 bg-card/50 p-6">
+          <div className="mb-4 flex items-center gap-2">
+            <FanIcon className="h-5 w-5 text-primary" />
+            <h2 className="text-lg font-semibold">System Fans</h2>
+            <Badge variant="outline" className="ml-auto">
+              {hardwareData.fans.length} fans
+            </Badge>
+          </div>
+
+          <div className="grid gap-4 md:grid-cols-2">
+            {hardwareData.fans.map((fan, index) => (
+              <div key={index} className="space-y-2">
+                <div className="flex items-center justify-between">
+                  <span className="text-sm font-medium">{fan.name}</span>
+                  <span className="text-sm font-semibold text-blue-500">
+                    {fan.speed.toFixed(1)} {fan.unit}
+                  </span>
+                </div>
+                <Progress value={fan.speed} className="h-2" />
+              </div>
+            ))}
+          </div>
+        </Card>
+      )}
+
+      {/* Power Supplies */}
+      {hardwareData?.power_supplies && hardwareData.power_supplies.length > 0 && (
+        <Card className="border-border/50 bg-card/50 p-6">
+          <div className="mb-4 flex items-center gap-2">
+            <PowerIcon className="h-5 w-5 text-primary" />
+            <h2 className="text-lg font-semibold">Power Supplies</h2>
+            <Badge variant="outline" className="ml-auto">
+              {hardwareData.power_supplies.length} PSUs
+            </Badge>
+          </div>
+
+          <div className="grid gap-3 md:grid-cols-2">
+            {hardwareData.power_supplies.map((psu, index) => (
+              <div key={index} className="rounded-lg border border-border/30 bg-background/50 p-4">
+                <div className="flex items-center justify-between">
+                  <span className="text-sm font-medium">{psu.name}</span>
+                  {psu.status && <Badge variant={psu.status === "OK" ? "default" : "destructive"}>{psu.status}</Badge>}
+                </div>
+                <p className="mt-2 text-2xl font-bold text-primary">{psu.watts} W</p>
+                <p className="text-xs text-muted-foreground">Current Output</p>
+              </div>
+            ))}
+          </div>
+        </Card>
+      )}
+
+      {/* UPS */}
+      {hardwareData?.ups && (
+        <Card className="border-border/50 bg-card/50 p-6">
+          <div className="mb-4 flex items-center gap-2">
+            <Battery className="h-5 w-5 text-primary" />
+            <h2 className="text-lg font-semibold">UPS Status</h2>
+          </div>
+
+          <div className="space-y-4">
+            <div className="rounded-lg border border-border/30 bg-background/50 p-4">
+              <div className="flex items-center justify-between mb-4">
+                <span className="text-sm font-medium">{hardwareData.ups.name}</span>
+                <Badge variant={hardwareData.ups.status === "OL" ? "default" : "destructive"}>
+                  {hardwareData.ups.status}
+                </Badge>
+              </div>
+
+              <div className="grid gap-3 md:grid-cols-2">
+                {hardwareData.ups.battery_charge !== undefined && (
+                  <div className="space-y-1">
+                    <div className="flex items-center justify-between">
+                      <span className="text-xs text-muted-foreground">Battery Charge</span>
+                      <span className="text-sm font-semibold">{hardwareData.ups.battery_charge}%</span>
+                    </div>
+                    <Progress value={hardwareData.ups.battery_charge} className="h-2" />
+                  </div>
+                )}
+
+                {hardwareData.ups.load !== undefined && (
+                  <div className="space-y-1">
+                    <div className="flex items-center justify-between">
+                      <span className="text-xs text-muted-foreground">Load</span>
+                      <span className="text-sm font-semibold">{hardwareData.ups.load}%</span>
+                    </div>
+                    <Progress value={hardwareData.ups.load} className="h-2" />
+                  </div>
+                )}
+
+                {hardwareData.ups.battery_runtime !== undefined && (
+                  <div>
+                    <span className="text-xs text-muted-foreground">Runtime</span>
+                    <p className="text-sm font-semibold">{Math.floor(hardwareData.ups.battery_runtime / 60)} min</p>
+                  </div>
+                )}
+
+                {hardwareData.ups.input_voltage !== undefined && (
+                  <div>
+                    <span className="text-xs text-muted-foreground">Input Voltage</span>
+                    <p className="text-sm font-semibold">{hardwareData.ups.input_voltage} V</p>
+                  </div>
+                )}
+
+                {hardwareData.ups.output_voltage !== undefined && (
+                  <div>
+                    <span className="text-xs text-muted-foreground">Output Voltage</span>
+                    <p className="text-sm font-semibold">{hardwareData.ups.output_voltage} V</p>
+                  </div>
+                )}
+              </div>
+            </div>
+          </div>
+        </Card>
+      )}
     </div>
   )
 }
diff --git a/AppImage/types/hardware.ts b/AppImage/types/hardware.ts
new file mode 100644
index 0000000..e55043a
--- /dev/null
+++ b/AppImage/types/hardware.ts
@@ -0,0 +1,76 @@
+export interface Temperature {
+  name: string
+  current: number
+  high?: number
+  critical?: number
+  adapter?: string
+}
+
+export interface PowerMeter {
+  name: string
+  watts: number
+  adapter?: string
+}
+
+export interface NetworkInterface {
+  name: string
+  type: string
+  speed?: string
+  status?: string
+}
+
+export interface StorageDevice {
+  name: string
+  type: string
+  size?: string
+  model?: string
+}
+
+export interface PCIDevice {
+  slot: string
+  type: string
+  device: string
+  vendor: string
+  class: string
+  driver?: string
+  kernel_module?: string
+  irq?: string
+  memory_address?: string
+  link_speed?: string
+  capabilities?: string[]
+}
+
+export interface Fan {
+  name: string
+  speed: number
+  unit: string
+}
+
+export interface PowerSupply {
+  name: string
+  watts: number
+  status?: string
+}
+
+export interface UPS {
+  name: string
+  status: string
+  battery_charge?: number
+  battery_runtime?: number
+  load?: number
+  input_voltage?: number
+  output_voltage?: number
+}
+
+export interface HardwareData {
+  temperatures?: Temperature[]
+  power_meter?: PowerMeter
+  network_cards?: NetworkInterface[]
+  storage_devices?: StorageDevice[]
+  pci_devices?: PCIDevice[]
+  fans?: Fan[]
+  power_supplies?: PowerSupply[]
+  ups?: UPS
+}
+
+export const fetcher = (url: string) => fetch(url).then((res) => res.json())