PageSourceSearch

https://synerise.com/assets/latest-videos-section-xfouIrDR.js

js synerise.com collected 2026-09-25 19:05:13 UTC 7,468 bytes, 1 lines download raw bytes

1import{r as l,j as e}from"./vendor-react-Cmi0Jrom.js";import{a as v}from"./vendor-query-HImUUcVP.js";import{Y as f}from"./youtube-player-Ca78q3Jj.js";import{L as m}from"./vendor-router-xf9UbNSr.js";import{f as x,a as h}from"./youtube-helpers-nF7Gp0QU.js";import{a as y}from"./index-CIJgM20k.js";import{A as g,L as b,aG as w,at as j,s as k,X as N}from"./vendor-icons-RDdiQ4sc.js";import{m as d,A as C}from"./vendor-motion-OaAG8utH.js";import"./vendor-radix-toast-LTka-d4j.js";import"./vendor-radix-primitive-BvNKvj7K.js";import"./vendor-radix-slot-f_qNkOMa.js";import"./vendor-radix-compose-refs-0p3tndNK.js";import"./vendor-radix-collection-C2ADOcGb.js";import"./vendor-radix-context-CZA76pzV.js";import"./vendor-radix-dismissable-layer-DVO7zjMy.js";import"./vendor-radix-use-callback-ref-DNSMTU4D.js";import"./vendor-radix-use-escape-keydown-CIZfUBKX.js";import"./vendor-radix-portal-lgfuWWlX.js";import"./vendor-radix-use-layout-effect-BVlAuFcq.js";import"./vendor-radix-presence-CVpwEzH2.js";import"./vendor-radix-use-controllable-state-DQPsvzY-.js";import"./vendor-radix-visually-hidden-BUU9ShfC.js";import"./vendor-radix-tooltip-DC8ZRS9i.js";import"./vendor-radix-popper-DhClme89.js";import"./vendor-radix-arrow-DCOqILDI.js";import"./vendor-radix-use-size-BbzWdhnQ.js";function W(){const{t:s}=y(),[a,n]=l.useState(null),i=l.useCallback(()=>n(null),[]);l.useEffect(()=>{if(!a)return;const t=o=>{o.key==="Escape"&&i()};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[a,i]);const{data:p=[],isLoading:r,error:u}=v({queryKey:["/api/youtube-videos"]}),c=p.slice(0,6);return u||!r&&c.length===0?null:e.jsxs(e.Fragment,{children:[e.jsx("section",{"data-testid":"section-latest-videos",className:"py-24 md:py-32 bg-white dark:bg-gray-950 relative overflow-hidden",children:e.jsxs("div",{className:"relative z-10 max-w-7xl mx-auto px-6 lg:px-8",children:[e.jsxs("div",{className:"flex items-end justify-between mb-12",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium text-gray-400 uppercase tracking-widest mb-4",children:s("videos.tag","Videos")}),e.jsx("h2",{className:"text-3xl md:text-5xl font-medium text-gray-900 dark:text-gray-100","data-testid":"text-latest-videos-heading",children:s("latest_videos.heading","Latest from our channel")})]}),e.jsxs(m,{href:"/videos","data-testid":"link-see-all-videos",className:"hidden md:inline-flex items-center gap-1.5 text-sm font-medium text-gray-500 hover:text-gray-900 dark:text-gray-100 dark:hover:text-gray-100 transition-colors group",children:[e.jsx("span",{className:"link-underline-active",children:s("videos.see_all","See all videos")})," ",e.jsx(g,{className:"w-4 h-4"})]})]}),r&&e.jsxs("div",{className:"flex items-center justify-center py-16","data-testid":"loading-latest-videos",children:[e.jsx(b,{className:"w-5 h-5 text-gray-400 animate-spin"}),e.jsx("span",{className:"ml-3 text-gray-400 text-sm",children:s("videos.loading","Loading videos...")})]}),!r&&e.jsx("div",{className:"grid sm:grid-cols-2 lg:grid-cols-3 gap-7",children:c.map((t,o)=>e.jsxs(d.button,{initial:{opacity:0,y:24},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{duration:.5,delay:o*.1,ease:[.25,.46,.45,.94]},onClick:()=>n(t),"data-testid":`card-latest-video-${t.id}`,className:"group relative bg-white dark:bg-gray-900 rounded-[0.6rem] overflow-hidden text-left transition-all duration-500 shadow-sm hover:shadow-xl hover:shadow-black/[0.08] dark:shadow-none dark:hover:shadow-md dark:hover:shadow-black/30 ring-1 ring-gray-200/80 dark:ring-white/[0.08] hover:ring-gray-300/80 dark:hover:ring-white/[0.15] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-900/80 dark:focus-visible:ring-white/80 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-gray-950",children:[e.jsxs("div",{className:"relative h-52 sm:h-56 overflow-hidden bg-gray-100 dark:bg-gray-800",children:[e.jsx("img",{src:t.thumbnailUrl,alt:t.title,loading:"lazy",decoding:"async",className:"w-full h-full object-cover transition-transform duration-700 ease-out group-hover:scale-[1.05] motion-reduce:transition-none motion-reduce:group-hover:scale-100","data-testid":`img-latest-video-${t.id}`}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-t from-black/30 via-trans
1parent to-transparent opacity-60 group-hover:opacity-80 transition-opacity duration-500"}),e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:e.jsx("div",{className:"w-14 h-14 rounded-full bg-white/95 dark:bg-white/90 backdrop-blur-sm flex items-center justify-center shadow-lg shadow-black/20 opacity-60 group-hover:opacity-100 group-focus-visible:opacity-100 scale-95 group-hover:scale-100 group-focus-visible:scale-100 transition-all duration-300 ease-out",children:e.jsx(w,{className:"w-5 h-5 text-gray-900 ml-0.5",fill:"currentColor"})})})]}),e.jsxs("div",{className:"p-5 pb-6",children:[e.jsx("h3",{className:"text-[0.9375rem] font-medium text-gray-900 dark:text-gray-100 mb-3 leading-snug line-clamp-2 group-hover:text-gray-700 dark:group-hover:text-white transition-colors duration-300","data-testid":`text-latest-video-title-${t.id}`,children:t.title}),e.jsxs("div",{className:"flex items-center gap-4 text-xs text-gray-500 dark:text-gray-400",children:[e.jsxs("span",{className:"flex items-center gap-1.5","data-testid":`text-latest-video-date-${t.id}`,children:[e.jsx(j,{className:"w-3.5 h-3.5"}),x(t.publishedAt)]}),e.jsxs("span",{className:"flex items-center gap-1.5","data-testid":`text-latest-video-views-${t.id}`,children:[e.jsx(k,{className:"w-3.5 h-3.5"}),h(t.viewCount)]})]})]})]},t.id))}),e.jsxs(m,{href:"/videos","data-testid":"link-see-all-videos-mobile",className:"md:hidden flex items-center justify-center gap-1.5 mt-8 text-sm font-medium text-gray-500 hover:text-gray-900 dark:text-gray-100 dark:hover:text-gray-100 transition-colors",children:[s("videos.see_all","See all videos")," ",e.jsx(g,{className:"w-4 h-4"})]})]})}),e.jsx(C,{children:a&&e.jsx(d.div,{initial:{opacity:0}
1,animate:{opacity:1},exit:{opacity:0},role:"dialog","aria-modal":"true","aria-label":`Playing: ${a.title}`,className:"fixed inset-0 z-[100] bg-black/80 flex items-center justify-center p-4 md:p-8",onClick:i,"data-testid":"modal-latest-video-player",children:e.jsxs(d.div,{initial:{scale:.95,opacity:0},animate:{scale:1,opacity:1},exit:{scale:.95,opacity:0},transition:{duration:.2},className:"relative w-full max-w-4xl bg-black rounded-[0.6rem] overflow-hidden",onClick:t=>t.stopPropagation(),children:[e.jsx("button",{onClick:i,"data-testid":"button-close-latest-video","aria-label":s("latest_videos.aria_close_player","Close video player"),className:"absolute -top-12 right-0 text-white/70 hover:text-white transition-colors z-10",children:e.jsx(N,{className:"w-6 h-6"})}),e.jsx("div",{className:"aspect-video",children:e.jsx(f,{videoId:a.id,title:a.title,testIdPrefix:"latest-video"})}),e.jsxs("div",{className:"p-5 bg-gray-950",children:[e.jsx("h3",{className:"text-white text-sm font-medium mb-1","data-testid":"text-modal-latest-video-title",children:a.title}),e.jsxs("div",{className:"flex items-center gap-4 text-xs text-gray-500",children:[e.jsx("span",{"data-testid":"text-modal-latest-video-date",children:x(a.publishedAt)}),e.jsxs("span",{"data-testid":"text-modal-latest-video-views",children:[h(a.viewCount)," ",s("videos.views_label","views")]})]})]})]})})})]})}export{W as LatestVideosSection};

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.