UNPKG

@baseplate-dev/project-builder-web

Version:

Web interface for constructing project builder JSON

3 lines (2 loc) 8.81 kB
import{i as l}from"./_virtual___federation_fn_import-DOo8C-zl.js";import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{v as D,b as W,C as U,y as A,z as P}from"./index-DiAhmW9l.js";import{u as _}from"./use-model-form-CMNCrezb.js";import{e as w,f as z,i as B}from"./index.esm-DImnoN58.js";import{S as H}from"./-constants-CfroQnV_.js";import{B as L}from"./badge-with-type-label-BSTlOdJB.js";import{c as k,A as V,H as K,Q as q}from"./index-G5ZRloOW.js";const{ModelTransformerUtils:G}=await l("@baseplate-dev/project-builder-lib"),{modelTransformerWebSpec:Q,useProjectDefinition:Y}=await l("@baseplate-dev/project-builder-lib/web"),{Label:N,SectionListSection:J,SectionListSectionContent:X,SectionListSectionDescription:Z,SectionListSectionHeader:ee,SectionListSectionTitle:te,SwitchField:v}=await l("@baseplate-dev/ui-components");function se({className:u,control:s,setValue:r}){const d=D(t=>t.model.fields),i=w({control:s,name:"service.create"}),m=w({control:s,name:"service.update"}),p=i?.enabled,n=m?.enabled,h=w({control:s,name:"service.transformers"})??[],{definitionContainer:o,pluginContainer:j}=Y();if(!p&&!n)return null;const a=i?.fields??[],b=m?.fields??[],S=i?.transformerNames??[],c=m?.transformerNames??[],g="w-full border-collapse text-left [&_td]:py-1 [&_th]:sticky [&_th]:top-0 [&_th]:bg-background [&_th]:z-10 [&_th]:py-2",C=j.use(Q);return e.jsxs(J,{className:u,children:[e.jsxs(ee,{children:[e.jsx(te,{children:"Create / Update Fields"}),e.jsx(Z,{children:"Configure the fields that can be created or updated by the service method"})]}),e.jsx(X,{className:"max-w-xl space-y-4",children:e.jsxs("table",{className:g,children:[e.jsx("thead",{children:e.jsxs("tr",{children:[e.jsx("th",{className:"w-full",children:e.jsx(N,{children:"Fields"})}),p&&e.jsx("th",{className:"pl-8",children:"Create"}),n&&e.jsx("th",{className:"pl-8",children:"Update"})]})}),e.jsxs("tbody",{children:[d.map(t=>e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx(L,{type:t.type==="enum"&&t.options?.enumRef?o.nameFromId(t.options.enumRef):H[t.type].label,children:t.name})}),p&&e.jsx("td",{className:"pl-8",children:e.jsx(v,{value:a.includes(t.id),onChange:f=>{r("service.create.fields",f?[...a,t.id]:a.filter(x=>x!==t.id),{shouldDirty:!0})}})}),n&&e.jsx("td",{className:"pl-8",children:e.jsx(v,{value:b.includes(t.id),onChange:f=>{r("service.update.fields",f?[...b,t.id]:b.filter(x=>x!==t.id),{shouldDirty:!0})}})})]},t.id)),h.length>0&&e.jsx("tr",{children:e.jsx("th",{children:e.jsx(N,{children:"Transformers"})})}),h.map(t=>e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx(L,{type:C.getWebConfigOrThrow(t.type).label,children:G.getTransformerName(o,t,j)})}),p&&e.jsx("td",{className:"pl-8",children:e.jsx(v,{value:S.includes(t.id),onChange:f=>{r("service.create.transformerNames",f?[...S,t.id]:S.filter(x=>x!==t.id),{shouldDirty:!0})}})}),n&&e.jsx("td",{className:"pl-8",children:e.jsx(v,{value:c.includes(t.id),onChange:f=>{r("service.update.transformerNames",f?[...c,t.id]:c.filter(x=>x!==t.id),{shouldDirty:!0})}})})]},t.id))]})]})})]})}const{createTransformerSchema:ne,modelTransformerEntityType:ie}=await l("@baseplate-dev/project-builder-lib"),{useDefinitionSchema:re}=await l("@baseplate-dev/project-builder-lib/web"),{Button:M,DialogClose:oe,DialogFooter:ae}=await l("@baseplate-dev/ui-components"),{useId:ce,useMemo:le}=await l("react"),{z:de}=await l("zod");function me({className:u,webConfig:{Form:s,pluginKey:r},transformer:d,onUpdate:i,isCreate:m}){const p=D(c=>c),n=re(ne),h=le(()=>de.object({transformer:n}),[n]),o=z({resolver:W(h),defaultValues:{transformer:d}}),{handleSubmit:j,formState:{isDirty:a}}=o,b=j(c=>{i({...c.transformer,id:c.transformer.id?c.transformer.id:ie.generateNewId()})}),S=ce();return s?e.jsxs("form",{className:k("space-y-4",u),id:S,onSubmit:c=>(c.stopPropagation(),b(c)),children:[e.jsx(s,{formProps:o,name:"transformer",originalModel:p,pluginKey:r}),e.jsxs(ae,{children:[e.jsx(oe,{asChild:!0,children:e.jsx(M,{variant:"secondary",children:"Cancel"})}),e.jsx(M,{type:"submit",disabled:!m&&!a,form:S,children:"Save"})]})]}):null}const{Dialog:pe,DialogContent:he,DialogDescription:ue,DialogHeader:fe,DialogTitle:xe,DialogTrigger:je,useControlledState:be}=await l("@baseplate-dev/ui-components");function $({children:u,transformer:s,asChild:r,webConfig:d,open:i,onOpenChange:m,onUpdate:p,isCreate:n}){const[h,o]=be(i,m,!1);return e.jsxs(pe,{open:h,onOpenChange:o,children:[u&&e.jsx(je,{asChild:r,children:u}),e.jsxs(he,{children:[e.jsxs(fe,{children:[e.jsxs(xe,{children:[n?"Create":"Edit"," ",d?.label," Transformer"]}),e.jsx(ue,{children:d?.instructions??"Manage the transformer for the service"})]}),d&&e.jsx(me,{transformer:s,onUpdate:j=>{o(!1),p(j)},webConfig:d,isCreate:n})]})]})}const{modelTransformerWebSpec:R,useProjectDefinition:I}=await l("@baseplate-dev/project-builder-lib/web"),{Button:y,DropdownMenu:Se,DropdownMenuContent:ge,DropdownMenuGroup:ve,DropdownMenuItem:we,DropdownMenuTrigger:Ce,RecordView:Te,RecordViewActions:ye,RecordViewItem:E,RecordViewItemList:De,SectionListSection:Le,SectionListSectionContent:Ne,SectionListSectionDescription:Me,SectionListSectionHeader:Ee,SectionListSectionTitle:Fe,useConfirmDialog:$e}=await l("@baseplate-dev/ui-components"),{useState:F}=await l("react");function Re({formProps:u,idx:s,onRemove:r,onUpdate:d}){const{pluginContainer:i,definitionContainer:m}=I(),{control:p}=u,n=w({control:p,name:`service.transformers.${s}`}),o=i.use(R).getWebConfigOrThrow(n.type),j=o.getSummary(n,m);return e.jsxs(Te,{children:[e.jsxs(De,{children:[e.jsx(E,{title:"Type",children:o.label}),j.map(a=>e.jsx(E,{title:a.label,children:a.description},a.label))]}),e.jsxs(ye,{children:[o.Form&&e.jsx($,{webConfig:o,transformer:n,onUpdate:a=>{d(a,s)},asChild:!0,isCreate:!1,children:e.jsx(y,{variant:"ghost",size:"icon",title:"Edit",children:e.jsx(K,{})})}),e.jsx(y,{variant:"ghost",size:"icon",onClick:()=>{r(s)},title:"Remove",className:"text-destructive hover:text-destructive-hover",children:e.jsx(q,{})})]})]})}function Ie({className:u,formProps:s}){const{control:r}=s,{fields:d,remove:i,append:m,update:p}=B({control:r,name:"service.transformers"}),{pluginContainer:n,definitionContainer:h}=I(),{requestConfirm:o}=$e(),j=n.use(R),a=D(t=>t),b=j.getWebConfigs().filter(t=>t.allowNewTransformer?t.allowNewTransformer(h,a):!0),[S,c]=F(!1),[g,C]=F(0);return e.jsxs(Le,{className:u,children:[e.jsxs(Ee,{children:[e.jsx(Fe,{children:"Transformers"}),e.jsx(Me,{children:"Transformers are used to operate on the data from the client into the shape that the database ORM expects."})]}),e.jsxs(Ne,{className:"max-w-xl space-y-4",children:[d.map((t,f)=>e.jsx(Re,{formProps:s,idx:f,onUpdate:(x,O)=>{p(O,x)},onRemove:x=>{o({title:"Confirm delete",content:"Are you sure you want to delete this transformer?",buttonConfirmText:"Delete",buttonConfirmVariant:"destructive",onConfirm:()=>{i(x)}})}},t.id)),b.length>0&&e.jsxs(Se,{children:[e.jsx(Ce,{asChild:!0,children:e.jsxs(y,{variant:"secondary",size:"sm",children:[e.jsx(V,{}),"Add Transformer"]})}),e.jsx(ge,{children:e.jsx(ve,{children:b.map((t,f)=>e.jsx(we,{onSelect:()=>{t.Form?(C(f),c(!0)):m(t.getNewTransformer(h,a))},children:e.jsxs("div",{className:"flex flex-col gap-1",children:[e.jsx("div",{children:t.label}),e.jsx("div",{className:"text-style-muted",children:t.description})]})},t.name))})})]}),e.jsx($,{webConfig:b[g],transformer:b[g]?.getNewTransformer(h,a),onUpdate:t=>{m(t)},open:S,onOpenChange:c,isCreate:!0})]})]})}const{modelTransformerEntityType:Oe}=await l("@baseplate-dev/project-builder-lib"),{useBlockUnsavedChangesNavigate:We}=await l("@baseplate-dev/project-builder-lib/web"),{FormActionBar:Ue,SectionList:Ae,SectionListSection:Pe,SectionListSectionContent:_e,SectionListSectionDescription:ze,SectionListSectionHeader:Be,SectionListSectionTitle:He,SwitchFieldController:T}=await l("@baseplate-dev/ui-components");P(Oe,"/data/models/edit/{parentKey}");function Xe(){const{key:u}=U.useParams(),{form:s,onSubmit:r,originalModel:d}=_({omit:["name","featureRef"],modelKey:u}),{control:i,watch:m,getValues:p,setValue:n,reset:h}=s;return We({control:i,reset:h,onSubmit:r}),e.jsx(A,{originalModel:d,getValues:p,watch:m,children:e.jsxs("form",{onSubmit:r,className:"w-full max-w-7xl space-y-4 p-4",children:[e.jsxs(Ae,{children:[e.jsxs(Pe,{children:[e.jsxs(Be,{children:[e.jsx(He,{children:"Methods"}),e.jsx(ze,{children:"Enable or disable which service methods will be generated"})]}),e.jsxs(_e,{className:"flex gap-8",children:[e.jsx(T,{label:"Create",name:"service.create.enabled",control:i}),e.jsx(T,{label:"Update",name:"service.update.enabled",control:i}),e.jsx(T,{label:"Delete",name:"service.delete.enabled",control:i})]})]}),e.jsx(se,{control:i,setValue:n}),e.jsx(Ie,{formProps:s})]}),e.jsx(Ue,{form:s})]})})}export{Xe as component}; //# sourceMappingURL=service-CKtjv66r.js.map