UNPKG

@baseplate-dev/project-builder-web

Version:

Web interface for constructing project builder JSON

3 lines (2 loc) 10.6 kB
import{i as a}from"./_virtual___federation_fn_import-C4el_tlG.js";import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{u as y,S as V,E as K}from"./-constants-B0-XNY1n.js";import{u as W}from"./use-model-form-DBAMk4je.js";import{e as m,u as L}from"./index.esm-C5MSuOl4.js";import{D as I,G as P}from"./index--XHV4ygU.js";import{B as w}from"./badge-with-type-label-D1uJTxZ1.js";import{y as Z}from"./index-BsqYBobW.js";const{authConfigSpec:Y}=await a("@baseplate-dev/project-builder-lib"),{useProjectDefinition:J}=await a("@baseplate-dev/project-builder-lib/web"),{Alert:X,AlertDescription:ee,AlertTitle:te,MultiSwitchField:N,SectionListSection:ie,SectionListSectionContent:se,SectionListSectionDescription:ne,SectionListSectionHeader:le,SectionListSectionTitle:ae,SwitchFieldController:R}=await a("@baseplate-dev/ui-components"),{Link:oe}=await a("@tanstack/react-router");function ce({control:t,modelKey:o}){const{definition:d,pluginContainer:l}=J(),i=l.getPluginSpecOptional(Y)?.getAuthRoles(d).map(b=>({label:b.name,value:b.id})),n=m({control:t,name:"graphql.objectType.enabled"}),c=y(b=>b.service??{}),p=m({control:t,name:"graphql.mutations.create.enabled"}),h=c.create?.enabled,j=m({control:t,name:"graphql.mutations.update.enabled"}),g=c.update?.enabled,u=m({control:t,name:"graphql.mutations.delete.enabled"}),x=c.delete?.enabled;return e.jsxs(ie,{children:[e.jsx("div",{children:e.jsxs(le,{className:"sticky top-2",children:[e.jsx(ae,{children:"Mutations"}),e.jsx(ne,{children:"Configure the GraphQL mutations that can be performed on this model."})]})}),e.jsxs(se,{className:"space-y-8",children:[(!h||!g||!x)&&e.jsxs(X,{className:"max-w-md",children:[e.jsx(I,{}),e.jsxs(te,{children:["Service methods disabled (",[!h&&"Create",!g&&"Update",!x&&"Delete"].filter(Boolean).join(", "),")"]}),e.jsx(ee,{children:e.jsxs("div",{children:["Enable the appropriate methods on the"," ",e.jsx(oe,{to:"/data/models/edit/$key/service",params:{key:o},className:"font-semibold",children:"the service tab"})," ","to expose mutations"]})})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(R,{control:t,name:"graphql.mutations.create.enabled",disabled:!n||!h,label:"Create Mutation",description:"Expose the create method in the GraphQL schema, e.g. createUser(input: $input)."}),p&&i&&e.jsx(N.Controller,{control:t,name:"graphql.mutations.create.roles",label:"Allowed Roles",options:i,className:"ml-[52px]"})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(R,{control:t,name:"graphql.mutations.update.enabled",label:"Update Mutation",disabled:!n||!g,description:"Expose the update method in the GraphQL schema, e.g. updateUser(id: $id, input: $input)."}),j&&i&&e.jsx(N.Controller,{control:t,name:"graphql.mutations.update.roles",label:"Allowed Roles",options:i,className:"ml-[52px]"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(R,{control:t,name:"graphql.mutations.delete.enabled",label:"Delete Mutation",disabled:!n||!x,description:"Expose the delete method in the GraphQL schema, e.g. deleteUser(id: $id)."}),u&&i&&e.jsx(N.Controller,{control:t,name:"graphql.mutations.delete.roles",label:"Allowed Roles",options:i,className:"ml-[52px]"})]})]})]})}function E(t){return P({attr:{viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},child:[{tag:"path",attr:{fillRule:"evenodd",d:"M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z",clipRule:"evenodd"},child:[]}]})(t)}function q(t){return P({attr:{viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},child:[{tag:"path",attr:{fillRule:"evenodd",d:"M9.47 6.47a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 1 1-1.06 1.06L10 8.06l-3.72 3.72a.75.75 0 0 1-1.06-1.06l4.25-4.25Z",clipRule:"evenodd"},child:[]}]})(t)}const{ModelUtils:de}=await a("@baseplate-dev/project-builder-lib"),{useProjectDefinition:re}=await a("@baseplate-dev/project-builder-lib/web"),{Badge:$,Button:T,Label:D,SectionListSection:pe,SectionListSectionContent:he,SectionListSectionDescription:me,SectionListSectionHeader:ue,SectionListSectionTitle:xe,Switch:F,SwitchFieldController:je}=await a("@baseplate-dev/ui-components"),{useState:M}=await a("react"),be="border-collapse text-left [&_td]:py-1 [&_th]:sticky [&_th]:top-0 [&_th]:bg-background [&_th]:z-10 [&_th]:py-2";function k(t,o,d,l){return d?t.filter(i=>o.includes(i.id)||i.id===l).map(i=>i.id):o.filter(i=>i!==l)}function ge({control:t}){const{definitionContainer:o,definition:d}=re(),l=y(s=>s.id),i=m({control:t,name:"graphql.objectType.enabled"}),n=y(s=>s.model.fields),{field:{value:c=[],onChange:p}}=L({control:t,name:"graphql.objectType.fields"}),h=n.length>10,[j,g]=M(h),u=y(s=>s.model.relations)??[],{field:{value:x=[],onChange:b}}=L({control:t,name:"graphql.objectType.localRelations"}),A=u.length>4,[S,U]=M(A),f=de.getRelationsToModel(d,l),{field:{value:v=[],onChange:B}}=L({control:t,name:"graphql.objectType.foreignRelations"}),O=f.length>4,[C,_]=M(O);return e.jsxs(pe,{children:[e.jsx("div",{children:e.jsxs(ue,{className:"sticky top-2",children:[e.jsx(xe,{children:"Object Type"}),e.jsx(me,{children:"Configure the object type that will be exposed in the GraphQL schema for this model."})]})}),e.jsxs(he,{className:"space-y-4",children:[e.jsx(je,{control:t,name:"graphql.objectType.enabled",label:"Enable Object Type",description:"Must be enabled for queries, mutations, and any relations to this model"}),e.jsxs("table",{className:be,children:[e.jsx("thead",{children:e.jsxs("tr",{children:[e.jsx("th",{children:e.jsxs("div",{className:"flex w-80 items-center gap-1",children:[e.jsx(D,{children:"Exposed Fields"}),e.jsxs($,{variant:"outline",className:"mr-5 font-medium text-muted-foreground",children:[c.length,"/",n.length," active"]}),h?e.jsx(T,{onClick:()=>{g(!j)},className:"flex items-center gap-4",title:j?"Expand fields":"Collapse fields",type:"button",variant:"ghost",size:"icon",children:j?e.jsx(E,{}):e.jsx(q,{})}):null]})}),e.jsx("th",{className:"pl-8"})]})}),e.jsxs("tbody",{children:[!j&&n.map(s=>e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx(w,{type:s.type==="enum"&&s.options?.enumRef?o.nameFromId(s.options.enumRef):V[s.type].label,children:s.name})}),e.jsx("td",{className:"pl-8",children:e.jsx(F,{"aria-label":`Expose ${s.name} field`,disabled:!i,checked:c.includes(s.id),onCheckedChange:r=>{p(k(n,c,r,s.id))}})})]},s.id)),u.length>0?e.jsxs("tr",{children:[e.jsx("th",{children:e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(D,{children:"Exposed Local Relations"}),e.jsxs($,{variant:"outline",className:"mr-5 font-medium text-muted-foreground",children:[x.length,"/",u.length," ","active"]}),A?e.jsx(T,{onClick:()=>{U(!S)},className:"flex items-center gap-4",title:S?"Expand fields":"Collapse fields",type:"button",variant:"ghost",size:"icon",children:S?e.jsx(E,{}):e.jsx(q,{})}):null]})}),e.jsx("th",{})]}):null,!S&&u.map(s=>e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx(w,{type:o.nameFromId(s.modelRef),children:s.name})}),e.jsx("td",{className:"pl-8",children:e.jsx(F,{"aria-label":`Expose ${s.name} relation`,disabled:!i,checked:x.includes(s.id),onCheckedChange:r=>{b(k(u,x,r,s.id))}})})]},s.id)),f.length>0?e.jsxs("tr",{children:[e.jsx("th",{children:e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(D,{children:"Exposed Foreign Relations"}),e.jsxs($,{variant:"outline",className:"mr-5 font-medium text-muted-foreground",children:[v.length,"/",f.length," ","active"]}),O?e.jsx(T,{onClick:()=>{_(!C)},className:"flex items-center gap-4",title:C?"Expand fields":"Collapse fields",type:"button",variant:"ghost",size:"icon",children:C?e.jsx(E,{}):e.jsx(q,{})}):null]})}),e.jsx("th",{})]}):null,!C&&f.map(({model:s,relation:r})=>e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx(w,{type:s.name,children:r.foreignRelationName})}),e.jsx("td",{className:"pl-8",children:e.jsx(F,{"aria-label":`Expose ${r.foreignRelationName} relation`,disabled:!i,checked:v.includes(r.foreignId),onCheckedChange:H=>{B(k(f.map(({relation:z})=>({id:z.foreignId})),v,H,r.foreignId))}})})]},r.id))]})]})]})]})}const{authConfigSpec:fe}=await a("@baseplate-dev/project-builder-lib"),{useProjectDefinition:Se}=await a("@baseplate-dev/project-builder-lib/web"),{Alert:Ce,AlertDescription:ye,AlertTitle:ve,MultiSwitchField:G,SectionListSection:Le,SectionListSectionContent:we,SectionListSectionDescription:Ne,SectionListSectionHeader:Re,SectionListSectionTitle:Ee,SwitchFieldController:Q}=await a("@baseplate-dev/ui-components");function qe({control:t}){const{definition:o,pluginContainer:d}=Se(),l=m({control:t,name:"graphql.objectType.enabled"}),i=d.getPluginSpecOptional(fe)?.getAuthRoles(o).map(p=>({label:p.name,value:p.id})),n=m({control:t,name:"graphql.queries.get.enabled"}),c=m({control:t,name:"graphql.queries.list.enabled"});return e.jsxs(Le,{children:[e.jsx("div",{children:e.jsxs(Re,{className:"sticky top-2",children:[e.jsx(Ee,{children:"Queries"}),e.jsx(Ne,{children:"Configure the GraphQL queries that can be performed on this model."})]})}),e.jsxs(we,{className:"space-y-8",children:[!l&&e.jsxs(Ce,{className:"max-w-md",children:[e.jsx(I,{}),e.jsx(ve,{children:"Object type missing"}),e.jsx(ye,{children:"Enable the object type to expose queries and mutations"})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(Q,{control:t,name:"graphql.queries.get.enabled",label:"Get By ID Query",disabled:!l,description:"Expose method for querying a single instance of this model by its ID, e.g. user(id: $id)."}),n&&i&&e.jsx(G.Controller,{control:t,name:"graphql.queries.get.roles",label:"Allowed Roles",options:i,className:"ml-[52px]"})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(Q,{control:t,name:"graphql.queries.list.enabled",disabled:!l,label:"List Query",description:"Expose method for querying a list of instances of this model, e.g. users."}),c&&i&&e.jsx(G.Controller,{control:t,name:"graphql.queries.list.roles",label:"Allowed Roles",options:i,className:"ml-[52px]"})]})]})]})}const{useBlockUnsavedChangesNavigate:$e}=await a("@baseplate-dev/project-builder-lib/web"),{FormActionBar:Te,SectionList:De}=await a("@baseplate-dev/ui-components"),Pe=function(){const{key:o}=Z.useParams(),{form:d,onSubmit:l,originalModel:i}=W({omit:["name","featureRef"],modelKey:o}),{control:n,watch:c,getValues:p,reset:h}=d;return $e({control:n,reset:h,onSubmit:l}),e.jsx(K,{originalModel:i,getValues:p,watch:c,children:e.jsx("form",{onSubmit:l,className:"space-y-4 p-4",children:e.jsxs(De,{children:[e.jsx(ge,{control:n}),e.jsx(qe,{control:n}),e.jsx(ce,{control:n,modelKey:o}),e.jsx(Te,{form:d})]})})})};export{Pe as component}; //# sourceMappingURL=graphql-D9PefeKb.js.map