@strapi/admin 4.12.7 → 4.13.0-alpha.1

package/build/users-roles-settings-page.2b051e6a.chunk.js

@@ -0,0 +1,55 @@
+"use strict";(self.webpackChunk_strapi_admin=self.webpackChunk_strapi_admin||[]).push([[8853],{34254:function(ve,G,s){s.r(G),s.d(G,{default:function(){return Tt}});var e=s(32735),a=s(45509),T=s(53038),P=s(19108),k=s(27649),x=s(82055),O=s(41415),B=s(17e3),E=s(87933),p=s(49372),A=s(15335),S=s(5803),K=s(10369),J=s(33475),w=s(66456),q=s(92802),b=s(67879),I=s(20108),ye=s(60216),y=s.n(ye);const _=(0,e.createContext)({}),ee=({children:t,value:n})=>e.createElement(_.Provider,{value:n},t),Q=()=>(0,e.useContext)(_);ee.propTypes={children:y().node.isRequired,value:y().object.isRequired};var $=s(48395),Re=s(83828),Ce=s(61762),Pe=s(89966),Se=s(23940),Te=s.n(Se);function be(t){switch(t){case"application":return"Application";case"plugin::content-manager":return"Content manager";case"plugin::content-type-builder":return"Content types builder";case"plugin::documentation":return"Documentation";case"plugin::email":return"Email";case"plugin::i18n":return"i18n";case"plugin::upload":return"Upload";case"plugin::users-permissions":return"Users-permissions";default:return Te()(t.replace("api::","").replace("plugin::",""))}}var Ae=be,Me=(t,n)=>{const o=Object.keys(n).sort().map(r=>({name:r,isOpen:!1}));return{...t,collapses:o}},L=s(72850),Le=s(98978),te=s.n(Le),se=s(8284),ne=s(3685),De=s(45112),Ze=s(33795),F=s.n(Ze),U=s(8471);const ae=(0,U.iv)`
+  background: ${t=>t.theme.colors.primary100};
+  svg {
+    opacity: 1;
+  }
+`;var xe=(0,U.ZP)(L.x)`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  svg {
+    opacity: 0;
+    path {
+      fill: ${t=>t.theme.colors.primary600};
+    }
+  }
+
+  /* Show active style both on hover and when the action is selected */
+  ${t=>t.isActive&&ae}
+  &:hover {
+    ${ae}
+  }
+`;const Oe=U.ZP.div`
+  flex: 1;
+  align-self: center;
+  border-top: 1px solid ${({theme:t})=>t.colors.neutral150};
+`,oe=({subCategory:t})=>{const{formatMessage:n}=(0,b.Z)(),{onChange:o,onChangeSelectAll:r,onSelectedAction:c,selectedAction:l,modifiedData:d}=Q(),u=(0,e.useMemo)(()=>F()(d,t.name,{}),[d,t]),m=(0,e.useMemo)(()=>Object.values(u).every(i=>i.enabled===!0),[u]),g=(0,e.useMemo)(()=>Object.values(u).some(i=>i.enabled===!0)&&!m,[u,m]),h=(0,e.useCallback)(({target:{name:i}})=>{r({target:{name:i,value:!m}})},[m,r]),f=(0,e.useCallback)(i=>l===i,[l]);return e.createElement(L.x,null,e.createElement(E.k,{justifyContent:"space-between",alignItems:"center"},e.createElement(L.x,{paddingRight:4},e.createElement(p.Z,{variant:"sigma",textColor:"neutral600"},t.label)),e.createElement(Oe,null),e.createElement(L.x,{paddingLeft:4},e.createElement(se.X,{name:t.name,value:m,onValueChange:i=>h({target:{name:t.name,value:i}}),indeterminate:g},n({id:"app.utils.select-all",defaultMessage:"Select all"})))),e.createElement(E.k,{paddingTop:6,paddingBottom:6},e.createElement(A.r,{gap:2,style:{flex:1}},t.actions.map(i=>{const v=`${i.name}.enabled`;return e.createElement(S.P,{col:6,key:i.name},e.createElement(xe,{isActive:f(i.name),padding:2,hasRadius:!0},e.createElement(se.X,{value:F()(d,v,!1),name:v,onValueChange:C=>o({target:{name:v,value:C}})},i.label),e.createElement("button",{type:"button",onClick:()=>c(i.name),style:{display:"inline-flex",alignItems:"center"}},e.createElement(ne.T,{as:"span"},n({id:"app.utils.show-bound-route",defaultMessage:"Show bound route for {route}"},{route:i.name})),e.createElement(De.Z,null))))}))))};oe.propTypes={subCategory:y().object.isRequired};var Be=oe;const re=({name:t,permissions:n})=>{const o=(0,e.useMemo)(()=>te()(Object.values(n.controllers).reduce((r,c,l)=>{const d=`${t}.controllers.${Object.keys(n.controllers)[l]}`,u=te()(Object.keys(c).reduce((m,g)=>[...m,{...c[g],label:g,name:`${d}.${g}`}],[]),"label");return[...r,{actions:u,label:Object.keys(n.controllers)[l],name:d}]},[]),"label"),[t,n]);return e.createElement(L.x,{padding:6},o.map(r=>e.createElement(Be,{key:r.name,subCategory:r})))};re.propTypes={name:y().string.isRequired,permissions:y().object.isRequired};var Ie=re,le=s(97889);const $e={collapses:[]},Ne=(t,n)=>(0,le.ZP)(t,o=>{switch(n.type){case"TOGGLE_COLLAPSE":{o.collapses=t.collapses.map((r,c)=>c===n.index?{...r,isOpen:!r.isOpen}:{...r,isOpen:!1});break}default:return o}});var je=()=>{const{modifiedData:t}=Q(),{formatMessage:n}=(0,b.Z)(),[{collapses:o},r]=(0,e.useReducer)(Ne,$e,l=>Me(l,t)),c=l=>r({type:"TOGGLE_COLLAPSE",index:l});return e.createElement(E.k,{direction:"column",alignItems:"stretch",gap:1},o.map((l,d)=>e.createElement(Re.U,{expanded:l.isOpen,onToggle:()=>c(d),key:l.name,variant:d%2===0?"secondary":void 0},e.createElement(Ce.B,{title:Ae(l.name),description:n({id:"users-permissions.Plugin.permissions.plugins.description",defaultMessage:"Define all allowed actions for the {name} plugin."},{name:l.name}),variant:d%2?"primary":"secondary"}),e.createElement(Pe.v,null,e.createElement(Ie,{permissions:t[l.name],name:l.name})))))},ke=s(86834),Ue=s.n(ke),We=s(86205),Ge=s.n(We),Fe=s(37213),Ve=s.n(Fe),He=s(15738),Qe=s.n(He),Ye=t=>{switch(t){case"POST":return{text:"success600",border:"success200",background:"success100"};case"GET":return{text:"secondary600",border:"secondary200",background:"secondary100"};case"PUT":return{text:"warning600",border:"warning200",background:"warning100"};case"DELETE":return{text:"danger600",border:"danger200",background:"danger100"};default:return{text:"neutral600",border:"neutral200",background:"neutral100"}}};const Xe=(0,U.ZP)(L.x)`
+  margin: -1px;
+  border-radius: ${({theme:t})=>t.spaces[1]} 0 0 ${({theme:t})=>t.spaces[1]};
+`;function Y({route:t}){const{formatMessage:n}=(0,b.Z)(),{method:o,handler:r,path:c}=t,l=c?Qe()(c.split("/")):[],[d="",u=""]=r?r.split("."):[],m=Ye(t.method);return e.createElement(E.k,{direction:"column",alignItems:"stretch",gap:2},e.createElement(p.Z,{variant:"delta",as:"h3"},n({id:"users-permissions.BoundRoute.title",defaultMessage:"Bound route to"}),"\xA0",e.createElement("span",null,d),e.createElement(p.Z,{variant:"delta",textColor:"primary600"},".",u)),e.createElement(E.k,{hasRadius:!0,background:"neutral0",borderColor:"neutral200",gap:0},e.createElement(Xe,{background:m.background,borderColor:m.border,padding:2},e.createElement(p.Z,{fontWeight:"bold",textColor:m.text},o)),e.createElement(L.x,{paddingLeft:2,paddingRight:2},Ve()(l,g=>e.createElement(p.Z,{key:g,textColor:g.includes(":")?"neutral600":"neutral900"},"/",g)))))}Y.defaultProps={route:{handler:"Nocontroller.error",method:"GET",path:"/there-is-no-path"}},Y.propTypes={route:y().shape({handler:y().string,method:y().string,path:y().string})};var ze=Y,Ke=()=>{const{formatMessage:t}=(0,b.Z)(),{selectedAction:n,routes:o}=Q(),r=Ge()(n.split("."),"controllers"),c=F()(o,r[0]),l=r.slice(1).join("."),d=Ue()(c)?[]:c.filter(u=>u.handler.endsWith(l));return e.createElement(S.P,{col:5,background:"neutral150",paddingTop:6,paddingBottom:6,paddingLeft:7,paddingRight:7,style:{minHeight:"100%"}},n?e.createElement(E.k,{direction:"column",alignItems:"stretch",gap:2},d.map((u,m)=>e.createElement(ze,{key:m,route:u}))):e.createElement(E.k,{direction:"column",alignItems:"stretch",gap:2},e.createElement(p.Z,{variant:"delta",as:"h3"},t({id:"users-permissions.Policies.header.title",defaultMessage:"Advanced settings"})),e.createElement(p.Z,{as:"p",textColor:"neutral600"},t({id:"users-permissions.Policies.header.hint",defaultMessage:"Select the application's actions or the plugin's actions and click on the cog icon to display the bound route"}))))},Je=(t,n,o)=>({...t,initialData:n,modifiedData:n,routes:o}),we=s(3040),ie=s.n(we),qe=s(88708),_e=s.n(qe);const et={initialData:{},modifiedData:{},routes:{},selectedAction:"",policies:[]};var tt=(t,n)=>(0,le.ZP)(t,o=>{switch(n.type){case"ON_CHANGE":{const r=n.keys.length,c=n.keys[r-1]==="enabled";if(n.value&&c){const l=_e()(n.keys,r-1).join(".");o.selectedAction=l}ie()(o,["modifiedData",...n.keys],n.value);break}case"ON_CHANGE_SELECT_ALL":{const r=["modifiedData",...n.keys],c=F()(t,r,{}),l=Object.keys(c).reduce((d,u)=>(d[u]={...c[u],enabled:n.value},d),{});ie()(o,r,l);break}case"ON_RESET":{o.modifiedData=t.initialData;break}case"ON_SUBMIT_SUCCEEDED":{o.initialData=t.modifiedData;break}case"SELECT_ACTION":{const{actionToSelect:r}=n;o.selectedAction=r===t.selectedAction?"":r;break}default:return o}});const ce=(0,e.forwardRef)(({permissions:t,routes:n},o)=>{const{formatMessage:r}=(0,b.Z)(),[c,l]=(0,e.useReducer)(tt,et,h=>Je(h,t,n));(0,e.useImperativeHandle)(o,()=>({getPermissions(){return{permissions:c.modifiedData}},resetForm(){l({type:"ON_RESET"})},setFormAfterSubmit(){l({type:"ON_SUBMIT_SUCCEEDED"})}}));const g={...c,onChange:({target:{name:h,value:f}})=>l({type:"ON_CHANGE",keys:h.split("."),value:f==="empty__string_value"?"":f}),onChangeSelectAll:({target:{name:h,value:f}})=>l({type:"ON_CHANGE_SELECT_ALL",keys:h.split("."),value:f}),onSelectedAction:h=>l({type:"SELECT_ACTION",actionToSelect:h})};return e.createElement(ee,{value:g},e.createElement(A.r,{gap:0,shadow:"filterShadow",hasRadius:!0,background:"neutral0"},e.createElement(S.P,{col:7,paddingTop:6,paddingBottom:6,paddingLeft:7,paddingRight:7},e.createElement(E.k,{direction:"column",alignItems:"stretch",gap:6},e.createElement(E.k,{direction:"column",alignItems:"stretch",gap:2},e.createElement(p.Z,{variant:"delta",as:"h2"},r({id:(0,$.Z)("Plugins.header.title"),defaultMessage:"Permissions"})),e.createElement(p.Z,{as:"p",textColor:"neutral600"},r({id:(0,$.Z)("Plugins.header.description"),defaultMessage:"Only actions bound by a route are listed below."}))),e.createElement(je,null))),e.createElement(Ke,null)))});ce.propTypes={permissions:y().object.isRequired,routes:y().object.isRequired};var de=(0,e.memo)(ce),X=s(24346);const me=X.Ry().shape({name:X.Z_().required(a.I0.required),description:X.Z_().required(a.I0.required)});var W=s(55733);const ue=()=>{const t=(0,a.lm)(),{get:n}=(0,a.kY)(),{formatAPIError:o}=(0,a.So)(W.OB),[{data:r,isLoading:c,error:l,refetch:d},{data:u,isLoading:m,error:g,refetch:h}]=(0,I.useQueries)([{queryKey:["users-permissions","permissions"],async queryFn(){const{data:{permissions:v}}=await n("/users-permissions/permissions");return v}},{queryKey:["users-permissions","routes"],async queryFn(){const{data:{routes:v}}=await n("/users-permissions/routes");return v}}]),f=async()=>{await Promise.all([d(),h()])};(0,e.useEffect)(()=>{l&&t({type:"warning",message:o(l)})},[t,l,o]),(0,e.useEffect)(()=>{g&&t({type:"warning",message:o(g)})},[t,g,o]);const i=c||m;return{permissions:r?(0,W.YX)(r):{},routes:u??{},getData:f,isLoading:i}},st=()=>{const{formatMessage:t}=(0,b.Z)(),n=(0,a.lm)(),{goBack:o}=(0,T.k6)(),{lockApp:r,unlockApp:c}=(0,a.o1)(),{isLoading:l,permissions:d,routes:u}=ue(),{trackUsage:m}=(0,a.rS)(),g=e.useRef(),{post:h}=(0,a.kY)(),f=(0,I.useMutation)(v=>h("/users-permissions/roles",v),{onError(){n({type:"warning",message:{id:"notification.error",defaultMessage:"An error occurred"}})},onSuccess(){m("didCreateRole"),n({type:"success",message:{id:(0,$.Z)("Settings.roles.created"),defaultMessage:"Role created"}}),o()}}),i=async v=>{r();const C=g.current.getPermissions();await f.mutate({...v,...C,users:[]}),c()};return e.createElement(k.o,null,e.createElement(a.SL,{name:"Roles"}),e.createElement(q.J9,{enableReinitialize:!0,initialValues:{name:"",description:""},onSubmit:i,validationSchema:me},({handleSubmit:v,values:C,handleChange:N,errors:R})=>e.createElement(a.l0,{noValidate:!0,onSubmit:v},e.createElement(x.T,{primaryAction:!l&&e.createElement(O.z,{type:"submit",loading:f.isLoading,startIcon:e.createElement(w.Z,null)},t({id:"global.save",defaultMessage:"Save"})),title:t({id:"Settings.roles.create.title",defaultMessage:"Create a role"}),subtitle:t({id:"Settings.roles.create.description",defaultMessage:"Define the rights given to the role"})}),e.createElement(B.D,null,e.createElement(E.k,{background:"neutral0",direction:"column",alignItems:"stretch",gap:7,hasRadius:!0,paddingTop:6,paddingBottom:6,paddingLeft:7,paddingRight:7,shadow:"filterShadow"},e.createElement(E.k,{direction:"column",alignItems:"stretch"},e.createElement(p.Z,{variant:"delta",as:"h2"},t({id:(0,$.Z)("EditPage.form.roles"),defaultMessage:"Role details"})),e.createElement(A.r,{gap:4},e.createElement(S.P,{col:6},e.createElement(K.o,{name:"name",value:C.name||"",onChange:N,label:t({id:"global.name",defaultMessage:"Name"}),error:R?.name?t({id:R.name}):!1,required:!0})),e.createElement(S.P,{col:6},e.createElement(J.g,{id:"description",value:C.description||"",onChange:N,label:t({id:"global.description",defaultMessage:"Description"}),error:R?.description?t({id:R.description}):!1,required:!0})))),!l&&e.createElement(de,{ref:g,permissions:d,routes:u}))))))},nt=()=>e.createElement(a.O4,{permissions:P._.createRole},e.createElement(st,null));var at=s(29439);const ot=()=>{const{formatMessage:t}=(0,b.Z)(),n=(0,a.lm)(),{lockApp:o,unlockApp:r}=(0,a.o1)(),{params:{id:c}}=(0,T.$B)("/settings/users-permissions/roles/:id"),{get:l}=(0,a.kY)(),{isLoading:d,routes:u}=ue(),{data:m,isLoading:g,refetch:h}=(0,I.useQuery)(["users-permissions","role",c],async()=>{const{data:{role:R}}=await l(`/users-permissions/roles/${c}`);return R}),f=e.useRef(),{put:i}=(0,a.kY)(),{formatAPIError:v}=(0,a.So)(),C=(0,I.useMutation)(R=>i(`/users-permissions/roles/${c}`,R),{onError(R){n({type:"warning",message:v(R)})},async onSuccess(){n({type:"success",message:{id:(0,$.Z)("Settings.roles.created"),defaultMessage:"Role edited"}}),await h()}}),N=async R=>{o();const D=f.current.getPermissions();await C.mutate({...R,...D,users:[]}),r()};return g?e.createElement(a.dO,null):e.createElement(k.o,null,e.createElement(a.SL,{name:"Roles"}),e.createElement(q.J9,{enableReinitialize:!0,initialValues:{name:m.name,description:m.description},onSubmit:N,validationSchema:me},({handleSubmit:R,values:D,handleChange:V,errors:j})=>e.createElement(a.l0,{noValidate:!0,onSubmit:R},e.createElement(x.T,{primaryAction:!d&&e.createElement(O.z,{disabled:m.code==="strapi-super-admin",type:"submit",loading:C.isLoading,startIcon:e.createElement(w.Z,null)},t({id:"global.save",defaultMessage:"Save"})),title:m.name,subtitle:m.description,navigationAction:e.createElement(a.rU,{startIcon:e.createElement(at.Z,null),to:"/settings/users-permissions/roles"},t({id:"global.back",defaultMessage:"Back"}))}),e.createElement(B.D,null,e.createElement(E.k,{background:"neutral0",direction:"column",alignItems:"stretch",gap:7,hasRadius:!0,paddingTop:6,paddingBottom:6,paddingLeft:7,paddingRight:7,shadow:"filterShadow"},e.createElement(E.k,{direction:"column",alignItems:"stretch",gap:4},e.createElement(p.Z,{variant:"delta",as:"h2"},t({id:(0,$.Z)("EditPage.form.roles"),defaultMessage:"Role details"})),e.createElement(A.r,{gap:4},e.createElement(S.P,{col:6},e.createElement(K.o,{name:"name",value:D.name||"",onChange:V,label:t({id:"global.name",defaultMessage:"Name"}),error:j?.name?t({id:j.name}):!1,required:!0})),e.createElement(S.P,{col:6},e.createElement(J.g,{id:"description",value:D.description||"",onChange:V,label:t({id:"global.description",defaultMessage:"Description"}),error:j?.description?t({id:j.description}):!1,required:!0})))),!d&&e.createElement(de,{ref:f,permissions:m.permissions,routes:u}))))))},rt=()=>e.createElement(a.O4,{permissions:P._.updateRole},e.createElement(ot,null));var lt=s(94638),it=s(96709),ct=s(99223),dt=s(56755),mt=s(33827),ge=s(94547),M=s(19786),ut=s(19406),gt=s(50428),pt=s(35658),ht=s(50563),Et=s(68625),ft=s(4038);const vt=(0,U.ZP)(gt.r)`
+  align-items: center;
+  height: ${(0,a.Q1)(32)};
+  display: flex;
+  justify-content: center;
+  padding: ${({theme:t})=>`${t.spaces[2]}}`};
+  width: ${(0,a.Q1)(32)};
+
+  svg {
+    height: ${(0,a.Q1)(12)};
+    width: ${(0,a.Q1)(12)};
+
+    path {
+      fill: ${({theme:t})=>t.colors.neutral500};
+    }
+  }
+
+  &:hover,
+  &:focus {
+    svg {
+      path {
+        fill: ${({theme:t})=>t.colors.neutral800};
+      }
+    }
+  }
+`,z=({sortedRoles:t,canDelete:n,permissions:o,setRoleToDelete:r,onDelete:c})=>{const{formatMessage:l}=(0,b.Z)(),{push:d}=(0,T.k6)(),[u,m]=c,g=i=>n&&!["public","authenticated"].includes(i.type),h=i=>{r(i),m(!u)},f=i=>{d(`/settings/users-permissions/roles/${i}`)};return e.createElement(pt.p,null,t?.map(i=>e.createElement(ge.Tr,{key:i.name,...(0,a.X7)({fn:()=>f(i.id)})},e.createElement(M.Td,{width:"20%"},e.createElement(p.Z,null,i.name)),e.createElement(M.Td,{width:"50%"},e.createElement(p.Z,null,i.description)),e.createElement(M.Td,{width:"30%"},e.createElement(p.Z,null,l({id:"Roles.RoleRow.user-count",defaultMessage:"{number, plural, =0 {# user} one {# user} other {# users}}"},{number:i.nb_users}))),e.createElement(M.Td,null,e.createElement(E.k,{justifyContent:"end",...a.UW},e.createElement(a.jW,{permissions:o.updateRole},e.createElement(vt,{to:`/settings/users-permissions/roles/${i.id}`,"aria-label":l({id:"app.component.table.edit",defaultMessage:"Edit {target}"},{target:`${i.name}`})},e.createElement(Et.Z,null))),g(i)&&e.createElement(a.jW,{permissions:o.deleteRole},e.createElement(ht.h,{onClick:()=>h(i.id),noBorder:!0,icon:e.createElement(ft.Z,null),label:l({id:"global.delete-target",defaultMessage:"Delete {target}"},{target:`${i.name}`})})))))))};var yt=z;z.defaultProps={canDelete:!1},z.propTypes={onDelete:y().array.isRequired,permissions:y().object.isRequired,setRoleToDelete:y().func.isRequired,sortedRoles:y().array.isRequired,canDelete:y().bool};const Rt=async(t,n)=>{try{const{get:o}=(0,a.tg)(),{data:r}=await o("/users-permissions/roles");return n("The roles have loaded successfully"),r}catch(o){throw t({type:"warning",message:{id:"notification.error"}}),new Error(o)}},Ct=async(t,n)=>{try{const{del:o}=(0,a.tg)();await o(`/users-permissions/roles/${t}`)}catch{n({type:"warning",message:{id:"notification.error",defaultMessage:"An error occured"}})}},Pt=()=>{const{trackUsage:t}=(0,a.rS)(),{formatMessage:n,locale:o}=(0,b.Z)(),r=(0,a.lm)(),{notifyStatus:c}=(0,lt.G)(),[{query:l}]=(0,a.Kx)(),d=l?._q||"",[u,m]=(0,e.useState)(!1),[g,h]=(0,e.useState)(!1),[f,i]=(0,e.useState)();(0,a.go)();const{isLoading:v,allowedActions:{canRead:C,canDelete:N}}=(0,a.ss)({create:P._.createRole,read:P._.readRoles,update:P._.updateRole,delete:P._.deleteRole}),{isLoading:R,data:{roles:D},isFetching:V,refetch:j}=(0,I.useQuery)("get-roles",()=>Rt(r,c),{initialData:{},enabled:C}),{includes:pe}=(0,a.L0)(o,{sensitivity:"base"}),he=(0,a.Xe)(o,{sensitivity:"base"}),Ee=R||V,bt=()=>{m(!u)},At={roles:{id:(0,W.OB)("Roles.empty"),defaultMessage:"You don't have any roles yet."},search:{id:(0,W.OB)("Roles.empty.search"),defaultMessage:"No roles match the search."}},Mt=n({id:"global.roles",defaultMessage:"Roles"}),Lt=(0,I.useMutation)(Z=>Ct(Z,r),{async onSuccess(){await j()}}),Dt=async()=>{h(!0),await Lt.mutateAsync(f),m(!u),h(!1)},H=(D||[]).filter(Z=>pe(Z.name,d)||pe(Z.description,d)).sort((Z,fe)=>he.compare(Z.name,fe.name)||he.compare(Z.description,fe.description)),Zt=d&&!H.length?"search":"roles",xt=4,Ot=(D?.length||0)+1;return e.createElement(it.A,null,e.createElement(a.SL,{name:Mt}),e.createElement(k.o,{"aria-busy":Ee},e.createElement(x.T,{title:n({id:"global.roles",defaultMessage:"Roles"}),subtitle:n({id:"Settings.roles.list.description",defaultMessage:"List of roles"}),primaryAction:e.createElement(a.jW,{permissions:P._.createRole},e.createElement(a.Qj,{to:"/settings/users-permissions/roles/new",onClick:()=>t("willCreateRole"),startIcon:e.createElement(ut.Z,null),size:"S"},n({id:(0,W.OB)("List.button.roles"),defaultMessage:"Add new role"})))}),e.createElement(ct.Z,{startActions:e.createElement(a.m,{label:n({id:"app.component.search.label",defaultMessage:"Search"})})}),e.createElement(B.D,null,!C&&e.createElement(a.ZF,null),(Ee||v)&&e.createElement(a.dO,null),C&&H&&H?.length?e.createElement(dt.i,{colCount:xt,rowCount:Ot},e.createElement(mt.h,null,e.createElement(ge.Tr,null,e.createElement(M.Th,null,e.createElement(p.Z,{variant:"sigma",textColor:"neutral600"},n({id:"global.name",defaultMessage:"Name"}))),e.createElement(M.Th,null,e.createElement(p.Z,{variant:"sigma",textColor:"neutral600"},n({id:"global.description",defaultMessage:"Description"}))),e.createElement(M.Th,null,e.createElement(p.Z,{variant:"sigma",textColor:"neutral600"},n({id:"global.users",defaultMessage:"Users"}))),e.createElement(M.Th,null,e.createElement(ne.T,null,n({id:"global.actions",defaultMessage:"Actions"}))))),e.createElement(yt,{sortedRoles:H,canDelete:N,permissions:P._,setRoleToDelete:i,onDelete:[u,m]})):e.createElement(a.x7,{content:At[Zt]})),e.createElement(a.QH,{isConfirmButtonLoading:g,onConfirm:Dt,onToggleDialog:bt,isOpen:u})))},St=()=>e.createElement(a.O4,{permissions:P._.accessRoles},e.createElement(Pt,null));var Tt=()=>e.createElement(a.O4,{permissions:P._.accessRoles},e.createElement(T.rs,null,e.createElement(T.AW,{path:"/settings/users-permissions/roles/new",component:nt,exact:!0}),e.createElement(T.AW,{path:"/settings/users-permissions/roles/:id",component:rt,exact:!0}),e.createElement(T.AW,{path:"/settings/users-permissions/roles",component:St,exact:!0}),e.createElement(T.AW,{path:"",component:a.Hn})))},55733:function(ve,G,s){s.d(G,{YX:function(){return P},OB:function(){return k.Z}});var e=s(86834),a=s.n(e),P=x=>Object.keys(x).reduce((O,B)=>{const E=x[B].controllers,p=Object.keys(E).reduce((A,S)=>(a()(E[S])||(A[S]=E[S]),A),{});return a()(p)||(O[B]={controllers:p}),O},{}),k=s(48395)}}]);

package/build/{webhook-edit-page.6cb479ff.chunk.js → webhook-edit-page.de45c635.chunk.js}

@@ -23,11 +23,11 @@
      */
     padding-inline-start: ${({theme:s})=>s.spaces[2]};
   }
-`,oe=s=>{const r=[{id:"Settings.webhooks.events.create",defaultMessage:"Create"},{id:"Settings.webhooks.events.update",defaultMessage:"Update"},{id:"app.utils.delete",defaultMessage:"Delete"}];return s&&(r.push({id:"app.utils.publish",defaultMessage:"Publish"}),r.push({id:"app.utils.unpublish",defaultMessage:"Unpublish"})),r},Y=s=>{const r=["entry.create","entry.update","entry.delete"];return s&&r.push("entry.publish","entry.unpublish"),{entry:r,media:["media.create","media.update","media.delete"]}},J=e.createContext(),le=({children:s})=>{const{formatMessage:r}=(0,_.Z)(),{collectionTypes:d,isLoading:M}=(0,de.G)(),y=e.useMemo(()=>d.some(L=>L.options.draftAndPublish===!0),[d]),v=r({id:"Settings.webhooks.form.events",defaultMessage:"Events"});return e.createElement(J.Provider,{value:{isDraftAndPublish:y}},e.createElement(g.k,{direction:"column",alignItems:"stretch",gap:1},e.createElement(b.Q,{"aria-hidden":!0},v),M&&e.createElement(W.a,null,r({id:"Settings.webhooks.events.isLoading",defaultMessage:"Events loading"})),e.createElement(B,{"aria-label":v},s)))};le.propTypes={children:f().oneOfType([f().arrayOf(f().node),f().node]).isRequired};const q=({getHeaders:s=oe})=>{const{isDraftAndPublish:r}=e.useContext(J),{formatMessage:d}=(0,_.Z)(),M=s(r);return e.createElement(K.S,null,e.createElement(U.Z,null,e.createElement(i.g,null,e.createElement(se.T,null,d({id:"Settings.webhooks.event.select",defaultMessage:"Select event"}))),M.map(y=>["app.utils.publish","app.utils.unpublish"].includes(y.id)?e.createElement(i.g,{key:y.id,title:d({id:"Settings.webhooks.event.publish-tooltip",defaultMessage:"This event only exists for content with draft & publish enabled"})},e.createElement(re.Z,{variant:"sigma",textColor:"neutral600"},d(y))):e.createElement(i.g,{key:y.id},e.createElement(re.Z,{variant:"sigma",textColor:"neutral600"},d(y))))))};q.defaultProps={getHeaders:oe},q.propTypes={getHeaders:f().func};const ee=({providedEvents:s})=>{const{isDraftAndPublish:r}=e.useContext(J),d=s||Y(r),{values:M,handleChange:y}=(0,Q.u6)(),v="events",L=M.events,w=[],te=u(L),A=({target:{name:E,value:m}})=>{let C=new Set(L);m?C.add(E):C.delete(E),y({target:{name:v,value:Array.from(C)}})},$=({target:{name:E,value:m}})=>{let C=new Set(L);m?d[E].forEach(N=>{w.includes(N)||C.add(N)}):d[E].forEach(N=>C.delete(N)),y({target:{name:v,value:Array.from(C)}})};return e.createElement(j.X,null,Object.entries(d).map(([E,m])=>e.createElement(F,{disabledEvents:w,key:E,name:E,events:m,inputValue:te[E],handleSelect:A,handleSelectAll:$})))};ee.defaultProps={providedEvents:null},ee.propTypes={providedEvents:f().object};const ce=s=>s.replace(/-/g," ").split(" ").map(r=>r.charAt(0).toUpperCase()+r.slice(1).toLowerCase()).join(" "),F=({disabledEvents:s,name:r,events:d,inputValue:M,handleSelect:y,handleSelectAll:v})=>{const{formatMessage:L}=(0,_.Z)(),w=d.filter(m=>!s.includes(m)),te=M.length>0,A=M.length===w.length,$=({target:{name:m}})=>{v({target:{name:m,value:!A}})},E=5;return e.createElement(U.Z,null,e.createElement(i.f,null,e.createElement(X.X,{indeterminate:te&&!A,"aria-label":L({id:"global.select-all-entries",defaultMessage:"Select all entries"}),name:r,onChange:$,value:A},ce(r))),d.map(m=>e.createElement(i.f,{key:m},e.createElement(S.C,{disabled:s.includes(m),"aria-label":m,name:m,value:M.includes(m),onValueChange:C=>y({target:{name:m,value:C}})}))),d.length<E&&e.createElement(i.f,{colSpan:E-d.length}))};F.defaultProps={disabledEvents:[],events:[],inputValue:[],handleSelect(){},handleSelectAll(){}},F.propTypes={disabledEvents:f().array,events:f().array,inputValue:f().array,handleSelect:f().func,handleSelectAll:f().func,name:f().string.isRequired},P.Z={Root:le,Headers:q,Body:ee,EventRow:F}},77476:function(G,P,t){t.d(P,{Z:function(){return fe}});var e=t(32735),T=t(27649),g=t(19565),b=t(20108),W=t(53038),K=t(90769),U=t(82055),i=t(87933),se=t(41415),re=t(17e3),j=t(72850),X=t(15335),S=t(5803),Q=t(10369),ie=t(2438),f=t(66456),_=t(29439),D=t(92802),de=t(60216),u=t.n(de),B=t(67879),oe=t(9592),Y=t(36795);function J(){return e.createElement(Y.Z.Root,null,e.createElement(Y.Z.Headers,null),e.createElement(Y.Z.Body,null))}var le=t(76437),q=t(7563),ee=t(19406),ce=t(21428),F=t(90333);const s=["A-IM","Accept","Accept-Charset","Accept-Encoding","Accept-Language","Accept-Datetime","Access-Control-Request-Method","Access-Control-Request-Headers","Authorization","Cache-Control","Connection","Content-Length","Content-Type","Cookie","Date","Expect","Forwarded","From","Host","If-Match","If-Modified-Since","If-None-Match","If-Range","If-Unmodified-Since","Max-Forwards","Origin","Pragma","Proxy-Authorization","Range","Referer","TE","User-Agent","Upgrade","Via","Warning"],r=({name:n,onChange:a,value:o,...c})=>{const{values:{headers:h}}=(0,D.u6)(),[O,l]=(0,e.useState)(s);(0,e.useEffect)(()=>{l(s.filter(p=>!h?.some(x=>x.key!==o&&x.key===p)))},[h,o]);const H=p=>{a({target:{name:n,value:p}})},z=p=>{l(x=>[...x,p]),H(p)};return e.createElement(ce.XU,{...c,onClear:()=>H(""),onChange:H,onCreateOption:z,placeholder:"",value:o},O.map(p=>e.createElement(F.O,{value:p,key:p},p)))};r.defaultProps={value:void 0},r.propTypes={name:u().string.isRequired,onChange:u().func.isRequired,value:u().string};var d=r,y=()=>{const{formatMessage:n}=(0,B.Z)(),{values:a,errors:o}=(0,D.u6)();return e.createElement(i.k,{direction:"column",alignItems:"stretch",gap:1},e.createElement(le.Q,null,n({id:"Settings.webhooks.form.headers",defaultMessage:"Headers"})),e.createElement(j.x,{padding:8,background:"neutral100",hasRadius:!0},e.createElement(D.F2,{validateOnChange:!1,name:"headers",render:({push:c,remove:h})=>e.createElement(X.r,{gap:4},a.headers.map((O,l)=>e.createElement(e.Fragment,{key:`${l}.${O.key}`},e.createElement(S.P,{col:6},e.createElement(D.gN,{as:d,name:`headers.${l}.key`,"aria-label":`row ${l+1} key`,label:n({id:"Settings.webhooks.key",defaultMessage:"Key"}),error:o.headers?.[l]?.key&&o.headers[l].key})),e.createElement(S.P,{col:6},e.createElement(i.k,{alignItems:"flex-end"},e.createElement(j.x,{style:{flex:1}},e.createElement(D.gN,{as:Q.o,name:`headers.${l}.value`,"aria-label":`row ${l+1} value`,label:n({id:"Settings.webhooks.value",defaultMessage:"Value"}),error:o.headers?.[l]?.value&&o.headers[l].value})),e.createElement(i.k,{paddingLeft:2,style:{alignSelf:"center"},paddingTop:o.headers?.[l]?.value?0:5},e.createElement(g.fG,{disabled:a.headers.length===1,onClick:()=>h(l),label:n({id:"Settings.webhooks.headers.remove",defaultMessage:"Remove header row {number}"},{number:l+1})})))))),e.createElement(S.P,{col:12},e.createElement(q.A,{type:"button",onClick:()=>{c({key:"",value:""})},startIcon:e.createElement(ee.Z,null)},n({id:"Settings.webhooks.create.header",defaultMessage:"Create new header"}))))})))},v=t(49372),L=t(27169),w=t(35331),te=t(8471);const A=te.ZP.svg(({theme:n,color:a})=>`
+`,oe=s=>{const r=[{id:"Settings.webhooks.events.create",defaultMessage:"Create"},{id:"Settings.webhooks.events.update",defaultMessage:"Update"},{id:"app.utils.delete",defaultMessage:"Delete"}];return s&&(r.push({id:"app.utils.publish",defaultMessage:"Publish"}),r.push({id:"app.utils.unpublish",defaultMessage:"Unpublish"})),r},Y=s=>{const r=["entry.create","entry.update","entry.delete"];return s&&r.push("entry.publish","entry.unpublish"),{entry:r,media:["media.create","media.update","media.delete"]}},J=e.createContext(),le=({children:s})=>{const{formatMessage:r}=(0,_.Z)(),{collectionTypes:d,isLoading:M}=(0,de.G)(),y=e.useMemo(()=>d.some(L=>L.options.draftAndPublish===!0),[d]),v=r({id:"Settings.webhooks.form.events",defaultMessage:"Events"});return e.createElement(J.Provider,{value:{isDraftAndPublish:y}},e.createElement(g.k,{direction:"column",alignItems:"stretch",gap:1},e.createElement(b.Q,{"aria-hidden":!0},v),M&&e.createElement(W.a,null,r({id:"Settings.webhooks.events.isLoading",defaultMessage:"Events loading"})),e.createElement(B,{"aria-label":v},s)))};le.propTypes={children:f().oneOfType([f().arrayOf(f().node),f().node]).isRequired};const q=({getHeaders:s=oe})=>{const{isDraftAndPublish:r}=e.useContext(J),{formatMessage:d}=(0,_.Z)(),M=s(r);return e.createElement(K.S,null,e.createElement(U.Z,null,e.createElement(i.g,null,e.createElement(se.T,null,d({id:"Settings.webhooks.event.select",defaultMessage:"Select event"}))),M.map(y=>["app.utils.publish","app.utils.unpublish"].includes(y.id)?e.createElement(i.g,{key:y.id,title:d({id:"Settings.webhooks.event.publish-tooltip",defaultMessage:"This event only exists for content with draft & publish enabled"})},e.createElement(re.Z,{variant:"sigma",textColor:"neutral600"},d(y))):e.createElement(i.g,{key:y.id},e.createElement(re.Z,{variant:"sigma",textColor:"neutral600"},d(y))))))};q.defaultProps={getHeaders:oe},q.propTypes={getHeaders:f().func};const ee=({providedEvents:s})=>{const{isDraftAndPublish:r}=e.useContext(J),d=s||Y(r),{values:M,handleChange:y}=(0,Q.u6)(),v="events",L=M.events,w=[],te=u(L),A=({target:{name:E,value:m}})=>{let C=new Set(L);m?C.add(E):C.delete(E),y({target:{name:v,value:Array.from(C)}})},$=({target:{name:E,value:m}})=>{let C=new Set(L);m?d[E].forEach(N=>{w.includes(N)||C.add(N)}):d[E].forEach(N=>C.delete(N)),y({target:{name:v,value:Array.from(C)}})};return e.createElement(j.X,null,Object.entries(d).map(([E,m])=>e.createElement(F,{disabledEvents:w,key:E,name:E,events:m,inputValue:te[E],handleSelect:A,handleSelectAll:$})))};ee.defaultProps={providedEvents:null},ee.propTypes={providedEvents:f().object};const ce=s=>s.replace(/-/g," ").split(" ").map(r=>r.charAt(0).toUpperCase()+r.slice(1).toLowerCase()).join(" "),F=({disabledEvents:s,name:r,events:d,inputValue:M,handleSelect:y,handleSelectAll:v})=>{const{formatMessage:L}=(0,_.Z)(),w=d.filter(m=>!s.includes(m)),te=M.length>0,A=M.length===w.length,$=({target:{name:m}})=>{v({target:{name:m,value:!A}})},E=5;return e.createElement(U.Z,null,e.createElement(i.f,null,e.createElement(X.X,{indeterminate:te&&!A,"aria-label":L({id:"global.select-all-entries",defaultMessage:"Select all entries"}),name:r,onChange:$,value:A},ce(r))),d.map(m=>e.createElement(i.f,{key:m},e.createElement(S.C,{disabled:s.includes(m),"aria-label":m,name:m,value:M.includes(m),onValueChange:C=>y({target:{name:m,value:C}})}))),d.length<E&&e.createElement(i.f,{colSpan:E-d.length}))};F.defaultProps={disabledEvents:[],events:[],inputValue:[],handleSelect(){},handleSelectAll(){}},F.propTypes={disabledEvents:f().array,events:f().array,inputValue:f().array,handleSelect:f().func,handleSelectAll:f().func,name:f().string.isRequired},P.Z={Root:le,Headers:q,Body:ee,EventRow:F}},77476:function(G,P,t){t.d(P,{Z:function(){return fe}});var e=t(32735),T=t(27649),g=t(45509),b=t(20108),W=t(53038),K=t(90769),U=t(82055),i=t(87933),se=t(41415),re=t(17e3),j=t(72850),X=t(15335),S=t(5803),Q=t(10369),ie=t(2438),f=t(66456),_=t(29439),D=t(92802),de=t(60216),u=t.n(de),B=t(67879),oe=t(9592),Y=t(36795);function J(){return e.createElement(Y.Z.Root,null,e.createElement(Y.Z.Headers,null),e.createElement(Y.Z.Body,null))}var le=t(76437),q=t(7563),ee=t(19406),ce=t(21428),F=t(90333);const s=["A-IM","Accept","Accept-Charset","Accept-Encoding","Accept-Language","Accept-Datetime","Access-Control-Request-Method","Access-Control-Request-Headers","Authorization","Cache-Control","Connection","Content-Length","Content-Type","Cookie","Date","Expect","Forwarded","From","Host","If-Match","If-Modified-Since","If-None-Match","If-Range","If-Unmodified-Since","Max-Forwards","Origin","Pragma","Proxy-Authorization","Range","Referer","TE","User-Agent","Upgrade","Via","Warning"],r=({name:n,onChange:a,value:o,...c})=>{const{values:{headers:h}}=(0,D.u6)(),[O,l]=(0,e.useState)(s);(0,e.useEffect)(()=>{l(s.filter(p=>!h?.some(x=>x.key!==o&&x.key===p)))},[h,o]);const H=p=>{a({target:{name:n,value:p}})},z=p=>{l(x=>[...x,p]),H(p)};return e.createElement(ce.XU,{...c,onClear:()=>H(""),onChange:H,onCreateOption:z,placeholder:"",value:o},O.map(p=>e.createElement(F.O,{value:p,key:p},p)))};r.defaultProps={value:void 0},r.propTypes={name:u().string.isRequired,onChange:u().func.isRequired,value:u().string};var d=r,y=()=>{const{formatMessage:n}=(0,B.Z)(),{values:a,errors:o}=(0,D.u6)();return e.createElement(i.k,{direction:"column",alignItems:"stretch",gap:1},e.createElement(le.Q,null,n({id:"Settings.webhooks.form.headers",defaultMessage:"Headers"})),e.createElement(j.x,{padding:8,background:"neutral100",hasRadius:!0},e.createElement(D.F2,{validateOnChange:!1,name:"headers",render:({push:c,remove:h})=>e.createElement(X.r,{gap:4},a.headers.map((O,l)=>e.createElement(e.Fragment,{key:`${l}.${O.key}`},e.createElement(S.P,{col:6},e.createElement(D.gN,{as:d,name:`headers.${l}.key`,"aria-label":`row ${l+1} key`,label:n({id:"Settings.webhooks.key",defaultMessage:"Key"}),error:o.headers?.[l]?.key&&o.headers[l].key})),e.createElement(S.P,{col:6},e.createElement(i.k,{alignItems:"flex-end"},e.createElement(j.x,{style:{flex:1}},e.createElement(D.gN,{as:Q.o,name:`headers.${l}.value`,"aria-label":`row ${l+1} value`,label:n({id:"Settings.webhooks.value",defaultMessage:"Value"}),error:o.headers?.[l]?.value&&o.headers[l].value})),e.createElement(i.k,{paddingLeft:2,style:{alignSelf:"center"},paddingTop:o.headers?.[l]?.value?0:5},e.createElement(g.fG,{disabled:a.headers.length===1,onClick:()=>h(l),label:n({id:"Settings.webhooks.headers.remove",defaultMessage:"Remove header row {number}"},{number:l+1})})))))),e.createElement(S.P,{col:12},e.createElement(q.A,{type:"button",onClick:()=>{c({key:"",value:""})},startIcon:e.createElement(ee.Z,null)},n({id:"Settings.webhooks.create.header",defaultMessage:"Create new header"}))))})))},v=t(49372),L=t(27169),w=t(35331),te=t(8471);const A=te.ZP.svg(({theme:n,color:a})=>`
   width: ${12/16}rem;
   height: ${12/16}rem;
 
   path {
     fill: ${n.colors[a]};
   }
-`),$=({isPending:n,statusCode:a})=>{const{formatMessage:o}=(0,B.Z)();return n?e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(A,{as:L.Z}),e.createElement(v.Z,null,o({id:"Settings.webhooks.trigger.pending",defaultMessage:"pending"}))):a>=200&&a<300?e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(A,{as:f.Z,color:"success700"}),e.createElement(v.Z,null,o({id:"Settings.webhooks.trigger.success",defaultMessage:"success"}))):a>=300?e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(A,{as:w.Z,color:"danger700"}),e.createElement(v.Z,null,o({id:"Settings.error",defaultMessage:"error"})," ",a)):null};$.propTypes={isPending:u().bool.isRequired,statusCode:u().number},$.defaultProps={statusCode:void 0};const E=({statusCode:n,message:a})=>{const{formatMessage:o}=(0,B.Z)();return n>=200&&n<300?e.createElement(i.k,{justifyContent:"flex-end"},e.createElement(v.Z,{textColor:"neutral600",ellipsis:!0},o({id:"Settings.webhooks.trigger.success.label",defaultMessage:"Trigger succeeded"}))):n>=300?e.createElement(i.k,{justifyContent:"flex-end"},e.createElement(i.k,{maxWidth:(0,g.Q1)(250),justifyContent:"flex-end",title:a},e.createElement(v.Z,{ellipsis:!0,textColor:"neutral600"},a))):null};E.propTypes={statusCode:u().number,message:u().string},E.defaultProps={statusCode:void 0,message:void 0};const m=({onCancel:n})=>{const{formatMessage:a}=(0,B.Z)();return e.createElement(i.k,{justifyContent:"flex-end"},e.createElement("button",{onClick:n,type:"button"},e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(v.Z,{textColor:"neutral400"},a({id:"Settings.webhooks.trigger.cancel",defaultMessage:"cancel"})),e.createElement(A,{as:w.Z,color:"neutral400"}))))};m.propTypes={onCancel:u().func.isRequired};const C=({isPending:n,onCancel:a,response:o})=>{const{statusCode:c,message:h}=o,{formatMessage:O}=(0,B.Z)();return e.createElement(j.x,{background:"neutral0",padding:5,shadow:"filterShadow",hasRadius:!0},e.createElement(X.r,{gap:4,style:{alignItems:"center"}},e.createElement(S.P,{col:3},e.createElement(v.Z,null,O({id:"Settings.webhooks.trigger.test",defaultMessage:"Test-trigger"}))),e.createElement(S.P,{col:3},e.createElement($,{isPending:n,statusCode:c})),e.createElement(S.P,{col:6},n?e.createElement(m,{onCancel:a}):e.createElement(E,{statusCode:c,message:h}))))};C.defaultProps={isPending:!1,onCancel(){},response:{}},C.propTypes={isPending:u().bool,onCancel:u().func,response:u().object};var N=C,k=t(24346);const ge=/(^$)|(^[A-Za-z][_0-9A-Za-z ]*$)/,Ee=/(^$)|((https?:\/\/.*)(d*)\/?(.*))/,he=({formatMessage:n})=>k.Ry().shape({name:k.Z_().required(n({id:"Settings.webhooks.validation.name.required",defaultMessage:"Name is required"})).matches(ge,n({id:"Settings.webhooks.validation.name.regex",defaultMessage:"The name must start with a letter and only contain letters, numbers, spaces and underscores"})),url:k.Z_().required(n({id:"Settings.webhooks.validation.url.required",defaultMessage:"Url is required"})).matches(Ee,n({id:"Settings.webhooks.validation.url.regex",defaultMessage:"The value must be a valid Url"})),headers:k.Vo(a=>{let o=k.IX();if(a.length===1){const{key:c,value:h}=a[0];if(!c&&!h)return o}return o.of(k.Ry().shape({key:k.Z_().required(n({id:"Settings.webhooks.validation.key",defaultMessage:"Key is required"})),value:k.Z_().required(n({id:"Settings.webhooks.validation.value",defaultMessage:"Value is required"}))}))}),events:k.IX()}),ue=({handleSubmit:n,triggerWebhook:a,isCreating:o,isTriggering:c,triggerResponse:h,data:O})=>{const{formatMessage:l}=(0,B.Z)(),[H,z]=(0,e.useState)(!1),p=(0,oe.c)(J,async()=>(await t.e(7030).then(t.bind(t,61442))).EventTableEE),x=Z=>Object.keys(Z).length?Object.entries(Z).map(([ne,ae])=>({key:ne,value:ae})):[{key:"",value:""}],R=(0,D.TA)({initialValues:{name:O?.name||"",url:O?.url||"",headers:x(O?.headers||{}),events:O?.events||[]},onSubmit(Z,{resetForm:ne,setSubmitting:ae}){n(Z),ne({values:Z}),ae(!1)},validationSchema:he({formatMessage:l}),validateOnChange:!1,validateOnBlur:!1});return p?e.createElement(D.Hy,{value:R},e.createElement(g.l0,{onSubmit:R.handleSubmit},e.createElement(U.T,{primaryAction:e.createElement(i.k,{gap:2},e.createElement(se.z,{onClick:()=>{a(),z(!0)},variant:"tertiary",startIcon:e.createElement(ie.Z,null),disabled:o||c,size:"L"},l({id:"Settings.webhooks.trigger",defaultMessage:"Trigger"})),e.createElement(se.z,{startIcon:e.createElement(f.Z,null),type:"submit",size:"L",disabled:!R.dirty,loading:R.isSubmitting},l({id:"global.save",defaultMessage:"Save"}))),title:o?l({id:"Settings.webhooks.create",defaultMessage:"Create a webhook"}):O?.name,navigationAction:e.createElement(g.rU,{startIcon:e.createElement(_.Z,null),to:"/settings/webhooks"},l({id:"global.back",defaultMessage:"Back"}))}),e.createElement(re.D,null,e.createElement(i.k,{direction:"column",alignItems:"stretch",gap:4},H&&e.createElement(N,{isPending:c,response:h,onCancel:()=>z(!1)}),e.createElement(j.x,{background:"neutral0",padding:8,shadow:"filterShadow",hasRadius:!0},e.createElement(i.k,{direction:"column",alignItems:"stretch",gap:6},e.createElement(X.r,{gap:6},e.createElement(S.P,{col:6},e.createElement(D.gN,{as:Q.o,name:"name",error:R?.errors?.name&&R.errors.name,label:l({id:"global.name",defaultMessage:"Name"}),required:!0})),e.createElement(S.P,{col:12},e.createElement(D.gN,{as:Q.o,name:"url",error:R?.errors?.url&&R.errors.url,label:l({id:"Settings.roles.form.input.url",defaultMessage:"Url"}),required:!0}))),e.createElement(y,null),e.createElement(p,null))))))):null};ue.propTypes={data:u().object,handleSubmit:u().func.isRequired,triggerWebhook:u().func.isRequired,isCreating:u().bool.isRequired,isTriggering:u().bool.isRequired,triggerResponse:u().object},ue.defaultProps={data:void 0,triggerResponse:void 0};var pe=ue;const me=n=>({...n,headers:n.headers.reduce((a,{key:o,value:c})=>(o!==""&&(a[o]=c),a),{})});var fe=()=>{const{params:{id:n}}=(0,W.$B)("/settings/webhooks/:id"),a=n==="create",{replace:o}=(0,W.k6)(),c=(0,g.lm)(),{formatAPIError:h}=(0,g.So)(),O=(0,b.useQueryClient)(),{isLoading:l}=(0,K.G)(),{put:H,get:z,post:p}=(0,g.kY)(),{isLoading:x,data:R,error:Z}=(0,b.useQuery)(["webhooks",n],async()=>{const{data:{data:I}}=await z(`/admin/webhooks/${n}`);return I},{enabled:!a});e.useEffect(()=>{Z&&c({type:"warning",message:h(Z)})},[Z,c,h]);const{isLoading:ne,data:ae,isIdle:ve,mutate:Me}=(0,b.useMutation)(()=>p(`/admin/webhooks/${n}/trigger`)),ye=()=>Me(null,{onError(I){c({type:"warning",message:h(I)})}}),Ce=(0,b.useMutation)(I=>p("/admin/webhooks",I)),Pe=(0,b.useMutation)(({id:I,body:V})=>H(`/admin/webhooks/${I}`,V)),be=async I=>{if(a){Ce.mutate(me(I),{onSuccess({data:V}){c({type:"success",message:{id:"Settings.webhooks.created"}}),o(`/settings/webhooks/${V.data.id}`)},onError(V){c({type:"warning",message:h(V)})}});return}Pe.mutate({id:n,body:me(I)},{onSuccess(){O.invalidateQueries(["webhooks",n]),c({type:"success",message:{id:"notification.form.success.fields"}})},onError(V){c({type:"warning",message:h(V)})}})};return x||l?e.createElement(g.dO,null):e.createElement(T.o,null,e.createElement(g.SL,{name:"Webhooks"}),e.createElement(pe,{data:R,handleSubmit:be,triggerWebhook:ye,isCreating:a,isTriggering:ne,isTriggerIdle:ve,triggerResponse:ae?.data.data}))}},5722:function(G,P,t){t.r(P);var e=t(32735),T=t(19565),g=t(15062),b=t(30305),W=t(77476);const K=()=>{const U=(0,g.v9)(b._);return e.createElement(T.O4,{permissions:U.settings.webhooks.create},e.createElement(W.Z,null))};P.default=K},63939:function(G,P,t){t.r(P);var e=t(32735),T=t(19565),g=t(15062),b=t(30305),W=t(77476);const K=()=>{const U=(0,g.v9)(b._);return e.createElement(T.O4,{permissions:U.settings.webhooks.update},e.createElement(W.Z,null))};P.default=K},90333:function(G,P,t){t.d(P,{O:function(){return T}});var e=t(21428);const T=e.Wx},29439:function(G,P,t){t.d(P,{Z:function(){return g}});var e=t(74512);const T=b=>(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1rem",height:"1rem",fill:"none",viewBox:"0 0 24 24",...b,children:(0,e.jsx)("path",{fill:"#212134",d:"M24 13.3a.2.2 0 0 1-.2.2H5.74l8.239 8.239a.2.2 0 0 1 0 .282L12.14 23.86a.2.2 0 0 1-.282 0L.14 12.14a.2.2 0 0 1 0-.282L11.86.14a.2.2 0 0 1 .282 0L13.98 1.98a.2.2 0 0 1 0 .282L5.74 10.5H23.8c.11 0 .2.09.2.2v2.6Z"})}),g=T}}]);
+`),$=({isPending:n,statusCode:a})=>{const{formatMessage:o}=(0,B.Z)();return n?e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(A,{as:L.Z}),e.createElement(v.Z,null,o({id:"Settings.webhooks.trigger.pending",defaultMessage:"pending"}))):a>=200&&a<300?e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(A,{as:f.Z,color:"success700"}),e.createElement(v.Z,null,o({id:"Settings.webhooks.trigger.success",defaultMessage:"success"}))):a>=300?e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(A,{as:w.Z,color:"danger700"}),e.createElement(v.Z,null,o({id:"Settings.error",defaultMessage:"error"})," ",a)):null};$.propTypes={isPending:u().bool.isRequired,statusCode:u().number},$.defaultProps={statusCode:void 0};const E=({statusCode:n,message:a})=>{const{formatMessage:o}=(0,B.Z)();return n>=200&&n<300?e.createElement(i.k,{justifyContent:"flex-end"},e.createElement(v.Z,{textColor:"neutral600",ellipsis:!0},o({id:"Settings.webhooks.trigger.success.label",defaultMessage:"Trigger succeeded"}))):n>=300?e.createElement(i.k,{justifyContent:"flex-end"},e.createElement(i.k,{maxWidth:(0,g.Q1)(250),justifyContent:"flex-end",title:a},e.createElement(v.Z,{ellipsis:!0,textColor:"neutral600"},a))):null};E.propTypes={statusCode:u().number,message:u().string},E.defaultProps={statusCode:void 0,message:void 0};const m=({onCancel:n})=>{const{formatMessage:a}=(0,B.Z)();return e.createElement(i.k,{justifyContent:"flex-end"},e.createElement("button",{onClick:n,type:"button"},e.createElement(i.k,{gap:2,alignItems:"center"},e.createElement(v.Z,{textColor:"neutral400"},a({id:"Settings.webhooks.trigger.cancel",defaultMessage:"cancel"})),e.createElement(A,{as:w.Z,color:"neutral400"}))))};m.propTypes={onCancel:u().func.isRequired};const C=({isPending:n,onCancel:a,response:o})=>{const{statusCode:c,message:h}=o,{formatMessage:O}=(0,B.Z)();return e.createElement(j.x,{background:"neutral0",padding:5,shadow:"filterShadow",hasRadius:!0},e.createElement(X.r,{gap:4,style:{alignItems:"center"}},e.createElement(S.P,{col:3},e.createElement(v.Z,null,O({id:"Settings.webhooks.trigger.test",defaultMessage:"Test-trigger"}))),e.createElement(S.P,{col:3},e.createElement($,{isPending:n,statusCode:c})),e.createElement(S.P,{col:6},n?e.createElement(m,{onCancel:a}):e.createElement(E,{statusCode:c,message:h}))))};C.defaultProps={isPending:!1,onCancel(){},response:{}},C.propTypes={isPending:u().bool,onCancel:u().func,response:u().object};var N=C,k=t(24346);const ge=/(^$)|(^[A-Za-z][_0-9A-Za-z ]*$)/,Ee=/(^$)|((https?:\/\/.*)(d*)\/?(.*))/,he=({formatMessage:n})=>k.Ry().shape({name:k.Z_().required(n({id:"Settings.webhooks.validation.name.required",defaultMessage:"Name is required"})).matches(ge,n({id:"Settings.webhooks.validation.name.regex",defaultMessage:"The name must start with a letter and only contain letters, numbers, spaces and underscores"})),url:k.Z_().required(n({id:"Settings.webhooks.validation.url.required",defaultMessage:"Url is required"})).matches(Ee,n({id:"Settings.webhooks.validation.url.regex",defaultMessage:"The value must be a valid Url"})),headers:k.Vo(a=>{let o=k.IX();if(a.length===1){const{key:c,value:h}=a[0];if(!c&&!h)return o}return o.of(k.Ry().shape({key:k.Z_().required(n({id:"Settings.webhooks.validation.key",defaultMessage:"Key is required"})),value:k.Z_().required(n({id:"Settings.webhooks.validation.value",defaultMessage:"Value is required"}))}))}),events:k.IX()}),ue=({handleSubmit:n,triggerWebhook:a,isCreating:o,isTriggering:c,triggerResponse:h,data:O})=>{const{formatMessage:l}=(0,B.Z)(),[H,z]=(0,e.useState)(!1),p=(0,oe.c)(J,async()=>(await t.e(7030).then(t.bind(t,61442))).EventTableEE),x=Z=>Object.keys(Z).length?Object.entries(Z).map(([ne,ae])=>({key:ne,value:ae})):[{key:"",value:""}],R=(0,D.TA)({initialValues:{name:O?.name||"",url:O?.url||"",headers:x(O?.headers||{}),events:O?.events||[]},onSubmit(Z,{resetForm:ne,setSubmitting:ae}){n(Z),ne({values:Z}),ae(!1)},validationSchema:he({formatMessage:l}),validateOnChange:!1,validateOnBlur:!1});return p?e.createElement(D.Hy,{value:R},e.createElement(g.l0,{onSubmit:R.handleSubmit},e.createElement(U.T,{primaryAction:e.createElement(i.k,{gap:2},e.createElement(se.z,{onClick:()=>{a(),z(!0)},variant:"tertiary",startIcon:e.createElement(ie.Z,null),disabled:o||c,size:"L"},l({id:"Settings.webhooks.trigger",defaultMessage:"Trigger"})),e.createElement(se.z,{startIcon:e.createElement(f.Z,null),type:"submit",size:"L",disabled:!R.dirty,loading:R.isSubmitting},l({id:"global.save",defaultMessage:"Save"}))),title:o?l({id:"Settings.webhooks.create",defaultMessage:"Create a webhook"}):O?.name,navigationAction:e.createElement(g.rU,{startIcon:e.createElement(_.Z,null),to:"/settings/webhooks"},l({id:"global.back",defaultMessage:"Back"}))}),e.createElement(re.D,null,e.createElement(i.k,{direction:"column",alignItems:"stretch",gap:4},H&&e.createElement(N,{isPending:c,response:h,onCancel:()=>z(!1)}),e.createElement(j.x,{background:"neutral0",padding:8,shadow:"filterShadow",hasRadius:!0},e.createElement(i.k,{direction:"column",alignItems:"stretch",gap:6},e.createElement(X.r,{gap:6},e.createElement(S.P,{col:6},e.createElement(D.gN,{as:Q.o,name:"name",error:R?.errors?.name&&R.errors.name,label:l({id:"global.name",defaultMessage:"Name"}),required:!0})),e.createElement(S.P,{col:12},e.createElement(D.gN,{as:Q.o,name:"url",error:R?.errors?.url&&R.errors.url,label:l({id:"Settings.roles.form.input.url",defaultMessage:"Url"}),required:!0}))),e.createElement(y,null),e.createElement(p,null))))))):null};ue.propTypes={data:u().object,handleSubmit:u().func.isRequired,triggerWebhook:u().func.isRequired,isCreating:u().bool.isRequired,isTriggering:u().bool.isRequired,triggerResponse:u().object},ue.defaultProps={data:void 0,triggerResponse:void 0};var pe=ue;const me=n=>({...n,headers:n.headers.reduce((a,{key:o,value:c})=>(o!==""&&(a[o]=c),a),{})});var fe=()=>{const{params:{id:n}}=(0,W.$B)("/settings/webhooks/:id"),a=n==="create",{replace:o}=(0,W.k6)(),c=(0,g.lm)(),{formatAPIError:h}=(0,g.So)(),O=(0,b.useQueryClient)(),{isLoading:l}=(0,K.G)(),{put:H,get:z,post:p}=(0,g.kY)(),{isLoading:x,data:R,error:Z}=(0,b.useQuery)(["webhooks",n],async()=>{const{data:{data:I}}=await z(`/admin/webhooks/${n}`);return I},{enabled:!a});e.useEffect(()=>{Z&&c({type:"warning",message:h(Z)})},[Z,c,h]);const{isLoading:ne,data:ae,isIdle:ve,mutate:Me}=(0,b.useMutation)(()=>p(`/admin/webhooks/${n}/trigger`)),ye=()=>Me(null,{onError(I){c({type:"warning",message:h(I)})}}),Ce=(0,b.useMutation)(I=>p("/admin/webhooks",I)),Pe=(0,b.useMutation)(({id:I,body:V})=>H(`/admin/webhooks/${I}`,V)),be=async I=>{if(a){Ce.mutate(me(I),{onSuccess({data:V}){c({type:"success",message:{id:"Settings.webhooks.created"}}),o(`/settings/webhooks/${V.data.id}`)},onError(V){c({type:"warning",message:h(V)})}});return}Pe.mutate({id:n,body:me(I)},{onSuccess(){O.invalidateQueries(["webhooks",n]),c({type:"success",message:{id:"notification.form.success.fields"}})},onError(V){c({type:"warning",message:h(V)})}})};return x||l?e.createElement(g.dO,null):e.createElement(T.o,null,e.createElement(g.SL,{name:"Webhooks"}),e.createElement(pe,{data:R,handleSubmit:be,triggerWebhook:ye,isCreating:a,isTriggering:ne,isTriggerIdle:ve,triggerResponse:ae?.data.data}))}},5722:function(G,P,t){t.r(P);var e=t(32735),T=t(45509),g=t(15062),b=t(30305),W=t(77476);const K=()=>{const U=(0,g.v9)(b._);return e.createElement(T.O4,{permissions:U.settings.webhooks.create},e.createElement(W.Z,null))};P.default=K},63939:function(G,P,t){t.r(P);var e=t(32735),T=t(45509),g=t(15062),b=t(30305),W=t(77476);const K=()=>{const U=(0,g.v9)(b._);return e.createElement(T.O4,{permissions:U.settings.webhooks.update},e.createElement(W.Z,null))};P.default=K},90333:function(G,P,t){t.d(P,{O:function(){return T}});var e=t(21428);const T=e.Wx},29439:function(G,P,t){t.d(P,{Z:function(){return g}});var e=t(74512);const T=b=>(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1rem",height:"1rem",fill:"none",viewBox:"0 0 24 24",...b,children:(0,e.jsx)("path",{fill:"#212134",d:"M24 13.3a.2.2 0 0 1-.2.2H5.74l8.239 8.239a.2.2 0 0 1 0 .282L12.14 23.86a.2.2 0 0 1-.282 0L.14 12.14a.2.2 0 0 1 0-.282L11.86.14a.2.2 0 0 1 .282 0L13.98 1.98a.2.2 0 0 1 0 .282L5.74 10.5H23.8c.11 0 .2.09.2.2v2.6Z"})}),g=T}}]);

package/build/{webhook-list-page.65e1b5bb.chunk.js → webhook-list-page.ca91df8b.chunk.js}

@@ -1,4 +1,4 @@
-"use strict";(self.webpackChunk_strapi_admin=self.webpackChunk_strapi_admin||[]).push([[4121],{93826:function(I,h,t){t.r(h),t.d(h,{default:function(){return me}});var e=t(32735),s=t(19565),c=t(15062),m=t(30305),g=t(94638),T=t(96709),D=t(27649),S=t(82055),P=t(99223),l=t(49372),y=t(41415),j=t(17e3),U=t(72850),_=t(56755),ee=t(73269),te=t(33827),K=t(94547),i=t(19786),V=t(82884),ne=t(3685),ae=t(35658),k=t(87933),E=t(74512),F=t(8471);const $=F.ZP.div`
+"use strict";(self.webpackChunk_strapi_admin=self.webpackChunk_strapi_admin||[]).push([[4121],{93826:function(I,h,t){t.r(h),t.d(h,{default:function(){return me}});var e=t(32735),s=t(45509),c=t(15062),m=t(30305),g=t(94638),T=t(96709),D=t(27649),S=t(82055),P=t(99223),l=t(49372),y=t(41415),j=t(17e3),U=t(72850),_=t(56755),ee=t(73269),te=t(33827),K=t(94547),i=t(19786),V=t(82884),ne=t(3685),ae=t(35658),k=t(87933),E=t(74512),F=t(8471);const $=F.ZP.div`
   background: ${({theme:o})=>o.colors.danger500};
   border: none;
   border-radius: 16px;

package/ee/admin/content-manager/components/Filter/CustomInputs/ReviewWorkflows/AssigneeFilter.js

@@ -0,0 +1,42 @@
+import React from 'react';
+
+import { Combobox, ComboboxOption } from '@strapi/design-system';
+import PropTypes from 'prop-types';
+import { useIntl } from 'react-intl';
+
+import { getDisplayName } from '../../../../../../../admin/src/content-manager/utils/getDisplayName';
+import { useAdminUsers } from '../../../../../../../admin/src/hooks/useAdminUsers';
+
+export const AssigneeFilter = ({ value, onChange }) => {
+  const { formatMessage } = useIntl();
+  const { users, isLoading } = useAdminUsers();
+
+  return (
+    <Combobox
+      value={value}
+      aria-label={formatMessage({
+        id: 'content-manager.components.Filters.usersSelect.label',
+        defaultMessage: 'Search and select an user to filter',
+      })}
+      onChange={onChange}
+      loading={isLoading}
+    >
+      {users.map((user) => {
+        return (
+          <ComboboxOption key={user.id} value={user.id.toString()}>
+            {getDisplayName(user, formatMessage)}
+          </ComboboxOption>
+        );
+      })}
+    </Combobox>
+  );
+};
+
+AssigneeFilter.propTypes = {
+  onChange: PropTypes.func.isRequired,
+  value: PropTypes.string,
+};
+
+AssigneeFilter.defaultProps = {
+  value: '',
+};

package/ee/admin/content-manager/components/Filter/CustomInputs/ReviewWorkflows/StageFilter.js

@@ -0,0 +1,70 @@
+import * as React from 'react';
+
+import { Flex, Loader, SingleSelect, SingleSelectOption, Typography } from '@strapi/design-system';
+import PropTypes from 'prop-types';
+import { useIntl } from 'react-intl';
+
+import { useReviewWorkflows } from '../../../../../pages/SettingsPage/pages/ReviewWorkflows/hooks/useReviewWorkflows';
+import { getStageColorByHex } from '../../../../../pages/SettingsPage/pages/ReviewWorkflows/utils/colors';
+
+export const StageFilter = ({ value, onChange, uid }) => {
+  const { formatMessage } = useIntl();
+  const {
+    workflows: [workflow],
+    isLoading,
+  } = useReviewWorkflows({ filters: { contentTypes: uid } });
+
+  return (
+    <SingleSelect
+      aria-label={formatMessage({
+        id: 'content-manager.components.Filters.reviewWorkflows.label',
+        defaultMessage: 'Search and select an workflow stage to filter',
+      })}
+      value={value}
+      onChange={onChange}
+      loading={isLoading}
+      // eslint-disable-next-line react/no-unstable-nested-components
+      customizeContent={() => (
+        <Flex as="span" justifyContent="space-between" alignItems="center" width="100%">
+          <Typography textColor="neutral800" ellipsis>
+            {value}
+          </Typography>
+          {isLoading ? <Loader small style={{ display: 'flex' }} /> : null}
+        </Flex>
+      )}
+    >
+      {(workflow?.stages ?? []).map(({ id, color, name }) => {
+        const { themeColorName } = getStageColorByHex(color);
+
+        return (
+          <SingleSelectOption
+            key={id}
+            startIcon={
+              <Flex
+                height={2}
+                background={color}
+                borderColor={themeColorName === 'neutral0' ? 'neutral150' : 'transparent'}
+                hasRadius
+                shrink={0}
+                width={2}
+              />
+            }
+            value={name}
+          >
+            {name}
+          </SingleSelectOption>
+        );
+      })}
+    </SingleSelect>
+  );
+};
+
+StageFilter.defaultProps = {
+  value: '',
+};
+
+StageFilter.propTypes = {
+  onChange: PropTypes.func.isRequired,
+  uid: PropTypes.string.isRequired,
+  value: PropTypes.string,
+};

package/ee/admin/content-manager/components/Filter/CustomInputs/ReviewWorkflows/constants.js

@@ -0,0 +1,71 @@
+import { getTrad } from '../../../../../../../admin/src/content-manager/utils';
+
+import { AssigneeFilter } from './AssigneeFilter';
+import { StageFilter } from './StageFilter';
+
+export const REVIEW_WORKFLOW_FILTERS = [
+  {
+    fieldSchema: {
+      type: 'relation',
+      mainField: {
+        name: 'name',
+
+        schema: {
+          type: 'string',
+        },
+      },
+    },
+
+    metadatas: {
+      customInput: StageFilter,
+
+      label: {
+        id: getTrad(`containers.ListPage.table-headers.reviewWorkflows.stage`),
+        defaultMessage: 'Review stage',
+      },
+    },
+
+    name: 'strapi_stage',
+  },
+
+  {
+    fieldSchema: {
+      type: 'relation',
+      mainField: {
+        name: 'id',
+
+        schema: {
+          type: 'int',
+        },
+      },
+    },
+
+    metadatas: {
+      customInput: AssigneeFilter,
+
+      customOperators: [
+        {
+          intlLabel: {
+            id: 'components.FilterOptions.FILTER_TYPES.$eq',
+            defaultMessage: 'is',
+          },
+          value: '$eq',
+        },
+        {
+          intlLabel: {
+            id: 'components.FilterOptions.FILTER_TYPES.$ne',
+            defaultMessage: 'is not',
+          },
+          value: '$ne',
+        },
+      ],
+
+      label: {
+        id: getTrad(`containers.ListPage.table-headers.reviewWorkflows.assignee.label`),
+        defaultMessage: 'Assignee',
+      },
+    },
+
+    name: 'strapi_assignee',
+  },
+];

package/ee/admin/content-manager/pages/EditView/InformationBox/InformationBoxEE.js

@@ -1,238 +1,30 @@
 import React from 'react';
 
-import { Flex, Loader, SingleSelect, SingleSelectOption, Typography } from '@strapi/design-system';
-import {
-  useAPIErrorHandler,
-  useCMEditViewDataManager,
-  useFetchClient,
-  useNotification,
-} from '@strapi/helper-plugin';
-import { useIntl } from 'react-intl';
-import { useMutation } from 'react-query';
+import { useCMEditViewDataManager } from '@strapi/helper-plugin';
 
 import { Information } from '../../../../../../admin/src/content-manager/pages/EditView/Information';
-import { useLicenseLimits } from '../../../../hooks/useLicenseLimits';
-import * as LimitsModal from '../../../../pages/SettingsPage/pages/ReviewWorkflows/components/LimitsModal';
-import {
-  CHARGEBEE_STAGES_PER_WORKFLOW_ENTITLEMENT_NAME,
-  CHARGEBEE_WORKFLOW_ENTITLEMENT_NAME,
-} from '../../../../pages/SettingsPage/pages/ReviewWorkflows/constants';
-import { useReviewWorkflows } from '../../../../pages/SettingsPage/pages/ReviewWorkflows/hooks/useReviewWorkflows';
-import { getStageColorByHex } from '../../../../pages/SettingsPage/pages/ReviewWorkflows/utils/colors';
 
-const ATTRIBUTE_NAME = 'strapi_stage';
+import { AssigneeSelect } from './components/AssigneeSelect';
+import { StageSelect } from './components/StageSelect';
 
 export function InformationBoxEE() {
   const {
-    initialData,
     isCreatingEntry,
-    layout: { uid, options },
-    isSingleType,
-    onChange,
+    layout: { options },
   } = useCMEditViewDataManager();
-  const { put } = useFetchClient();
-  // it is possible to rely on initialData here, because it always will
-  // be updated at the same time when modifiedData is updated, otherwise
-  // the entity is flagged as modified
-  const activeWorkflowStage = initialData?.[ATTRIBUTE_NAME] ?? null;
-  const hasReviewWorkflowsEnabled = options?.reviewWorkflows ?? false;
-  const { formatMessage } = useIntl();
-  const { formatAPIError } = useAPIErrorHandler();
-  const toggleNotification = useNotification();
-  const { getFeature } = useLicenseLimits();
-  const [showLimitModal, setShowLimitModal] = React.useState(false);
-
-  const {
-    meta,
-    workflows: [workflow],
-    isLoading: isWorkflowLoading,
-  } = useReviewWorkflows({ filters: { contentTypes: uid } });
-
-  const { error, isLoading, mutateAsync } = useMutation(
-    async ({ entityId, stageId, uid }) => {
-      const typeSlug = isSingleType ? 'single-types' : 'collection-types';
-
-      const {
-        data: { data: createdEntity },
-      } = await put(`/admin/content-manager/${typeSlug}/${uid}/${entityId}/stage`, {
-        data: { id: stageId },
-      });
-
-      // initialData and modifiedData have to stay in sync, otherwise the entity would be flagged
-      // as modified, which is what the boolean flag is for
-      onChange({ target: { name: ATTRIBUTE_NAME, value: createdEntity[ATTRIBUTE_NAME] } }, true);
-
-      return createdEntity;
-    },
-    {
-      onSuccess() {
-        toggleNotification({
-          type: 'success',
-          message: {
-            id: 'content-manager.reviewWorkflows.stage.notification.saved',
-            defaultMessage: 'Review stage updated',
-          },
-        });
-      },
-    }
-  );
-
-  const limits = getFeature('review-workflows');
-  const formattedError = (error && formatAPIError(error)) || null;
-
-  const handleStageChange = async ({ value: stageId }) => {
-    try {
-      /**
-       * If the current license has a limit:
-       * check if the total count of workflows exceeds that limit and display
-       * the limits modal.
-       *
-       * If the current license does not have a limit (e.g. offline license):
-       * do nothing (for now).
-       *
-       */
 
-      if (
-        limits?.[CHARGEBEE_WORKFLOW_ENTITLEMENT_NAME] &&
-        parseInt(limits[CHARGEBEE_WORKFLOW_ENTITLEMENT_NAME], 10) < meta.workflowCount
-      ) {
-        setShowLimitModal('workflow');
-
-        /**
-         * If the current license has a limit:
-         * check if the total count of stages exceeds that limit and display
-         * the limits modal.
-         *
-         * If the current license does not have a limit (e.g. offline license):
-         * do nothing (for now).
-         *
-         */
-      } else if (
-        limits?.[CHARGEBEE_STAGES_PER_WORKFLOW_ENTITLEMENT_NAME] &&
-        parseInt(limits[CHARGEBEE_STAGES_PER_WORKFLOW_ENTITLEMENT_NAME], 10) <
-          workflow.stages.length
-      ) {
-        setShowLimitModal('stage');
-      } else {
-        await mutateAsync({
-          entityId: initialData.id,
-          stageId,
-          uid,
-        });
-      }
-    } catch (error) {
-      // react-query@v3: the error doesn't have to be handled here
-      // see: https://github.com/TanStack/query/issues/121
-    }
-  };
-
-  const { themeColorName } = activeWorkflowStage?.color
-    ? getStageColorByHex(activeWorkflowStage?.color)
-    : {};
+  const hasReviewWorkflowsEnabled = options?.reviewWorkflows ?? false;
 
   return (
     <Information.Root>
       <Information.Title />
-
       {hasReviewWorkflowsEnabled && !isCreatingEntry && (
-        <SingleSelect
-          error={formattedError}
-          name={ATTRIBUTE_NAME}
-          id={ATTRIBUTE_NAME}
-          value={activeWorkflowStage?.id}
-          onChange={(value) => handleStageChange({ value })}
-          label={formatMessage({
-            id: 'content-manager.reviewWorkflows.stage.label',
-            defaultMessage: 'Review stage',
-          })}
-          startIcon={
-            <Flex
-              as="span"
-              height={2}
-              background={activeWorkflowStage?.color}
-              borderColor={themeColorName === 'neutral0' ? 'neutral150' : 'transparent'}
-              hasRadius
-              shrink={0}
-              width={2}
-              marginRight="-3px"
-            />
-          }
-          // eslint-disable-next-line react/no-unstable-nested-components
-          customizeContent={() => (
-            <Flex as="span" justifyContent="space-between" alignItems="center" width="100%">
-              <Typography textColor="neutral800" ellipsis>
-                {activeWorkflowStage?.name}
-              </Typography>
-              {isWorkflowLoading || isLoading ? <Loader small style={{ display: 'flex' }} /> : null}
-            </Flex>
-          )}
-        >
-          {workflow
-            ? workflow.stages.map(({ id, color, name }) => {
-                const { themeColorName } = getStageColorByHex(color);
-
-                return (
-                  <SingleSelectOption
-                    startIcon={
-                      <Flex
-                        height={2}
-                        background={color}
-                        borderColor={themeColorName === 'neutral0' ? 'neutral150' : 'transparent'}
-                        hasRadius
-                        shrink={0}
-                        width={2}
-                      />
-                    }
-                    value={id}
-                    textValue={name}
-                  >
-                    {name}
-                  </SingleSelectOption>
-                );
-              })
-            : []}
-        </SingleSelect>
+        <>
+          <StageSelect />
+          <AssigneeSelect />
+        </>
       )}
-
       <Information.Body />
-
-      <LimitsModal.Root
-        isOpen={showLimitModal === 'workflow'}
-        onClose={() => setShowLimitModal(false)}
-      >
-        <LimitsModal.Title>
-          {formatMessage({
-            id: 'content-manager.reviewWorkflows.workflows.limit.title',
-            defaultMessage: 'You’ve reached the limit of workflows in your plan',
-          })}
-        </LimitsModal.Title>
-
-        <LimitsModal.Body>
-          {formatMessage({
-            id: 'content-manager.reviewWorkflows.workflows.limit.body',
-            defaultMessage: 'Delete a workflow or contact Sales to enable more workflows.',
-          })}
-        </LimitsModal.Body>
-      </LimitsModal.Root>
-
-      <LimitsModal.Root
-        isOpen={showLimitModal === 'stage'}
-        onClose={() => setShowLimitModal(false)}
-      >
-        <LimitsModal.Title>
-          {formatMessage({
-            id: 'content-manager.reviewWorkflows.stages.limit.title',
-            defaultMessage: 'You have reached the limit of stages for this workflow in your plan',
-          })}
-        </LimitsModal.Title>
-
-        <LimitsModal.Body>
-          {formatMessage({
-            id: 'content-manager.reviewWorkflows.stages.limit.body',
-            defaultMessage: 'Try deleting some stages or contact Sales to enable more stages.',
-          })}
-        </LimitsModal.Body>
-      </LimitsModal.Root>
     </Information.Root>
   );
 }