happyDomain/happyDeliver
2
0
Fork 0
Code Issues 8 Pull requests 4 Projects Releases Packages Wiki Activity Actions

Tests design and descriptions

Browse source
This commit is contained in:
nemunaire 2025-10-22 22:41:11 +07:00
commit a97729fea6
7 changed files with 230 additions and 164 deletions
Download patch file Download diff file Expand all files Collapse all files

77
web/src/lib/components/MxRecordsDisplay.svelte
View file

@ -1,49 +1,54 @@
<script lang="ts">
import type { ClassValue } from 'svelte/elements';
import type { MXRecord } from "$lib/api/types.gen";
interface Props {
class: ClassValue;
mxRecords: MXRecord[];
title: string;
description?: string;
}
let { mxRecords, title, description }: Props = $props();
let { class: className, mxRecords, title, description }: Props = $props();
let mxsAreValids = $derived(mxRecords.reduce((acc, r) => acc && r.valid, true));
</script>
<div class="mb-4">
<h5 class="text-muted mb-2">
<span class="badge bg-secondary">MX</span> {title}
</h5>
{#if description}
<p class="small text-muted mb-2">{description}</p>
{/if}
<div class="table-responsive">
<table class="table table-sm table-bordered">
<thead>
<tr>
<th>Priority</th>
<th>Host</th>
<th>Status</th>
</tr>
</thead>
<tbody>
{#each mxRecords as mx}
<tr>
<td>{mx.priority}</td>
<td><code>{mx.host}</code></td>
<td>
{#if mx.valid}
<span class="badge bg-success">Valid</span>
{:else}
<span class="badge bg-danger">Invalid</span>
{#if mx.error}
<br><small class="text-danger">{mx.error}</small>
{/if}
{/if}
</td>
</tr>
{/each}
</tbody>
</table>
<div class="card {className}">
<div class="card-header d-flex justify-content-between align-items-center">
<h5 class="text-muted mb-0">
<i
class="bi"
class:bi-check-circle-fill={mxsAreValids}
class:text-success={mxsAreValids}
class:bi-x-circle-fill={!mxsAreValids}
class:text-danger={!mxsAreValids}
></i>
{title}
</h5>
<span class="badge bg-secondary">MX</span>
</div>
<div class="card-body pb-0">
{#if description}
<p class="card-text small text-muted mb-0">{description}</p>
{/if}
</div>
<div class="list-group list-group-flush">
{#each mxRecords as mx}
<div class="list-group-item">
<div class="d-flex gap-2 align-items-center">
{#if mx.valid}
<span class="badge bg-success">Valid</span>
{:else}
<span class="badge bg-danger">Invalid</span>
{/if}
<div>Host: <code>{mx.host}</code></div>
<div>Priority: <strong>{mx.priority}</strong></div>
</div>
{#if mx.error}
<small class="text-danger">{mx.error}</small>
{/if}
</div>
{/each}
</div>
</div>