<script>
    import {previewTitle} from "./Preview";
    import {getContext} from "svelte";

    const channel = getContext("channel");
    export let record;
    export let graph;
    $: schema = channel.schemas.find((aschema) => aschema.name === record.schema);

    $: title = previewTitle(channel.schemas, record, graph);
</script>

{#if record?.data}
    <a
        href="{channel.lucentUrl}/records/{record.id}"
        {title}
        class="reference"
    >
        {title}
    </a>
{/if}

<style>
    a {
        max-width: 200px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 13px;
        color: #333;
    }

    a:hover {
        opacity: 0.5;
        /* color: #fff; */
    }
</style>
