https://www.techi.com/_next/static/chunks/49720-a113bd96ecf25b73.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[49720],{49720:(e,t,r)=>{r.r(t),r.d(t,{CommentSection:()=>f});var a=r(31426),s=r(12929),l=r.n(s),o=r(11202),n=r(4682),i=r(72299),d=r(18733),c=r(41048),m=r(58567);let u=/^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/,h=new Intl.DateTimeFormat(void 0,{year:"numeric",month:"short",day:"numeric",hour:"numeric",minute:"2-digit"});function p(e){let{src:t,name:r,size:s=36}=e,[l,o]=(0,n.useState)(!1),i=(r.trim().charAt(0)||"?").toUpperCase(),{bg:d,fg:c}=function(e){let t=0;for(let r=0;r<e.length;r++)t=31*t+e.charCodeAt(r)|0;let r=Math.abs(t)%360;return{bg:`hsl(${r}, 60%, 78%)`,fg:`hsl(${r}, 60%, 22%)`}}(r),m={width:s,height:s};return!t||l?(0,a.jsx)("div",{className:"relative shrink-0 self-start overflow-hidden rounded-full ring-1 ring-slate-200 dark:ring-white/10",style:m,"aria-hidden":!0,children:(0,a.jsx)("span",{className:"absolute inset-0 flex items-center justify-center font-bold",style:{backgroundColor:d,color:c,fontSize:.42*s},children:i})}):(0,a.jsx)("div",{className:"relative shrink-0 self-start overflow-hidden rounded-full ring-1 ring-slate-200 dark:ring-white/10",style:m,children:(0,a.jsx)("img",{src:t,alt:"",width:s,height:s,className:"absolute inset-0 h-full w-full object-cover",onError:()=>o(!0),loading:"lazy",decoding:"async"})})}let x=["before:bg-gradient-to-b before:from-techi-teal/40 before:to-techi-teal/10 dark:before:from-techi-cyan/30 dark:before:to-techi-cyan/5","before:bg-slate-200 dark:before:bg-white/[0.07]","before:bg-slate-200/60 dark:before:bg-white/[0.05]"];function b(e){let t,r,s,{comment:o,onReply:i,isAuthenticated:d,authPending:f=!1}=e,[g,y]=(0,n.useState)(!1),[k,w]=(0,n.useState)(""),[v,j]=(0,n.useState)(""),[N,C]=(0,n.useState)(""),[S,$]=(0,n.useState)(!1),[T,E]=(0,n.useState)(!1),[R,A]=(0,n.use

1State)(!1),[L,M]=(0,n.useState)(Number(o.reportCount||0)),I=(0,n.useRef)(null),P=(0,n.useRef)(null),q=(t=o.author)&&"object"==typeof t?t.name?.trim()||o.guestName?.trim()||"Anonymous":"number"==typeof t?"User":o.guestName?.trim()||"Anonymous",_=(r=o.author)&&"object"==typeof r&&r.slug?.trim()||null,F=(s=o.author)&&"object"==typeof s&&s.avatarUrl?.trim()?s.avatarUrl.trim():o.gravatarHash?`https://www.gravatar.com/avatar/${o.gravatarHash}?s=80&d=mp`:null,z=o.depth<3,Y=d||v.trim().length>=2&&u.test(N.trim()),D="ai_assistant"===o.authorType,U=Number(o.replyCount||0);(0,n.useEffect)(()=>{if(g){if(!d&&I.current)return void I.current.focus();P.current?.focus()}},[g,d]);let O=async e=>{if(e.preventDefault(),k.trim().length<3||S||!Y)return;$(!0);let t=await i(o.id,k.trim(),d?void 0:{guestName:v.trim(),guestEmail:N.trim()});$(!1),t&&(w(""),y(!1),E(!0),setTimeout(()=>E(!1),4e3))},H=async()=>{if(!R){A(!0);try{let e=await fetch(`/api/comments/${o.id}/report`,{method:"POST",headers:{"Content-Type":"application/json"}});if(e.ok){let t=await e.json().catch(()=>null);t?.reportCount!=null&&M(t.reportCount)}}catch{}}};return(0,a.jsxs)("article",{id:`comment-${o.id}`,className:o.depth>0?`relative ml-10 pl-4 sm:ml-13 sm:pl-5 before:absolute before:left-0 before:top-2 before:bottom-2 before:w-[2px] before:rounded-full ${x[Math.min(o.depth-1,x.length-1)]}`:"",children:[(0,a.jsxs)("div",{className:"group flex gap-3 py-3.5",children:[_?(0,a.jsx)(l(),{href:`/@${_}`,"aria-label":`${q}'s profile`,className:"shrink-0",children:(0,a.jsx)(p,{src:F,name:q,size:o.depth>0?28:32})}):(0,a.jsx)(p,{src:F,name:q,size:o.depth>0?28:32}),(0,a.jsxs)("div",{className:"min-w-0 flex-1",children:[(0,a.jsxs)("header",{className:"mb-1 flex flex-wrap items-center gap-x-2 gap-y-1 text-sm",children:[_?(0,a.jsx)(l(),{href:`/@${_}`,className:"font-semibold text-slate-900 transition-colors hover:text-techi-teal-600 dark:text-slate-50 dark:hover:text-techi-teal-300",children:q}):(0,a.jsx)("span",{className:"font-semibold text-slate-900 dark:text-slate-50",children:q}),(0,a.jsx)("time",{dateTime:o.createdAt,title:function(e){try{return h.format(new Date(e))}catch{return e}}(o.createdAt),className:"text-[12px] font-medium text-slate-500 dark:text-slate-400",children:function(e){let t=Math.max(0,Math.floor((Date.now()-new Date(e).getTime())/1e3));if(t<60)return"just now";let r=Math.floor(t/60);if(r<60)return`${r}m ago`;let a=Math.floor(r/60);if(a<24)return`${a}h ago`;let s=Math.floor(a/24);if(s<30)return`${s}d ago`;let l=Math.floor(s/30);if(l<12)return`${l}mo ago`;let o=Math.floor(l/12);return`${o}y ago`}(o.createdAt)}),o.isVerified?(0,a.jsx)("span",{className:"inline-flex items-center rounded-full border border-emerald-300/70 bg-emerald-50 px-1.5 py-0.5 text-[10px] font-bold uppercase tracking-wider text-emerald-700 dark:border-emerald-500/40 dark:bg-emerald-500/10 dark:text-emerald-300",children:"✓ verified"}):null,D?(0,a.jsx)("span",{className:"inline-flex items-center rounded-full border border-sky-300/70 bg-sky-50 px-1.5 py-0.5 text-[10px] font-bold uppercase tracking-wider text-sky-700 dark:border-sky-500/40 dark:bg-sky-500/10 dark:text-sky-300",children:"AI"}):null]}),(0,a.jsx)("div",{className:"techi-comment-body whitespace-pre-line break-words text-[15px] leading-[1.55] text-slate-800 dark:text-slate-200",children:o.body}),(0,a.jsxs)("div",{className:"-ml-1.5 mt-2 flex flex-wrap items-center gap-0.5 text-[12px]",children:[(0,a.jsxs)("button",{type:"button",onClick:()=>{z&&!f&&y(e=>!e)},disabled:!z||f,title:f?"Checking your account":z?g?"Cancel reply":d?"Reply to this comment":"Reply as a guest":"Maximum reply depth reached",className:"inline-flex items-center gap-1.5 rounded-md px-2 py-1 font-semibold text-slate-500 transition-colors hover:bg-slate-100 hover:text-techi-teal-600 disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-transparent disabled:hover:text-slate-500 dark:text-slate-400 dark:hover:bg-white/[0.05] dark:hover:text-techi-teal-300",children:[(0,a.jsx)(c.A,{className:"h-3.5 w-3.5","aria-hidden":!0}),g?"Cancel":"Reply",U>0?(0,a.jsxs)("span",{className:"font-normal text-slate-400 dark:text-slate-500",children:["\xb7 ",U]}):null]}),(0,a.jsxs)("button",{type:"button",onClick:H,disabled:R,title:R?"Reported — thanks for the heads-up":"Flag this comment for moderation",className:"inline-flex items-center gap-1.5 rounded-md px-2 py-1 font-semibold text-slate-500 transition-colors hover:bg-slate-100 hover:text-red-600 disabled:cursor-not-allowed disabled:opacity-60 disabled:hover:bg-transparent disabled:hover:text-slate-500 dark:text-slate-400 dark:hover:bg-white/[0.05] dark:hover:text-red-400",children:[(0,a.jsx)(m.A,{className:"h-3.5 w-3.5","aria-hidden":!0}),R?"Reported":"Report",L>0?(0,a.jsxs)("span",{className:"font-normal text-slate-400 dark:text-slate-500",children:["\xb7 ",L]}):null]}),T?(0,a.jsx)("span",{className:"ml-2 inline-flex items-center gap-1 rounded-md bg-emerald-50 px-2 py-1 font-semibold text-emerald-700 dark:bg-emerald-500/10 dark:text-emerald-300",children:"✓ Reply submitted"}):null]}),o.trustScore||o.factCheckScore?(0,a.jsxs)("div",{className:"mt-2 flex flex-wrap items-center gap-3 text-[11px] text-slate-500 dark:text-slate-500",children:[(0,a.jsxs)("span",{children:["Trust ",Math.round(Number(o.trustScore||0)),"%"]}

1),(0,a.jsx)("span",{"aria-hidden":!0,children:"\xb7"}),(0,a.jsxs)("span",{children:["Fact-check ",Math.round(Number(o.factCheckScore||0)),"%"]})]}):null,g&&(0,a.jsxs)("form",{onSubmit:O,className:"mt-3",children:[(0,a.jsxs)("label",{htmlFor:`techi-comment-reply-${o.id}`,className:"sr-only",children:["Reply to ",q]}),d?null:(0,a.jsxs)("div",{className:"mb-2 grid gap-2 sm:grid-cols-2",children:[(0,a.jsx)("input",{type:"text",value:v,onChange:e=>j(e.target.value),placeholder:"Your name",maxLength:80,minLength:2,required:!0,disabled:S,autoComplete:"name","aria-label":"Your name for this reply",ref:I,className:"h-9 rounded-lg border border-slate-200 bg-white px-3 text-sm text-slate-800 placeholder:text-slate-400 focus:border-techi-teal-500 focus:outline-none focus:ring-1 focus:ring-techi-teal-500/40 dark:border-white/10 dark:bg-white/[0.04] dark:text-slate-200 dark:placeholder:text-slate-500"}),(0,a.jsx)("input",{type:"email",value:N,onChange:e=>C(e.target.value),placeholder:"Email (never shown)",maxLength:200,required:!0,disabled:S,autoComplete:"email","aria-label":"Your email for this reply, never shown",className:"h-9 rounded-lg border border-slate-200 bg-white px-3 text-sm text-slate-800 placeholder:text-slate-400 focus:border-techi-teal-500 focus:outline-none focus:ring-1 focus:ring-techi-teal-500/40 dark:border-white/10 dark:bg-white/[0.04] dark:text-slate-200 dark:placeholder:text-slate-500"})]}),(0,a.jsx)("textarea",{id:`techi-comment-reply-${o.id}`,ref:P,value:k,onChange:e=>w(e.target.value),placeholder:`Reply to ${q}...`,minLength:3,maxLength:4e3,required:!0,rows:3,className:"w-full resize-none rounded-lg border border-slate-200 bg-white px-3 py-2 text-sm text-slate-800 placeholder:text-slate-400 focus:border-techi-teal-500 focus:outline-none focus:ring-1 focus:ring-techi-teal-500/40 dark:border-white/10 dark:bg-white/[0.04] dark:text-slate-200 dark:placeholder:text-slate-500 dark:focus:border-techi-teal-400 dark:focus:ring-techi-teal-400/30"}),(0,a.jsxs)("div",{className:"mt-2 flex items-center gap-2",children:[(0,a.jsx)("button",{type:"submit",disabled:k.trim().length<3||S||!Y,className:"inline-flex items-center gap-1.5 rounded-lg bg-gradient-to-br from-techi-teal-500 to-techi-teal-700 px-3.5 py-1.5 text-[12px] font-bold text-white shadow-[0_4px_12px_-4px_rgba(13,115,115,0.5)] transition-transform hover:scale-[1.02] disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:scale-100",children:S?"Posting…":d?"Post reply":"Reply as guest"}),(0,a.jsx)("button",{type:"button",onClick:()=>{y(!1),w("")},className:"rounded-lg px-3 py-1.5 text-[12px] font-medium text-slate-500 transition-colors hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200",children:"Cancel"}),(0,a.jsxs)("span",{className:"ml-auto text-[10px] tabular-nums text-slate-400 dark:text-slate-500",children:[k.length," / 4000"]})]})]})]})]}),o.replies&&o.replies.length>0?(0,a.jsx)("div",{className:"space-y-0",children:o.replies.map(e=>(0,a.jsx)(b,{comment:e,onReply:i,isAuthenticated:d,authPending:f},e.id))}):null]})}function f(e){let t="twoTakeId"in e&&null!=e.twoTakeId?"twoTake":"post",r="twoTake"===t?e.twoTakeId:e.postId,s=(0,i.ad)(),c=s?.user??null,m=(0,o.usePathname)(),u=`/login/?next=${encodeURIComponent(`${m||"/"}#comments`)}`,h=(0,n.useRef)(null),p=(0,n.useRef)(0),[x,f]=(0,n.useState)(!1),[g,y]=(0,n.useState)([]),[k,w]=(0,n.useState)(!1),[v,j]=(0,n.useState)(null),[N,C]=(0,n.useState)(null),[S,$]=(0,n.useState)(""),[T,E]=(0,n.useState)(!1),[R,A]=(0,n.use

1State)(!1),[L,M]=(0,n.useState)(""),[I,P]=(0,n.useState)(""),[q,_]=(0,n.useState)(""),F=(0,n.useCallback)(async()=>{let e=++p.current;w(!0),C(null);try{let a=(0,d.yw)(),s=new URLSearchParams({[`where[${t}][equals]`]:String(r),"where[status][equals]":"approved",sort:"-createdAt",depth:"1",limit:"50"}),[l,o]=await Promise.all([fetch(`${a}/api/comments/?${s.toString()}`,{credentials:"include"}),c?fetch(`${a}/api/social/user-blocks/`,{credentials:"include"}):null]);if(!l.ok)throw Error("Failed to load comments");if(c&&(!o||!o.ok))throw console.error("[CommentSection] user-blocks fetch failed; refusing to render"),Error("Could not verify your block list. Please retry.");let n=(await l.json()).docs??[],i=new Set;if(o)for(let e of(await o.json()).blocks??[]){let t=e.user?.id;"number"==typeof t&&i.add(t)}let m=0===i.size?n:n.filter(e=>{let t="object"==typeof e.author&&e.author&&"id"in e.author?e.author.id:e.author;return"number"!=typeof t||!i.has(t)});e===p.current&&y(function(e){let t=new Map,r=[];for(let r of e)t.set(r.id,{id:r.id,body:r.body,author:r.author,guestName:r.guestName??null,gravatarHash:r.gravatarHash??null,authorType:r.authorType,isVerified:r.isVerified,trustScore:r.trustScore,factCheckScore:r.factCheckScore,replyCount:r.replyCount,shareCount:r.shareCount,reportCount:r.reportCount,createdAt:r.createdAt,depth:"number"==typeof r.depth?r.depth:0,replies:[],isMigrated:null!=r.wpCommentId});for(let a of e){let e=t.get(a.id),s=a.parent&&"object"==typeof a.parent?a.parent.id:a.parent;s&&t.has(s)?t.get(s).replies.push(e):r.push(e)}return r}(m))}catch(t){e===p.current&&C(t instanceof Error?t.message:"Something went wrong")}finally{e===p.current&&w(!1)}},[t,r,c]);(0,n.useEffect)(()=>{if(x)return;if(/^#comments$|^#comment-\d+$/.test(window.location.hash))return void f(!0);let e=h.current;if(!e||"u"<typeof IntersectionObserver)return void f(!0);let t=new IntersectionObserver(e=>{e.some(e=>e.isIntersecting)&&(f(!0),t.disconnect())},{rootMargin:"250px 0px"});return t.observe(e),()=>t.disconnect()},[x]),(0,n.useEffect)(()=>{if(x)return F(),()=>{p.current+=1}},[F,x]),(0,n.useEffect)(()=>{if(k||N||!x)return;let e=window.location.hash;/^#comment-\d+$/.test(e)&&document.getElementById(e.slice(1))?.scrollIntoView?.({block:"start"})},[g,k,N,x]);let z=(0,n.useCallback)(async(e,a,s)=>{j(null);try{let l=(0,d.yw)(),o={[t]:r,body:e};a&&(o.parent=a),c||(o.guestName=(s?.guestName??L).trim(),o.guestEmail=(s?.guestEmail??I).trim(),o.website=q);let n=await fetch(c?`${l}/api/comments/`:`${l}/api/comments/guest/`,{method:"POST",credentials:"include",headers:{"Content-Type":"application/json"},body:JSON.stringify(o)});if(!n.ok){let e=await n.json().catch(()=>({}));throw Error(e?.error||e?.errors?.[0]?.message||"Failed to post comment")}return!0}catch(e){return j(e instanceof Error?e.message:"Failed to post comment"),!1}},[t,r,c,L,I,q]),Y=async e=>{if(e.preventDefault(),S.trim().length<3||T)return;A(!1),E(!0);let t=await z(S.trim());E(!1),t&&($(""),A(!0))},D=(0,n.useCallback)(async(e,t,r)=>z(t,e,r),[z]),U=function e(t){return t.reduce((t,r)=>t+1+(r.replies?e(r.replies):0),0)}(g);return(0,a.jsxs)("section",{id:"comments",ref:h,className:"scroll-mt-32 rounded-lg border border-slate-200/80 bg-white p-5 shadow-sm sm:p-6 dark:border-white/10 dark:bg-white/[0.03]","aria-label":"Comments",children:[(0,a.jsxs)("h2",{className:"mb-2 text-lg font-bold text-slate-900 dark:text-slate-100",children:["Comments",x&&!k&&!N&&U>0&&(0,a.jsxs)("span",{className:"ml-2 text-sm font-normal text-slate-400 dark:text-slate-500",children:["(",U,")"]})]}),(0,a.jsxs)("p",{id:"techi-comment-guidance",className:"mb-5 text-sm text-slate-500 dark:text-slate-400",children:[c?"Join the discussion. ":"Comment as a guest or sign in with your account. ","Comments appear after moderation. Please follow our"," ",(0,a.jsx)(l(),{href:"/comments-policy/",className:"underline underline-offset-2",children:"comments policy"}),"."]}),(0,a.jsxs)("form",{onSubmit:Y,className:"mb-6",children:[(0,a.jsx)("label",{htmlFor:"techi-comment-compose",className:"sr-only",children:"Write a comment"}),c?null:(0,a.jsxs)("div",{className:"mb-2 grid gap-2 sm:grid-cols-2",children:[(0,a.jsx)("input",{type:"text",value:L,onChange:e=>M(e.target.value),placeholder:"Your name",maxLength:80,minLength:2,required:!0,disabled:T,autoComplete:"name","aria-label":"Your name",className:"h-10 rounded-lg border border-slate-200 bg-slate-50/50 px-3 text-sm text-slate-800 placeholder:text-slate-400 focus:border-techi-teal focus:bg-white focus:outline-none focus:ring-1 focus:ring-techi-teal/50 dark:border-white/10 dark:bg-white/[0.03] dark:text-slate-200 dark:placeholder:text-slate-500"}),(0,a.jsx)("input",{type:"email",value:I,onChange:e=>P(e.target.value),placeholder:"Email (never shown)",maxLength:200,required:!0,disabled:T,autoComplete:"email","aria-label":"Your email, never shown",className:"h-10 rounded-lg border border-slate-200 bg-slate-50/50 px-3 text-sm text-slate-800 placeholder:text-slate-400 focus:border-techi-teal focus:bg-white focus:outline-none focus:ring-1 focus:ring-techi-teal/50 dark:border-white/10 dark:bg-white/[0.03] dark:text-slate-200 dark:placeholder:text-slate-500"}),(0,a.jsx)("input",{type:"text",value:q,onChange:e=>_(e.target.value),tabIndex:-1,autoComplete:"off","aria-hidden":!0,name:"website",className:"hidden"})]}),(0,a.jsx)("textarea",{id:"techi-comment-compose",value:S,onChange:e=>{$(e.target.value),A(!1)},placeholder:"Add your perspective or ask a question…",minLength:3,maxLength:4e3,required:!0,disabled:T,rows:3,"aria-describedby":"techi-comment-guidance techi-comment-counter",className:"w-full resize-none rounded-lg border border-slate-200 bg-slate-50/50 px-4 py-3 text-sm text-slate-800 placeholder:text-slate-400 focus:border-techi-teal focus:bg-white focus:outline-none focus:ring-1 focus:ring-techi-teal/50 disabled:cursor-not-allowed disabled:opacity-60 dark:border-white/10 dark:bg-white/[0.03] dark:text-slate-200 dark:placeholder:text-slate-500 dark:focus:border-techi-cyan dark:focus:bg-white/[0.05] dark:focus:ring-techi-cyan/30"}),(0,a.jsxs)("p",{id:"techi-comment-counter",className:"mt-1 text-right text-[11px] text-slate-500 dark:text-slate-400","aria-live":"polite","aria-atomic":"true",children:[S.length," / 4000"]}),(0,a.jsxs)("div",{className:"mt-2 flex flex-wrap items-center gap-3",children:[(0,a.jsx)("button",{type:"submit",disabled:S.trim().length<3||T||!!s?.isLoading||!c&&(L.trim().length<2||!/^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/.test(I.trim())),className:"min-h-11 rounded-lg bg-techi-teal px-4 py-2 text-sm font-semibold text-white shadow-sm transition-colors hover:bg-[#24a8a8] disabled:cursor-not-allowed disabled:opacity-50 dark:bg-techi-cyan dark:text-slate-900 dark:hover:bg-[#4dd4bd

1]",children:T?"Submitting…":c?"Submit comment":"Submit as guest"}),c?null:(0,a.jsx)(l(),{href:u,className:"inline-flex min-h-11 items-center text-sm font-medium text-techi-teal hover:underline dark:text-techi-cyan",children:"Sign in"})]}),R&&(0,a.jsx)("p",{role:"status",className:"mt-3 text-sm text-emerald-700 dark:text-emerald-400",children:"Thanks. Your comment was submitted for review and will appear once approved."})]}),v&&(0,a.jsx)("div",{role:"alert","aria-live":"assertive",className:"mb-4 rounded-lg border border-red-200 bg-red-50 px-4 py-2.5 text-sm text-red-700 dark:border-red-500/20 dark:bg-red-500/10 dark:text-red-400",children:v}),N&&(0,a.jsxs)("div",{role:"alert",className:"mb-4 rounded-lg border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700 dark:border-red-500/20 dark:bg-red-500/10 dark:text-red-400",children:[(0,a.jsx)("p",{children:N}),(0,a.jsx)("button",{type:"button",onClick:()=>void F(),className:"mt-2 min-h-11 font-semibold underline underline-offset-2",children:"Try loading comments again"})]}),k&&(0,a.jsxs)("div",{role:"status","aria-live":"polite","aria-label":"Loading comments",className:"flex items-center justify-center py-8",children:[(0,a.jsx)("div",{className:"h-5 w-5 animate-spin rounded-full border-2 border-slate-300 border-t-techi-teal dark:border-slate-600 dark:border-t-techi-cyan","aria-hidden":"true"}),(0,a.jsx)("span",{className:"sr-only",children:"Loading comments…"})]}),x&&!k&&!N&&0===g.length&&(0,a.jsx)("p",{className:"py-6 text-center text-sm text-slate-400 dark:text-slate-500",children:"No comments yet. Be the first to share your thoughts."}),x&&!k&&!N&&g.length>0&&(0,a.jsx)("div",{className:"divide-y divide-slate-100 dark:divide-white/5",children:g.map(e=>(0,a.jsx)(b,{comment:e,onReply:D,isAuthenticated:!!c,authPending:!!s?.isLoading},e.id))})]})}}}]);