https://propertyvideos.ai/assets/brand-kits-MPXz1gd4.js

1import{j as e,u as xe,a as ue,r,c7 as ge,d as he,e as I,l as N,D as U,G as pe,B as j,P as q,f as G,g as R,h as H,i as M,b_ as ae,b$ as re,c0 as ne,x as fe,L as V,I as z,p as W,q as _,s as J}from"./index-D0AtZcBU.js";import{C as X,c as Y}from"./card-Dsub_NS9.js";import{A as je,b as ye,c as be,d as Ne,e as ve,f as we,g as Fe,h as Ce}from"./alert-dialog-WICAKXIn.js";import{l as De,B as Se}from"./BrandColorPicker-CTM6evqk.js";import{A as Le}from"./AccountLayout-Fukw7syA.js";import{F as Z,a as ee}from"./FontUploader-3V8ijyLg.js";import{B as Te}from"./badge-NC0-xVpI.js";import{S as se}from"./separator-C567rEic.js";import{P as ke}from"./palette-BYSqHCtj.js";import{B as le}from"./building-BuMmJbxl.js";import{S as Ke}from"./square-pen-DjbAhyHQ.js";import{T as Be}from"./trash-2-CgdPYA44.js";import{I as $}from"./info-XDGk3qw0.js";import{C as Ae}from"./circle-check-BD57xBQr.js";import"./AppHeader-DekwHeZr.js";import"./EnquiryModal-CDwynGGk.js";import"./textarea-CBBLPAX2.js";import"./settings-DJSYSBbF.js";import"./select-DKB0Q1Jw.js";import"./star-DPEvAvfU.js";import"./upload-CaJkpYM3.js";function Pe(){const{toast:t}=xe(),u=ue(),[v,g]=r.useState(!1),[d,h]=r.useState(null),[y,w]=r.useState(null),{user:F,getTeamspaceBrandKits:k}=ge(),{data:C=[],isLoading:K}=he({queryKey:["/api/brand-kits"]}),D=r.useMemo(()=>{const s=new Set;return F.teams.forEach(l=>{k(l.id).forEach(c=>s.add(c))}),Array.from(s)},[F.teams,k]),S=r.useMemo(()=>C.map(s=>({...s,isTeamspaceKit:D.includes(s.id)})),[C,D]);I({mutationFn:async s=>N("POST","/api/brand-kits",s),onSuccess:()=>{t({title:"Success",description:"Brand kit created successfully"}),g(!1),u.invalidateQueries({queryKey:["/api/brand-kits"]})},onError:s=>{t({title:"Error",description:s.message||"Failed to create brand kit",variant:"destructive"})}}),I({mutationFn:async({id:s,data:l})=>N("PATCH",`/api/brand-kits/${s}`,l),onSuccess:()=>{t({title:"Success",description:"Brand kit updated successfully"}),h(null),u.invalidateQueries({queryKey:["/api/brand-kits"]})},onError:s=>{t({title:"Error",description:s.message||"Failed to update brand kit",variant:"destructive"})}});const b=I({mutationFn:async s=>N("DELETE",`/api/brand-kits/${s}`),onSuccess:()=>{t({title:"Success",description:"Brand kit deleted successfully"}),u.invalidateQueries({queryKey:["/api/brand-kits"]})},onError:s=>{t({title:"Error",description:s.message||"Failed to delete brand kit",variant:"destructive"})}}),B=async(s,l=!1,p=null,c=null,O="",L=()=>{})=>{s.preventDefault();const A=new FormData(s.currentTarget);L(!0);try{const m=await(l&&d?await N("PATCH",`/api/brand-kits/${d.id}`,A):await N("POST","/api/brand-kits",A)).json();if(p||c){const o={};if(p){const n=new FormData;n.append("fontFile",p),n.append("brandKitName",m.kitName);const i=await fetch("/api/custom-fonts/upload",{method:"POST",body:n});if(!i.ok){const f=await i.json();throw new Error(f.error||"Failed to upload title font")}const{font:T}=await i.json();o.titleFont=T.fontName}if(c){const n=new FormData;n.append("fontFile",c),n.append("brandKitName",m.kitName);const i=await fetch("/api/custom-fonts/upload",{method:"POST",body:n});if(!i.ok){const f=await i.json();throw new Error(f.error||"Failed to upload body font")}const{font:T}=await i.json();o.bodyFont=T.fontName}if(Object.keys(o).length>0){const n=new FormData;o.titleFont&&n.append("titleFont",o.titleFont),o.bodyFont&&n.append("bodyFont",o.bodyFont),await N("PATCH",`/api/brand-kits/${m.id}`,n)}}t({title:"Success",description:`Brand kit ${l?"updated":"created"} successfully`}),g(!1),h(null),u.invalidateQueries({queryKey:["/api/brand-kits"]})}catch(P){t({title:"Error",description:P.message||`Failed to ${l?"update":"create"} brand kit`,variant:"destructive"})}finally{L(!1)}},E=s=>{w(s)};return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"space-y-8",children:e.jsx("div",{className:"space-y-8",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs(U,{open:v,onOpenChange:g,children:[!K&&S.length>0&&e.jsx("div",{className:"flex justify-start",children:e.jsx(pe,{asChild:!0,children:e.jsxs(j,{className:"bg-[#652eff] hover:bg-[#5925e6] text-white rounded-xl text-sm h-10 px-5","data-testid":"button-new-kit",children:[e.jsx(q,{className:"w-4 h-4 mr-2"}),"Create Brand Kit"]})})}),e.jsxs(G,{className:"max-w-4xl w-[95vw] sm:w-full max-h-[90vh] overflow-y-auto p-4 sm:p-6",children:[e.jsxs(R,{children:[e.jsx(H,{className:"text-gray-900 text-lg sm:text-xl",children:"Create Brand Kit"}),e.jsx(M,{className:"text-gray-600 text-sm",children:"Save your branding assets for quick reuse across projects"})]}),e.jsx(te,{onSubmit:B,onCancel:()=>g(!1)},"create-kit-form")]})]}),K?e.jsx("div",{className:"text-center py-12 text-gray-600",children:"Loading brand kits..."}):S.length===0?e.jsx(X,{className:"bg-white border-gray-200 shadow-sm",children:e.jsxs(Y,{className:"flex flex-col items-center justify-center py-12",children:[e.jsx(ke,{className:"h-12 w-12 text-gray-400 mb-4"}),e.jsx("h3",{className:"text-lg font-semibold mb-2 text-gray-900",children:"No brand kits yet"}),e.jsx("p",{className:"text-sm text-gray-600 mb-4",children:"Create your first brand kit to save time on future projects"}),e.jsxs(j,{onClick:()=>g(!0),className:"bg-[#652eff] hover:bg-[#5925e6] text-white rounded-xl text-sm h-10 px-5","data-testid":"button-create-first-kit",children:[e.jsx(q,{className:"mr-2 h-4 w-4"}),"Create Brand Kit"]})]})}):e.jsx("div",{className:"flex flex-col items-stretch gap-4",children:S.map(s=>e.jsx(X,{className:"bg-white border-gray-200 shadow-sm max-w-2xl w-full","data-testid":`card-kit-${s.id}`,children:e.jsx(Y,{className:"p-6",children:e.jsxs("div",{className:"flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4",children:[e.jsxs("div",{className:"flex items-center space-x-4 min-w-0 flex-1",children:[e.jsx(ae,{className:"h-12 w-12 flex-shrink-0 rounded-md",children:s.agencyLogo?e.jsx(re,{src:`/api/image-proxy/${encodeURIComponent(s.agencyLogo)}`,alt:s.kitName,className:"object-contain"}):e.jsx(ne,{style:{backgroundColor:s.brandColor||"#652eff20"},className:"text-white",children:e.jsx(le,{className:"h-6 w-6"})})}),e.jsxs("div",{className:"min-w-0 flex-1",children:[e.jsxs("div",{className:"flex items-center space-x-2 mb-1",children:[e.jsx("h3",{className:"text-lg font-semibold text-gray-900 truncate",children:s.kitName}),s.isTeamspaceKit&&e.jsxs(Te,{variant:"outline",className:"bg-[#652eff]/10 text-[#652eff] border-[#652eff]/20 text-xs font-semibold",children:[e.jsx(fe,{className:"w-3 h-3 mr-1"}),"TEAM"]})]}),e.jsxs("div",{className:"flex flex-col space-y-1 text-sm text-gray-600",children:[e.jsxs("span",{className:"flex items-center",children:[e.jsx("div",{className:"w-4 h-4 rounded border border-gray-300 mr-2",style:{backgroundColor:s.brandColor||"#652eff"}}),s.brandColor]}),s.titleFont&&e.jsxs("span",{className:"flex items-center truncate",children:["Title Font: ",s.titleFont]}),s.bodyFont&&e.jsxs("span",{className:"flex items-center truncate",children:["Body Font: ",s.bodyFont]})]})]})]}),e.jsx("div",{className:"flex items-center space-x-2 flex-shrink-0",children:s.isTeam

1spaceKit?e.jsx("span",{className:"text-xs text-gray-500 italic px-3",children:"Team brand kit"}):e.jsxs(e.Fragment,{children:[e.jsx(j,{variant:"outline",size:"sm",onClick:()=>h(s),className:"border-gray-300 text-gray-600 hover:bg-gray-50","data-testid":`button-edit-${s.id}`,children:e.jsx(Ke,{className:"w-4 h-4"})}),e.jsx(j,{variant:"outline",size:"sm",onClick:()=>E(s.id),className:"border-red-300 text-red-600 hover:bg-red-50",disabled:b.isPending,"data-testid":`button-delete-${s.id}`,children:e.jsx(Be,{className:"w-4 h-4"})})]})})]})})},s.id))}),d&&e.jsx(U,{open:!!d,onOpenChange:s=>!s&&h(null),children:e.jsxs(G,{className:"max-w-4xl w-[95vw] sm:w-full max-h-[90vh] overflow-y-auto p-4 sm:p-6",children:[e.jsxs(R,{children:[e.jsx(H,{className:"text-gray-900 text-lg sm:text-xl",children:"Edit Brand Kit"}),e.jsx(M,{className:"text-gray-600 text-sm",children:"Update your brand kit details"})]}),e.jsx(te,{kit:d,isEdit:!0,onSubmit:B,onCancel:()=>h(null)},`edit-kit-form-${d.id}`)]})})]})})}),e.jsx(je,{open:!!y,onOpenChange:s=>!s&&w(null),children:e.jsxs(ye,{children:[e.jsxs(be,{children:[e.jsx(Ne,{children:"Delete Brand Kit"}),e.jsx(ve,{children:"Are you sure you want to delete this brand kit? This action cannot be undone."})]}),e.jsxs(we,{children:[e.jsx(Fe,{"data-testid":"button-cancel-delete-kit",children:"Cancel"}),e.jsx(Ce,{onClick:()=>{y&&(b.mutate(y),w(null))},disabled:b.isPending,className:"bg-red-600 hover:bg-red-700","data-testid":"button-confirm-delete-kit",children:b.isPending?"Deleting...":"Delete"})]})]})})]})}function ts(){return e.jsx(Le,{activeSection:"brand-kits",children:e.jsx(Pe,{})})}const te=r.memo(({kit:t,isEdit:u,onSubmit:v,onCancel:g})=>{const[d,h]=r.useState((t==null?void 0:t.kitName)||""),[y,w]=r.useState((t==null?void 0:t.brandColor)||"#7c3aed"),[F,k]=r.useState((t==null?void 0:t.titleFont)||""),[C,K]=r.useState((t==null?void 0:t.bodyFont)||""),[D,S]=r.useState(null),[b,B]=r.useState(null),[E,s]=r.useState(!1),[l,p]=r.useState(null),[c,O]=r.useState(null),[L,A]=r.useState(!1),[P,m]=r.useState(!1),[o,n]=r.useState(null),[i,T]=r.useState(!1),f=a=>{S(a),B(URL.createObjectURL(a)),T(!0)},oe=a=>{var Q;const x=(Q=a.target.files)==null?void 0:Q[0];x&&(!i&&!D?(n(x),m(!0)):f(x))},ie=a=>{a.preventDefault(),a.stopPropagation()},de=a=>{a.preventDefault(),a.stopPropagation(),s(!0)},ce=a=>{a.preventDefault(),a.stopPropagation(),s(!1)},me=a=>{a.preventDefault(),a.stopPropagation(),s(!1);const x=a.dataTransfer.files[0];x&&x.type.startsWith("image/")&&(!i&&!D?(n(x),m(!0)):f(x))};return e.jsxs(e.Fragment,{children:[e.jsx(U,{open:P,onOpenChange:m,children:e.jsxs(G,{className:"max-w-2xl",children:[e.jsxs(R,{children:[e.jsxs(H,{

1className:"text-gray-900 text-xl flex items-center gap-2",children:[e.jsx($,{className:"w-5 h-5 text-[#652eff]"}),"Logo Guidelines"]}),e.jsx(M,{className:"text-gray-600",children:"For best results in your videos"})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("img",{src:De,alt:"Logo Guidelines",className:"w-full rounded-lg border border-gray-200"}),e.jsx("div",{className:"bg-purple-50 border border-purple-200 rounded-lg p-4",children:e.jsxs("p",{className:"text-sm text-gray-700 leading-relaxed",children:[e.jsx("strong",{className:"text-[#652eff]",children:"Important:"})," Avoid using dark logos as they won't be visible on your videos. Use the ",e.jsx("strong",{children:"white variant"})," of your logo or ",e.jsx("strong",{children:"bright colored logos"})," for best visibility."]})})]}),e.jsx("div",{className:"flex justify-end",children:e.jsxs(j,{onClick:()=>{m(!1),o&&(f(o),n(null))},className:"bg-[#652eff] hover:bg-[#5925e6] text-white","data-testid":"button-logo-guidelines-ok",children:[e.jsx(Ae,{className:"w-4 h-4 mr-2"}),"Got it"]})})]})}),e.jsxs("form",{onSubmit:a=>v==null?void 0:v(a,u??!1,l,c,d,A),className:"space-y-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx(V,{htmlFor:"kitName",children:"Kit Name"}),e.jsx(z,{id:"kitName",name:"kitName",placeholder:"My Brand Kit",value:d,onChange:a=>h(a.target.value),required:!0,"data-testid":"input-kit-name"})]}),e.jsx("div",{className:"bg-gray-100 rounded-2xl p-4 sm:p-6",children:e.jsxs("div",{className:"flex flex-col md:flex-row items-start gap-4 md:gap-6",children:[e.jsxs("div",{className:"flex-shrink-0 w-full md:w-auto",children:[e.jsx("label",{className:"text-sm font-medium leading-none text-gray-700 block mb-2",children:"Agency Logo *"}),e.jsx("div",{className:`flex flex-col items-center justify-center space-y-3 border-2 border-dashed rounded-lg p-4 transition-all h-24 w-24 ${E?"border-[#652eff] bg-[#652eff]/10 scale-105":"border-gray-300 hover:border-[#652eff]/50"}`,onDragOver:ie,onDragEnter:de,onDragLeave:ce,onDrop:me,children:e.jsxs(V,{htmlFor:"agencyLogo",className:"cursor-pointer relative",children:[e.jsxs(ae,{className:"h-20 w-20 rounded-lg",children:[e.jsx(re,{src:b||(t!=null&&t.agencyLogo?`/api/image-proxy/${encodeURIComponent(t.agencyLogo)}`:void 0),alt:"Agency Logo",className:"object-contain"}),e.jsx(ne,{style:{backgroundColor:"#652eff20"},className:"text-[#652eff] rounded-lg",children:e.jsx(le,{className:"h-8 w-8"})})]}),e.jsx("div",{className:"absolute bottom-0 right-0 bg-white rounded-full p-1.5 shadow-md border border-gray-200 hover:bg-gray-50 transition-colors",children:e.jsx(q,{className:"h-3.5 w-3.5 text-gray-600"})}),e.jsx(z,{id:"agencyLogo",name:"agencyLogo",type:"file",accept:"image/*",className:"hidden",onChange:oe,"data-testid":"input-agency-logo"})]})})]}),e.jsx(se,{orientation:"vertical",className:"hidden md:block h-auto self-stretch bg-gray-300"}),e.jsxs("div",{className:"flex-shrink-0 w-full md:w-auto",children:[e.jsx(Se,{value:y,onValueChange:w}),e.jsx("input",{type:"hidden",name:"brandColor",value:y})]}),e.jsx(se,{orientation:"vertical",className:"hidden md:block h-auto self-stretch bg-gray-300"}),e.jsxs("div",{className:"flex-1 space-y-3 w-full",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsxs("label",{className:"text-sm font-medium leading-none text-gray-700",children:["Title Font ",e.jsx("span",{className:"text-xs text-gray-500 font-normal",children:"(Optional)"})]}),e.jsxs(W,{delayDuration:0,children:[e.jsx(_,{asChild:!0,children:e.jsx($,{className:"w-4 h-4 text-[#652eff] cursor-pointer"})}),e.jsx(J,{children:e.jsx("p",{children:"Leave empty to use the preset template fonts"})})]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("div",{className:"flex-1",children:[e.jsx(Z,{value:F,onValueChange:k,placeholder:"Select title font",uploadedFile:l,onClearUploadedFile:()=>p(null)}),e.jsx("input",{type:"hidden",name:"titleFont",value:F})]}),e.jsx(ee,{onFileSelected:p,selectedFile:l,compact:!0})]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsxs("label",{className:"text-sm font-medium leading-none text-gray-700",children:["Body Font ",e.jsx("span",{className:"text-xs text-gray-500 font-normal",children:"(Optional)"})]}

1),e.jsxs(W,{delayDuration:0,children:[e.jsx(_,{asChild:!0,children:e.jsx($,{className:"w-4 h-4 text-[#652eff] cursor-pointer"})}),e.jsx(J,{children:e.jsx("p",{children:"Leave empty to use the preset template fonts"})})]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("div",{className:"flex-1",children:[e.jsx(Z,{value:C,onValueChange:K,placeholder:"Select body font",uploadedFile:c,onClearUploadedFile:()=>O(null)}),e.jsx("input",{type:"hidden",name:"bodyFont",value:C})]}),e.jsx(ee,{onFileSelected:O,selectedFile:c,compact:!0})]})]})]})]})}),e.jsxs("div",{className:"flex flex-col-reverse sm:flex-row justify-end gap-2",children:[e.jsx(j,{type:"button",variant:"outline",onClick:g,className:"border-gray-300 text-gray-600 hover:bg-gray-50 w-full sm:w-auto","data-testid":"button-cancel",children:"Cancel"}),e.jsx(j,{type:"submit",disabled:L,className:"bg-[#652eff] hover:bg-[#5925e6] text-white w-full sm:w-auto","data-testid":"button-save-kit",children:L?"Saving...":`${u?"Update":"Create"} Kit`})]})]})]})});export{Pe as BrandKitsContent,ts as default};