mirror of
https://github.com/EFForg/rayhunter.git
synced 2026-04-27 07:59:59 -07:00
Add arrow for analysis view toggle
This commit is contained in:
@@ -2,9 +2,10 @@
|
||||
import { AnalysisStatus } from "$lib/analysisManager.svelte";
|
||||
import { EventType } from "$lib/analysis.svelte";
|
||||
import type { ManifestEntry } from "$lib/manifest.svelte";
|
||||
let { entry, onclick }: {
|
||||
let { entry, onclick, analysis_visible}: {
|
||||
entry: ManifestEntry,
|
||||
onclick: () => void,
|
||||
analysis_visible: boolean,
|
||||
} = $props();
|
||||
|
||||
let summary = $derived.by(() => {
|
||||
@@ -43,10 +44,9 @@
|
||||
|
||||
let button_class = $derived(ready ? "text-blue-600 border rounded-full px-2" : '');
|
||||
</script>
|
||||
|
||||
<button class="{button_class} {entry.get_num_warnings() < 1 ? 'text-green-700 border-green-500 bg-green-200' : 'text-red-700 border-red-500 bg-red-200'}" disabled={!ready} {onclick}>
|
||||
{summary}
|
||||
</button>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
<button class="flex flex-row gap-1 lg:gap-2" disabled={!ready} {onclick}>
|
||||
<span class="{button_class} {entry.get_num_warnings() < 1 ? 'text-green-700 border-green-500 bg-green-200' : 'text-red-700 border-red-500 bg-red-200'}">{summary}</span>
|
||||
<svg class="w-6 h-6 text-gray-800 transition-transform {analysis_visible ? 'rotate-180' : ''}" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
|
||||
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 9-7 7-7-7"/>
|
||||
</svg>
|
||||
</button>
|
||||
@@ -24,19 +24,26 @@
|
||||
}
|
||||
return current ? "bg-green-100" : "bg-gray-100"
|
||||
});
|
||||
let status_border_color = $derived.by(() => {
|
||||
const num_warnings = entry.get_num_warnings();
|
||||
if (num_warnings !== undefined && num_warnings > 0) {
|
||||
return "border-red-100";
|
||||
}
|
||||
return current ? "border-green-100" : "border-gray-100"
|
||||
});
|
||||
let analysis_visible = $state(false);
|
||||
function toggle_analysis_visibility() {
|
||||
analysis_visible = !analysis_visible;
|
||||
}
|
||||
</script>
|
||||
<div class="{status_row_color} drop-shadow p-4 flex flex-col gap-2">
|
||||
<div class="{status_row_color} {status_border_color} drop-shadow p-4 flex flex-col gap-2 border rounded-md">
|
||||
{#if current}
|
||||
<span class="text-2xl font-bold mb-2">Current Recording</span>
|
||||
{/if}
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-row justify-between">
|
||||
<span class="font-bold">ID: {entry.name}</span>
|
||||
<span class=""><AnalysisStatus onclick={toggle_analysis_visibility} entry={entry} /></span>
|
||||
<span class=""><AnalysisStatus onclick={toggle_analysis_visibility} entry={entry} analysis_visible={analysis_visible}/></span>
|
||||
</div>
|
||||
<span class="">{entry.qmdl_size_bytes} bytes</span>
|
||||
</div>
|
||||
|
||||
@@ -37,7 +37,7 @@
|
||||
<td class="p-2">{entry.qmdl_size_bytes}</td>
|
||||
<td class="p-2"><DownloadLink url={entry.get_pcap_url()} text="pcap" /></td>
|
||||
<td class="p-2"><DownloadLink url={entry.get_qmdl_url()} text="qmdl" /></td>
|
||||
<td class="p-2"><AnalysisStatus onclick={toggle_analysis_visibility} entry={entry} /></td>
|
||||
<td class="p-2"><AnalysisStatus onclick={toggle_analysis_visibility} entry={entry} analysis_visible={analysis_visible}/></td>
|
||||
{#if current}
|
||||
<td class="p-2"></td>
|
||||
{:else}
|
||||
|
||||
Reference in New Issue
Block a user