UNPKG

@baseplate-dev/project-builder-web

Version:

Web interface for constructing project builder JSON

3 lines (2 loc) 10.6 kB
import{i as n}from"./_virtual___federation_fn_import-DOo8C-zl.js";import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{v as y,D as V,y as K}from"./index-DiAhmW9l.js";import{u as W}from"./use-model-form-CMNCrezb.js";import{e as h,u as L}from"./index.esm-DImnoN58.js";import{D as I,G as U}from"./index-G5ZRloOW.js";import{S as Z}from"./-constants-CfroQnV_.js";import{B as w}from"./badge-with-type-label-BSTlOdJB.js";const{authConfigSpec:Y}=await n("@baseplate-dev/project-builder-lib"),{useProjectDefinition:J}=await n("@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 n("@baseplate-dev/ui-components"),{Link:oe}=await n("@tanstack/react-router");function ce({control:t,modelKey:l}){const{definition:d,pluginContainer:a}=J(),i=a.use(Y).getAuthConfig(d)?.roles.map(b=>({label:b.name,value:b.id})),o=h({control:t,name:"graphql.objectType.enabled"}),c=y(b=>b.service??{}),p=h({control:t,name:"graphql.mutations.create.enabled"}),x=c.create?.enabled,j=h({control:t,name:"graphql.mutations.update.enabled"}),g=c.update?.enabled,m=h({control:t,name:"graphql.mutations.delete.enabled"}),u=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:[(!x||!g||!u)&&e.jsxs(X,{className:"max-w-md",children:[e.jsx(I,{}),e.jsxs(te,{children:["Service methods disabled (",[!x&&"Create",!g&&"Update",!u&&"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:l},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:!o||!x,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:!o||!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:!o||!u,description:"Expose the delete method in the GraphQL schema, e.g. deleteUser(id: $id)."}),m&&i&&e.jsx(N.Controller,{control:t,name:"graphql.mutations.delete.roles",label:"Allowed Roles",options:i,className:"ml-[52px]"})]})]})]})}function E(t){return U({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 U({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 n("@baseplate-dev/project-builder-lib"),{useProjectDefinition:re}=await n("@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 n("@baseplate-dev/ui-components"),{useState:M}=await n("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,l,d,a){return d?t.filter(i=>l.includes(i.id)||i.id===a).map(i=>i.id):l.filter(i=>i!==a)}function ge({control:t}){const{definitionContainer:l,definition:d}=re(),a=y(s=>s.id),i=h({control:t,name:"graphql.objectType.enabled"}),o=y(s=>s.model.fields),{field:{value:c=[],onChange:p}}=L({control:t,name:"graphql.objectType.fields"}),x=o.length>10,[j,g]=M(x),m=y(s=>s.model.relations)??[],{field:{value:u=[],onChange:b}}=L({control:t,name:"graphql.objectType.localRelations"}),A=m.length>4,[S,B]=M(A),f=de.getRelationsToModel(d,a),{field:{value:v=[],onChange:P}}=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,"/",o.length," active"]}),x?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&&o.map(s=>e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx(w,{type:s.type==="enum"&&s.options?.enumRef?l.nameFromId(s.options.enumRef):Z[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(o,c,r,s.id))}})})]},s.id)),m.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:[u.length,"/",m.length," ","active"]}),A?e.jsx(T,{onClick:()=>{B(!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&&m.map(s=>e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx(w,{type:l.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:u.includes(s.id),onCheckedChange:r=>{b(k(m,u,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=>{P(k(f.map(({relation:z})=>({id:z.foreignId})),v,H,r.foreignId))}})})]},r.id))]})]})]})]})}const{authConfigSpec:fe}=await n("@baseplate-dev/project-builder-lib"),{useProjectDefinition:Se}=await n("@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 n("@baseplate-dev/ui-components");function qe({control:t}){const{definition:l,pluginContainer:d}=Se(),a=h({control:t,name:"graphql.objectType.enabled"}),i=d.use(fe).getAuthConfig(l)?.roles.map(p=>({label:p.name,value:p.id})),o=h({control:t,name:"graphql.queries.get.enabled"}),c=h({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:[!a&&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:!a,description:"Expose method for querying a single instance of this model by its ID, e.g. user(id: $id)."}),o&&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:!a,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 n("@baseplate-dev/project-builder-lib/web"),{FormActionBar:Te,SectionList:De}=await n("@baseplate-dev/ui-components");function Ue(){const{key:t}=V.useParams(),{form:l,onSubmit:d,originalModel:a}=W({omit:["name","featureRef"],modelKey:t}),{control:i,watch:o,getValues:c,reset:p}=l;return $e({control:i,reset:p,onSubmit:d}),e.jsx(K,{originalModel:a,getValues:c,watch:o,children:e.jsx("form",{onSubmit:d,className:"space-y-4 p-4",children:e.jsxs(De,{children:[e.jsx(ge,{control:i}),e.jsx(qe,{control:i}),e.jsx(ce,{control:i,modelKey:t}),e.jsx(Te,{form:l})]})})})}export{Ue as component}; //# sourceMappingURL=graphql-CdQMdjAP.js.map