https://www.trybased.com/static/js/4236.3a4f54ab.chunk.js

1/*! For license information please see 4236.3a4f54ab.chunk.js.LICENSE.txt */
2"use strict";(self.webpackChunkknowledge_base_saas=self.webpackChunkknowledge_base_saas||[]).push([[4236],{84236(e,t,s){s.r(t),s.d(t,{default:()=>q});var a=s(89379),r=s(5544),n=s(65043),o=s(97950),l=s(13190),i=s(27673),c=s(41680);const d=(0,s(77784).A)("code-xml",[["path",{d:"m18 16 4-4-4-4",key:"1inbqp"}],["path",{d:"m6 8-4 4 4 4",key:"15zrgr"}],["path",{d:"m14.5 4-5 16",key:"e7oirm"}]]);var x=s(14459),g=s(20073),u=s(40614),h=s(9463),m=s(22024),p=s(56099),b=s(38326),y=s(247),f=s(53639),w=s(36210),j=s(86376),v=s(14939),N=s(39599),k=s(17412),A=s(52395),C=s(78337),S=s(55472),I=s(58147),z=s(96822),E=s(92339),L=s(70579);const M={"client-services":l.A,"agency-creative":i.A,"ops-internal":c.A,"dev-technical":d,"personal-other":x.A},T=["org-profile","work-type","follow-up","extras","review"];function q(e){let t=e.isOpen,s=e.onComplete,l=e.onSkip,i=e.organizationId,c=e.initialOrgName,d=e.initialOrgLogoUrl;const x=(0,n.useState)(0),y=(0,r.A)(x,2),f=y[0],w=y[1],j=(0,n.useState)(""),v=(0,r.A)(j,2),M=v[0],q=v[1],R=(0,n.useState)(null),U=(0,r.A)(R,2),H=U[0],Y=U[1],_=(0,n.useState)(null),Q=(0,r.A)(_,2),B=Q[0],V=Q[1],G=(0,n.useState)(!1),J=(0,r.A)(G,2),K=J[0],Z=J[1],X=(0,n.useState)(null),$=(0,r.A)(X,2),ee=$[0],te=$[1],se=(0,n.useState)({}),ae=(0,r.A)(se,2),re=ae[0],ne=ae[1],oe=(0,n.useState)(new Set),le=(0,r.A)(oe,2),ie=le[0],ce=le[1],de=(0,n.useState)(!1),xe=(0,r.A)(de,2),ge=xe[0],ue=xe[1],he=(0,n.useState)(""),me=(0,r.A)(he,2),pe=me[0],be=me[1],ye=(0,n.useState)(null),fe=(0,r.A)(ye,2),we=fe[0],je=fe[1],ve=(0,n.useRef)(!1);(0,n.useEffect)(()=>{t?(q(c||""),V(d||null),Z(!1)):(w(0),q(""),Y(null),V(null),Z(!1),te(null),ne({}),ce(new Set),ue(!1),be(""),je(null),ve.current=!1)},[t,c,d]),(0,n.useEffect)(()=>{if(!t||!i)return;let e=!1;return(async()=>{try{var t;const s=(0,A.httpsCallable)((0,A.getFunctions)(),"getAllIntegrationStatuses"),r=await s({organizationId:i});if(e)return;const n=r.data||{};if(je(n),!0===(null===(t=n.sopEnhancement)||void 0===t?void 0:t.enabled))return;if(ve.current)return;ve.current=!0;const o=await(0,k.S)(i,"sopEnhancement");if(e)return;o.ok?(je(e=>(0,a.A)((0,a.A)({},e),{},{sopEnhancement:{enabled:!0}})),window.dispatchEvent(new Event("organizationChanged"))):ve.current=!1}catch(s){}})(),()=>{e=!0}},[t,i]);const Ne=(0,n.useMemo)(()=>ee?(0,N.II)(ee):[],[ee]),ke=(0,n.useMemo)(()=>ee?(0,N.tg)(ee,re):{integrationIds:[],showStripeCta:!1,showWebsiteChatbotCta:!1},[ee,re]);(0,n.useEffect)(()=>{ce(new Set(ke.integrationIds))},[ke.integrationIds]);const Ae=(0,n.useCallback)(e=>{ne(t=>(0,a.A)((0,a.A)({},t),{},{[e]:!t[e]}))},[]),Ce=(0,n.useCallback)(e=>{ce(t=>{const s=new Set(t);return s.has(e)?s.delete(e):s.add(e),s})},[]),Se=(0,n.useCallback)(async()=>{if(i)try{const e=(0,S.doc)(z.db,"organizations",i),t={},s=K?"":M.trim();if(t.name=s,H){be("Uploading logo\u2026");const e=(0,I.KR)(z.IG,"organizations/".concat(i,"/logo"));await(0,I.D)(e,H);const s=await(0,I.qk)(e);t["settings.branding.logoUrl"]=s}t.updatedAt=new Date,await(0,S.mZ)(e,t),window.dispatchEvent(new Event("organizationChanged"))}catch(e){console.error("Failed to save org profile during onboarding:",e),E.Ay.error("Could not save organization profile. You can update it later in Settings.")}},[i,M,K,H]),Ie=(0,n.useCallback)(async()=>{if(!i)return void E.Ay.error("No organization found. Please try again.");ue(!0),await Se();const e=[...ie].filter(e=>"stripe"!==e&&(!we||!(0,C.Jm)(we,e)));let t=0,a=0;for(const s of e){be("Enabling ".concat(N.Hr[s]||s,"\u2026"));const e=await(0,k.S)(i,s);e.ok?t++:(a++,console.error("Onboarding enable failed:",s,e.errorMessage))}a>0&&E.Ay.error("".concat(a," integration").concat(a>1?"s":""," could not be enabled. You can turn them on from Settings \u2192 Integrations.")),t>0&&(E.Ay.success("".concat(t," integration").concat(t>1?"s":""," enabled!")),window.dispatchEvent(new Event("organizationChanged"))),ue(!1),s({workType:ee,answers:re,enabledIds:e.filter((e,s)=>s<t+a),wantsStripe:!!re.stripe,wantsChatbot:!!re.chatbot})},[i,ie,we,ee,re,s,Se]),ze=1!==f||!!ee,Ee=(0,n.useCallback)(()=>{w(e=>Math.min(e+1,T.length-1))},[]),Le=(0,n.useCallback)(()=>{w(e=>Math.max(e-1,0))},[]);if(!t)return null;const Me=T[f];return(0,o.createPortal)((0,L.jsx)("div",{className:"fixed inset-0 z-[10001] flex items-center justify-center bg-black/40 backdrop-blur-[2px]",onMouseDown:e=>{e.target!==e.currentTarget||ge||l()},children:(0,L.jsxs)("div",{className:"relative w-full max-w-lg mx-4 bg-white rounded-2xl shadow-2xl overflow-hidden",onMouseDown:e=>e.stopPropagation(),children:[(0,L.jsxs)("div",{className:"flex items-center justify-between px-6 pt-5 pb-3",children:[(0,L.jsxs)("div",{className:"flex items-center gap-2",children:[(0,L.jsx)(g.A,{className:"w-5 h-5 text-blue-500"}),(0,L.jsx)("h2",{className:"text-base font-semibold text-gray-900",children:"org

2-profile"===Me?"Welcome to Based":"Set up your workspace"})]}),(0,L.jsx)("button",{type:"button",onClick:l,disabled:ge,className:"p-1.5 rounded-lg text-gray-400 hover:text-gray-600 hover:bg-gray-100 transition-colors disabled:opacity-50","aria-label":"Skip setup",children:(0,L.jsx)(u.A,{className:"w-4 h-4"})})]}),(0,L.jsx)("div",{className:"px-6 pb-4",children:(0,L.jsx)("div",{className:"flex gap-1.5",children:T.map((e,t)=>(0,L.jsx)("div",{className:"h-1 flex-1 rounded-full transition-colors duration-300 ".concat(t<=f?"bg-blue-500":"bg-gray-100")},t))})}),(0,L.jsxs)("div",{className:"px-6 pb-2 min-h-[280px] max-h-[60vh] overflow-y-auto ".concat("review"===Me&&ge?"flex flex-col":""),children:["org-profile"===Me&&(0,L.jsx)(F,{orgName:M,onNameChange:q,orgLogoPreview:B,onLogoSelect:(e,t)=>{Y(e),V(t)},orgLogoOnly:K,onLogoOnlyChange:Z}),"work-type"===Me&&(0,L.jsx)(O,{workType:ee,onSelect:te}),"follow-up"===Me&&(0,L.jsx)(P,{questions:Ne,answers:re,onToggle:Ae}),"extras"===Me&&(0,L.jsx)(W,{answers:re,onToggle:Ae}),"review"===Me&&(0,L.jsx)(D,{checkedIds:ie,onToggle:Ce,wantsStripe:!!re.stripe,wantsChatbot:!!re.chatbot,applying:ge,applyProgress:pe})]}),(0,L.jsxs)("div",{className:"flex items-center justify-between px-6 py-4 border-t border-gray-100 bg-gray-50/50",children:[(0,L.jsx)("div",{children:f>0&&!ge&&(0,L.jsxs)("button",{type:"button",onClick:Le,className:"inline-flex items-center gap-1 text-sm text-gray-500 hover:text-gray-700 transition-colors",children:[(0,L.jsx)(h.A,{className:"w-4 h-4"}),"Back"]})}),(0,L.jsxs)("div",{className:"flex items-center gap-3",children:["review"!==Me&&(0,L.jsx)("button",{type:"button",onClick:l,disabled:ge,className:"text-sm text-gray-400 hover:text-gray-600 transition-colors",children:"Skip for now"}),"review"===Me?(0,L.jsx)("button",{type:"button",onClick:Ie,disabled:ge,className:"inline-flex items-center gap-2 px-5 py-2 text-sm font-medium text-white bg-blue-500 rounded-lg hover:bg-blue-600 disabled:opacity-50 transition-colors",children:ge?(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(m.A,{className:"w-4 h-4 animate-spin"}),"Setting up\u2026"]}):(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(p.A,{className:"w-4 h-4"}),"Apply & get started"]})}):(0,L.jsxs)("button",{type:"button",onClick:Ee,disabled:!ze,className:"inline-flex items-center gap-1.5 px-5 py-2 text-sm font-medium text-white bg-blue-500 rounded-lg hover:bg-blue-600 disabled:opacity-50 transition-colors",children:["Continue",(0,L.jsx)(b.A,{className:"w-4 h-4"})]})]})]})]})}),document.body)}function F(e){let t=e.orgName,s=e.onNameChange,a=e.orgLogoPreview,r=e.onLogoSelect,o=e.orgLogoOnly,l=e.onLogoOnlyChange;const i=(0,n.useRef)(null),c=!!a;return(0,L.jsxs)("div",{className:"space-y-5",children:[(0,L.jsx)("p",{className:"text-sm text-gray-600",children:"Let's set up your organization. This is how your brand appears on shared documents, knowledge bases, and invoices."}),(0,L.jsxs)("div",{className:"flex flex-col items-center gap-3",children:[(0,L.jsx)("button",{type:"button",onClick:()=>{var e;return null===(e=i.current)||void 0===e?void 0:e.click()},className:"group relative w-20 h-20 rounded-2xl border-2 border-dashed border-gray-200 hover:border-blue-400 transition-colors flex items-center justify-center overflow-hidden bg-gray-50",children:a?(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)("img",{src:a,alt:"Logo",className:"w-full h-full object-cover"}),(0,L.jsx)("div",{className:"absolute inset-0 bg-black/40 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center",children:(0,L.jsx)(y.A,{className:"w-5 h-5 text-white"})})]}):(0,L.jsxs)("div",{className:"flex flex-col items-center gap-1 text-gray-400 group-hover:text-blue-500 transition-colors",children:[(0,L.jsx)(y.A,{className:"w-6 h-6"}),(0,L.jsx)("span",{className:"text-[10px] font-medium",children:"Add logo"})]})}),(0,L.jsx)("input",{ref:i,type:"file",accept:"image/*",onChange:e=>{var t;const s=null===(t=e.target.files)||void 0===t?void 0:t[0];if(!s)return;const a=new FileReader;a.onloadend=()=>r(s,a.result),a.readAsDataURL(s)},className:"hidden"}),(0,L.jsx)("p",{className:"text-xs text-gray-400",children:"Square image works best"})]}),(0,L.jsxs)("div",{className:"space-y-2",children:[(0,L.jsx)("label",{htmlFor:"onboarding-org-name",className:"block text-sm font-medium text-gray-700",children:(0,L.jsxs)("div",{className:"flex items-center gap-2",children:[(0,L.jsx)(f.A,{className:"w-4 h-4 text-gray-400"}),"Organization name"]})}),(0,L.jsx)("input",{id:"onboarding-org-name",type:"text",value:o?"":t,onChange:e=>s(e.target.value),disabled:o,placeholder:"e.g. Acme Corp",className:"w-full px-4 py-2.5 rounded-xl border border-gray-200 text-sm text-gray-900 placeholder:text-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500/30 focus:border-blue-400 transition-all disabled:bg-gray-50 disabled:text-gray-400"}),c&&(0,L.jsxs)("label",{className:"flex items-center gap-2 cursor-pointer mt-1",children:[(0,L.jsx)("input",{type:"checkbox",checked:o,onChange:e=>l(e.target.checked),className:"rounded border-gray-300 text-blue-600 focus:ring-blue-500"}),(0,L.jsx)("span",{className:"text-xs text-gray-500",children:"My logo already includes the name \u2014 skip the text"})]})]})]})}function O(e){let t=e.workType,s=e.onSelect;return(0,L.jsxs)("div",{className:"space-y-3",children:[(0,L.jsx)("p",{className:"text-sm text-gray-600",children:"What kind of work do you do? We'll suggest the right integrations for you."}),(0,L.jsx)("div",{className:"space-y-2",children:N.AQ.map(e=>{const a=M[e.id]||x.A,r=t===e.id;return(0,L.jsxs)("button",{type:"button",onClick:()=>s(e.id),className:"w-full flex items-center gap-3 px-4 py-3 rounded-xl text-left text-sm font-medium transition-all border ".concat(r?"border-blue-500 bg-blue-50/70 text-blue-700 ring-1 ring-blue-500/30":"border-gray-100 bg-white text-gray-700 hover:border-gray-200 hover:bg-gray-50"),children:[(0,L.jsx)("div",{className:"p-2 rounded-lg ".concat(r?"bg-blue-100":"bg-gray-100"),children:(0,L.jsx)(a,{className:"w-4 h-4 ".concat(r?"text-blue-600":"text-gray-500")})}),e.label,r&&(0,L.jsx)(w.A,{className:"w-4 h-4 ml-auto text-blue-500"})]},e.id)})})]})}function P(e){let t=e.questions,s=e.answers,a=e.onToggle;return(0,L.jsxs)("div",{className:"space-y-3",children:[(0,L.jsx)("p",{className:"text-sm text-gray-600",children:"A few quick questions to fine-tune your setup."}),(0,L.jsx)("div",{className:"space-y-2",children:t.map(e=>{const t=!!s[e.id];return(0,L.jsxs)("button",{type:"button",onClick:()=>a(e.id),className:"w-full flex items-center gap-3 px-4 py-3 rounded-xl text-left text-sm transition-all border ".concat(t?"border-blue-500 bg-blue-50/70 text-blue-700 ring-1 ring-blue-500/30":"border-gray-100 bg-white text-gray-700 hover:border-gray-200 hover:bg-gray-50"),children:[(0,L.jsx)("div",{className:"flex-shrink-0 w-5 h-5 rounded border-2 flex items-center justify-center transition-colors ".concat(t?"bg-blue-500 border-blue-500":"border-gray-300"),children:t&&(0,L.jsx)(w.A,{className:"w-3 h-3 text-white"})}),(0,L.jsx)("span",{className:"flex-1",children:e.text})]},e.id)})})]})}function W(e){let t=e.answers,s=e.onToggle;return(0,L.jsxs)("div",{className:"space-y-4",children:[(0,L.jsx)("p",{className:"text-sm text-gray-600",children:"A couple of extras that need a bit more setup after onboarding."}),(0,L.jsxs)("div",{className:"flex items-start gap-3 px-4 py-3.5 rounded-xl border cursor-pointer transition-all ".concat(t.stripe?"border-blue-500 bg-blue-50/70 ring-1 ring-blue-500/30":"border-gray-100 bg-white hover:border-gray-200 hover:bg-gray-50"),onClick:()=>s("stripe"),children:[(0,L.jsx)("div",{className:"flex-shrink-0 mt-0.5 w-

25 h-5 rounded border-2 flex items-center justify-center transition-colors ".concat(t.stripe?"bg-blue-500 border-blue-500":"border-gray-300"),children:t.stripe&&(0,L.jsx)(w.A,{className:"w-3 h-3 text-white"})}),(0,L.jsxs)("div",{className:"flex-1",children:[(0,L.jsxs)("div",{className:"flex items-center gap-2",children:[(0,L.jsx)(j.A,{className:"w-4 h-4 text-gray-500"}),(0,L.jsx)("span",{className:"text-sm font-medium text-gray-900",children:"Invoice or take payments"})]}),(0,L.jsx)("p",{className:"text-xs text-gray-500 mt-1",children:"Connect Stripe to generate invoices from time entries and accept payments. You'll finish setup in Settings \u2192 Integrations."})]})]}),(0,L.jsxs)("div",{className:"flex items-start gap-3 px-4 py-3.5 rounded-xl border cursor-pointer transition-all ".concat(t.chatbot?"border-blue-500 bg-blue-50/70 ring-1 ring-blue-500/30":"border-gray-100 bg-white hover:border-gray-200 hover:bg-gray-50"),onClick:()=>s("chatbot"),children:[(0,L.jsx)("div",{className:"flex-shrink-0 mt-0.5 w-5 h-5 rounded border-2 flex items-center justify-center transition-colors ".concat(t.chatbot?"bg-blue-500 border-blue-500":"border-gray-300"),children:t.chatbot&&(0,L.jsx)(w.A,{className:"w-3 h-3 text-white"})}),(0,L.jsxs)("div",{className:"flex-1",children:[(0,L.jsxs)("div",{className:"flex items-center gap-2",children:[(0,L.jsx)(v.A,{className:"w-4 h-4 text-gray-500"}),(0,L.jsx)("span",{className:"text-sm font-medium text-gray-900",children:"AI chatbot on my website"})]}),(0,L.jsx)("p",{className:"text-xs text-gray-500 mt-1",children:"Add an AI assistant widget to your website that answers questions using your knowledge base. We'll show you how after setup."})]})]})]})}function D(e){let t=e.checkedIds,s=e.onToggle,a=e.wantsStripe,r=e.wantsChatbot,n=e.applying,o=e.applyProgress;const l=[...t];return(0,L.jsx)("div",{className:n?"flex flex-1 flex-col items-center justify-center gap-4 py-6":"space-y-4",children:n?(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(m.A,{className:"w-8 h-8 text-blue-500 animate-spin shrink-0"}),(0,L.jsx)("p",{className:"text-sm text-gray-600 text-center",children:o||"Setting things up\u2026"})]}):(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)("p",{className:"text-sm text-gray-600",children:"Here's what we'll turn on. Uncheck anything you'd rather skip."}),0===l.length?(0,L.jsx)("p",{className:"text-sm text-gray-400 italic py-4",children:"No integrations selected. You can always enable them later from Settings \u2192 Integrations."}):(0,L.jsx)("div",{className:"space-y-1.5",children:l.map(e=>(0,L.jsxs)("label",{className:"flex items-start gap-3 px-3 py-2.5 rounded-lg hover:bg-gray-50 cursor-pointer transition-colors",children:[(0,L.jsx)("input",{type:"checkbox",checked:!0,onChange:()=>s(e),className:"mt-0.5 rounded border-gray-300 text-blue-600 focus:ring-blue-500"}),(0,L.jsxs)("div",{className:"flex-1 min-w-0",children:[(0,L.jsx)("span",{className:"text-sm font-medium text-gray-900",children:N.Hr[e]||e}),N.hQ[e]&&(0,L.jsx)("p",{className:"text-xs text-gray-500 mt-0.5",children:N.hQ[e]})]})]},e))}),(a||r)&&(0,L.jsxs)("div",{className:"pt-2 border-t border-gray-100 space-y-2",children:[(0,L.jsx)("p",{className:"text-xs font-medium text-gray-500 uppercase tracking-wide",children:"After setup"}),a&&(0,L.jsxs)("div",{className:"flex items-center gap-2 text-sm text-gray-600",children:[(0,L.jsx)(j.A,{className:"w-4 h-4 text-gray-400"}),(0,L.jsx)("span",{children:"We'll guide you to connect Stripe"})]}),r&&(0,L.jsxs)("div",{className:"flex items-center gap-2 text-sm text-gray-600",children:[(0,L.jsx)(v.A,{className:"w-4 h-4 text-gray-400"}),(0,L.jsx)("span",{children:"We'll show you how to add the AI chatbot to your website"})]})]})]})})}},13190(e,t,s){s.d(t,{A:()=>a});const a=(0,s(77784).A)("briefcase",[["path",{d:"M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16",key:"jecpp"}],["rect",{width:"20",height:"14",x:"2",y:"6",rx:"2",key:"i6l2r4"}]])},247(e,t,s){s.d(t,{A:()=>a});const a=(0,s(77784).A)("camera",[["path",{d:"M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z",key:"1tc9qg"}],["circle",{cx:"12",cy:"13",r:"3",key:"1vg3eu"}]])},9463(e,t,s){s.d(t,{A:()=>a});const a=(0,s(77784).A)("chevron-left",[["path",{d:"m15 18-6-6 6-6",key:"1wnfg3"}]])},20073(e,t,s){s.d(t,{A:()=>a});const a=(0,s(77784).A)("zap",[["path",{d:"M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z",key:"1xq2db"}]])}}]);
3//# sourceMappingURL=4236.3a4f54ab.chunk.js.map