forked from coracle/caravel
userAdityaa
08c9a2920b
Co-authored-by: userAdityaa <aditya.chaudhary1558@gmail.com> Co-committed-by: userAdityaa <aditya.chaudhary1558@gmail.com>
39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
import { A } from "@solidjs/router"
|
|
import { Show } from "solid-js"
|
|
import type { Relay } from "@/lib/api"
|
|
|
|
type RelayListItemProps = {
|
|
relay: Relay
|
|
href: string
|
|
showTenant?: boolean
|
|
}
|
|
|
|
export default function RelayListItem(props: RelayListItemProps) {
|
|
return (
|
|
<li>
|
|
<A href={props.href} class="block rounded-lg border border-gray-200 bg-white p-4 hover:border-gray-300">
|
|
<div class="flex items-center justify-between gap-3">
|
|
<div>
|
|
<p class="font-medium text-gray-900">{props.relay.info_name || props.relay.subdomain}</p>
|
|
<p class="text-xs text-gray-500">{props.relay.subdomain}.spaces.coracle.social</p>
|
|
{props.showTenant && (
|
|
<p class="text-xs text-gray-500 break-all mt-1">Tenant: {props.relay.tenant}</p>
|
|
)}
|
|
</div>
|
|
<Show
|
|
when={props.relay.sync_error}
|
|
fallback={<p class="text-xs uppercase tracking-wide text-gray-500">{props.relay.status}</p>}
|
|
>
|
|
<span
|
|
class="inline-flex items-center rounded-full border border-red-200 bg-red-50 px-2.5 py-0.5 text-xs font-medium text-red-700 max-w-56 truncate"
|
|
title={props.relay.sync_error}
|
|
>
|
|
{props.relay.sync_error}
|
|
</span>
|
|
</Show>
|
|
</div>
|
|
</A>
|
|
</li>
|
|
)
|
|
}
|