1import{g as I,e as R,r as a,j as e}from"./main-BH7B0TpM.js";import{u as A}from"./useAppBridge-Bj34gXAL.js";function P(){const{shop:j,credits:t}=I.useLoaderData(),f=A(),x=R(),b=a.useRef(void 0),m=a.useRef(void 0),[i,o]=a.useState({banner:t===0,setupGuide:!0,calloutCard:!0}),[c,y]=a.useState(!0),[r,k]=a.useState("step1"),[p,v]=a.useState({}),n=async()=>{try{const s=await f.resourcePicker({type:"product",multiple:!1,action:"select"});s&&s[0]&&x.navigate({to:"/shopify/generate",search:{productId:s[0].id}})}catch(s){console.error("Error selecting product:",s)}},C=()=>{x.navigate({to:"/shopify/credits"})};a.useEffect(()=>{const s=b.current,l=m.current;return s&&s.addEventListener("click",n),l&&l.addEventListener("click",h=>{h.preventDefault(),C()}),()=>{s&&s.removeEventListener("click",n)}},[t]);const u=s=>{k(r===s?null:s)},g=(s,l)=>{v(h=>({...h,[s]:l}))},d=[{id:"step1",label:"Purchase credits",isComplete:t>0||p.step1||!1},{id:"step2",label:"Select a product to enhance",isComplete:p.step2||!1},{id:"step3",label:"Generate and upload AI images",isComplete:p.step3||!1}],S=d.filter(s=>s.isComplete).length;return e.jsxs("s-page",{heading:"Dashboard",children:[e.jsx("s-button",{ref:b,slot:"primary-action",variant:"primary",disabled:t<=0,children:"Select Product"}),e.jsx("s-button",{ref:m,slot:"secondary-actions",children:"Manage Credits"}),i.banner&&t===0&&e.jsxs("s-banner",{dismissible:!0,tone:"warning",onDismiss:()=>o({...i,banner:!1}),children:["You need credits to generate AI-powered product images."," ",e.jsx("s-link",{href:"/shopify/credits",children:"Purchase credits"})," to get started."]}),i.setupGuide&&e.jsx("s-section",{children:e.jsxs("s-grid",{gap:"small",children:[e.jsxs("s-grid",{gap:"small-200",children:[e.jsxs("s-grid",{gridTemplateColumns:"1fr auto auto",gap:"small-300",alignItems:"center",children:[e.jsx("s-heading",{children:"Setup Guide"}),e.jsx("s-button",{accessibilityLabel:"Dismiss Guide",onClick:()=>o({...i,setupGuide:!1}),variant:"tertiary",tone:"neutral",icon:"x"}),e.jsx("s-button",{accessibilityLabel:"Toggle setup guide",onClick:()=>y(!c),variant:"tertiary",tone:"neutral",icon:c?"chevron-up":"chevron-down"})]}),e.jsx("s-paragraph",{children:"Use this personalized guide to get your app set up and start generating AI images."}),e.jsxs("s-paragraph",{color:"subdued",children:[S," out of ",d.length," steps completed"]})]}),c&&e.jsxs("s-box",{borderRadius:"base",border:"base",background:"base",children:[e.jsxs("s-box",{children:[e.jsxs("s-grid",{gridTemplateColumns:"1fr auto",gap:"base",padding:"small",children:[e.jsx("s-checkbox",{label:"Purchase credits",checked:d[0]?.isComplete||!1,onInput:s=>g("step1",s.currentTarget.checked)}),e.jsx("s-button",{onClick:()=>u("step1"),accessibilityLabel:"Toggle step 1 details",variant:"tertiary",icon:r==="step1"?"chevron-up":"chevron-down"})]}),r==="step1"&&e.jsx("s-box",{padding:"small",paddingBlockStart:"none",children:e.jsx("s-box",{padding:"base",background:"subdued",borderRadius:"base",children:e.jsxs("s-grid",{gap:"small-200",children:[e.jsx("s-paragraph",{children:"Purchase credit packs to generate AI images for your products. Credits never expire and each image costs 1-4 credits depending on the AI model."}),e.jsxs("s-stack",{direction:"inline",gap:"small-200",children:[e.jsx("s-button",{variant:"primary",href:"/shopify/credits",children:"Purchase Credits"}),e.jsx("s-button",{variant:"tertiary",tone:"neutral",href:"/shopify/credits",children:"View Pricing"})]})]})})})]}),e.jsx("s-divider",{}),e.jsxs("s-box",{children:[e.jsxs("s-grid",{gridTemplateColumns:"1fr auto",gap:"base",padding:"small",children:[e.jsx("s-checkbox",{label:"Select a product to enhance",checked:d[1]?.isComplete||!1,onInput:s=>g("step2",s.currentTarget.checked)}),e.jsx("s-button",{onClick:()=>u("step2"),accessibilityLabel:"Toggle step 2 details",variant:"tertiary",icon:r==="step2"?"chevron-up":"chevron-down"})]}),r==="step2"&&e.jsx("s-box",{padding:"small",paddingBlockStart:"none",children:e.jsx("s-box",{padding:"base",background:"subdued",borderRadius:"base",children:e.jsxs("s-grid",{gap:"small-200",children:[e.jsx("s-paragraph",{children:"Choose a product from your catalog to enhance with AI-generated images. You can select any product and generate multiple variations."}),e.jsxs("s-stack",{direction:"inline",gap:"small-200",children:[e.jsx("s-button",{variant:"primary",onClick:n,children:"Select Product"}),e.jsx("s-button",{variant:"tertiary",tone:"neutral",href:"shopify://admin/products",children:"Manage Products"})]})]})})})]}),e.jsx("s-divider",{}),e.jsxs("s-box",{children:[e.jsxs("s-grid",{gridTemplateColumns:"1fr auto",gap:"base",padding:"small",children:[e.jsx("s-checkbox",{label:"Generate and upload AI images",checked:d[2]?.isComplete||!1,onInput:s=>g("step3",s.currentTarget.checked)}),e.jsx("s-button",{onClick:()=>u("step3"),accessibilityLabel:"Toggle step 3 details",variant:"tertiary",icon:r==="step3"?"chevron-up":"chevron-down"})]}
1),r==="step3"&&e.jsx("s-box",{padding:"small",paddingBlockStart:"none",children:e.jsx("s-box",{padding:"base",background:"subdued",borderRadius:"base",children:e.jsxs("s-grid",{gap:"small-200",children:[e.jsx("s-paragraph",{children:"Choose a style preset, select image count and aspect ratio, then generate. Upload your favorite results directly to your product."}),e.jsx("s-stack",{direction:"inline",gap:"small-200",children:e.jsx("s-button",{variant:"primary",onClick:n,children:"Start Generating"})})]})})})]})]})]})}),e.jsx("s-section",{padding:"base",children:e.jsxs("s-grid",{gridTemplateColumns:"@container (inline-size <= 400px) 1fr, 1fr auto 1fr auto 1fr",gap:"small",children:[e.jsx("s-box",{paddingBlock:"small-400",paddingInline:"small-100",borderRadius:"base",children:e.jsxs("s-grid",{gap:"small-300",children:[e.jsx("s-text",{color:"subdued",children:"Credits Available"}),e.jsxs("s-stack",{direction:"inline",gap:"small-200",alignItems:"center",children:[e.jsx("s-heading",{children:t.toLocaleString()}),t===0&&e.jsx("s-badge",{tone:"critical",children:"Empty"}),t>0&&t<10&&e.jsx("s-badge",{tone:"warning",children:"Low"}),t>=10&&e.jsx("s-badge",{tone:"success",children:"Active"})]})]})}),e.jsx("s-divider",{direction:"block"}),e.jsx("s-box",{paddingBlock:"small-400",paddingInline:"small-100",borderRadius:"base",children:e.jsxs("s-grid",{gap:"small-300",children:[e.jsx("s-text",{color:"subdued",children:"Store"}),e.jsx("s-heading",{children:j})]})}),e.jsx("s-divider",{direction:"block"}),e.jsx("s-box",{paddingBlock:"small-400",paddingInline:"small-100",borderRadius:"base",children:e.jsxs("s-grid",{gap:"small-300",children:[e.jsx("s-text",{color:"subdued",children:"Status"}),e.jsx("s-badge",{tone:"success",children:"Connected"})]})})]})}),i.calloutCard&&t>0&&e.jsx("s-section",{children:e.jsxs("s-grid",{gridTemplateColumns:"1fr auto",gap:"small-400",alignItems:"start",children:[e.jsxs("s-grid",{gap:"small-200",children:[e.jsx("s-heading",{children:"Ready to create AI-powered product images?"}),e.jsx("s-paragraph",{children:"Select a product from your catalog and choose from multiple style presets to generate professional images."}),e.jsxs("s-stack",{direction:"inline",gap:"small-200",children:[e.jsx("s-button",{variant:"primary",onClick:n,children:"Select Product"}),e.jsx("s-button",{tone:"neutral",variant:"tertiary",href:"/shopify/credits",children:"View Pricing"})]})]}),e.jsx("s-button",{onClick:()=>o({...i,calloutCard:!1}),icon:"x",tone:"neutral",variant:"tertiary",accessibilityLabel:"Dismiss card"})]})}),e.jsx("s-section",{accessibilityLabel:"Help and support",children:e.jsx("s-box",{padding:"none",children:e.jsxs("s-text",{children:["Need help getting started?"," ",e.jsx("s-link",{href:"mailto:[email protected]",children:"Contact Support"})]})})})]})}export{P as component};
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.