"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[9218],{96757:(U,h,e)=>{e.d(h,{Z:()=>T});var t=e(27702),C=e(48024),D=e(33716),M=e(66670),P=e(5336);class T extends t.PureComponent{render(){const{searchQuery:g,linkButton:r,setSearchQuery:d,target:S,placeholder:i="Search by name or type",sortPicker:c}=this.props,u={href:r?.href,disabled:r?.disabled};return S&&(u.target=S),t.createElement("div",{className:"page-action-bar"},t.createElement(C._,{grow:!0},t.createElement(D.H,{value:g,onChange:d,placeholder:i})),c&&t.createElement(P.P,{onChange:c.onChange,value:c.value,getSortOptions:c.getSortOptions}),r&&t.createElement(M.Qj,{...u},r.title))}}},5336:(U,h,e)=>{e.d(h,{P:()=>g});var t=e(27702),C=e(25111),D=e(28580),M=e(73453),P=e(15758),T=e(63064);const p=()=>(0,T.getGrafanaSearcher)().getSortOptions();function g({onChange:r,value:d,placeholder:S,filter:i,getSortOptions:c,isClearable:u}){const O=(0,C.Z)(async()=>{const m=await(c??p)();return i?m.filter(A=>i.includes(A.value)):m},[c,i]);if(O.loading)return null;const L=!!(d?.includes("desc")||d?.startsWith("-"));return t.createElement(D.Ph,{key:d,width:28,onChange:r,value:O.value?.find(m=>m.value===d)??null,options:O.value,"aria-label":"Sort",placeholder:S??`Sort (Default ${P.yw.label})`,prefix:t.createElement(M.J,{name:L?"sort-amount-down":"sort-amount-up"}),isClearable:u})}},34032:(U,h,e)=>{e.r(h),e.d(h,{PlaylistPage:()=>K,default:()=>H});var t=e(27702),C=e(25111),D=e(3613),M=e(66970),P=e(44644),T=e(96757),p=e(91368),g=e(42844),r=e(66310);const d=()=>{const a=(0,r.wW)(S);return t.createElement("div",{className:a.noResult},"No playlist found!")},S=a=>({noResult:(0,g.css)`
      padding: ${a.spacing(2)};
      background: ${a.colors.secondary.main};
      font-style: italic;
      margin-top: ${a.spacing(2)};
    `});var i=e(50230),c=e(60729),u=e(66670),O=e(78474),L=e(78968),m=e(13741),A=e(5229),I=e(22209),x=e(40705),W=e(83967),$=e(1128),F=e(71585),Z=e(42857);const Q=({playlistUid:a,onDismiss:f})=>{const[n,E]=(0,t.useState)(!1),[l,o]=(0,t.useState)(!1),v=[{label:"Normal",value:!1},{label:"TV",value:"tv"},{label:"Kiosk",value:!0}],y={};n&&(y.kiosk=n),l&&(y.autofitpanels=!0);const s=L.Cj.renderUrl(`${(0,Z.OS)()}/play/${a}`,y);return t.createElement(m.u,{isOpen:!0,title:"Share playlist",onDismiss:f},t.createElement(A.C,null,t.createElement(I.g,{label:"Mode"},t.createElement(x.S,{value:n,options:v,onChange:E})),t.createElement(I.g,null,t.createElement(W.X,{label:"Autofit",description:"Panel heights will be adjusted to fit screen size",name:"autofix",value:l,onChange:B=>o(B.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 E=(0,r.wW)(z);return t.createElement("ul",{className:E.list},a.map(l=>t.createElement("li",{className:E.listItem,key:l.uid},t.createElement(i.Z,null,t.createElement(i.Z.Heading,null,l.name,t.createElement(c.JY,{key:"button-share"},({showModal:o,hideModal:v})=>t.createElement(O.u,{tooltip:"Share playlist",icon:"share-alt",iconSize:"lg",onClick:()=>{o(Q,{playlistUid:l.uid,onDismiss:v})}}))),t.createElement(i.Z.Actions,null,t.createElement(u.zx,{variant:"secondary",icon:"play",onClick:()=>f(l)},"Start playlist"),p.contextSrv.isEditor&&t.createElement(t.Fragment,null,t.createElement(u.Qj,{key:"edit",variant:"secondary",href:`/playlists/edit/${l.uid}`,icon:"cog"},"Edit playlist"),t.createElement(u.zx,{disabled:!1,onClick:()=>n(l),icon:"trash-alt",variant:"destructive"},"Delete playlist")))))))};function z(a){return{list:(0,g.css)({display:"grid"}),listItem:(0,g.css)({listStyle:"none"})}}var G=e(26129);const V=({playlist:a,onDismiss:f})=>{const[n,E]=(0,t.useState)(!1),[l,o]=(0,t.useState)(!1),v=[{label:"Normal",value:!1},{label:"TV",value:"tv"},{label:"Kiosk",value:!0}],y=()=>{const s={};n&&(s.kiosk=n),l&&(s.autofitpanels=!0),G.E1.push(L.Cj.renderUrl(`/playlists/play/${a.uid}`,s))};return t.createElement(m.u,{isOpen:!0,icon:"play",title:"Start playlist",onDismiss:f},t.createElement(A.C,null,t.createElement(I.g,{label:"Mode"},t.createElement(x.S,{value:n,options:v,onChange:E})),t.createElement(W.X,{label:"Autofit",description:"Panel heights will be adjusted to fit screen size",name:"autofix",value:l,onChange:s=>o(s.currentTarget.checked)})),t.createElement(m.u.ButtonRow,null,t.createElement(u.zx,{variant:"primary",onClick:y},"Start ",a.name)))};var R=e(60086);const K=()=>{const[a,f]=(0,t.useState)(0),[n,E]=(0,t.useState)(""),l=(0,C.Z)(()=>(0,R.Dv)(),[a]),o=(0,t.useMemo)(()=>(0,R.Ds)(l.value??[],n),[n,l]),[v,y]=(0,t.useState)(),[s,B]=(0,t.useState)(),J=o&&o.length>0,X=()=>B(void 0),Y=()=>{s&&(0,R.l8)(s.uid).finally(()=>{f(a+1),B(void 0)})},b=t.createElement(M.Z,{title:"There are no playlists created yet",buttonIcon:"plus",buttonLink:"playlists/new",buttonTitle:"Create Playlist",buttonDisabled:!p.contextSrv.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=o.length>0||n.length>0;return t.createElement(P.T,{navId:"dashboards/playlists"},t.createElement(P.T.Contents,{isLoading:l.loading},N&&t.createElement(T.Z,{searchQuery:n,linkButton:p.contextSrv.isEditor?{title:"New playlist",href:"/playlists/new"}:void 0,setSearchQuery:E}),!J&&n?t.createElement(d,null):t.createElement(j,{playlists:o,setStartPlaylist:y,setPlaylistToDelete:B}),!N&&b,s&&t.createElement(D.s,{title:s.name,confirmText:"Delete",body:`Are you sure you want to delete '${s.name}' playlist?`,onConfirm:Y,isOpen:!!s,onDismiss:X}),v&&t.createElement(V,{playlist:v,onDismiss:()=>y(void 0)})))},H=K}}]);

//# sourceMappingURL=PlaylistPage.52e459f0b58128dbddf7.js.map