[codex] add audit log filters and CSV export#33
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull request overview
Adds shared client-side filtering and CSV export capabilities to the Audit Log UI (both Connection and System tabs), and increases the fetched audit window so filtering/export is more useful in practice.
Changes:
- Introduces a reusable audit filter bar (search/action/source/status/date range) and applies it to both audit-log tabs.
- Adds CSV export for the currently filtered audit entries.
- Increases audit-log fetch limits from 100 → 1000 and loosens the CSV helper’s column type to accept name-only metadata.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| src/pages/AuditLog.tsx | Adds shared filter UI, filtering logic, and CSV export for connection + system audit entries. |
| src/lib/export-csv.ts | Loosens column metadata typing to support non-query exports with named columns. |
| src/hooks/useQuery.ts | Raises audit-log query limits to 1000 via a shared constant. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <Label>Action</Label> | ||
| <Select | ||
| value={filters.action} | ||
| onValueChange={(action) => onFiltersChange({ ...filters, action: action ?? 'all' })} | ||
| > | ||
| <SelectTrigger> | ||
| <SelectValue /> | ||
| </SelectTrigger> | ||
| <SelectContent> |
There was a problem hiding this comment.
Addressed in dedc4b0 by adding matching label/trigger ids for the Action, Source, and Status selects. Validated with pnpm build, pnpm test tests/audit.test.ts, and pnpm exec eslint src/pages/AuditLog.tsx src/lib/export-csv.ts src/hooks/useQuery.ts.
| <Label>Source</Label> | ||
| <Select | ||
| value={filters.source} | ||
| onValueChange={(source) => onFiltersChange({ ...filters, source: source ?? 'all' })} | ||
| > | ||
| <SelectTrigger> | ||
| <SelectValue /> | ||
| </SelectTrigger> | ||
| <SelectContent> |
There was a problem hiding this comment.
Addressed in dedc4b0 by adding matching label/trigger ids for the Action, Source, and Status selects. Validated with pnpm build, pnpm test tests/audit.test.ts, and pnpm exec eslint src/pages/AuditLog.tsx src/lib/export-csv.ts src/hooks/useQuery.ts.
| <Label>Status</Label> | ||
| <Select | ||
| value={filters.status} | ||
| onValueChange={(status) => onFiltersChange({ ...filters, status: status ?? 'all' })} | ||
| > | ||
| <SelectTrigger> | ||
| <SelectValue /> | ||
| </SelectTrigger> | ||
| <SelectContent> |
There was a problem hiding this comment.
Addressed in dedc4b0 by adding matching label/trigger ids for the Action, Source, and Status selects. Validated with pnpm build, pnpm test tests/audit.test.ts, and pnpm exec eslint src/pages/AuditLog.tsx src/lib/export-csv.ts src/hooks/useQuery.ts.
Greptile SummaryThis PR adds shared client-side filtering (search, action, source, status, date range) and CSV export to both the Connection and System audit log tabs, and raises the server-side page fetch ceiling from 500 to 1000 rows so that client-side operations cover a wider window.
Confidence Score: 3/5Safe to merge after addressing the filter-state persistence bug; all other changes are additive and well-scoped. The connection-switch filter reset bug can silently show zero results — or results filtered by a stale action/source value that doesn't belong to the newly selected connection — with no visible indication to the user beyond the row count. The fix is a single key prop, but without it the feature behaves incorrectly on any warm-cache navigation. The remaining concern (missing label associations) is a minor accessibility gap with no functional impact. src/pages/AuditLog.tsx — the AuditEntriesView render inside connectionContent needs a key prop tied to connectionId. Important Files Changed
Flowchart%%{init: {'theme': 'neutral'}}%%
flowchart TD
A[User visits Audit Log tab] --> B{Connection or System?}
B -->|Connection| C[useAuditLogEntries - limit 1000]
B -->|System| D[useSystemAuditLogEntries - limit 1000]
C --> E[EntriesPanel: loading / error / empty guard]
D --> E
E -->|entries available| F[AuditEntriesView - useState filters]
F --> G[AuditFilterBar renders selects + search]
G --> H{User changes filter}
H --> I[useMemo: filterEntries called]
I --> J{scope?}
J -->|connection| K[ConnectionAuditTable]
J -->|system| L[SystemAuditTable]
G -->|Export CSV click| M[exportAuditEntries - filtered entries only]
M --> N[exportToCsv - PapaParse + blob download]
%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
flowchart TD
A[User visits Audit Log tab] --> B{Connection or System?}
B -->|Connection| C[useAuditLogEntries - limit 1000]
B -->|System| D[useSystemAuditLogEntries - limit 1000]
C --> E[EntriesPanel: loading / error / empty guard]
D --> E
E -->|entries available| F[AuditEntriesView - useState filters]
F --> G[AuditFilterBar renders selects + search]
G --> H{User changes filter}
H --> I[useMemo: filterEntries called]
I --> J{scope?}
J -->|connection| K[ConnectionAuditTable]
J -->|system| L[SystemAuditTable]
G -->|Export CSV click| M[exportAuditEntries - filtered entries only]
M --> N[exportToCsv - PapaParse + blob download]
Reviews (1): Last reviewed commit: "fix: align audit log filter window" | Re-trigger Greptile |
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.
Comments suppressed due to low confidence (1)
src/hooks/useQuery.ts:356
- With the audit-log fetch limit increased to 1000, these queries still refetch every 5s. That can significantly increase background load (network + server) compared to the previous 100-row payload. Consider whether the audit log really needs polling this frequently, or make the refetch interval configurable / longer for these endpoints.
const AUDIT_LOG_LIMIT = 1000;
export function useAuditLogEntries(connectionId: string, enabled = true) {
return useQuery({
queryKey: queryKeys.auditLog(connectionId),
queryFn: async () => {
const response = await queryClient.getAuditLogEntries({ connectionId, limit: AUDIT_LOG_LIMIT });
return response.entries;
},
enabled: enabled && !!connectionId,
refetchInterval: 5000,
});
}
// System-level audit entries (auth.login / auth.logout). Owner-gated server-side, so
// only enable the query for instance owners.
export function useSystemAuditLogEntries(enabled = true) {
return useQuery({
queryKey: queryKeys.systemAuditLog(),
queryFn: async () => {
const response = await queryClient.getSystemAuditLogEntries({ limit: AUDIT_LOG_LIMIT });
return response.entries;
},
enabled,
refetchInterval: 5000,
});
Summary
Validation
pnpm buildpnpm test tests/audit.test.tspnpm exec eslint src/pages/AuditLog.tsx src/lib/export-csv.ts src/hooks/useQuery.tscurl -s -o /tmp/pgconsole-audit.html -w "%{http_code}" http://localhost:5173/audit-log-> 200 with local dev serverNote:
pnpm lint -- src/pages/AuditLog.tsx src/lib/export-csv.tsinvokes the package script aseslint . -- ..., so it still scans the full repo and fails on existing unrelated lint debt. Direct ESLint on touched files passes.