Files
supabase/apps/studio/components/interfaces/Organization/AuditLogs/AuditLogs.utils.ts
Joshen Lim e3fec137fe Joshenlim/fe 4466 audit logs update organization logs as well (#50935)
## Context

Follows up from [this
PR](https://github.com/supabase/supabase/pull/50799) - updates the Audit
Logs UI for organization audit logs. Just differs from Account audit
logs slightly with added "Actor" + "Target" column

Reuses the same UI components from account audit logs so quite a bit of
code clean up 🙂
<img width="1451" height="955" alt="image"
src="https://github.com/user-attachments/assets/a1002cee-917f-4d9a-b977-3fab8ecd2d13"
/>


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Organization audit logs now use a sortable table with row selection
and a resizable details panel.
* Actor details show a member’s username when available, otherwise the
actor’s email; a dash appears when neither is available.
* Logs can be filtered by users and projects, with separate messages for
no logs and no matching results.
* A refresh control and loading indicators help show audit-log updates.
* **Bug Fixes**
* Organization project lists stop loading when pagination totals are
unavailable.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-09-29 17:41:54 +08:00

42 lines
1.7 KiB
TypeScript

import dayjs from 'dayjs'
import { DatePickerToFrom } from '@/components/interfaces/Settings/Logs/Logs.types'
import type { AuditLog } from '@/data/organizations/organization-audit-logs-query'
export function filterByUsers(logs: AuditLog[], userIds: string[]): AuditLog[] {
if (userIds.length === 0) return logs
return logs.filter((log) => userIds.includes(log.actor.user_id ?? ''))
}
// [Joshen] Mainly to handle if a single date is selected - currently just for Audit Logs as
// i'm on the fence if this logic should be within the DatePicker component itself
// e.g for Logs.DatePicker which uses this component, the component itself has its own time selection UI
// JFYI currentDate is just a parameter so that I can run tests for this
export const formatSelectedDateRange = (value: DatePickerToFrom) => {
const current = dayjs()
const from = dayjs(value.from)
.hour(current.hour())
.minute(current.minute())
.second(current.second())
const to = dayjs(value.to).hour(current.hour()).minute(current.minute()).second(current.second())
if (from.date() === to.date()) {
// [Joshen] If a single date is selected, we either set the "from" to start from 00:00
// or "to" to end at 23:59 depending on which date was selected
if (from.date() === current.date()) {
return {
from: from.set('hour', 0).set('minute', 0).set('second', 0).utc().toISOString(),
to: to.utc().toISOString(),
}
} else {
return {
from: from.utc().toISOString(),
to: to.set('hour', 23).set('minute', 59).set('second', 59).utc().toISOString(),
}
}
} else {
return { from: from.utc().toISOString(), to: to.utc().toISOString() }
}
}