https://posthog.com/component---src-pages-videos-index-tsx-3e9b77a4599cfa46ca51.js

1"use strict";(self.webpackChunkposthog_com=self.webpackChunkposthog_com||[]).push([[4748],{517:function(e,t,r){r.d(t,{A:function(){return b}});var a=r(19371),s=r(30758),l=r(59527),o=r(1350),n=r(63629),i=r(14038),c=r(93058),d=r(5356),u=r(4856),m=r(59145),h=r(86070);function g(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,a)}return r}function f(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?g(Object(r),!0).forEach(function(t){(0,a.A)(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):g(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}const p=e=>{let{content:t}=e;return t?Array.isArray(t)?(0,h.jsx)(h.Fragment,{children:t.map((e,t)=>(0,h.jsx)(c.nD,{"data-scheme":"primary",className:"",defaultValue:"item-0",items:[{trigger:e.title,content:e.content}]},t))}):(0,h.jsx)(h.Fragment,{children:t}):null},x=300;function b(e){var t,r;let{template:a,slug:c,title:g,accentImage:b,leftSidebarContent:v,rightSidebarContent:y,children:j,fullScreen:w=!1,transparent:N=!1,showTitle:O=!0,padding:C=!0,headerBarOptions:S,selectOptions:A=[],onCategoryChange:P,selectedCategory:k,rightSidebarPanel:I,isRightSidebarOpen:F=!1,onRightSidebarClose:L,doubleClickToOpen:z=!1,rightActionButtons:V,onSearch:E,viewportClasses:D="",showAddressBar:_=!0,className:H=""}=e;const{appWindow:M}=(0,d.ox)(),B=(null==M||null===(t=M.path)||void 0===t?void 0:t.replace(/^\//,""))||"",R=(0,s.useRef)(null),{0:W,1:T}=(0,s.useState)(x),q=null==M||null===(r=M.size)||void 0===r?void 0:r.width,U=(0,s.useMemo)(()=>{const e=e=>{let{children:t}=e;return q&&q<=768?(0,h.jsx)(i.A,{viewportClasses:"[&>div]:h-full "+D,children:t}):(0,h.jsx)(h.Fragment,{children:t})};return e.displayName="ContentWrapper",e},[q,D]);return(0,h.jsxs)("div",{className:"@container w-full h-full flex flex-col min-h-1 "+H,children:[(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(o.A,f(f({},(()=>{const e={};return S?S.forEach(t=>{e[t]=!0}):(e.showBack=!0,e.showForward=!0,e.showSearch=!0),e})()),{},{searchContentRef:R,rightActionButtons:V,onSearch:E,className:_?"":"border-b border-primary"})),_&&(0,h.jsx)(m.A,{selectOptions:A,currentPath:B,handleValueChange:e=>{P?P(e):(0,n.navigate)("/"+e)},selectedCategory:k})]}),(0,h.jsx)(U,{children:(0,h.jsxs)("div",{"data-scheme":"secondary",className:"flex flex-col @3xl:flex-row-reverse flex-grow min-h-0 "+(w?" ":"h-full"),children:[y&&(0,h.jsx)("aside",{"data-scheme":"secondary",className:"not-prose w-96 bg-primary border-l border-primary h-full text-primary",children:(0,h.jsx)("div",{className:"h-full flex flex-col",children:(0,h.jsx)("div",{className:"flex-1 overflow-auto",children:(0,h.jsx)(p,{content:y})})})}),I&&F&&(0,h.jsxs)("aside",{"data-scheme":"secondary",className:"not-prose bg-primary border-l border-primary h-full text-primary relative @3xl:block hidden",style:{width:W},children:[(0,h.jsx)("div",{className:"h-full flex flex-col",children:(0,h.jsx)("div",{className:"flex-1 overflow-auto",children:I})}),(0,h.jsx)(l.P.div,{"data-scheme":"tertiary",className:"w-1.5 cursor-ew-resize top-0 left-0 !transform-none absolute z-20 h-full hover:bg-accent active:bg-accent",drag:"x",dragMomentum:!1,dragConstraints:{left:0,right:0},onDrag:(e,t)=>{var r;const a=Math.max(Math.min(W-t.delta.x,((null==M||null===(r=M.size)||void 0===r?void 0:r.width)||0)/2),x);T(a)}})]}),(0,h.jsx)("main",{"data-app":"Explorer","data-scheme":"primary",className:"@container flex-1 relative h-full "+(N?"":"bg-primary"),children:w?j:(0,h.jsxs)(i.A,{className:"h-full",children:[b&&(0,h.jsx)("div",{className:"absolute right-0 top-6",children:(0,h.jsxs)("div",{className:"relative max-w-md @4xl:max-w-lg @5xl:max-w-xl @6xl:max-w-2xl transition-all duration-700 ease-out opacity-25 @xl:opacity-50",children:[b,(0,h.jsx)("div",{className:"absolute left-0 top-0 w-1/2 h-full bg-gradient-to-r from-[rgb(var(--bg))] to-[color-mix(in_srgb,rgb(var(--bg))_0%,transparent)]"}),(0,h.jsx)("div",{className:"absolute bottom-0 left-0 h-1/2 w-full bg-gradient-to-b from-[color-mix(in_srgb,rgb(var(--bg))_0%,transparent)] to-[rgb(var(--bg))]"})]})}),(0,h.jsxs)("div",{ref:R,className:(0,u.WN)()+" max-w-none h-full "+(C?"relative @md:p-4":"")+" ",children:[!w&&O&&(0,h.jsx)("h1",{children:g}),j]})]})}),v&&(0,h.jsx)("aside",{"data-scheme":"secondary",className:"@3xl:w-64 bg-primary border-t @3xl:border-t-0 @3xl:border-r border-primary prose prose-sm dark:prose-invert h-full",children:(0,h.jsx)(i.A,{className:"p-2",children:(0,h.jsx)("div",{className:"space-y-3",children:(0,h.jsx)(p,{content:v})})})})]})})]})}},24283:function(e,t,r){r.r(t),r.d(t,{default:function(){return v}});var a=r(30758),s=r(517),l=r(63629),o=r(8462),n=r(78558),i=r(93058),c=r(4856),d=r(86070);const u=[{label:(0,d.jsx)(n.IconGrid,{className:"size-4"}),value:"grid",default:!0},{label:(0,d.jsx)(n.IconListSquare,{className:"size-4"}),value:"list"}];var m=r(23081);const h="posthog-explorer-layout";var g=r(9446),f=r(16318),p=r(47433),x=r(99797);const b=e=>{var t,r,a;return"changelog"===e.folder?"photobooth":null!==(t=e.tags)&&void 0!==t&&t.includes("experiments")||null!==(r=e.tags)&&void 0!==r&&r.includes("feature flags")?"hedgehog_mode":(null!==(a=e.tags)&&void 0!==a&&a.includes("demo"),"video")};function v(){const{isListLayout:e,setLayoutValue:t,currentLayout:r}=function(e){void 0===e&&(e="grid");const{0:t,1:r}=(0,a.useState)("list"===e);return(0,a.useEffect)(()=>{try{const e=localStorage.getItem(h);!e||"grid"!==e&&"list"!==e||r("list"===e)}catch(e){console.warn("Failed to load layout preference from localStorage:",e)}},[]),{isListLayout:t,setLayoutValue:e=>{if("grid"===e||"list"===e){r("list"===e);try{localStorage.setItem(h,e)}catch(t){console.warn("Failed to save layout preference to localStorage:",t)}}},currentLayout:t?"list":"grid"}}("grid"),v=(0,g.bI)(),y=(0,x.O)(),j=(0,a.useMemo)(()=>{const e={};

1return Array.isArray(y)&&y.forEach(t=>{e[t.folder]||(e[t.folder]=[]),e[t.folder].push(t)}),e},[y]);return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(o.Ay,{title:"Video library - PostHog",description:"PostHog on film",image:"/images/og/default.png"}),(0,d.jsx)(s.A,{template:"generic",slug:"videos",selectOptions:v,selectedCategory:"videos",rightActionButtons:(0,d.jsx)(m.O,{title:"Layout",hideTitle:!0,options:u,onValueChange:t,value:r,className:"-my-1 ml-2"}),leftSidebarContent:(0,d.jsx)(d.Fragment,{children:(0,d.jsx)(i.nD,{"data-scheme":"primary",className:"",defaultValue:"item-0",items:[{trigger:(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(n.IconSparksJoy,{className:"size-5 inline-block"}),(0,d.jsx)("span",{className:"flex-1",children:"Why?"})]}),content:(0,d.jsx)(d.Fragment,{children:(0,d.jsxs)("p",{className:"text-sm mb-0",children:["It's a reference to a book by Marie Kondo and is part of the"," ",(0,d.jsx)(l.Link,{to:"/handbook/company/lore",state:{newWindow:!0},children:"lore of PostHog"}),"."]})})}]})}),children:(0,d.jsx)("div",{className:"@container not-prose space-y-2 @md:-ml-3",children:Object.entries(j).map((t,r)=>{let[a,s]=t;return(0,d.jsx)(i.nD,{triggerClassName:"flex-row-reverse [&>svg]:!-rotate-90 [&[data-state=open]>svg]:!rotate-0 [&>span]:relative [&>span]:after:absolute [&>span]:after:right-0 [&>span]:after:top-1/2 [&>span]:after:h-px [&>span]:after:w-full [&>span]:after:bg-border [&>span]:after:content-['']",items:[{value:a,trigger:(0,d.jsxs)("span",{className:"bg-primary pr-2 relative z-10 select-none",children:[a.charAt(0).toUpperCase()+a.slice(1)," (",s.length,")"]}),content:(0,d.jsx)("div",{className:"@md:pl-4 grid "+(e?"@lg:grid-cols-2 @3xl:grid-cols-3":c.R4+" gap-y-4 items-start justify-items-center")+" gap-x-1 @md:gap-x-4 relative [&>div]:mx-auto [&_figure]:text-center",children:s.map(t=>(0,d.jsx)(p.A,{className:e?"w-full justify-start":"w-28 justify-center",children:(0,d.jsx)(f.Ez,{label:t.title,url:"/videos/play?source="+t.source+"&videoId="+t.videoId,Icon:t.thumbnail?(0,d.jsx)("img",{src:t.thumbnail,alt:t.title,className:"w-full h-full object-cover rounded"}):(0,d.jsx)(f.z9,{name:b(t)}),background:"bg-primary",className:"size-12",orientation:e?"row":"column"})},t.source+"-"+t.videoId))})}],defaultValue:0===r?a:void 0},a)})})})]})}},59145:function(e,t,r){r.d(t,{A:function(){return l}});var a=r(96549),s=r(86070);function l(e){let{selectOptions:t,currentPath:r,handleValueChange:l,selectedCategory:o}=e;return(0,s.jsx)("div",{"data-scheme":"secondary",className:"bg-primary px-2 pb-2 border-b border-primary",children:(0,s.jsx)(a.l,{groups:t,placeholder:"Select...",ariaLabel:"Products",defaultValue:o||r,onValueChange:l,className:"w-full",dataScheme:"primary"})})}},99797:function(e,t,r){r.d(t,{O:function(){return l}});var a=r(30758);const s=[{source:"youtube",videoId:"1FZji2L-LmM",folder:"products",title:"Demo video",tags:["demo","overview"]},{source:"wistia",videoId:"tg7d3aw5af",folder:"products",title:"How PostHog uses Experiments",tags:["experiments"]},{source:"wistia",videoId:"x8m2u14slo",folder:"products",title:"How PostHog uses Feature Flags",tags:["feature flags"]},{source:"wistia",videoId:"klphfrgiq3",title:"Changelog 001",folder:"changelog"}];function l(){const{0:e,1:t}=(0,a.useState)(s);return(0,a.useEffect)(()=>{fetch("/videos-metadata.json").then(e=>{if(!e.ok)throw new Error("Failed to fetch video metadata");return e.json()}).then(e=>{t(e)}).catch(e=>{console.warn("Using base video data (enriched metadata not available):",e.message)})},[]),e}}}]);
2//# sourceMappingURL=component---src-pages-videos-index-tsx-3e9b77a4599cfa46ca51.js.map