Polish the create and link to table

This commit is contained in:
Owen
2026-04-20 20:14:25 -07:00
parent f938e9c3c0
commit d7a9e1a517
5 changed files with 19 additions and 7 deletions

View File

@@ -583,6 +583,7 @@ export default function GeneralForm() {
<UptimeAlertSection <UptimeAlertSection
orgId={resource.orgId} orgId={resource.orgId}
resourceId={resource.resourceId} resourceId={resource.resourceId}
startingName={resource.name}
/> />
)} )}
<SettingsSection> <SettingsSection>

View File

@@ -117,6 +117,7 @@ export default function GeneralPage() {
<UptimeAlertSection <UptimeAlertSection
orgId={site.orgId} orgId={site.orgId}
siteId={site.siteId} siteId={site.siteId}
startingName={site.name}
/> />
)} )}
<SettingsSection> <SettingsSection>

View File

@@ -31,6 +31,8 @@ import { useDebouncedCallback } from "use-debounce";
type AlertingRulesTableProps = { type AlertingRulesTableProps = {
orgId: string; orgId: string;
siteId?: number;
resourceId?: number;
}; };
type AlertRuleRow = { type AlertRuleRow = {
@@ -99,7 +101,7 @@ function triggerLabel(
} }
} }
export default function AlertingRulesTable({ orgId }: AlertingRulesTableProps) { export default function AlertingRulesTable({ orgId, siteId, resourceId }: AlertingRulesTableProps) {
const router = useRouter(); const router = useRouter();
const t = useTranslations(); const t = useTranslations();
const api = createApiClient(useEnvContext()); const api = createApiClient(useEnvContext());
@@ -127,7 +129,7 @@ export default function AlertingRulesTable({ orgId }: AlertingRulesTableProps) {
isLoading, isLoading,
refetch, refetch,
isRefetching isRefetching
} = useQuery(orgQueries.alertRules({ orgId, limit: pageSize, offset: pageIndex * pageSize, query })); } = useQuery(orgQueries.alertRules({ orgId, limit: pageSize, offset: pageIndex * pageSize, query, siteId, resourceId }));
const rows = data?.alertRules ?? []; const rows = data?.alertRules ?? [];
const total = data?.pagination.total ?? 0; const total = data?.pagination.total ?? 0;

View File

@@ -35,6 +35,7 @@ import { orgQueries } from "@app/lib/queries";
interface UptimeAlertSectionProps { interface UptimeAlertSectionProps {
orgId: string; orgId: string;
siteId?: number; siteId?: number;
startingName?: string;
resourceId?: number; resourceId?: number;
days?: number; days?: number;
} }
@@ -42,6 +43,7 @@ interface UptimeAlertSectionProps {
export default function UptimeAlertSection({ export default function UptimeAlertSection({
orgId, orgId,
siteId, siteId,
startingName,
resourceId, resourceId,
days = 90 days = 90
}: UptimeAlertSectionProps) { }: UptimeAlertSectionProps) {
@@ -49,7 +51,7 @@ export default function UptimeAlertSection({
const queryClient = useQueryClient(); const queryClient = useQueryClient();
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const [name, setName] = useState("Uptime Alert"); const [name, setName] = useState(`${siteId ? "Site" : "Resource"} ${startingName} Alert`);
const [userTags, setUserTags] = useState<Tag[]>([]); const [userTags, setUserTags] = useState<Tag[]>([]);
const [roleTags, setRoleTags] = useState<Tag[]>([]); const [roleTags, setRoleTags] = useState<Tag[]>([]);
const [emailTags, setEmailTags] = useState<Tag[]>([]); const [emailTags, setEmailTags] = useState<Tag[]>([]);
@@ -156,7 +158,7 @@ export default function UptimeAlertSection({
const alertButton = alertRulesLoading ? null : hasRules ? ( const alertButton = alertRulesLoading ? null : hasRules ? (
<Button variant="outline" size="sm" asChild> <Button variant="outline" size="sm" asChild>
<Link href={`/${orgId}/settings/alerting`}> <Link href={`/${orgId}/settings/alerting?siteId=${siteId}&resourceId=${resourceId}`}>
<BellRing className="size-4 mr-2" /> <BellRing className="size-4 mr-2" />
View Alerts View Alerts
</Link> </Link>

View File

@@ -260,20 +260,26 @@ export const orgQueries = {
orgId, orgId,
limit = 20, limit = 20,
offset = 0, offset = 0,
query query,
siteId,
resourceId
}: { }: {
orgId: string; orgId: string;
limit?: number; limit?: number;
offset?: number; offset?: number;
query?: string; query?: string;
siteId?: number;
resourceId?: number;
}) => }) =>
queryOptions({ queryOptions({
queryKey: ["ORG", orgId, "ALERT_RULES", { limit, offset, query }] as const, queryKey: ["ORG", orgId, "ALERT_RULES", { limit, offset, query, siteId, resourceId }] as const,
queryFn: async ({ signal, meta }) => { queryFn: async ({ signal, meta }) => {
const sp = new URLSearchParams(); const sp = new URLSearchParams();
sp.set("limit", String(limit)); sp.set("limit", String(limit));
sp.set("offset", String(offset)); sp.set("offset", String(offset));
if (query) sp.set("query", query); if (query) sp.set("query", query);
if (siteId != null) sp.set("siteId", String(siteId));
if (resourceId != null) sp.set("resourceId", String(resourceId));
const res = await meta!.api.get< const res = await meta!.api.get<
AxiosResponse<ListAlertRulesResponse> AxiosResponse<ListAlertRulesResponse>
>(`/org/${orgId}/alert-rules?${sp.toString()}`, { signal }); >(`/org/${orgId}/alert-rules?${sp.toString()}`, { signal });