"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[9218],{78014:(U,g,e)=>{e.d(g,{Z:()=>h});var t=e(66111),C=e(14747),S=e(31403),D=e(95509);class h extends t.PureComponent{render(){const{searchQuery:v,linkButton:r,setSearchQuery:P,target:c,placeholder:T="Search by name or type",sortPicker:o}=this.props,y={href:r?.href,disabled:r?.disabled};return c&&(y.target=c),t.createElement("div",{className:"page-action-bar"},t.createElement("div",{className:"gf-form gf-form--grow"},t.createElement(C.H,{value:v,onChange:P,placeholder:T})),o&&t.createElement(D.P,{onChange:o.onChange,value:o.value,getSortOptions:o.getSortOptions}),r&&t.createElement(S.Qj,{...y},r.title))}}},95509:(U,g,e)=>{e.d(g,{P:()=>r});var t=e(66111),C=e(59679),S=e(8581),D=e(39904),h=e(10216),B=e(82e3);const v=()=>(0,B.getGrafanaSearcher)().getSortOptions();function r({onChange:P,value:c,placeholder:T,filter:o,getSortOptions:y,isClearable:p}){const M=(0,C.Z)(async()=>{const u=await(y??v)();return o?u.filter(A=>o.includes(A.value)):u},[y,o]);if(M.loading)return null;const L=Boolean(c?.includes("desc")||c?.startsWith("-"));return t.createElement(S.Ph,{key:c,width:28,onChange:P,value:M.value?.find(u=>u.value===c)??null,options:M.value,"aria-label":"Sort",placeholder:T??`Sort (Default ${h.yw.label})`,prefix:t.createElement(D.J,{name:L?"sort-amount-down":"sort-amount-up"}),isClearable:p})}},21977:(U,g,e)=>{e.r(g),e.d(g,{PlaylistPage:()=>K,default:()=>b});var t=e(66111),C=e(59679),S=e(98102),D=e(69142),h=e(8412),B=e(78014),v=e(82002),r=e(9892),P=e(72648);const c=()=>{const a=(0,P.wW)(T);return t.createElement("div",{className:a.noResult},"No playlist found!")},T=a=>({noResult:r.css`
      padding: ${a.spacing(2)};
      background: ${a.colors.secondary.main};
      font-style: italic;
      margin-top: ${a.spacing(2)};
    `});var o=e(72948),y=e(5191),p=e(31403),M=e(64503),L=e(49187),u=e(35029),A=e(13393),I=e(24799),W=e(2594),x=e(58255),$=e(46967),F=e(94599),Z=e(89346);const Q=({playlistUid:a,onDismiss:f})=>{const[n,d]=(0,t.useState)(!1),[l,i]=(0,t.useState)(!1),m=[{label:"Normal",value:!1},{label:"TV",value:"tv"},{label:"Kiosk",value:!0}],E={};n&&(E.kiosk=n),l&&(E.autofitpanels=!0);const s=L.Cj.renderUrl(`${(0,Z.OS)()}/play/${a}`,E);return t.createElement(u.u,{isOpen:!0,title:"Share playlist",onDismiss:f},t.createElement(A.C,null,t.createElement(I.g,{label:"Mode"},t.createElement(W.S,{value:n,options:m,onChange:d})),t.createElement(I.g,null,t.createElement(x.X,{label:"Autofit",description:"Panel heights will be adjusted to fit screen size",name:"autofix",value:l,onChange:O=>i(O.currentTarget.checked)})),t.createElement(I.g,{label:"Link URL"},t.createElement($.I,{id:"link-url-input",value:s,readOnly:!0,addonAfter:t.createElement(F.m,{icon:"copy",variant:"primary",getText:()=>s},"Copy")}))))},j=({playlists:a,setStartPlaylist:f,setPlaylistToDelete:n})=>{const d=(0,P.wW)(z);return t.createElement("ul",{className:d.list},a.map(l=>t.createElement("li",{className:d.listItem,key:l.uid},t.createElement(o.Z,null,t.createElement(o.Z.Heading,null,l.name,t.createElement(y.JY,{key:"button-share"},({showModal:i,hideModal:m})=>t.createElement(M.u,{tooltip:"Share playlist",icon:"share-alt",iconSize:"lg",onClick:()=>{i(Q,{playlistUid:l.uid,onDismiss:m})}}))),t.createElement(o.Z.Actions,null,t.createElement(p.zx,{variant:"secondary",icon:"play",onClick:()=>f(l)},"Start playlist"),v.Vt.isEditor&&t.createElement(t.Fragment,null,t.createElement(p.Qj,{key:"edit",variant:"secondary",href:`/playlists/edit/${l.uid}`,icon:"cog"},"Edit playlist"),t.createElement(p.zx,{disabled:!1,onClick:()=>n(l),icon:"trash-alt",variant:"destructive"},"Delete playlist")))))))};function z(a){return{list:(0,r.css)({display:"grid"}),listItem:(0,r.css)({listStyle:"none"})}}var V=e(37932);const G=({playlist:a,onDismiss:f})=>{const[n,d]=(0,t.useState)(!1),[l,i]=(0,t.useState)(!1),m=[{label:"Normal",value:!1},{label:"TV",value:"tv"},{label:"Kiosk",value:!0}],E=()=>{const s={};n&&(s.kiosk=n),l&&(s.autofitpanels=!0),V.E1.push(L.Cj.renderUrl(`/playlists/play/${a.uid}`,s))};return t.createElement(u.u,{isOpen:!0,icon:"play",title:"Start playlist",onDismiss:f},t.createElement(A.C,null,t.createElement(I.g,{label:"Mode"},t.createElement(W.S,{value:n,options:m,onChange:d})),t.createElement(x.X,{label:"Autofit",description:"Panel heights will be adjusted to fit screen size",name:"autofix",value:l,onChange:s=>i(s.currentTarget.checked)})),t.createElement(u.u.ButtonRow,null,t.createElement(p.zx,{variant:"primary",onClick:E},"Start ",a.name)))};var R=e(6129);const K=()=>{const[a,f]=(0,t.useState)(0),[n,d]=(0,t.useState)(""),l=(0,C.Z)(()=>(0,R.Dv)(),[a]),i=(0,t.useMemo)(()=>(0,R.Ds)(l.value??[],n),[n,l]),[m,E]=(0,t.useState)(),[s,O]=(0,t.useState)(),H=i&&i.length>0,J=()=>O(void 0),X=()=>{s&&(0,R.l8)(s.uid).finally(()=>{f(a+1),O(void 0)})},Y=t.createElement(D.Z,{title:"There are no playlists created yet",buttonIcon:"plus",buttonLink:"playlists/new",buttonTitle:"Create Playlist",buttonDisabled:!v.Vt.isEditor,proTip:"You can use playlists to cycle dashboards on TVs without user control",proTipLink:"http://docs.grafana.org/reference/playlist/",proTipLinkTitle:"Learn more",proTipTarget:"_blank"}),N=i.length>0||n.length>0;return t.createElement(h.T,{navId:"dashboards/playlists"},t.createElement(h.T.Contents,{isLoading:l.loading},N&&t.createElement(B.Z,{searchQuery:n,linkButton:v.Vt.isEditor?{title:"New playlist",href:"/playlists/new"}:void 0,setSearchQuery:d}),!H&&n?t.createElement(c,null):t.createElement(j,{playlists:i,setStartPlaylist:E,setPlaylistToDelete:O}),!N&&Y,s&&t.createElement(S.s,{title:s.name,confirmText:"Delete",body:`Are you sure you want to delete '${s.name}' playlist?`,onConfirm:X,isOpen:Boolean(s),onDismiss:J}),m&&t.createElement(G,{playlist:m,onDismiss:()=>E(void 0)})))},b=K}}]);

//# sourceMappingURL=PlaylistPage.908d4ced6ba80b779a6a.js.map