---
import { Icon } from "astro-icon/components";
import { licenseConfig, profileConfig } from "../../config";

import { formatDateToYYYYMMDD } from "../../utils/date-utils";

interface Props {
	title: string;
	slug: string;
	pubDate: Date;
	class: string;
}

const { title, pubDate } = Astro.props;
const className = Astro.props.class;
const profileConf = profileConfig;
const licenseConf = licenseConfig;
const postUrl = decodeURIComponent(Astro.url.toString());
---
<div class=`relative transition overflow-hidden bg-[var(--license-block-bg)] py-5 px-6 ${className}`>
    <div class="transition font-bold text-black/75 dark:text-white/75">
        {title}
    </div>

    <a id="current-link" style="display:none;" class="link text-[var(--primary)]"></a>

    <script>
    const currentLink = document.getElementById('current-link');

    if (currentLink) {
        console.log(`[license] old url: ${window.location.href}`);
        const url = new URL(window.location.href);
        url.search = '';
        const address = url.toString();
        console.log(`[license] new url: ${address}`);
    
        currentLink.textContent = address;  // 显示文本 = 当前 URL
        currentLink.href = address;         // 点击跳转 = 当前 URL
        currentLink.style.display = 'inline'; // 显示出来
    }
    </script>

    <div class="flex gap-6 mt-2">
        <div>
            <div class="transition text-black/30 dark:text-white/30 text-sm">作者</div>
            <div class="transition text-black/75 dark:text-white/75 line-clamp-2">{profileConf.name}</div>
        </div>
        <div>
            <div class="transition text-black/30 dark:text-white/30 text-sm">发布于</div>
            <div class="transition text-black/75 dark:text-white/75 line-clamp-2">{formatDateToYYYYMMDD(pubDate)}</div>
        </div>
        <div>
            <div class="transition text-black/30 dark:text-white/30 text-sm">许可协议</div>
            <a href={licenseConf.url} target="_blank" class="link text-[var(--primary)] line-clamp-2">{licenseConf.name}</a>
        </div>
    </div>
    <Icon name="fa6-brands:creative-commons" class="transition text-[15rem] absolute pointer-events-none right-6 top-1/2 -translate-y-1/2 text-black/5 dark:text-white/5"></Icon>
</div>


