Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add basic filtering to scan results page #805

Merged
merged 2 commits into from
Dec 1, 2023
Merged

Add basic filtering to scan results page #805

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1ff4448
Add basic filtering
zacharykeeping Dec 1, 2023
4d33cd2
Include anchor text
zacharykeeping Dec 1, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
125 changes: 64 additions & 61 deletions ui/src/components/linkauditorcomponents/DetailsByDest.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@

export let builds = [];
export let scanUrl;
export let isIgnoredHidden;

const ignore = url => dispatch("ignore", url);
let destinations;
Expand Down Expand Up @@ -47,7 +48,7 @@

const deleteIgnore = async (url) => {
deleteUrl = url;
loadingChecks[url] = true;
loadingChecks[url.dst] = true;
const rules = getMatchingIgnoredRules(url, scanUrl, $ignoredUrls$);
try {
for await (const rule of rules) {
Expand All @@ -56,82 +57,84 @@
} catch (error) {
addedFailedToast = true;
} finally {
loadingChecks[url] = false;
loadingChecks[url.dst] = false;
}
};

const toggleIgnore = async (url) => {
if (ignoredChecks[url]) {
if (ignoredChecks[url.dst]) {
await deleteIgnore(url);
} else {
ignore(url);
ignore(url.dst);
}
};
</script>

{#each destinationsKeys as url}
<div class="mb-3">
<span class="font-bold mr-2">
<Icon
cssClass="inline-block cursor-pointer"
on:click={() => hideShow(url)}>
{#if !hiddenRows[url]}
<path d="M19 9l-7 7-7-7" />
{#if !(isIgnoredHidden && ignoredChecks[url])}
<div class="mb-3">
<span class="font-bold mr-2">
<Icon
cssClass="inline-block cursor-pointer"
on:click={() => hideShow(url)}>
{#if !hiddenRows[url]}
<path d="M19 9l-7 7-7-7" />
{:else}
<path d="M9 5l7 7-7 7" />
{/if}
</Icon>
{destinations[url][0].statusmsg} ({destinations[url][0].statuscode || 0})
:
</span>
<a class="mr-2 inline-block align-baseline link" target="_blank" href={url}>
{url}
</a>
</div>
{#if !hiddenRows[url]}
<div class="font-bold textgrey ml-2">
<i class="fas fa-ban"></i>
<span title="Ignore URL in future scans" use:tooltip>Ignore: </span>
{#if loadingChecks[url]}
<LoadingCircle />
{:else}
<path d="M9 5l7 7-7 7" />
<input type="checkbox" on:click={() => toggleIgnore(url)} bind:checked={ignoredChecks[url]} />
{/if}
</Icon>
{destinations[url][0].statusmsg} ({destinations[url][0].statuscode || 0})
:
</span>
<a class="mr-2 inline-block align-baseline link" target="_blank" href={url}>
{url}
</a>
</div>
{#if !hiddenRows[url]}
<div class="font-bold textgrey ml-2">
<i class="fas fa-ban"></i>
<span title="Ignore URL in future scans" use:tooltip>Ignore: </span>
{#if loadingChecks[url]}
<LoadingCircle />
{:else}
<input type="checkbox" on:click={() => toggleIgnore(url)} bind:checked={ignoredChecks[url]} />
{/if}
</div>
{#if destinations[url][0].daysUnfixed > -1}
<div class="font-bold text-yellow-600 ml-2">
<i class="fas fa-exclamation-triangle"></i>
{formatDaysUnfixed(destinations[url][0].daysUnfixed)}
</div>
{/if}
<table
class="table-fixed w-full md:table-auto mb-8"
in:fade={{ y: 100, duration: 400 }}
out:fade={{ y: -100, duration: 200 }}>
<thead>
<tr>
<th class="w-6/12 px-4 py-2">
Found on Page ({destinations[url].length})
</th>
<th class="w-6/12 px-4 py-2">Anchor Text</th>
</tr>
</thead>
<tbody>
{#each destinations[url] as val}
{#if destinations[url][0].daysUnfixed > -1}
<div class="font-bold text-yellow-600 ml-2">
<i class="fas fa-exclamation-triangle"></i>
{formatDaysUnfixed(destinations[url][0].daysUnfixed)}
</div>
{/if}
<table
class="table-fixed w-full md:table-auto mb-8"
in:fade={{ y: 100, duration: 400 }}
out:fade={{ y: -100, duration: 200 }}>
<thead>
<tr>
<td class="w-6/12 border px-4 py-2 break-all">
<a
class="link inline-block align-baseline link"
target="_blank"
href={val.src}>
{val.src}
</a>
</td>
<td class="w-6/12 border px-4 py-2 break-all">{val.link || ''}</td>
<th class="w-6/12 px-4 py-2">
Found on Page ({destinations[url].length})
</th>
<th class="w-6/12 px-4 py-2">Anchor Text</th>
</tr>
{/each}
</tbody>
</table>
</thead>
<tbody>
{#each destinations[url] as val}
<tr>
<td class="w-6/12 border px-4 py-2 break-all">
<a
class="link inline-block align-baseline link"
target="_blank"
href={val.src}>
{val.src}
</a>
</td>
<td class="w-6/12 border px-4 py-2 break-all">{val.link || ''}</td>
</tr>
{/each}
</tbody>
</table>
{/if}
{/if}
{/each}

Expand Down
150 changes: 78 additions & 72 deletions ui/src/components/linkauditorcomponents/DetailsByReason.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,14 @@
import LoadingCircle from "../misccomponents/LoadingCircle.svelte";
import Toastr from "../misccomponents/Toastr.svelte";
import { tooltip } from '../misccomponents/tooltip';

export let builds = [];
export let scanUrl;
export let isIgnoredHidden;

const dispatch = createEventDispatcher();
const ignore = url => dispatch("ignore", url);

export let scanUrl;

let reasons;
let reasonsKeys = [];
let hiddenRows = {};
Expand All @@ -22,7 +24,7 @@
let deleteUrl = '';
let addedFailedToast = false;

$: if (builds.length > 0) {
$: {
reasons = groupBy(props(["statusmsg"]))(builds);
reasonsKeys = Object.keys(reasons);

Expand All @@ -47,7 +49,7 @@

const deleteIgnore = async (url) => {
deleteUrl = url;
loadingChecks[url] = true;
loadingChecks[url.dst] = true;
const rules = getMatchingIgnoredRules(url, scanUrl, $ignoredUrls$);
try {
for await (const rule of rules) {
Expand All @@ -56,88 +58,92 @@
} catch (error) {
addedFailedToast = true;
} finally {
loadingChecks[url] = false;
loadingChecks[url.dst] = false;
}
};

const toggleIgnore = async (url) => {
if (ignoredChecks[url]) {
if (ignoredChecks[url.dst]) {
await deleteIgnore(url);
} else {
ignore(url);
ignore(url.dst);
}
};
</script>

{#each reasonsKeys as reason}
<div class="mb-3">
<span class="font-bold mr-2">
<Icon
cssClass="inline-block cursor-pointer"
on:click={() => hideShow(reason)}>
{#if !hiddenRows[reason]}
<path d="M19 9l-7 7-7-7" />
{:else}
<path d="M9 5l7 7-7 7" />
{/if}
</Icon>
Failure reason:
</span>
<span class="inline-block align-baseline textgrey">{reason}</span>
</div>
{#if !(isIgnoredHidden && reasons[reason].every((val) => ignoredChecks[val.dst]))}
<div class="mb-3">
<span class="font-bold mr-2">
<Icon
cssClass="inline-block cursor-pointer"
on:click={() => hideShow(reason)}>
{#if !hiddenRows[reason]}
<path d="M19 9l-7 7-7-7" />
{:else}
<path d="M9 5l7 7-7 7" />
{/if}
</Icon>
Failure reason:
</span>
<span class="inline-block align-baseline textgrey">{reason}</span>
</div>

{#if !hiddenRows[reason]}
<table
class="w-full table-auto mb-8"
in:fade={{ y: 100, duration: 400 }}
out:fade={{ y: -100, duration: 200 }}>
<thead>
<tr>
<th class="w-4/12 px-2 py-2">Source ({reasons[reason].length})</th>
<th class="w-3/12 px-2 py-2">Destination</th>
<th class="w-2/12 px-2 py-2">Anchor Text</th>
<th class="w-1/12 px-2 py-2 text-right">Status</th>
<th class="w-1/12 px-2 py-2 text-right">Days Unfixed</th>
<th class="hidden md:table-cell w-1/12 px-2 py-2" title="Ignore URL in future scans" use:tooltip>Ignore</th>
</tr>
</thead>
<tbody>
{#each reasons[reason] as val}
{#if !hiddenRows[reason]}
<table
class="w-full table-auto mb-8"
in:fade={{ y: 100, duration: 400 }}
out:fade={{ y: -100, duration: 200 }}>
<thead>
<tr>
<td class="w-4/12 border px-2 py-2 break-all">
<a
class="inline-block align-baseline link"
target="_blank"
href={val.src}>
{val.src}
</a>
</td>
<td class="w-3/12 border px-2 py-2 break-all">
<a
class="inline-block align-baseline link"
target="_blank"
href={val.dst}>
{val.dst.length < 70 ? val.dst : val.dst.substring(0, 70) + '...'}
</a>
</td>
<td class="w-2/12 border px-2 py-2 break-all">{val.link || ''}</td>
<td class="w-1/12 border px-2 py-2 text-right">
{val.statuscode || '0'}
</td>
<td class="w-1/12 border px-2 py-2 text-right">
{formatDaysUnfixed(val.daysUnfixed)}
</td>
<td class="hidden md:table-cell w-1/12 border px-2 py-2 text-center">
{#if loadingChecks[val.dst]}
<LoadingCircle />
{:else}
<input type="checkbox" on:click={() => toggleIgnore(val.dst)} bind:checked={ignoredChecks[val.dst]} />
{/if}
</td>
<th class="w-4/12 px-2 py-2">Source ({reasons[reason].length})</th>
<th class="w-3/12 px-2 py-2">Destination</th>
<th class="w-2/12 px-2 py-2">Anchor Text</th>
<th class="w-1/12 px-2 py-2 text-right">Status</th>
<th class="w-1/12 px-2 py-2 text-right">Days Unfixed</th>
<th class="hidden md:table-cell w-1/12 px-2 py-2" title="Ignore URL in future scans" use:tooltip>Ignore</th>
</tr>
{/each}
</tbody>
</table>
</thead>
<tbody>
{#each reasons[reason] as val}
{#if !(isIgnoredHidden && ignoredChecks[val.dst])}
<tr>
<td class="w-4/12 border px-2 py-2 break-all">
<a
class="inline-block align-baseline link"
target="_blank"
href={val.src}>
{val.src}
</a>
</td>
<td class="w-3/12 border px-2 py-2 break-all">
<a
class="inline-block align-baseline link"
target="_blank"
href={val.dst}>
{val.dst.length < 70 ? val.dst : val.dst.substring(0, 70) + '...'}
</a>
</td>
<td class="w-2/12 border px-2 py-2 break-all">{val.link || ''}</td>
<td class="w-1/12 border px-2 py-2 text-right">
{val.statuscode || '0'}
</td>
<td class="w-1/12 border px-2 py-2 text-right">
{formatDaysUnfixed(val.daysUnfixed)}
</td>
<td class="hidden md:table-cell w-1/12 border px-2 py-2 text-center">
{#if loadingChecks[val.dst]}
<LoadingCircle />
{:else}
<input type="checkbox" on:click={() => toggleIgnore(val.dst)} bind:checked={ignoredChecks[val.dst]} />
{/if}
</td>
</tr>
{/if}
{/each}
</tbody>
</table>
{/if}
{/if}
{/each}

Expand Down
Loading
Loading