Refine ISAC selection controls and icons
This commit is contained in:
@@ -2,9 +2,18 @@
|
||||
import KpiFilters from '$lib/components/KpiFilters.svelte';
|
||||
import PendingForm from '$lib/components/PendingForm.svelte';
|
||||
import RegistryPagination from '$lib/components/RegistryPagination.svelte';
|
||||
import SearchableAssignment from '$lib/components/SearchableAssignment.svelte';
|
||||
let { data, form } = $props();
|
||||
let confirming = $state<any>(null);
|
||||
let handledResultToken = $state('');
|
||||
const categoryOptions = $derived([
|
||||
{id:'user',name:'USER OPERATIONS · ALL'},
|
||||
{id:'access_policy',name:'ACCESS POLICY · ALL'},
|
||||
...data.categories
|
||||
.filter((item) => !['user', 'access_policy'].includes(String(item.entity_type)))
|
||||
.map((item) => ({id:String(item.entity_type),name:`${String(item.entity_type).replaceAll('_',' ').toUpperCase()} · ${item.count}`}))
|
||||
]);
|
||||
const actionOptions = $derived(data.actions.map((item) => ({id:String(item.action),name:`${String(item.action).toUpperCase()} · ${item.count}`})));
|
||||
const date = (value: unknown) => new Intl.DateTimeFormat(undefined, { dateStyle: 'medium', timeStyle: 'medium' }).format(new Date(String(value)));
|
||||
const pretty = (value: unknown) => {
|
||||
if (!value) return 'NO SNAPSHOT';
|
||||
@@ -29,8 +38,8 @@
|
||||
]}/>
|
||||
<form class="audit-filter">
|
||||
<input name="q" value={data.filters.query} placeholder="ACTOR, TARGET ID, OR CHANGED VALUE"/>
|
||||
<select name="category"><option value="">ALL CATEGORIES</option><option value="user" selected={data.filters.category === 'user'}>USER OPERATIONS · ALL</option><option value="access_policy" selected={data.filters.category === 'access_policy'}>ACCESS POLICY · ALL</option>{#each data.categories as item}<option value={item.entity_type} selected={data.filters.category === item.entity_type}>{String(item.entity_type).replaceAll('_',' ').toUpperCase()} · {item.count}</option>{/each}</select>
|
||||
<select name="action"><option value="">ALL ACTIONS</option>{#each data.actions as item}<option value={item.action} selected={data.filters.action === item.action}>{String(item.action).toUpperCase()} · {item.count}</option>{/each}</select>
|
||||
<SearchableAssignment items={categoryOptions} mode="single" compact fieldName="category" value={data.filters.category} subjectLabel="AUDIT CATEGORY" searchPlaceholder="Search categories…" emptySelectionLabel="ALL CATEGORIES"/>
|
||||
<SearchableAssignment items={actionOptions} mode="single" compact fieldName="action" value={data.filters.action} subjectLabel="AUDIT ACTION" searchPlaceholder="Search actions…" emptySelectionLabel="ALL ACTIONS"/>
|
||||
<button class="secondary">SEARCH AUDIT</button>
|
||||
</form>
|
||||
<RegistryPagination pagination={data.pagination}/>
|
||||
|
||||
Reference in New Issue
Block a user