mirror of
https://github.com/9technologygroup/patchmon.net.git
synced 2025-10-23 07:42:05 +00:00
Fixed Filtering with the OS Distribution Dashboard card
This commit is contained in:
@@ -651,17 +651,7 @@ const Dashboard = () => {
|
||||
|
||||
case "osDistribution":
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
className="card p-6 cursor-pointer hover:shadow-card-hover dark:hover:shadow-card-hover-dark transition-shadow duration-200 w-full text-left"
|
||||
onClick={handleOSDistributionClick}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter" || e.key === " ") {
|
||||
e.preventDefault();
|
||||
handleOSDistributionClick();
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className="card p-6 w-full">
|
||||
<h3 className="text-lg font-medium text-secondary-900 dark:text-white mb-4">
|
||||
OS Distribution
|
||||
</h3>
|
||||
@@ -670,22 +660,12 @@ const Dashboard = () => {
|
||||
<Pie data={osChartData} options={chartOptions} />
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
|
||||
case "osDistributionDoughnut":
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
className="card p-6 cursor-pointer hover:shadow-card-hover dark:hover:shadow-card-hover-dark transition-shadow duration-200 w-full text-left"
|
||||
onClick={handleOSDistributionClick}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter" || e.key === " ") {
|
||||
e.preventDefault();
|
||||
handleOSDistributionClick();
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className="card p-6 w-full">
|
||||
<h3 className="text-lg font-medium text-secondary-900 dark:text-white mb-4">
|
||||
OS Distribution
|
||||
</h3>
|
||||
@@ -694,29 +674,19 @@ const Dashboard = () => {
|
||||
<Doughnut data={osChartData} options={doughnutChartOptions} />
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
|
||||
case "osDistributionBar":
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
className="card p-6 cursor-pointer hover:shadow-card-hover dark:hover:shadow-card-hover-dark transition-shadow duration-200 w-full text-left"
|
||||
onClick={handleOSDistributionClick}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter" || e.key === " ") {
|
||||
e.preventDefault();
|
||||
handleOSDistributionClick();
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className="card p-6 w-full">
|
||||
<h3 className="text-lg font-medium text-secondary-900 dark:text-white mb-4">
|
||||
OS Distribution
|
||||
</h3>
|
||||
<div className="h-64">
|
||||
<Bar data={osBarChartData} options={barChartOptions} />
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
|
||||
case "updateStatus":
|
||||
@@ -1100,6 +1070,7 @@ const Dashboard = () => {
|
||||
},
|
||||
},
|
||||
},
|
||||
onClick: handleOSChartClick,
|
||||
};
|
||||
|
||||
const osChartData = {
|
||||
|
@@ -657,6 +657,18 @@ const Hosts = () => {
|
||||
hideStale,
|
||||
]);
|
||||
|
||||
// Get unique OS types from hosts for dynamic dropdown
|
||||
const uniqueOsTypes = useMemo(() => {
|
||||
if (!hosts) return [];
|
||||
const osTypes = new Set();
|
||||
hosts.forEach((host) => {
|
||||
if (host.os_type) {
|
||||
osTypes.add(host.os_type);
|
||||
}
|
||||
});
|
||||
return Array.from(osTypes).sort();
|
||||
}, [hosts]);
|
||||
|
||||
// Group hosts by selected field
|
||||
const groupedHosts = useMemo(() => {
|
||||
if (groupBy === "none") {
|
||||
@@ -1268,9 +1280,11 @@ const Hosts = () => {
|
||||
className="w-full border border-secondary-300 dark:border-secondary-600 rounded-lg px-3 py-2 focus:ring-2 focus:ring-primary-500 focus:border-primary-500 bg-white dark:bg-secondary-800 text-secondary-900 dark:text-white"
|
||||
>
|
||||
<option value="all">All OS</option>
|
||||
<option value="linux">Linux</option>
|
||||
<option value="windows">Windows</option>
|
||||
<option value="macos">macOS</option>
|
||||
{uniqueOsTypes.map((osType) => (
|
||||
<option key={osType} value={osType.toLowerCase()}>
|
||||
{osType}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div className="flex items-end">
|
||||
|
Reference in New Issue
Block a user