https://www.likun.tech/_next/static/chunks/pages/blog/[slug]-46b6e7c091a967ed.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[492],{1127:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/blog/[slug]",function(){return n(502)}])},3411:function(e,t,n){"use strict";n.d(t,{Z:function(){return A}});var s=n(5893),a=n(6010),l=n(2553),i=n.n(l),r=n(7294),o=n(3673),c=n(4093),d=function(e,t){let n=(0,r.useRef)();(0,r.useEffect)(()=>{n.current=e},[e]),(0,r.useEffect)(()=>{if(null!==t){let e=setInterval(function(){n.current()},t);return()=>clearInterval(e)}return null},[t])},u=n(8324),m=n.n(u);let h={min:3,max:10,join:" "},x=[{text:m()(h),sent:!0},{text:m()(h)},{text:m()(h),sent:!0},{text:m()(h)},{text:m()(h)},{text:m()(h),sent:!0}],f={initial:{opacity:0,y:300},enter:{opacity:1,y:0,transition:{type:"spring",stiffness:200,mass:.2,damping:20}}};var p=n(5422),g=n(3092),j=n.n(g);let v=e=>{let{value:t,max:n=5}=e,a=Math.round(t/n*100);return(0,s.jsxs)("div",{className:j().container,children:[Array.from(Array(n).keys()).map((e,t)=>(0,s.jsx)(p.GK,{className:j().star},String(t))),(0,s.jsx)("div",{className:j().overlay,style:{width:"".concat(100-a,"%")}})]})};var y=n(5675),_=n.n(y),N=n(8053),w=n(4337),b=n(3347),S=n.n(b),k=n(6237),T=n(9745),E=n(5963),Z=n(7146);let I=e=>{let t=null==e?void 0:e.href,n=t&&(t.startsWith("/")||t.startsWith("#"));return n?(0,s.jsx)(N.Z,{...e,href:t,legacyBehavior:!0,children:(0,s.jsx)("a",{children:e.children})}):(0,s.jsx)("a",{target:"_blank",rel:"noopener noreferrer",...e})};var A={Image:function(e){let{src:t,width:n,height:l,alt:i,caption:r,breakout:o,rounded:c,priority:d}=e;return(0,s.jsx)("div",{className:(0,a.Z)("not-prose w-full",o?"bg-tertiary":"",(c||o)&&"rounded-2xl overflow-hidden"),children:(0,s.jsxs)("figure",{className:(0,a.Z)("flex flex-col",o?"gap-4":"gap-2"),children:[(0,s.jsx)(_(),{src:t,width:n,height:l,alt:i,className:"w-full h-auto",priority:d}),r&&(0,s.jsx)("figcaption",{className:(0,a.Z)("text-sm text-secondary",o&&"max-w-[700px] px-6 w-full mx-auto "),children:r})]})})},Video:function(e){let{src:t,autoPlay:n=!0}=e;return(0,s.jsxs)("video",{playsInline:n,autoPlay:n,loop:n,muted:n,controls:!n,className:"w-full overflow-hidden rounded-2xl",children:[(0,s.jsx)("source",{src:t,type:"video/mp4"}),"Sorry, your browser doesn't support embedded videos."]})},a:I,Link:I,Rating:()=>{let[e,t]=(0,r.useState)(4.6),[n,a]=(0,r.useState)(5);return(0,s.jsxs)("div",{className:j().playground,children:[(0,s.jsx)(v,{value:e,max:n}),(0,s.jsxs)("div",{className:j().controls,children:[(0,s.jsxs)("label",{children:["Value",(0,s.jsx)("input",{type:"number",value:e,step:.1,min:.

11,max:n,onChange:e=>t(+e.target.value)})]}),(0,s.jsxs)("label",{children:["Max",(0,s.jsx)("input",{type:"number",value:n,onChange:e=>a(+e.target.value),min:1,max:10})]})]}),(0,s.jsx)("p",{className:j().pointer,children:"Test the component by changing the values above \uD83D\uDC46"})]})},Warning:e=>{let{children:t,type:n}=e;return(0,s.jsxs)("div",{className:"flex gap-1 px-4 py-3 rounded-lg mt-7 bg-secondary",children:[(0,s.jsx)(p.aU,{className:"w-6 h-6 shrink-0"}),(0,s.jsx)("div",{children:t})]})},Messages:function(e){let{messages:t}=e;return(0,s.jsx)("ol",{className:(0,a.Z)(i().list,"not-prose"),children:t.map((e,n)=>{var l;let{text:r,sent:o}=e,c=n===t.length-1,d=!c&&(null===(l=t[n+1])||void 0===l?void 0:l.sent)===o;return(0,s.jsx)("li",{className:(0,a.Z)(i().shared,o?i().sent:i().received,d&&i().noTail),children:r},r)})})},AnimatedMessages:()=>{let[e,t]=(0,r.useState)(!1),[n,l]=(0,r.useState)(x);return((0,r.useEffect)(()=>{t(!0)},[]),d(()=>{l(e=>(e.shift(),[...e,{text:m()(h),sent:Math.random()>.5}]))},2e3),e)?(0,s.jsx)(o.M,{children:(0,s.jsx)("ol",{className:i().list,style:{minHeight:600},children:n.map((e,t)=>{var l;let{text:r,sent:o}=e,d=t===n.length-1,u=!d&&(null===(l=n[t+1])||void 0===l?void 0:l.sent)===o;return(0,s.jsx)(c.E.li,{className:(0,a.Z)(i().shared,o?i().sent:i().received,u&&i().noTail),initial:"initial",animate:"enter",variants:f,layout:!0,children:r},r)})})}):(0,s.jsx)(s.Fragment,{})},TailBreakdown:()=>(0,s.jsx)("ol",{className:i().list,children:(0,s.jsx)("li",{className:(0,a.Z)(i().shared,i().tailBreakdown),children:"Hello"})}),SegmentedControl:e=>{let{items:t}=e,[n,a]=(0,r.useState)(0);return(0,s.jsx)(w.s,{children:(0,s.jsx)("ol",{className:S().list,children:t.map((e,t)=>{let l=t===n;return(0,s.jsx)(c.E.li,{className:l||t===n-1?S().itemNoDivider:S().item,whileTap:l?{scale:.95}:{opacity:.6},children:(0,s.jsxs)("button",{onClick:()=>a(t),type:"button",className:S().button,children:[l&&(0,s.jsx)(c.E.div,{layoutId:"SegmentedControlActive",className:S().active}),(0,s.jsx)("span",{className:S().label,children:e})]})},e)})})})},Parallax:e=>{let{children:t,offset:n=50,clampInitial:a,clampFinal:l}=e,i=(0,k.J)(),[o,d]=(0,r.useState)(0),[u,m]=(0,r.useState)(0),h=(0,r.useRef)(null),{scrollY:x}=(0,T.M)(),f=o+n,p=(0,E.H)(x,[o-u,f],[a?0:n,l?0:-n]),g=(0,Z.q)(p,{stiffness:400,damping:90});return((0,r.useLayoutEffect)(()=>{let e=h.current,t=()=>{d(e.getBoundingClientRect().top+window.scrollY||window.pageYOffset),m(window.innerHeight)};return t(),window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)},[h]),i)?(0,s.jsx)(s.Fragment,{children:t}):(0,s.jsx)(c.E.div,{ref:h,style:{y:g},children:t})}}},6306:function(e,t,n){"use strict";var s=n(5893),a=n(7294);t.Z=e=>{let{slug:t}=e,[n,l]=(0,a.useState)(void 0);return((0,a.useEffect)(()=>{fetch("/api/register-hit?slug=".concat(t)).then(e=>e.json()).then(e=>{"number"==typeof e.hits&&l(e.hits)})},[t]),void 0===n)?(0,s.jsx)(s.Fragment,{}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("span",{children:" \xb7"})," ",n," Views"]})}},7382:function(e,t,n){"use strict";n.d(t,{Z:function(){return m}});var s=n(5893),a=n(1354),l=n(5023),i=n(8053),r=n(5675),o=n.n(r),c=n(4093),d=n(7294);function u(e){let{post:t,mousePosition:n}=e,{publishedAt:r,slug:d,title:u,image:m}=t,h=new Date(r),x=Math.abs(new Date(h).getTime()-new Date().getTime())/864e5<30;return(0,s.jsx)("li",{className:"py-2.5 group",children:(0,s.jsxs)("div",{className:"transition-opacity",children:[m&&n&&(0,s.jsx)(c.E.div,{animate:{top:n.y-150-22,left:n.x+22},initial:!1,transition:{ease:"easeOut"},style:{width:300,height:150},className:"absolute z-10 hidden overflow-hidden rounded shadow-sm pointer-events-none sm:group-hover:block bg-primary",children:(0,s.jsx)(o(),{src:m,alt:u,width:300,height:150})}),(0,s.jsx)(l.Z,{heading:(0,a.p)(r),children:(0,s.jsxs)(i.Z,{href:"/blog/".concat(d),children:[u,x&&(0,s.jsx)("span",{className:"inline-block px-1.5 py-[1px] relative -top-[2px] font-bold ml-2 text-[10px] uppercase rounded-full brand-gradient text-white",children:"New"})]})})]})})}function m(e){let{posts:t}=e,[n,a]=(0,d.useState)({x:240,y:0}),l=(0,d.useRef)(null),i=e=>{a(function(e,t){let n={x:e.pageX,y:e.pageY},s={left:t.offsetLeft,top:t.clientTop,width:t.clientWidth,height:t.clientHeight},a=t.offsetParent;for(;a;)s.left+=a.offsetLeft,s.top+=a.offsetTop,a=a.offsetParent;return{x:n.x-s.left,y:n.y-s.top}}(e,l.current))};return(0,s.jsxs)("ul",{ref:l,onMouseMove:e=>i(e),className:"flex flex-col animated-list",children:[0===t.length&&(0,s.jsx)("p",{children:"No posts found"}),t.map(e=>(0,s.jsx)(u,{post:e,mousePosition:n},e.slug))]})}},1354:function(e,t,n){"use strict";n.d(t,{p:function(){return s}});let s=e=>new Date(e).toLocaleDateString("en-US",{month:"short",day:"2-digit",year:"numeric",timeZone:"UTC"})},502:function(e,t,n){"use strict";n.r(t),n.d(t,{__N_SSG:function(){return k},default:function(){return T}});var s=n(5893),a=n(5929),l=n(2962),i=n(1354),r=n(6306),o=n(7382),c=n(8053),d=n(5675),u=n.n(d),m=n(1304),h=n.n(m),x=e=>{let{tags:t}=e;return(null==t?void 0:t.length)?(0,s.jsx)("div",{className:"flex justify-center",children:(0,s.jsx)("ul",{className:"flex gap-6 animated-list",children:t.map(e=>(0,s.jsx)("li",{className:"transition-opacity",children:(0,s.jsx)(c.Z,{href:"/blog/tag/".concat(h()(e,{lower:!0})),underline:!0,children:"#".concat(e)})},e))})}):null},f=n(7294);let p={getItem:e=>{if("undefined"!=typeof Storage)try{return localStorage.getItem(e)||""}catch(e){}return""},setItem:(e,t)=>

1{let n=!1;try{localStorage.setItem("testkey","testvalue"),localStorage.removeItem("testkey"),n=!0}catch(e){n=!1}n&&localStorage.setItem(e,t)},removeItem:e=>{if("undefined"!=typeof Storage)try{localStorage.removeItem(e)}catch(e){}return""}};var g=n(9405);async function j(){for(var e=arguments.length,t=Array(e),n=0;n<e;n++)t[n]=arguments[n];let s=await fetch(...t);return s.json()}var v=n(5422),y=n(1492),_=n(6010),N=function(e){let{children:t}=e,n=function(){let e=(0,f.useRef)(!0);return(0,f.useEffect)(()=>{e.current=!1},[]),e.current}(),[a,l]=(0,f.useState)("initial"),[i,r]=(0,f.useState)(t);return(0,f.useEffect)(()=>{n||(setTimeout(()=>l("out"),0),setTimeout(()=>r(t),75),setTimeout(()=>l("moveDown"),75),setTimeout(()=>l("initial"),150))},[t,n,75]),(0,s.jsx)("span",{className:(0,_.Z)("inline-flex","out"===a&&"opacity-0 -translate-y-3 duration-75 ease-in-out","initial"===a&&"opacity-100 translate-y-0 duration-75 ease-in-out","moveDown"===a&&"opacity-0 translate-y-3"),children:i})};function w(e){let{slug:t}=e,[n,a]=(0,f.useState)(!1),{data:l}=(0,g.ZP)("/api/likes?slug=".concat(t),j),i=null==l?void 0:l.likes,r="true"===p.getItem(t);(0,f.useEffect)(()=>a(!0),[]);let o=async()=>{p.setItem(t,"true"),(0,g.JG)("/api/likes?slug=".concat(t),{...l,likes:i+1},!1),await fetch("/api/likes?slug=".concat(t),{method:"POST"})};return n?(0,s.jsx)("div",{className:"flex justify-center",children:(0,s.jsx)("button",{disabled:r,onClick:o,type:"button",className:"flex items-center justify-center h-10 gap-2 overflow-hidden text-white transition-transform bg-orange-400 rounded-full like-button hover:cursor-default active:scale-95",children:(0,s.jsxs)(y.Z,{className:"flex items-center justify-center gap-2 px-4",size:120,strength:30,children:[r?(0,s.jsx)(v.AU,{}):(0,s.jsx)(v.fe,{})," ",void 0===i?"--":(0,s.jsx)(N,{children:i})]})})}):null}var b=n(3411),S=n(5100),k=!0;function T(e){let{post:t,related:n}=e,d="".concat(t.title," | ").concat(S.FullName),m="".concat(t.summary),h="".concat(S.SiteURL,"/blog/").concat(t.slug),f=(0,a.z)(t.body.code);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(l.PB,{title:d,description:m,canonical:h,openGraph:{title:d,url:h,description:m,site_name:S.FullName,type:"article",article:{publishedTime:t.publishedAt,modifiedTime:t.updatedAt,authors:[S.SiteURL]},images:[{url:t.image?"".concat(S.SiteURL).concat(t.image):"".concat(S.SiteURL,"/api/og?title=").concat(encodeURIComponent(t.title)),alt:t.title}]}}),(0,s.jsxs)("div",{className:"flex flex-col gap-20",children:[(0,s.jsxs)("article",{children:[t.image&&(0,s.jsx)(u(),{src:t.image,alt:"".concat(t.title," post image"),width:700,height:350,className:"w-[calc(100%+32px)] -ml-4 md:rounded-xl max-w-none border  border-primary",priority:!0}),(0,s.jsx)("div",{className:"h-8"}),(0,s.jsxs)("div",{className:"flex flex-col gap-3",children:[(0,s.jsx)("h1",{className:"text-2xl font-semibold",children:t.title}),(0,s.jsxs)("p",{className:"text-secondary",children:[(0,s.jsx)("time",{dateTime:t.publishedAt,children:(0,i.p)(t.publishedAt)}),t.updatedAt?" (Updated ".concat((0,i.p)(t.updatedAt),")"):""," ",(0,s.jsx)(r.Z,{slug:t.slug})]})]}),(0,s.jsx)("div",{className:"h-8"}),(0,s.jsx)("div",{className:"prose prose-h2:text-lg prose-h2:mb-2 prose-h2:font-semibold",children:(0,s.jsx)(f,{components:b.Z})})]}),(0,s.jsx)(w,{slug:t.slug}),(0,s.jsx)(x,{tags:t.tags}),n.length?(0,s.jsxs)("div",{className:"flex flex-col items-start gap-10",children:[(0,s.jsx)("h3",{className:"text-xl",children:"Related posts"}),(0,s.jsx)("div",{className:"will-change-transform",children:(0,s.jsx)(o.Z,{posts:n})}),(0,s.jsx)(c.Z,{href:"/blog",underline:!0,children:"← See all"})]}):null]})]})}},3092:function(e){e.exports={container:"rating_container__gdIWC",star:"rating_star__nbAQt",overlay:"rating_overlay__ofP_0",playground:"rating_playground__7xscX",controls:"rating_controls__wzmfG",pointer:"rating_pointer__JxThS"}},2553:function(e){e.exports={list:"messages_list__w53ta",shared:"messages_shared__7NzRR",noTail:"messages_noTail__ag96i",sent:"messages_sent__E_D40",received:"messages_received__Mmjo7",tailBreakdown:"messages_tailBreakdown__U76cj"}},3347:function(e){e.exports={list:"segmentedcontrol_list__jfANE",item:"segmentedcontrol_item__hlmDo",itemNoDivider:"segmentedcontrol_itemNoDivider__e2R4V segmentedcontrol_item__hlmDo",button:"segmentedcontrol_button__gt1nW",label:"segmentedcontrol_label__MmAIk",active:"segmentedcontrol_active__2A2uQ"}}},function(e){e.O(0,[15,451,774,888,179],function(){return e(e.s=1127)}),_N_E=e.O()}]);