https://theconcordpost.pages.dev/_astro/CommentsSection.astro_astro_type_script_index_0_lang.Dvv1WOh2.js

1import{g as $,l as j,r as q}from"./authService.Bn9fhosz.js";const N="visitor_id",L="theconcordpost_visitor_id";function B(){if(typeof window>"u")return"";const e=document.cookie.match(new RegExp("(?:^|;\\s*)"+N+"=([^;]+)"));if(e&&e[1]){const c=decodeURIComponent(e[1]);try{localStorage.setItem(L,c)}catch{}return c}let n=null;try{n=localStorage.getItem(L)}catch{}if(n)return O(n),n;let o;typeof crypto<"u"&&typeof crypto.randomUUID=="function"?o=crypto.randomUUID():o="xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,c=>{const r=Math.random()*16|0;return(c==="x"?r:r&3|8).toString(16)}),O(o);try{localStorage.setItem(L,o)}catch{}return o}function O(e){document.cookie=`${N}=${encodeURIComponent(e)}; path=/; max-age=31536000; SameSite=Lax`}const k="theconcordpost_comments_",J="theconcordpost_liked_comment_ids";function _(){try{const e=localStorage.getItem(J);if(e){const n=JSON.parse(e);if(Array.isArray(n))return new Set(n)}}catch{}return new Set}function R(e){try{localStorage.setItem(J,JSON.stringify(Array.from(e)))}catch{}}function H(e){return _().has(e)}async function F(e){const n=String(e||"").trim().replace(/\/+$/,""),o=B(),c=_();let r=[];try{const i=`/api/comments?slug=${encodeURIComponent(n)}&_t=${Date.now()}${o?`&visitor_id=${encodeURIComponent(o)}`:""}`,a=await fetch(i,{cache:"no-store",headers:{Accept:"application/json"}});if(a.ok){const l=await a.json();l.success&&Array.isArray(l.comments)&&(r=l.comments),Array.isArray(l.likedCommentIds)&&(l.likedCommentIds.forEach(h=>c.add(h)),R(c))}}catch{}let s=[];try{const i=localStorage.getItem(k+n);i&&(s=JSON.parse(i))}catch{}const t=new Map;return s.forEach(i=>t.set(i.id,i)),r.forEach(i=>t.set(i.id,i)),{comments:Array.from(t.values()).map(i=>({...i,userLiked:c.has(i.id)||!!i.userLiked})).sort((i,a)=>new Date(a.createdAt).getTime()-new Date(i.createdAt).getTime()),likedIds:c}}async function P(e,n){const o=String(e||"").trim().replace(/\/+$/,""),c=$();if(!c||!n.trim())return null;const r={slug:o,name:c.name,email:c.email,picture:c.picture,content:n.trim()};try{const s=await fetch("/api/comments",{method:"POST",headers:{"Content-Type":"application/json",Accept:"application/json"},body:JSON.stringify(r)});if(s.ok){const t=await s.json();if(t.success&&t.comment){const m={id:t.comment.id,slug:t.comment.slug||o,name:t.comment.name||c.name,email:t.comment.email||c.email,picture:t.comment.picture||c.picture,content:t.comment.content||n.trim(),likes:t.comment.likes||0,createdAt:t.comment.createdAt||new Date().toISOString(),userLiked:!1};try{const i=localStorage.getItem(k+o),l=(i?JSON.parse(i):[]).filter(h=>h.id!==m.id);l.unshift(m),localStorage.setItem(k+o,JSON.stringify(l))}catch{}return m}}else{const m=(await s.json().catch(()=>({}))).message||`Server responded with status ${s.status}`;throw new Error(m)}}catch(s){throw console.error("Failed to post comment to server:",s),s}return null}async function K(e,n){const o=String(n||"").trim().replace(/\/+$/,""),c=B(),r=_(),t=!r.has(e);t?r.add(e):r.delete(e),R(r);let m=0;try{const i=localStorage.getItem(k+o);if(i){const a=JSON.parse(i),l=a.find(h=>h.id===e);l&&(l.likes=Math.max(0,(l.likes||0)+(t?1:-1)),l.userLiked=t,m=l.likes,localStorage.setItem(k+o,JSON.stringify(a)))}}catch{}try{const i=await fetch("/api/comments",{method:"POST",headers:{"Content-Type":"application/json",Accept:"application/json"},body:JSON.stringify({action:"like",commentId:e,slug:o,visitorId:c})});if(i.ok){const a=await i.json();if(a.success)return{success:!0,liked:a.liked!==void 0?a.liked:t,likes:a.likes!==void 0?a.likes:m}}}catch{}return{success:!0,liked:t,likes:m}}const Y=document.getElementById("kolom-komentar"),f=(Y?.getAttribute("data-slug")||"").trim().replace(/\/+$/,""),S=document.getElementById("comment-guest-state"),v=document.getElementById("comment-user-state"),x=document.getElementById("comment-user-avatar"),M=document.getElementById("comment-user-name"),G=document.getElementById("comment-logout-btn"),T=document.getElementById("comment-google-btn-container"),z=document.getElementById("comment-post-form"),d=document.getElementById("comment-textarea"),I=document.getElementById("comment-submit-btn"),w=document.getElementById("comment-char-count"),u=document.getElementById("comments-list"),p=document.getElementById("comments-empty-state"),g=document.getElementById("comments-count-badge"),C=typeof BroadcastChannel<"u"?new BroadcastChannel("theconcordpost_comments_sync"):null;function D(e){const n=document.createElement("div");return n.textContent=e||"",n.innerHTML}function W(e){if(!e)return"Just now";if(typeof e=="string"&&(e.includes("ago")||e.includes("lalu")||e.includes("Just now")))return e;const n=new Date(e);if(isNaN(n.getTime()))return"Just now";const o=Math.floor((Date.now()-n.getTime())/1e3);if(o<60)return"Just now";const c=Math.floor(o/60);if(c<60)return`${c} minute${c>1?"s":""} ago`;const r=Math.floor(c/60);if(r<24)return`${r} hour${r>1?"s":""} ago`;const s=Math.floor(r/24);return`${s} day${s>1?"s":""} ago`}function U(e,n=!1){const o=document.createElement("article");

1o.className="comment-item"+(n?" comment-item-new":""),o.id="comment-"+e.id;const c=e.picture||"/brand/android-chrome-192.png",r=D(e.name||"Verified Reader"),s=D(e.content||""),t=W(e.createdAt),m=e.likes||0,a=e.userLiked||H(e.id)?" liked":"";o.innerHTML=`
2      <img
3        src="${c}"
4        alt="${r}"
5        class="comment-item-avatar"
6        loading="lazy"
7        referrerpolicy="no-referrer"
8      />
9      <div class="comment-item-content">
10        <div class="comment-item-header">
11          <div class="comment-author-wrap">
12            <strong class="comment-author-name">${r}</strong>
13            <span class="verified-tick" title="Verified Reader">
14              <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3">
15                <polyline points="20 6 9 17 4 12"></polyline>
16              </svg>
17            </span>
18          </div>
19          <time class="comment-time">${t}</time>
20        </div>
21        <p class="comment-text">${s}</p>
22        <div class="comment-item-footer">
23          <button type="button" class="comment-like-btn${a}" data-id="${e.id}" title="Endorse this commentary">
24            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
25              <path d="M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3"></path>
26            </svg>
27            <span>Endorse</span>
28            <span class="like-count">(${m})</span>
29          </button>
30          <button type="button" class="comment-reply-btn">
31            <span>Reply</span>
32          </button>
33        </div>
34      </div>
35    `;const l=o.querySelector(".comment-item-avatar");return l&&(l.onerror=()=>{l.src="/brand/android-chrome-192.png"}),o}function V(e,n){if(!u)return;const o=Array.isArray(e)?e.length:0;if(g&&(g.textContent=String(o)),o===0){p&&(p.style.display="flex"),u.innerHTML="";return}p&&(p.style.display="none");const c=[...e].sort((s,t)=>{const m=new Date(s.createdAt).getTime()||0;return(new Date(t.createdAt).getTime()||0)-m}),r=new Set;c.forEach((s,t)=>{r.add(s.id);const m=document.getElementById("comment-"+s.id),i=n.has(s.id);if(m){const a=m.querySelector(".comment-like-btn"),l=m.querySelector(".like-count");a&&a.classList.toggle("liked",i),l&&typeof s.likes=="number"&&(l.textContent=`(${s.likes})`)}else{const a=U(s,!0),l=u.children;t<l.length?u.insertBefore(a,l[t]):u.appendChild(a)}}),Array.from(u.children).forEach(s=>{const t=s.id.replace("comment-","");!t.startsWith("temp-")&&!r.has(t)&&s.remove()})}let b=!1;async function y(e=!1){if(!(!f||!u||b)){b=!0;try{const{comments:n,likedIds:o}=await F(f);V(n,o);try{sessionStorage.setItem("theconcordpost_comments_"+f,JSON.stringify({comments:n,likedIds:Array.from(o)}))}catch{}}catch(n){e||console.warn("Could not load dynamic comments:",n)}finally{b=!1}}}try{const e=sessionStorage.getItem("theconcordpost_comments_"+f);if(e){const n=JSON.parse(e);Array.isArray(n.comments)&&V(n.comments,new Set(n.likedIds||[]))}}catch{}function E(){const e=$();e?(S&&(S.style.display="none"),v&&(v.style.display="block"),x&&(x.src=e.picture||"/brand/android-chrome-192.png",x.onerror=()=>{x.src="/brand/android-chrome-192.png"}),M&&(M.textContent=e.name)):(S&&(S.style.display="flex"),v&&(v.style.display="none"),T&&q(T,()=>E()))}d?.addEventListener("input",()=>{w&&(w.textContent=`${d.value.length} / 500`)});G?.addEventListener("click",()=>{j(),E()});window.addEventListener("theconcordpost:auth-change",()=>{E()});z?.addEventListener("submit",async e=>{e.preventDefault();const n=d.value.trim();if(!n)return;const o=$(),r={id:"temp-"+Date.now(),name:o?.name||"Verified Reader",email:o?.email||"",picture:o?.picture||"",content:n,likes:0,createdAt:new Date().toISOString(),userLiked:!1};p&&(p.style.display="none");const s=U(r,!0);if(u&&u.prepend(s),g){const t=parseInt(g.textContent||"0",10);g.textContent=String(t+1)}d.value="",w&&(w.textContent="0 / 500"),I&&I.setAttribute("disabled","true");try{const t=await P(f,n);if(t){s.id="comment-"+t.id;const m=s.querySelector(".comment-like-btn");m&&m.setAttribute("data-id",t.id),C?.postMessage({type:"comment_added",slug:f}),y(!0)}}catch(t){if(console.error("Failed to post comment:",t),s.remove(),g){const m=parseInt(g.textContent||"1",10);g.textContent=String(Math.max(0,m-1))}alert("Unable to publish comment: "+(t?.message||"Please check your connection or try again."))}finally{I&&I.removeAttribute("disabled")}});u?.addEventListener("click",e=>{const n=e.target,o=n.closest(".comment-like-btn");if(o){const r=o.getAttribute("data-id")||"";if(!r||r.startsWith("temp-"))return;

35const s=o.classList.contains("liked"),t=o.querySelector(".like-count"),m=t?.textContent?.match(/\d+/),i=m?parseInt(m[0],10):0;s?(o.classList.remove("liked"),t&&(t.textContent=`(${Math.max(0,i-1)})`)):(o.classList.add("liked"),t&&(t.textContent=`(${i+1})`)),K(r,f).then(a=>{a&&typeof a.likes=="number"&&t&&(t.textContent=`(${a.likes})`),a&&typeof a.liked=="boolean"&&o.classList.toggle("liked",a.liked),C?.postMessage({type:"like_updated",slug:f})}).catch(a=>{console.warn("Like toggle sync note:",a)});return}const c=n.closest(".comment-reply-btn");if(c){const s=c.closest(".comment-item")?.querySelector(".comment-author-name")?.textContent?.trim();d&&(d.focus(),s&&!d.value.includes(`@${s}`)&&(d.value=`@${s} `+d.value),d.scrollIntoView({behavior:"smooth",block:"center"}))}});C&&(C.onmessage=e=>{e.data&&e.data.slug===f&&y(!0)});let A=null;function X(){A&&clearInterval(A),A=setInterval(()=>{document.hidden||y(!0)},2500)}window.addEventListener("focus",()=>y(!0));document.addEventListener("visibilitychange",()=>{document.hidden||y(!0)});B();E();y();X();