<script lang="ts">
let log_lvl: number = 0;

// *** Import Svelte core
import { onMount } from 'svelte';

// *** Import Aether core variables and functions
import { ae_util } from '$lib/ae_utils/ae_utils';
import {
    ae_snip,
    ae_loc,
    ae_sess,
    ae_api,
    ae_trig,
    slct,
    slct_trigger
} from '$lib/stores/ae_stores';
import { idaa_loc, idaa_sess, idaa_slct } from '$lib/stores/ae_idaa_stores';

interface Props {
    /** @type {import('./$types').PageData} */
    data: any;
    lq__post_obj_li: any;
}

let { data, lq__post_obj_li }: Props = $props();

// Derived list of visible items (Refactored 2026-02-05)
let visible_post_obj_li = $derived.by(() => {
    const list = $lq__post_obj_li;
    if (!list || !Array.isArray(list)) return [];

    const filtered = list.filter((post: any) => {
        if (!post) return false;

        /**
         * DUAL-LAYER VISIBILITY LOGIC
         * 1. Public Logic: If an item is enabled and NOT hidden, everyone sees it.
         * 2. Trusted Logic: If an item is disabled OR hidden, ONLY trusted users see it.
         *
         * NOTE: We also respect the active query filters for hidden/enabled.
         */
        const is_hidden = post.hide == true;
        const is_disabled = post.enable == false;

        // Strict Filter Mapping (from UI dropdowns)
        if ($idaa_loc.bb.qry__hidden === 'hidden' && !is_hidden) return false;
        if ($idaa_loc.bb.qry__hidden === 'not_hidden' && is_hidden)
            return false;
        if ($idaa_loc.bb.qry__enabled === 'enabled' && is_disabled)
            return false;
        if ($idaa_loc.bb.qry__enabled === 'not_enabled' && !is_disabled)
            return false;

        if (!is_hidden && !is_disabled) return true;

        return $ae_loc.trusted_access === true;
    });

    if (log_lvl)
        console.log(
            `visible_post_obj_li: Input=${list.length}, Output=${filtered.length} (trusted=${$ae_loc.trusted_access})`
        );

    return filtered;
});

onMount(() => {
    if (log_lvl) {
        console.log(
            '** Component Mounted: ** List - Bulletin Board (Post) Obj',
            data?.route.toString() ?? 'unknown'
        );
    }
});
</script>

<section
    class="bb_post_list flex w-full flex-col items-center justify-center gap-2">
    {#if visible_post_obj_li && visible_post_obj_li.length}
        {#each visible_post_obj_li as idaa_post_obj, index (idaa_post_obj.post_id)}
            {#if idaa_post_obj}
                <!-- This check for the idaa_post_obj is here in case the IDB entry is deleted. -->
                <div
                    class="bb_post post_obj container mb-2 flex w-full max-w-(--breakpoint-lg) flex-col items-center justify-center space-y-2 rounded-lg border bg-white p-2"
                    class:dim={idaa_post_obj?.hide}
                    class:bg-warning-100={!idaa_post_obj?.enable}>
                    <header class="ae_header">
                        <h3
                            class="post__name h3 flex w-full flex-row items-center gap-2 border-b border-gray-200">
                            <span class="post__name">
                                <span
                                    class="fas fa-comment-alt m-1 text-neutral-800/80"
                                ></span>
                                {@html idaa_post_obj.title}
                            </span>
                            {#if idaa_post_obj.topic_name}<span
                                    class="badge badge-info preset-tonal-secondary"
                                    ><span class="fas fa-tag m-1"></span>
                                    {idaa_post_obj.topic_name}</span
                                >{/if}
                        </h3>
                    </header>

                    <!-- {#if idaa_post_obj.content}<pre class="post__content p-2 bg-white shadow-md rounded-lg text-wrap text-sm font-normal whitespace-pre-wrap reset_css">{@html idaa_post_obj.content}</pre>{/if} -->
                    <!-- style="background: linear-gradient(to top, rgba(128, 128, 128, 0.5) 0, transparent 4em);" -->
                    {#if idaa_post_obj.content}
                        <div
                            class="post__content bg-gray reset_css relative max-h-96 w-full overflow-hidden rounded p-2 pb-8 text-sm font-normal text-wrap shadow-md">
                            {@html idaa_post_obj.content}
                            <!-- Add an overlay to fade the content out when close to max height -->
                            <div
                                class="post__content__fade from-surface-50 absolute bottom-0 left-0 h-16 w-full bg-linear-to-t to-transparent">
                            </div>
                        </div>
                    {/if}

                    <div
                        class="ae_options flex flex-row items-center justify-center gap-2">
                        <a
                            href="/idaa/bb/{idaa_post_obj?.post_id}"
                            class="
                    novi_btn btn-secondary
                    btn btn-md preset-filled-primary-200-800
                    transition
                    "
                            title={`View: ${idaa_post_obj?.name}`}>
                            <span
                                class="fas fa-envelope-open m-1 text-neutral-800/80"
                            ></span>
                            <!-- <span class="fas fa-info-circle"></span> -->
                            View Post

                            {#if idaa_post_obj?.post_comment_count}
                                <span
                                    class="ae_badge ae_info post__post_comment_count">
                                    <span
                                        class="fas fa-comments text-neutral-800/80"
                                    ></span>
                                    {idaa_post_obj?.post_comment_count == 1
                                        ? `${idaa_post_obj?.post_comment_count} comment`
                                        : `${idaa_post_obj?.post_comment_count} comments`}
                                </span>
                            {/if}

                            {#if idaa_post_obj?.linked_li_json?.length}
                                <span
                                    class="ae_badge ae_info post__linked_li_count">
                                    <span
                                        class="fas fa-link text-neutral-800/80"
                                    ></span>
                                    {idaa_post_obj?.linked_li_json?.length}
                                    {idaa_post_obj?.linked_li_json?.length == 1
                                        ? ' file'
                                        : ' files'}
                                </span>
                            {/if}
                        </a>
                    </div>

                    <div
                        class="ae_footer ae_meta post__meta m-1 flex flex-row items-center justify-center gap-2 text-sm text-gray-500/80">
                        {#if $ae_loc.trusted_access && idaa_post_obj.anonymous}
                            <div class="post__posted_by">
                                <span class="text-xs">Posted by:</span>
                                <span class="fas fa-user-secret"></span>
                                <span class="post__full_name">
                                    {idaa_post_obj.full_name}
                                    *Anonymous*
                                </span>
                                {#if idaa_post_obj.email}
                                    (<a
                                        href="mailto:{idaa_post_obj.email}?subject=IDAA BB Post"
                                        >{idaa_post_obj.email}</a
                                    >)
                                {/if}
                            </div>
                        {:else if idaa_post_obj.anonymous}
                            <div class="post__posted_by">
                                <span class="text-xs">Posted by:</span>
                                <span class="fas fa-user-secret"></span>
                                <span class="post__full_name">Anonymous</span>
                            </div>
                        {:else if idaa_post_obj.full_name}
                            <div class="post__posted_by">
                                <span class="text-xs">Posted by:</span>
                                <span class="fas fa-user"></span>
                                <span class="post__full_name"
                                    >{idaa_post_obj.full_name}
                                    {#if $ae_loc.trusted_access && idaa_post_obj.email}
                                        (<a
                                            href="mailto:{idaa_post_obj.email}?subject=IDAA BB Post"
                                            >{idaa_post_obj.email}</a
                                        >)
                                    {/if}
                                </span>
                            </div>
                        {/if}

                        {#if $ae_loc.trusted_access && $ae_loc.edit_mode}
                            <div class="post__novi_id text-xs text-gray-500 dark:text-gray-400" style="overflow-wrap:anywhere;">
                                Novi ID: <span class="font-mono">{idaa_post_obj.external_person_id ?? '-- not set --'}</span>
                            </div>
                        {/if}

                        {#if idaa_post_obj.created_on}
                            <div class="post__created_on_updated_on">
                                {#if !idaa_post_obj.updated_on}
                                    <span class="post__created_on">
                                        <span class="ae_label text-xs"
                                            >Created on:</span>
                                        <span class="ae_value"
                                            >{ae_util.iso_datetime_formatter(
                                                idaa_post_obj.created_on,
                                                'datetime_12_short'
                                            )}</span>
                                    </span>
                                {:else}
                                    <span class="post__updated_on">
                                        <span class="ae_label text-xs"
                                            >Updated on:</span>
                                        <span class="ae_value"
                                            >{ae_util.iso_datetime_formatter(
                                                idaa_post_obj.updated_on,
                                                'datetime_12_short'
                                            )}</span>
                                    </span>
                                {/if}
                                {#if idaa_post_obj.archive_on}
                                    <span class="post__archive_on">
                                        <span class="ae_label text-xs"
                                            >Archive on:</span>
                                        <span class="ae_value"
                                            >{ae_util.iso_datetime_formatter(
                                                idaa_post_obj.archive_on,
                                                'datetime_12_short'
                                            )}</span>
                                    </span>
                                {/if}
                            </div>
                        {/if}
                        <!-- <div style="font-size: smaller">json={encodeURIComponent(JSON.stringify({idaa_post_obj}))}</div> -->
                    </div>
                </div>
            {/if}
        {/each}
    {:else}
        No posts found at this time
    {/if}
</section>
<!-- {/if} -->
