mirror of
https://github.com/fosrl/pangolin.git
synced 2026-05-04 11:34:19 +00:00
Support unknown and degraded status
This commit is contained in:
37
src/components/AdminUsersDataTable.tsx
Normal file
37
src/components/AdminUsersDataTable.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
"use client";
|
||||
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { DataTable } from "@app/components/ui/data-table";
|
||||
import { useTranslations } from "next-intl";
|
||||
|
||||
interface DataTableProps<TData, TValue> {
|
||||
columns: ColumnDef<TData, TValue>[];
|
||||
data: TData[];
|
||||
onRefresh?: () => void;
|
||||
isRefreshing?: boolean;
|
||||
}
|
||||
|
||||
export function UsersDataTable<TData, TValue>({
|
||||
columns,
|
||||
data,
|
||||
onRefresh,
|
||||
isRefreshing
|
||||
}: DataTableProps<TData, TValue>) {
|
||||
const t = useTranslations();
|
||||
|
||||
return (
|
||||
<DataTable
|
||||
columns={columns}
|
||||
data={data}
|
||||
persistPageSize="userServer-table"
|
||||
title={t("userServer")}
|
||||
searchPlaceholder={t("userSearch")}
|
||||
searchColumn="email"
|
||||
onRefresh={onRefresh}
|
||||
isRefreshing={isRefreshing}
|
||||
enableColumnVisibility={true}
|
||||
stickyLeftColumn="username"
|
||||
stickyRightColumn="actions"
|
||||
/>
|
||||
);
|
||||
}
|
||||
41
src/components/RolesDataTable.tsx
Normal file
41
src/components/RolesDataTable.tsx
Normal file
@@ -0,0 +1,41 @@
|
||||
"use client";
|
||||
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { DataTable } from "@app/components/ui/data-table";
|
||||
import { useTranslations } from "next-intl";
|
||||
|
||||
interface DataTableProps<TData, TValue> {
|
||||
columns: ColumnDef<TData, TValue>[];
|
||||
data: TData[];
|
||||
createRole?: () => void;
|
||||
onRefresh?: () => void;
|
||||
isRefreshing?: boolean;
|
||||
}
|
||||
|
||||
export function RolesDataTable<TData, TValue>({
|
||||
columns,
|
||||
data,
|
||||
createRole,
|
||||
onRefresh,
|
||||
isRefreshing
|
||||
}: DataTableProps<TData, TValue>) {
|
||||
const t = useTranslations();
|
||||
|
||||
return (
|
||||
<DataTable
|
||||
columns={columns}
|
||||
data={data}
|
||||
persistPageSize="roles-table"
|
||||
title={t("roles")}
|
||||
searchPlaceholder={t("accessRolesSearch")}
|
||||
searchColumn="name"
|
||||
onAdd={createRole}
|
||||
onRefresh={onRefresh}
|
||||
isRefreshing={isRefreshing}
|
||||
addButtonText={t("accessRolesAdd")}
|
||||
enableColumnVisibility={true}
|
||||
stickyLeftColumn="name"
|
||||
stickyRightColumn="actions"
|
||||
/>
|
||||
);
|
||||
}
|
||||
@@ -42,7 +42,8 @@ const barColorClass: Record<string, string> = {
|
||||
good: "bg-green-500",
|
||||
degraded: "bg-yellow-500",
|
||||
bad: "bg-red-500",
|
||||
no_data: "bg-neutral-200 dark:bg-neutral-700"
|
||||
no_data: "bg-neutral-200 dark:bg-neutral-700",
|
||||
unknown: "bg-neutral-200 dark:bg-neutral-700"
|
||||
};
|
||||
|
||||
type UptimeBarProps = {
|
||||
@@ -188,7 +189,7 @@ export default function UptimeBar({
|
||||
<div className="font-semibold text-xs">
|
||||
{formatDate(day.date)}
|
||||
</div>
|
||||
{day.status !== "no_data" && (
|
||||
{day.status !== "no_data" && day.status !== "unknown" && (
|
||||
<div className="text-xs text-primary-foreground/80">
|
||||
{t("uptimeTooltipUptimeLabel")}:{" "}
|
||||
<span className="font-medium text-primary-foreground">
|
||||
@@ -224,7 +225,7 @@ export default function UptimeBar({
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
{day.status === "no_data" && (
|
||||
{(day.status === "no_data" || day.status === "unknown") && (
|
||||
<div className="text-xs text-primary-foreground/60">
|
||||
{t("uptimeNoMonitoringData")}
|
||||
</div>
|
||||
|
||||
@@ -34,7 +34,8 @@ const barColorClass: Record<string, string> = {
|
||||
good: "bg-green-500",
|
||||
degraded: "bg-yellow-500",
|
||||
bad: "bg-red-500",
|
||||
no_data: "bg-neutral-200 dark:bg-neutral-700"
|
||||
no_data: "bg-neutral-200 dark:bg-neutral-700",
|
||||
unknown: "bg-neutral-200 dark:bg-neutral-700"
|
||||
};
|
||||
|
||||
type UptimeMiniBarProps = {
|
||||
@@ -137,7 +138,7 @@ export default function UptimeMiniBar({
|
||||
{formatDate(day.date)}
|
||||
</div>
|
||||
<div className="text-xs text-primary-foreground/80">
|
||||
{day.status === "no_data"
|
||||
{day.status === "no_data" || day.status === "unknown"
|
||||
? t("uptimeNoData")
|
||||
: `${day.uptimePercent.toFixed(1)}% ${t("uptimeSuffix")}`}
|
||||
</div>
|
||||
|
||||
41
src/components/UsersDataTable.tsx
Normal file
41
src/components/UsersDataTable.tsx
Normal file
@@ -0,0 +1,41 @@
|
||||
"use client";
|
||||
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { DataTable } from "@app/components/ui/data-table";
|
||||
import { useTranslations } from "next-intl";
|
||||
|
||||
interface DataTableProps<TData, TValue> {
|
||||
columns: ColumnDef<TData, TValue>[];
|
||||
data: TData[];
|
||||
inviteUser?: () => void;
|
||||
onRefresh?: () => void;
|
||||
isRefreshing?: boolean;
|
||||
}
|
||||
|
||||
export function UsersDataTable<TData, TValue>({
|
||||
columns,
|
||||
data,
|
||||
inviteUser,
|
||||
onRefresh,
|
||||
isRefreshing
|
||||
}: DataTableProps<TData, TValue>) {
|
||||
const t = useTranslations();
|
||||
|
||||
return (
|
||||
<DataTable
|
||||
columns={columns}
|
||||
data={data}
|
||||
persistPageSize="users-table"
|
||||
title={t("users")}
|
||||
searchPlaceholder={t("accessUsersSearch")}
|
||||
searchColumn="email"
|
||||
onAdd={inviteUser}
|
||||
onRefresh={onRefresh}
|
||||
isRefreshing={isRefreshing}
|
||||
addButtonText={t("accessUserCreate")}
|
||||
enableColumnVisibility={true}
|
||||
stickyLeftColumn="displayUsername"
|
||||
stickyRightColumn="actions"
|
||||
/>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user