@strapi/admin 4.10.0-beta.0 → 4.10.0

package/build/webhook-edit-page.a3b62049.chunk.js

@@ -0,0 +1,75 @@
+"use strict";(self.webpackChunk_strapi_admin=self.webpackChunk_strapi_admin||[]).push([[5162],{47272:function(ne,S,t){t.d(S,{Z:function(){return Se}});var e=t(32735),d=t(43383),L=t(27649),o=t(20108),O=t(53038),D=t(67927),J=t(60216),s=t.n(J),g=t(2438),m=t(66456),N=t(29439),Oe=t(82055),b=t(87933),he=t(41415),ke=t(17e3),ae=t(72850),le=t(15335),V=t(5803),ie=t(10369),Z=t(92802),j=t(67879),Ee=t(28847),W=t(49372),de=t(8471),ve=t(8284),Le=t(44426),Q=t(23940),ce=t.n(Q);const i=({disabledEvents:n,name:r,events:a,inputValue:l,handleChange:p,handleChangeAll:I})=>{const u=a.filter(E=>!n.includes(E)),f=l.length===u.length,C=l.length>0,y=({target:{name:E}})=>{I({target:{name:E,value:!f}})};return e.createElement("tr",null,e.createElement("td",null,e.createElement(ve.X,{indeterminate:C&&!f,"aria-label":"Select all entries",name:r,onChange:y,value:f},ce()(r))),a.map(E=>e.createElement("td",{key:E},e.createElement(Le.C,{disabled:n.includes(E),"aria-label":E,name:E,value:l.includes(E),onValueChange:M=>p({target:{name:E,value:M}})}))))};i.defaultProps={disabledEvents:[],events:[],inputValue:[],handleChange(){},handleChangeAll(){}},i.propTypes={disabledEvents:s().array,events:s().array,inputValue:s().array,handleChange:s().func,handleChangeAll:s().func,name:s().string.isRequired};var A=i,X=n=>n.reduce((r,a)=>{const l=a.split(".")[0];return r[l]||(r[l]=[]),r[l].push(a),r},{});const R=de.ZP.table`
+  td {
+    height: ${52/16}rem;
+    width: 10%;
+    vertical-align: middle;
+    text-align: center;
+  }
+
+  tbody tr:nth-child(odd) {
+    background: ${({theme:n})=>n.colors.neutral100};
+  }
+
+  tbody tr td:first-child {
+    padding-left: ${({theme:n})=>n.spaces[7]};
+  }
+`,H={headers:{default:[{id:"Settings.webhooks.events.create",defaultMessage:"Create"},{id:"Settings.webhooks.events.update",defaultMessage:"Update"},{id:"app.utils.delete",defaultMessage:"Delete"}],draftAndPublish:[{id:"Settings.webhooks.events.create",defaultMessage:"Create"},{id:"Settings.webhooks.events.update",defaultMessage:"Update"},{id:"app.utils.delete",defaultMessage:"Delete"},{id:"app.utils.publish",defaultMessage:"Publish"},{id:"app.utils.unpublish",defaultMessage:"Unpublish"}]},events:{default:{entry:["entry.create","entry.update","entry.delete"],media:["media.create","media.update","media.delete"]},draftAndPublish:{entry:["entry.create","entry.update","entry.delete","entry.publish","entry.unpublish"],media:["media.create","media.update","media.delete"]}}},be=({isDraftAndPublish:n})=>{const r=n?H.headers.draftAndPublish:H.headers.default,a=n?H.events.draftAndPublish:H.events.default,{formatMessage:l}=(0,j.Z)(),{values:p,handleChange:I}=(0,Z.u6)(),u="events",f=p.events,C=[],y=X(f),E=({target:{name:h,value:T}})=>{let F=new Set(f);T?F.add(h):F.delete(h),I({target:{name:u,value:Array.from(F)}})},M=({target:{name:h,value:T}})=>{let F=new Set(f);T?a[h].forEach(G=>{C.includes(G)||F.add(G)}):a[h].forEach(G=>F.delete(G)),I({target:{name:u,value:Array.from(F)}})};return e.createElement(b.k,{direction:"column",alignItems:"stretch",gap:1},e.createElement(Ee.Q,null,l({id:"Settings.webhooks.form.events",defaultMessage:"Events"})),e.createElement(R,null,e.createElement("thead",null,e.createElement("tr",null,e.createElement("td",null),r.map(h=>h==="app.utils.publish"||h==="app.utils.unpublish"?e.createElement("td",{key:h.id,title:l({id:"Settings.webhooks.event.publish-tooltip",defaultMessage:"This event only exists for content with draft & publish enabled"})},e.createElement(W.Z,{variant:"sigma",textColor:"neutral600"},l(h))):e.createElement("td",{key:h.id},e.createElement(W.Z,{variant:"sigma",textColor:"neutral600"},l(h)))))),e.createElement("tbody",null,Object.keys(a).map(h=>e.createElement(A,{disabledEvents:C,key:h,name:h,events:a[h],inputValue:y[h],handleChange:E,handleChangeAll:M})))))};be.propTypes={isDraftAndPublish:s().bool.isRequired};var ue=be,Re=t(19406),Y=t(7563),Te=t(42623),ge=t(90333),Ce=["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"];const re=({name:n,onChange:r,value:a,...l})=>{const[p,I]=(0,e.useState)(a?[...Ce,a]:Ce),u=C=>{r({target:{name:n,value:C}})},f=C=>{I(y=>[...y,C]),r({target:{name:n,value:C}})};return e.createElement(Te.X,{...l,onChange:u,onCreateOption:f,placeholder:"",value:a},p.map(C=>e.createElement(ge.O,{value:C,key:C},C)))};re.defaultProps={value:void 0},re.propTypes={name:s().string.isRequired,onChange:s().func.isRequired,value:s().string};var ye=re,Me=()=>{const{formatMessage:n}=(0,j.Z)(),{values:r,errors:a}=(0,Z.u6)();return e.createElement(b.k,{direction:"column",alignItems:"stretch",gap:1},e.createElement(Ee.Q,null,n({id:"Settings.webhooks.form.headers",defaultMessage:"Headers"})),e.createElement(ae.x,{padding:8,background:"neutral100",hasRadius:!0},e.createElement(Z.F2,{validateOnChange:!1,name:"headers",render:({push:l,remove:p})=>e.createElement(le.r,{gap:4},r.headers?.map((I,u)=>e.createElement(e.Fragment,{key:u},e.createElement(V.P,{col:6},e.createElement(Z.gN,{as:ye,name:`headers.${u}.key`,"aria-label":`row ${u+1} key`,label:n({id:"Settings.webhooks.key",defaultMessage:"Key"}),error:a.headers?.[u]?.key&&n({id:a.headers[u]?.key,defaultMessage:a.headers[u]?.key})})),e.createElement(V.P,{col:6},e.createElement(b.k,{alignItems:"flex-end"},e.createElement(ae.x,{style:{flex:1}},e.createElement(Z.gN,{as:ie.o,"aria-label":`row ${u+1} value`,label:n({id:"Settings.webhooks.value",defaultMessage:"Value"}),name:`headers.${u}.value`,error:a.headers?.[u]?.value&&n({id:a.headers[u]?.value,defaultMessage:a.headers[u]?.value})})),e.createElement(b.k,{paddingLeft:2,style:{alignSelf:"center"},paddingTop:a.headers?.[u]?.value?0:5},e.createElement(d.fG,{onClick:()=>r.headers.length!==1&&p(u),label:n({id:"Settings.webhooks.headers.remove",defaultMessage:"Remove header row {number}"},{number:u+1})})))))),e.createElement(V.P,{col:12},e.createElement(Y.A,{type:"button",onClick:()=>{l({key:"",value:""})},startIcon:e.createElement(Re.Z,null)},n({id:"Settings.webhooks.create.header",defaultMessage:"Create new header"}))))})))},Ae=t(27169),Pe=t(35331);const q=de.ZP.svg(({theme:n,color:r})=>`
+  width: ${12/16}rem;
+  height: ${12/16}rem;
+
+  path {
+    fill: ${n.colors[r]};
+  }
+`),B=({isPending:n,statusCode:r})=>{const{formatMessage:a}=(0,j.Z)();return n?e.createElement(b.k,{gap:2,alignItems:"center"},e.createElement(q,{as:Ae.Z}),e.createElement(W.Z,null,a({id:"Settings.webhooks.trigger.pending",defaultMessage:"pending"}))):r>=200&&r<300?e.createElement(b.k,{gap:2,alignItems:"center"},e.createElement(q,{as:m.Z,color:"success700"}),e.createElement(W.Z,null,a({id:"Settings.webhooks.trigger.success",defaultMessage:"success"}))):r>=300?e.createElement(b.k,{gap:2,alignItems:"center"},e.createElement(q,{as:Pe.Z,color:"danger700"}),e.createElement(W.Z,null,a({id:"Settings.error",defaultMessage:"error"})," ",r)):null};B.propTypes={isPending:s().bool.isRequired,statusCode:s().number},B.defaultProps={statusCode:void 0};const me=({statusCode:n,message:r})=>{const{formatMessage:a}=(0,j.Z)();return n>=200&&n<300?e.createElement(b.k,{justifyContent:"flex-end"},e.createElement(W.Z,{textColor:"neutral600",ellipsis:!0},a({id:"Settings.webhooks.trigger.success.label",defaultMessage:"Trigger succeeded"}))):n>=300?e.createElement(b.k,{justifyContent:"flex-end"},e.createElement(b.k,{maxWidth:(0,d.Q1)(250),justifyContent:"flex-end",title:r},e.createElement(W.Z,{ellipsis:!0,textColor:"neutral600"},r))):null};me.propTypes={statusCode:s().number,message:s().string},me.defaultProps={statusCode:void 0,message:void 0};const xe=({onCancel:n})=>{const{formatMessage:r}=(0,j.Z)();return e.createElement(b.k,{justifyContent:"flex-end"},e.createElement("button",{onClick:n,type:"button"},e.createElement(b.k,{gap:2,alignItems:"center"},e.createElement(W.Z,{textColor:"neutral400"},r({id:"Settings.webhooks.trigger.cancel",defaultMessage:"cancel"})),e.createElement(q,{as:Pe.Z,color:"neutral400"}))))};xe.propTypes={onCancel:s().func.isRequired};const x=({isPending:n,onCancel:r,response:a})=>{const{statusCode:l,message:p}=a,{formatMessage:I}=(0,j.Z)();return e.createElement(ae.x,{background:"neutral0",padding:5,shadow:"filterShadow",hasRadius:!0},e.createElement(le.r,{gap:4,style:{alignItems:"center"}},e.createElement(V.P,{col:3},e.createElement(W.Z,null,I({id:"Settings.webhooks.trigger.test",defaultMessage:"Test-trigger"}))),e.createElement(V.P,{col:3},e.createElement(B,{isPending:n,statusCode:l})),e.createElement(V.P,{col:6},n?e.createElement(xe,{onCancel:r}):e.createElement(me,{statusCode:l,message:p}))))};x.defaultProps={isPending:!1,onCancel(){},response:{}},x.propTypes={isPending:s().bool,onCancel:s().func,response:s().object};var Ie=x,w=t(24346);const De=/(^$)|(^[A-Za-z][_0-9A-Za-z ]*$)/,U=/(^$)|((https?:\/\/.*)(d*)\/?(.*))/;var z=w.Ry().shape({name:w.Z_(d.I0.string).required(d.I0.required).matches(De,d.I0.regex),url:w.Z_(d.I0.string).required(d.I0.required).matches(U,d.I0.regex),headers:w.Vo(n=>{let r=w.IX();if(n.length===1){const{key:a,value:l}=n[0];if(!a&&!l)return r}return r.of(w.Ry().shape({key:w.Z_().required(d.I0.required),value:w.Z_().required(d.I0.required)}))}),events:w.IX()});const pe=({handleSubmit:n,data:r,triggerWebhook:a,isCreating:l,isTriggering:p,triggerResponse:I,isDraftAndPublishEvents:u})=>{const{formatMessage:f}=(0,j.Z)(),[C,y]=(0,e.useState)(!1);return e.createElement(Z.J9,{onSubmit:n,initialValues:{name:r?.name||"",url:r?.url||"",headers:Object.keys(r?.headers||[]).length?Object.entries(r.headers).map(([E,M])=>({key:E,value:M})):[{key:"",value:""}],events:r?.events||[]},validationSchema:z,validateOnChange:!1,validateOnBlur:!1},({handleSubmit:E,errors:M})=>e.createElement(d.l0,{noValidate:!0},e.createElement(Oe.T,{primaryAction:e.createElement(b.k,{gap:2},e.createElement(he.z,{onClick:()=>{a(),y(!0)},variant:"tertiary",startIcon:e.createElement(g.Z,null),disabled:l||p,size:"L"},f({id:"Settings.webhooks.trigger",defaultMessage:"Trigger"})),e.createElement(he.z,{startIcon:e.createElement(m.Z,null),onClick:E,type:"submit",size:"L"},f({id:"global.save",defaultMessage:"Save"}))),title:l?f({id:"Settings.webhooks.create",defaultMessage:"Create a webhook"}):r?.name,navigationAction:e.createElement(d.rU,{startIcon:e.createElement(N.Z,null),to:"/settings/webhooks"},f({id:"global.back",defaultMessage:"Back"}))}),e.createElement(ke.D,null,e.createElement(b.k,{direction:"column",alignItems:"stretch",gap:4},C&&e.createElement("div",{className:"trigger-wrapper"},e.createElement(Ie,{isPending:p,response:I,onCancel:()=>y(!1)})),e.createElement(ae.x,{background:"neutral0",padding:8,shadow:"filterShadow",hasRadius:!0},e.createElement(b.k,{direction:"column",alignItems:"stretch",gap:6},e.createElement(le.r,{gap:6},e.createElement(V.P,{col:6},e.createElement(Z.gN,{as:ie.o,name:"name",error:M.name&&f({id:M.name}),label:f({id:"global.name",defaultMessage:"Name"}),required:!0})),e.createElement(V.P,{col:12},e.createElement(Z.gN,{as:ie.o,name:"url",error:M.url&&f({id:M.url}),label:f({id:"Settings.roles.form.input.url",defaultMessage:"Url"}),required:!0}))),e.createElement(Me,null),e.createElement(ue,{isDraftAndPublish:u})))))))};pe.propTypes={data:s().object,handleSubmit:s().func.isRequired,triggerWebhook:s().func.isRequired,isCreating:s().bool.isRequired,isDraftAndPublishEvents:s().bool.isRequired,isTriggering:s().bool.isRequired,triggerResponse:s().object},pe.defaultProps={data:void 0,triggerResponse:void 0};var k=pe;const oe=n=>({...n,headers:_(n.headers)}),_=n=>n.reduce((r,a)=>{const{key:l,value:p}=a;return l!==""?{...r,[l]:p}:r},{});var ee=oe,Se=()=>{const{params:{id:n}}=(0,O.$B)("/settings/webhooks/:id"),{replace:r}=(0,O.k6)(),{lockApp:a,unlockApp:l}=(0,d.o1)(),p=(0,d.lm)(),I=(0,o.useQueryClient)(),{isLoading:u,collectionTypes:f}=(0,D.bP)(),{put:C,get:y,post:E}=(0,d.kY)(),M=n==="create",{isLoading:h,data:T}=(0,o.useQuery)(["get-webhook",n],async()=>{try{const{data:{data:P}}=await y(`/admin/webhooks/${n}`);return P}catch{return p({type:"warning",message:{id:"notification.error"}}),null}},{enabled:!M}),{isLoading:F,data:G,isIdle:$e,mutate:Be}=(0,o.useMutation)(()=>E(`/admin/webhooks/${n}/trigger`)),Ue=()=>Be(null,{onError(){p({type:"warning",message:{id:"notification.error"}})}}),fe=(0,o.useMutation)(P=>E("/admin/webhooks",P)),c=(0,o.useMutation)(({id:P,body:te})=>C(`/admin/webhooks/${P}`,te)),v=async P=>{M?(a(),fe.mutate(ee(P),{onSuccess({data:te}){p({type:"success",message:{id:"Settings.webhooks.created"}}),r(`/settings/webhooks/${te.data.id}`),l()},onError(te){p({type:"warning",message:{id:"notification.error"}}),console.log(te),l()}})):(a(),c.mutate({id:n,body:ee(P)},{onSuccess(){I.invalidateQueries(["get-webhook",n]),p({type:"success",message:{id:"notification.form.success.fields"}}),l()},onError(te){p({type:"warning",message:{id:"notification.error"}}),console.log(te),l()}}))},K=e.useMemo(()=>f.some(P=>P.options.draftAndPublish===!0),[f]);return h||u?e.createElement(d.dO,null):e.createElement(L.o,null,e.createElement(d.SL,{name:"Webhooks"}),e.createElement(k,{handleSubmit:v,data:T,triggerWebhook:Ue,isCreating:M,isTriggering:F,isTriggerIdle:$e,triggerResponse:G?.data.data,isDraftAndPublishEvents:K}))}},33238:function(ne,S,t){t.r(S);var e=t(32735),d=t(43383),L=t(83983),o=t(47272);const O=()=>e.createElement(d.O4,{permissions:L.Z.settings.webhooks.create},e.createElement(o.Z,null));S.default=O},59021:function(ne,S,t){t.r(S);var e=t(32735),d=t(43383),L=t(83983),o=t(47272);const O=()=>e.createElement(d.O4,{permissions:L.Z.settings.webhooks.update},e.createElement(o.Z,null));S.default=O},42623:function(ne,S,t){t.d(S,{h:function(){return Q},X:function(){return ce}});var e=t(32735),d=t(35331),L=t(16899),o=t(60216),O=t(90333),D=t(91225),J=t(17289),s=t(94486);const g={Close:"Close",CloseSelect:"CloseSelect",First:"First",Last:"Last",Next:"Next",Open:"Open",PageDown:"PageDown",PageUp:"PageUp",Previous:"Previous",Select:"Select",Space:"Space",Type:"Type"},m={Close:"Close",First:"First",Last:"Last",Next:"Next",Open:"Open",Previous:"Previous",Select:"Select",UpLevel:"UpLevel"};function N(i=[],A=null,$=[]){const X=String(A??"").toLowerCase();return X?i.filter(R=>R.props.children.toString().toLowerCase().includes(X)&&$.indexOf(R)<0):i}function Oe(i,A){if(!A&&i===s.y.DOWN)return g.Open;if(i===s.y.DOWN)return g.Next;if(i===s.y.UP)return g.Previous;if(i===s.y.HOME)return g.First;if(i===s.y.END)return g.Last;if(i===s.y.ESCAPE)return g.Close;if(i===s.y.ENTER)return g.CloseSelect;if(i===s.y.BACKSPACE||i===s.y.CLEAR||i.length===1)return g.Type}function b(i,A,$){switch($){case g.First:return 0;case g.Last:return A;case g.Previous:return Math.max(0,i-1);case g.Next:return Math.min(A,i+1);default:return i}}function he(i){(0,J.Z)(i,{scrollMode:"if-needed",block:"nearest",inline:"nearest"}).forEach(({el:A,top:$,left:X})=>{A.scrollTop=$,A.scrollLeft=X})}var ke=t(72850),ae=t(87107),le=t(28847),V=t(67014),ie=t(47851),Z=t(87933),j=t(74971),Ee=t(97405),W=t(4101),de=t(93958),ve=t(49372),Le=t(3685);const Q=({children:i,clearLabel:A,creatable:$,createMessage:X,disabled:R,error:H,hasMoreItems:be,hint:ue,id:Re,label:Y,labelAction:Te,loading:ge,loadingMessage:We,noOptionsMessage:Ce,onChange:re,onClear:ye,onCreateOption:we,onInputChange:Me,onLoadMore:Ae,placeholder:Pe,required:q,value:B,...me})=>{const xe=()=>i.find(c=>c.props?.value.toLowerCase()===B.toLowerCase()).props?.children,[x,Ie]=(0,e.useState)(0),[w,De]=(0,e.useState)(null),[U,Ze]=(0,e.useState)(i),[z,pe]=(0,e.useState)(!1),[k,oe]=(0,e.useState)(""),_=(0,e.useRef)(),ee=(0,e.useRef)(!1),se=(0,e.useRef)(),Se=(0,e.useRef)(),n=(0,e.useRef)(),r=(0,e.useRef)(!0),a=(0,j.M)(Re),l=`${a}-label`;if(!Y&&!me["aria-label"])throw new Error('The Combobox component needs a "label" or an "aria-label" props');(0,e.useEffect)(()=>{Ze(N(i,k))},[k,i]),(0,e.useEffect)(()=>{z&&_.current&&he(_.current)},[x,z]),(0,e.useLayoutEffect)(()=>{r.current&&(r.current=!1)},[B]);const p=z?`${a}-${x}`:"",I=()=>{re(null),oe("")},u=c=>{Me&&Me(c);const v=se.current.value;Ze(N(i,v)),Ie(0),De(null),k!==v&&oe(v),z||T(!0,!1)},f=c=>{const{key:v}=c,K=$&&k?U.length:U.length-1,P=Oe(v,z);switch(B&&!k&&v===s.y.BACKSPACE&&I(),P){case g.Next:{if(x===K){y(0);break}y(b(x,K,P));break}case g.Previous:{if(x===0){y(K);break}y(b(x,K,P));break}case g.Last:case g.First:{if(x===K){y(0);break}y(b(x,K,P));break}case g.CloseSelect:c.preventDefault(),h(x);break;case g.Close:c.preventDefault(),T(!1);break;case g.Open:T(!0);break}},C=c=>{if(c.preventDefault(),B&&!ee.current&&oe(""),ee.current){ee.current=!1;return}T(!1,!1)},y=c=>{Ie(c)},E=c=>{y(c),h(c)},M=()=>{ee.current=!0},h=c=>{const v=U[c];if(oe(""),v){re(v.props.value),T(!1);return}$&&(we(k),T(!1))},T=(c,v=!0)=>{pe(c),v&&se.current.focus()},F=e.Children.toArray(U).map((c,v)=>{const K=x===v;return(0,e.cloneElement)(c,{id:`${a}-${v}`,"aria-selected":w===v,"aria-posinset":v+1,"aria-setsize":e.Children.toArray(U).length,ref(P){K&&(_.current=P)},onClick:()=>E(v),onMouseDown:M,isSelected:K})}),G=()=>{se.current.focus(),ye&&ye(),I()},$e=()=>{se.current.focus(),T(!0)},Be=()=>{const c=U.findIndex(v=>v.props?.children===k);return k&&c===-1},Ue=c=>{c.preventDefault(),T(c,!0)};let fe;return H?fe=`${a}-error`:ue&&(fe=`${a}-hint`),e.createElement(ae.g,{hint:ue,error:H,id:a,required:q},e.createElement(Le.T,{"aria-live":"polite","aria-atomic":"false","aria-relevant":"additions text"},B),e.createElement(Z.k,{direction:"column",alignItems:"stretch",gap:Y||ue||H?1:0},Y&&e.createElement(le.Q,{action:Te},Y),e.createElement(D.d8,{ref:Se,$disabled:R,hasError:H},e.createElement(D.fv,{wrap:"wrap"},!k&&B&&e.createElement(D.K7,{id:`${a}-selected-value`},e.createElement(ve.Z,null,xe())),e.createElement(D.II,{"aria-activedescendant":p,"aria-autocomplete":"list","aria-controls":`${a}-listbox`,"aria-disabled":R,"aria-expanded":z,"aria-haspopup":"listbox","aria-describedby":fe,autoComplete:"off",autoCorrect:"off",id:a,onBlur:R?void 0:C,onClick:R?void 0:Ue,onInput:R?void 0:u,onKeyDown:R?void 0:f,placeholder:B?"":Pe,readOnly:R,ref:se,required:q,role:"combobox",spellCheck:"off",type:"text",value:k})),e.createElement(Z.k,null,(B||k)&&e.createElement(de.zb,{id:`${a}-clear`,"aria-label":A,disabled:R,paddingLeft:3,as:"button",onClick:G,type:"button"},e.createElement(d.Z,null)),e.createElement(de.AV,{disabled:R,paddingLeft:3,"aria-hidden":!0,as:"button",onClick:$e,tabIndex:-1,type:"button"},e.createElement(L.Z,null)))),e.createElement(V.J,null),e.createElement(ie.c,null)),z&&e.createElement(W.J2,{id:`${a}-popover`,source:Se,spacing:4,fullWidth:!0,intersectionId:`${a}-listbox-popover-intersection`,onReachEnd:be&&!ge?Ae:void 0},e.createElement("div",{role:"listbox",ref:n,id:`${a}-listbox`,"aria-labelledby":Y?l:void 0},(Boolean(U.length)||$)&&e.createElement(e.Fragment,null,F,Be()&&$&&e.createElement(O.O,{isSelected:x===U.length,ref:c=>{x===U.length&&(_.current=c)},onMouseDown:M,onClick:()=>h(),taindex:0},X(k))),!U.length&&!$&&!ge&&e.createElement(ke.x,{paddingLeft:4,paddingRight:4,paddingTop:2,paddingBottom:2,ref:_},e.createElement(ve.Z,{textColor:"neutral800"},Ce(k))),ge&&e.createElement(Z.k,{justifyContent:"center",alignItems:"center",paddingTop:2,paddingBottom:2},e.createElement(Ee.a,{small:!0},We)))))},ce=i=>e.createElement(Q,{...i,creatable:!0});Q.defaultProps={"aria-label":void 0,clearLabel:"clear",creatable:!1,createMessage:i=>`Create "${i}"`,disabled:!1,error:void 0,hasMoreItems:!1,hint:void 0,id:void 0,label:void 0,loading:!1,loadingMessage:"Loading content...",noOptionsMessage:()=>"No results found",onClear:void 0,onCreateOption:void 0,onInputChange:void 0,onLoadMore:void 0,placeholder:"Select or enter a value",value:void 0},ce.defaultProps=Q.defaultProps,Q.propTypes={"aria-label":o.string,children:o.oneOfType([o.arrayOf(o.node),o.node]),clearLabel:o.string,creatable:o.bool,createMessage:o.func,disabled:o.bool,error:o.string,hasMoreItems:o.bool,id:o.string,hint:o.oneOfType([o.string,o.node,o.arrayOf(o.node)]),label:o.string,labelAction:o.element,loading:o.bool,loadingMessage:o.string,noOptionsMessage:o.func,onChange:o.func.isRequired,onClear:o.func,onCreateOption:o.func,onInputChange:o.func,onLoadMore:o.func,placeholder:o.string,value:o.string},ce.propTypes={...Q.propTypes,onCreateOption:o.func.isRequired}},90333:function(ne,S,t){t.d(S,{O:function(){return O}});var e=t(32735),d=t(60216),L=t(91225),o=t(49372);const O=(0,e.forwardRef)(({isSelected:D,children:J,...s},g)=>e.createElement(L.Zq,{hasRadius:!0,paddingLeft:4,paddingRight:4,paddingTop:2,paddingBottom:2,role:"option",background:"neutral0",isSelected:D,ref:g,...s},e.createElement(o.Z,{textColor:D?"primary600":"neutral800",fontWeight:D?"bold":null},J)));O.defaultProps={isSelected:!1},O.propTypes={children:d.oneOfType([d.string,d.number]).isRequired,isSelected:d.bool},O.displayName="ComboboxOption"},91225:function(ne,S,t){t.d(S,{II:function(){return s},K7:function(){return D},Zq:function(){return g},d8:function(){return O},fv:function(){return J}});var e=t(8471),d=t(72850),L=t(87933),o=t(30350);const O=(0,e.ZP)(L.k)`
+  position: relative;
+  border: 1px solid ${({theme:m,hasError:N})=>N?m.colors.danger600:m.colors.neutral200};
+  padding-right: ${({theme:m})=>m.spaces[3]};
+  padding-left: ${({theme:m})=>m.spaces[3]};
+  border-radius: ${({theme:m})=>m.borderRadius};
+  background: ${({theme:m})=>m.colors.neutral0};
+
+  ${({theme:m,$disabled:N})=>N?`
+    color: ${m.colors.neutral600};
+    background: ${m.colors.neutral150};
+  `:void 0}
+
+  ${(0,o.k3)()}
+`,D=e.ZP.div`
+  padding: 1px 2px;
+  grid-area: 1 / 1 / 2 / 3;
+`,J=(0,e.ZP)(L.k)`
+  display: grid;
+  flex: 1 1 0%;
+  position: relative;
+`,s=e.ZP.input`
+  display: inline-grid;
+  grid-area: 1 / 1 / 2 / 3;
+  grid-template-columns: 0px min-content;
+  background: transparent;
+  min-height: ${40/16}rem;
+  border: none;
+  flex: 1;
+  font-size: ${14/16}rem;
+  color: ${({theme:m})=>m.colors.neutral800};
+  outline: none;
+  &:focus-visible {
+    outline: none;
+    box-shadow: none;
+    outline-offset: 0;
+  }
+  &[aria-disabled='true'] {
+    background: inherit;
+    color: inherit;
+    cursor: not-allowed;
+  }
+`,g=(0,e.ZP)(d.x)`
+  width: 100%;
+  border: none;
+  text-align: left;
+  outline-offset: -3px;
+  ${({isSelected:m,theme:N})=>m&&`background: ${N.colors.primary100};`}
+
+  &:hover {
+    background: ${({theme:m})=>m.colors.primary100};
+  }
+`},29439:function(ne,S,t){t.d(S,{Z:function(){return L}});var e=t(74512);const d=o=>(0,e.jsx)("svg",{width:"1rem",height:"1rem",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...o,children:(0,e.jsx)("path",{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",fill:"#212134"})}),L=d}}]);

package/build/webhook-list-page.ca38eeef.chunk.js

@@ -0,0 +1,71 @@
+"use strict";(self.webpackChunk_strapi_admin=self.webpackChunk_strapi_admin||[]).push([[4121],{74767:function(U,p,t){t.r(p),t.d(p,{default:function(){return be}});var e=t(32735),s=t(43383),b=t(83983),h=t(53038),L=t(67879),O=t(94638),C=t(96709),D=t(27649),E=t(82055),f=t(99223),d=t(49372),M=t(41415),x=t(17e3),H=t(72850),te=t(56755),ne=t(73269),le=t(33827),G=t(94547),m=t(19786),N=t(44426),ae=t(3685),oe=t(35658),S=t(87933),y=t(60216),V=t(8471);const $=V.ZP.div`
+  background: ${({theme:l})=>l.colors.danger500};
+  border: none;
+  border-radius: 16px;
+  position: relative;
+  height: ${24/16}rem;
+  width: ${40/16}rem;
+
+  & span {
+    font-size: ${({visibleLabels:l})=>l?"1rem":0};
+  }
+
+  &:before {
+    content: '';
+    background: ${({theme:l})=>l.colors.neutral0};
+    width: 1rem;
+    height: 1rem;
+    border-radius: 50%;
+    position: absolute;
+    transition: all 0.5s;
+    left: ${({theme:l})=>l.spaces[1]};
+    top: ${({theme:l})=>l.spaces[1]};
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    &:before {
+      transition: none;
+    }
+  }
+`,se=V.ZP.button`
+  background: transparent;
+  padding: 0;
+  border: none;
+
+  &[aria-checked='true'] ${$} {
+    background: ${({theme:l})=>l.colors.success500};
+  }
+
+  &[aria-checked='true'] ${$}:before {
+    transform: translateX(1rem);
+  }
+`,W=e.forwardRef(({label:l,onChange:r,onLabel:o,offLabel:c,selected:T,visibleLabels:v,...u},a)=>e.createElement(se,{ref:a,role:"switch","aria-checked":T,"aria-label":l,onClick:r,visibleLabels:v,type:"button",...u},e.createElement(S.k,null,e.createElement($,null,e.createElement("span",null,o),e.createElement("span",null,c)),v&&e.createElement(H.x,{as:"span","aria-hidden":!0,paddingLeft:2,color:T?"success600":"danger600"},T?o:c))));W.defaultProps={onLabel:"On",offLabel:"Off",visibleLabels:!1},W.propTypes={label:y.string.isRequired,offLabel:y.string,onChange:y.func.isRequired,onLabel:y.string,selected:y.bool.isRequired,visibleLabels:y.bool},W.displayName="Switch";var j=t(50563),re=t(9695),R=t(19406),F=t(4038),ie=t(68625),de=t(54725),ce=t(97889),Ee=t(3040),me=t.n(Ee);const he={webhooks:[],webhooksToDelete:[],webhookToDelete:null,loadingWebhooks:!0};var ue=(l,r)=>(0,ce.ZP)(l,o=>{switch(r.type){case"GET_DATA_SUCCEEDED":{o.webhooks=r.data,o.loadingWebhooks=!1;break}case"TOGGLE_LOADING":{o.loadingWebhooks=!l.loadingWebhooks;break}case"SET_WEBHOOK_ENABLED":{me()(o,["webhooks",...r.keys],r.value);break}case"SET_WEBHOOK_TO_DELETE":{o.webhookToDelete=r.id;break}case"SET_WEBHOOKS_TO_DELETE":{r.value?o.webhooksToDelete.push(r.id):o.webhooksToDelete=l.webhooksToDelete.filter(c=>c!==r.id);break}case"SET_ALL_WEBHOOKS_TO_DELETE":{l.webhooksToDelete.length===0?o.webhooksToDelete=l.webhooks.map(c=>c.id):o.webhooksToDelete=[];break}case"WEBHOOKS_DELETED":{o.webhooks=l.webhooks.filter(c=>!l.webhooksToDelete.includes(c.id)),o.webhooksToDelete=[];break}case"WEBHOOK_DELETED":{o.webhooks=l.webhooks.filter((c,T)=>T!==r.index),o.webhookToDelete=null;break}default:return o}}),ge=()=>{const{isLoading:l,allowedActions:{canCreate:r,canRead:o,canUpdate:c,canDelete:T}}=(0,s.ss)(b.Z.settings.webhooks),v=(0,s.lm)(),u=(0,e.useRef)(!0),{formatMessage:a}=(0,L.Z)(),[fe,B]=(0,e.useState)(!1),[{webhooks:P,webhooksToDelete:Z,webhookToDelete:K,loadingWebhooks:I},g]=(0,e.useReducer)(ue,he),{notifyStatus:z}=(0,O.G)(),{get:Q,del:Te,post:ve,put:De}=(0,s.kY)();(0,s.go)();const{push:pe}=(0,h.k6)(),{pathname:X}=(0,h.TH)(),A=P.length,k=Z.length,Y=n=>P.findIndex(i=>i.id===n);(0,e.useEffect)(()=>(u.current=!0,()=>{u.current=!1}),[]),(0,e.useEffect)(()=>{o&&(async()=>{try{const{data:{data:i}}=await Q("/admin/webhooks");u.current&&(g({type:"GET_DATA_SUCCEEDED",data:i}),z("webhooks have been loaded"))}catch(i){console.log(i),u.current&&(i.code!==20&&v({type:"warning",message:{id:"notification.error"}}),g({type:"TOGGLE_LOADING"}))}})()},[o,Q,z,v]);const Le=()=>{B(n=>!n)},Oe=()=>{K?ye():Ce()},ye=async()=>{try{await Te(`/admin/webhooks/${K}`),g({type:"WEBHOOK_DELETED",index:Y(K)})}catch(n){n.code!==20&&v({type:"warning",message:{id:"notification.error"}})}B(!1)},Ce=async()=>{const n={ids:Z};try{await ve("/admin/webhooks/batch-delete",n),u.current&&g({type:"WEBHOOKS_DELETED"})}catch(i){u.current&&i.code!==20&&v({type:"warning",message:{id:"notification.error"}})}B(!1)},J=n=>{B(!0),n!=="all"&&g({type:"SET_WEBHOOK_TO_DELETE",id:n})},ke=async(n,i)=>{const q=Y(i),Be=P[q],_=[q,"isEnabled"],ee={...Be,isEnabled:n};delete ee.id;try{g({type:"SET_WEBHOOK_ENABLED",keys:_,value:n}),await De(`/admin/webhooks/${i}`,ee)}catch(Pe){u.current&&(g({type:"SET_WEBHOOK_ENABLED",keys:_,value:!n}),Pe.code!==20&&v({type:"warning",message:{id:"notification.error"}}))}},Me=()=>{g({type:"SET_ALL_WEBHOOKS_TO_DELETE"})},We=(n,i)=>{g({type:"SET_WEBHOOKS_TO_DELETE",value:n,id:i})},w=n=>{pe(`${X}/${n}`)};return e.createElement(C.A,null,e.createElement(s.SL,{name:"Webhooks"}),e.createElement(D.o,{"aria-busy":l||I},e.createElement(E.T,{title:a({id:"Settings.webhooks.title",defaultMessage:"Webhooks"}),subtitle:a({id:"Settings.webhooks.list.description",defaultMessage:"Get POST changes notifications"}),primaryAction:r&&!I&&e.createElement(s.Qj,{startIcon:e.createElement(R.Z,null),variant:"default",to:`${X}/create`,size:"S"},a({id:"Settings.webhooks.list.button.add",defaultMessage:"Create new webhook"}))}),k>0&&T&&e.createElement(f.Z,{startActions:e.createElement(e.Fragment,null,e.createElement(d.Z,{variant:"epsilon",textColor:"neutral600"},a({id:"Settings.webhooks.to.delete",defaultMessage:"{webhooksToDeleteLength, plural, one {# asset} other {# assets}} selected"},{webhooksToDeleteLength:k})),e.createElement(M.z,{onClick:()=>J("all"),startIcon:e.createElement(F.Z,null),size:"L",variant:"danger-light"},a({id:"global.delete",defaultMessage:"Delete"})))}),e.createElement(x.D,null,l||I?e.createElement(H.x,{background:"neutral0",padding:6,shadow:"filterShadow",hasRadius:!0},e.createElement(s.dO,null)):A>0?e.createElement(te.i,{colCount:5,rowCount:A+1,footer:e.createElement(ne.c,{onClick:()=>r?w("create"):{},icon:e.createElement(R.Z,null)},a({id:"Settings.webhooks.list.button.add",defaultMessage:"Create new webhook"}))},e.createElement(le.h,null,e.createElement(G.Tr,null,e.createElement(m.Th,null,e.createElement(N.C,{"aria-label":a({id:"global.select-all-entries",defaultMessage:"Select all entries"}),indeterminate:k>0&&k<A,value:k===A,onValueChange:Me})),e.createElement(m.Th,{width:"20%"},e.createElement(d.Z,{variant:"sigma",textColor:"neutral600"},a({id:"global.name",defaultMessage:"Name"}))),e.createElement(m.Th,{width:"60%"},e.createElement(d.Z,{variant:"sigma",textColor:"neutral600"},a({id:"Settings.webhooks.form.url",defaultMessage:"URL"}))),e.createElement(m.Th,{width:"20%"},e.createElement(d.Z,{variant:"sigma",textColor:"neutral600"},a({id:"Settings.webhooks.list.th.status",defaultMessage:"Status"}))),e.createElement(m.Th,null,e.createElement(ae.T,null,a({id:"Settings.webhooks.list.th.actions",defaultMessage:"Actions"}))))),e.createElement(oe.p,null,P.map(n=>e.createElement(G.Tr,{key:n.id,...(0,s.X7)({fn:()=>w(n.id),condition:c})},e.createElement(m.Td,{...s.UW},e.createElement(N.C,{"aria-label":`${a({id:"global.select",defaultMessage:"Select"})} ${n.name}`,value:Z?.includes(n.id),onValueChange:i=>We(i,n.id),id:"select",name:"select"})),e.createElement(m.Td,null,e.createElement(d.Z,{fontWeight:"semiBold",textColor:"neutral800"},n.name)),e.createElement(m.Td,null,e.createElement(d.Z,{textColor:"neutral800"},n.url)),e.createElement(m.Td,null,e.createElement(S.k,{...s.UW},e.createElement(W,{onLabel:a({id:"global.enabled",defaultMessage:"Enabled"}),offLabel:a({id:"global.disabled",defaultMessage:"Disabled"}),label:`${n.name} ${a({id:"Settings.webhooks.list.th.status",defaultMessage:"Status"})}`,selected:n.isEnabled,onChange:()=>ke(!n.isEnabled,n.id),visibleLabels:!0}))),e.createElement(m.Td,null,e.createElement(S.k,{gap:1,...s.UW},c&&e.createElement(j.h,{onClick:()=>{w(n.id)},label:a({id:"Settings.webhooks.events.update",defaultMessage:"Update"}),icon:e.createElement(ie.Z,null),noBorder:!0}),T&&e.createElement(j.h,{onClick:()=>J(n.id),label:a({id:"global.delete",defaultMessage:"Delete"}),icon:e.createElement(F.Z,null),noBorder:!0,id:`delete-${n.id}`}))))))):e.createElement(re.x,{icon:e.createElement(de.Z,{width:"160px"}),content:a({id:"Settings.webhooks.list.empty.description",defaultMessage:"No webhooks found"}),action:e.createElement(M.z,{variant:"secondary",startIcon:e.createElement(R.Z,null),onClick:()=>r?w("create"):{}},a({id:"Settings.webhooks.list.button.add",defaultMessage:"Create new webhook"}))}))),e.createElement(s.QH,{isOpen:fe,onToggleDialog:Le,onConfirm:Oe}))},be=()=>e.createElement(s.O4,{permissions:b.Z.settings.webhooks.main},e.createElement(ge,null))},99223:function(U,p,t){t.d(p,{Z:function(){return D}});var e=t(32735),s=t(60216),b=t(8471),h=t(72850),L=t(87933);const O=(0,b.ZP)(L.k)`
+  & > * + * {
+    margin-left: ${({theme:E})=>E.spaces[2]};
+  }
+
+  margin-left: ${({pullRight:E})=>E?"auto":void 0};
+`,C=(0,b.ZP)(O)`
+  flex-shrink: 0;
+`,D=({startActions:E,endActions:f})=>E||f?e.createElement(h.x,{paddingLeft:10,paddingRight:10},e.createElement(h.x,{paddingBottom:4},e.createElement(L.k,{justifyContent:"space-between",alignItems:"flex-start"},E&&e.createElement(O,{wrap:"wrap"},E),f&&e.createElement(C,{pullRight:!0},f)))):null;D.defaultProps={endActions:void 0,startActions:void 0},D.propTypes={endActions:s.node,startActions:s.node}},73269:function(U,p,t){t.d(p,{c:function(){return f}});var e=t(32735),s=t(60216),b=t(8471),h=t(72850),L=t(9026),O=t(87933),C=t(49372);const D=(0,b.ZP)(h.x)`
+  height: ${24/16}rem;
+  width: ${24/16}rem;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  svg {
+    height: ${10/16}rem;
+    width: ${10/16}rem;
+  }
+
+  svg path {
+    fill: ${({theme:d})=>d.colors.primary600};
+  }
+`,E=(0,b.ZP)(h.x)`
+  border-radius: 0 0 ${({theme:d})=>d.borderRadius} ${({theme:d})=>d.borderRadius};
+  display: block;
+  width: 100%;
+  border: none;
+`,f=({children:d,icon:M,...x})=>e.createElement("div",null,e.createElement(L.i,null),e.createElement(E,{as:"button",background:"primary100",padding:5,...x},e.createElement(O.k,null,e.createElement(D,{"aria-hidden":!0,background:"primary200"},M),e.createElement(h.x,{paddingLeft:3},e.createElement(C.Z,{variant:"pi",fontWeight:"bold",textColor:"primary600"},d)))));f.propTypes={children:s.string.isRequired,icon:s.node.isRequired}}}]);

package/{admin/src/content-manager/components/DynamicTable/CellContent/ReviewWorkflowsStage/ReviewWorkflowsStage.js → ee/admin/content-manager/components/DynamicTable/CellContent/ReviewWorkflowsStage/ReviewWorkflowsStageEE.js}

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Typography } from '@strapi/design-system';
 
-export function ReviewWorkflowsStage({ name }) {
+export function ReviewWorkflowsStageEE({ name }) {
   return (
     <Typography fontWeight="regular" textColor="neutral700">
       {name}
@@ -10,6 +10,6 @@ export function ReviewWorkflowsStage({ name }) {
   );
 }
 
-ReviewWorkflowsStage.propTypes = {
+ReviewWorkflowsStageEE.propTypes = {
   name: PropTypes.string.isRequired,
 };

package/ee/admin/content-manager/components/DynamicTable/CellContent/ReviewWorkflowsStage/getTableColumn.js

@@ -0,0 +1,47 @@
+import React from 'react';
+import { useIntl } from 'react-intl';
+import { Typography } from '@strapi/design-system';
+
+import ReviewWorkflowsStage from '.';
+import getTrad from '../../../../../../../admin/src/content-manager/utils/getTrad';
+
+export default (layout) => {
+  const { formatMessage } = useIntl();
+
+  // TODO: As soon as the feature was enabled in EE mode, the BE currently does not have a way to send
+  // `false` once a user is in CE mode again. We shouldn't have to perform the window.strapi.isEE check here
+  // and it is meant to be in interim solution until we find a better one.
+  const hasReviewWorkflows =
+    (window.strapi.features.isEnabled(window.strapi.features.REVIEW_WORKFLOWS) &&
+      layout.contentType.options?.reviewWorkflows) ??
+    false;
+
+  if (!hasReviewWorkflows) {
+    return null;
+  }
+
+  return {
+    key: '__strapi_reviewWorkflows_stage_temp_key__',
+    name: 'strapi_reviewWorkflows_stage',
+    fieldSchema: {
+      type: 'custom',
+    },
+    metadatas: {
+      label: formatMessage({
+        id: getTrad(`containers.ListPage.table-headers.reviewWorkflows.stage`),
+        defaultMessage: 'Review stage',
+      }),
+      searchable: false,
+      sortable: false,
+    },
+    cellFormatter({ strapi_reviewWorkflows_stage }) {
+      // if entities are created e.g. through lifecycle methods
+      // they may not have a stage assigned
+      if (!strapi_reviewWorkflows_stage) {
+        return <Typography textColor="neutral800">-</Typography>;
+      }
+
+      return <ReviewWorkflowsStage name={strapi_reviewWorkflows_stage.name} />;
+    },
+  };
+};

package/ee/admin/content-manager/components/DynamicTable/CellContent/ReviewWorkflowsStage/index.js

@@ -0,0 +1,3 @@
+import { ReviewWorkflowsStageEE } from './ReviewWorkflowsStageEE';
+
+export default ReviewWorkflowsStageEE;

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

@@ -4,8 +4,9 @@ import {
   useCMEditViewDataManager,
   useAPIErrorHandler,
   useFetchClient,
+  useNotification,
 } from '@strapi/helper-plugin';
-import { Field, FieldLabel, FieldError, Flex } from '@strapi/design-system';
+import { Field, FieldLabel, FieldError, Flex, Loader } from '@strapi/design-system';
 import { useIntl } from 'react-intl';
 import { useMutation } from 'react-query';
 
@@ -19,27 +20,68 @@ export function InformationBoxEE() {
     initialData,
     isCreatingEntry,
     layout: { uid },
+    isSingleType,
+    onChange,
   } = 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 = Object.prototype.hasOwnProperty.call(
+    initialData,
+    ATTRIBUTE_NAME
+  );
   const { formatMessage } = useIntl();
   const { formatAPIError } = useAPIErrorHandler();
+  const toggleNotification = useNotification();
 
-  const { workflows: { data: [workflow] = [] } = {} } = useReviewWorkflows();
+  const { workflows: { data: workflows, isLoading: workflowIsLoading } = {} } =
+    useReviewWorkflows();
+  // TODO: this works only as long as we support one workflow
+  const workflow = workflows?.[0] ?? null;
 
-  const { error, isLoading, mutateAsync } = useMutation(async ({ entityId, stageId, uid }) => {
-    const {
-      data: { data },
-    } = await put(`/admin/content-manager/collection-types/${uid}/${entityId}/stage`, {
-      data: { id: stageId },
-    });
+  const { error, isLoading, mutateAsync } = useMutation(
+    async ({ entityId, stageId, uid }) => {
+      const typeSlug = isSingleType ? 'single-types' : 'collection-types';
 
-    return data;
-  });
+      const {
+        data: { data: createdEntity },
+      } = await put(`/admin/content-manager/${typeSlug}/${uid}/${entityId}/stage`, {
+        data: { id: stageId },
+      });
 
-  // stages are empty while the workflow is loading
-  const options = (workflow?.stages ?? []).map(({ id, name }) => ({ value: id, label: name }));
-  const formattedError = error ? formatAPIError(error) : null;
+      // 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: 'notification.success.saved', defaultMessage: 'Saved' },
+        });
+      },
+    }
+  );
+
+  // if entities are created e.g. through lifecycle methods
+  // they may not have a stage assigned. Updating the entity won't
+  // set the default stage either which may lead to entities that
+  // do not have a stage assigned for a while. By displaying an
+  // error by default we are trying to nudge users into assigning a stage.
+  const initialStageNullError =
+    activeWorkflowStage === null &&
+    !workflowIsLoading &&
+    !isCreatingEntry &&
+    formatMessage({
+      id: 'content-manager.reviewWorkflows.stage.select.placeholder',
+      defaultMessage: 'Select a stage',
+    });
+  const formattedMutationError = error && formatAPIError(error);
+  const formattedError = formattedMutationError || initialStageNullError || null;
 
   const handleStageChange = async ({ value: stageId }) => {
     try {
@@ -58,7 +100,7 @@ export function InformationBoxEE() {
     <Information.Root>
       <Information.Title />
 
-      {activeWorkflowStage && (
+      {hasReviewWorkflowsEnabled && !isCreatingEntry && (
         <Field error={formattedError} name={ATTRIBUTE_NAME} id={ATTRIBUTE_NAME}>
           <Flex direction="column" gap={2} alignItems="stretch">
             <FieldLabel>
@@ -69,16 +111,20 @@ export function InformationBoxEE() {
             </FieldLabel>
 
             <ReactSelect
+              components={{
+                LoadingIndicator: () => <Loader small />,
+              }}
               error={formattedError}
               inputId={ATTRIBUTE_NAME}
-              isDisabled={isCreatingEntry}
-              options={options}
-              name={ATTRIBUTE_NAME}
-              defaultValue={{ value: activeWorkflowStage?.id, label: activeWorkflowStage?.name }}
               isLoading={isLoading}
               isSearchable={false}
               isClearable={false}
+              name={ATTRIBUTE_NAME}
               onChange={handleStageChange}
+              options={
+                workflow ? workflow.stages.map(({ id, name }) => ({ value: id, label: name })) : []
+              }
+              value={{ value: activeWorkflowStage?.id, label: activeWorkflowStage?.name }}
             />
 
             <FieldError />

package/ee/admin/hooks/useAuthProviders/index.js

@@ -1,5 +1,5 @@
 import { useReducer, useEffect } from 'react';
-import { request, useNotification } from '@strapi/helper-plugin';
+import { useFetchClient, useNotification } from '@strapi/helper-plugin';
 
 import { getRequestUrl } from '../../../../admin/src/utils';
 import reducer, { initialState } from './reducer';
@@ -7,43 +7,42 @@ import reducer, { initialState } from './reducer';
 const useAuthProviders = ({ ssoEnabled }) => {
   const [state, dispatch] = useReducer(reducer, initialState);
   const toggleNotification = useNotification();
+  const { get } = useFetchClient();
 
   useEffect(() => {
-    fetchAuthProviders();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+    const fetchAuthProviders = async () => {
+      try {
+        if (!ssoEnabled) {
+          dispatch({
+            type: 'GET_DATA_SUCCEEDED',
+            data: [],
+          });
+
+          return;
+        }
+
+        const { data } = await get(getRequestUrl('providers'));
 
-  const fetchAuthProviders = async () => {
-    try {
-      if (!ssoEnabled) {
         dispatch({
           type: 'GET_DATA_SUCCEEDED',
-          data: [],
+          data,
+        });
+      } catch (err) {
+        console.error(err);
+
+        dispatch({
+          type: 'GET_DATA_ERROR',
         });
 
-        return;
+        toggleNotification({
+          type: 'warning',
+          message: { id: 'notification.error' },
+        });
       }
+    };
 
-      const requestUrl = getRequestUrl('providers');
-      const data = await request(requestUrl, { method: 'GET' });
-
-      dispatch({
-        type: 'GET_DATA_SUCCEEDED',
-        data,
-      });
-    } catch (err) {
-      console.error(err);
-
-      dispatch({
-        type: 'GET_DATA_ERROR',
-      });
-
-      toggleNotification({
-        type: 'warning',
-        message: { id: 'notification.error' },
-      });
-    }
-  };
+    fetchAuthProviders();
+  }, [get, ssoEnabled, toggleNotification]);
 
   return state;
 };

package/ee/admin/hooks/useLicenseLimitNotification/index.js

@@ -5,7 +5,7 @@
  */
 import { useEffect } from 'react';
 import { useIntl } from 'react-intl';
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import { useNotification } from '@strapi/helper-plugin';
 import isNil from 'lodash/isNil';
 import useLicenseLimits from '../useLicenseLimits';

package/ee/admin/pages/AuthResponse/index.js

@@ -2,7 +2,7 @@ import React, { useEffect, useRef, useCallback } from 'react';
 import { useHistory, useRouteMatch } from 'react-router-dom';
 import { useIntl } from 'react-intl';
 import Cookies from 'js-cookie';
-import { auth, LoadingIndicatorPage, request } from '@strapi/helper-plugin';
+import { auth, LoadingIndicatorPage, useFetchClient } from '@strapi/helper-plugin';
 import { getRequestUrl } from '../../../../admin/src/utils';
 
 const AuthResponse = () => {
@@ -24,6 +24,8 @@ const AuthResponse = () => {
     );
   }, [push]);
 
+  const { get } = useFetchClient();
+
   const fetchUserInfo = useCallback(async () => {
     try {
       const jwtToken = Cookies.get('jwtToken');
@@ -33,7 +35,9 @@ const AuthResponse = () => {
       if (jwtToken) {
         auth.setToken(jwtToken, true);
         const requestUrl = getRequestUrl('users/me');
-        const { data } = await request(requestUrl, { method: 'GET' });
+        const {
+          data: { data },
+        } = await get(requestUrl);
 
         auth.setUserInfo(data, true);
 
@@ -44,7 +48,7 @@ const AuthResponse = () => {
     } catch (e) {
       redirectToOops();
     }
-  }, [push, redirectToOops]);
+  }, [get, push, redirectToOops]);
 
   useEffect(() => {
     if (authResponse === 'error') {

package/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/hooks/useAuditLogsData.js

@@ -2,7 +2,7 @@ import { useQuery } from 'react-query';
 import { useNotification, useFetchClient } from '@strapi/helper-plugin';
 import { useLocation } from 'react-router-dom';
 
-const useAuditLogsData = ({ canRead }) => {
+const useAuditLogsData = ({ canReadAuditLogs, canReadUsers }) => {
   const { get } = useFetchClient();
   const { search } = useLocation();
   const toggleNotification = useNotification();
@@ -21,7 +21,6 @@ const useAuditLogsData = ({ canRead }) => {
   };
 
   const queryOptions = {
-    enabled: canRead,
     keepPreviousData: true,
     retry: false,
     staleTime: 1000 * 20, // 20 seconds
@@ -32,10 +31,14 @@ const useAuditLogsData = ({ canRead }) => {
     data: auditLogs,
     isLoading,
     isError: isAuditLogsError,
-  } = useQuery(['auditLogs', search], fetchAuditLogsPage, queryOptions);
+  } = useQuery(['auditLogs', search], fetchAuditLogsPage, {
+    ...queryOptions,
+    enabled: canReadAuditLogs,
+  });
 
   const { data: users, isError: isUsersError } = useQuery(['auditLogsUsers'], fetchAllUsers, {
     ...queryOptions,
+    enabled: canReadUsers,
     staleTime: 2 * (1000 * 60), // 2 minutes
   });
 

package/ee/admin/pages/SettingsPage/pages/AuditLogs/ListView/index.js

@@ -25,17 +25,27 @@ import Filters from '../../../../../../../admin/src/pages/SettingsPage/component
 import getDisplayedFilters from './utils/getDisplayedFilters';
 import useAuditLogsData from './hooks/useAuditLogsData';
 
+const auditLogsPermissions = {
+  ...adminPermissions.settings.auditLogs,
+  readUsers: adminPermissions.settings.users.read,
+};
+
 const ListView = () => {
   const { formatMessage } = useIntl();
+
   const {
-    allowedActions: { canRead },
-  } = useRBAC(adminPermissions.settings.auditLogs);
+    allowedActions: { canRead: canReadAuditLogs, canReadUsers },
+  } = useRBAC(auditLogsPermissions);
+
   const [{ query }, setQuery] = useQueryParams();
-  const { auditLogs, users, isLoading, hasError } = useAuditLogsData({ canRead });
+  const { auditLogs, users, isLoading, hasError } = useAuditLogsData({
+    canReadAuditLogs,
+    canReadUsers,
+  });
 
   useFocusWhenNavigate();
 
-  const displayedFilters = getDisplayedFilters({ formatMessage, users });
+  const displayedFilters = getDisplayedFilters({ formatMessage, users, canReadUsers });
 
   const title = formatMessage({
     id: 'global.auditLogs',
@@ -73,7 +83,7 @@ const ListView = () => {
         })}
       />
       <ActionLayout startActions={<Filters displayedFilters={displayedFilters} />} />
-      <ContentLayout canRead={canRead}>
+      <ContentLayout canRead={canReadAuditLogs}>
         <DynamicTable
           contentType="Audit logs"
           headers={headers}