"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[9218],{49995:(I,P,e)=>{e.d(P,{Z:()=>B});var t=e(39953),M=e(69171),T=e(41245),O=e(4919),C=e(7965);class B extends t.PureComponent{render(){const{searchQuery:g,linkButton:c,setSearchQuery:d,target:S,placeholder:h="Search by name or type",sortPicker:o}=this.props,D={href:c?.href,disabled:c?.disabled};return S&&(D.target=S),t.createElement("div",{className:"page-action-bar"},t.createElement(M._,{grow:!0},t.createElement(T.H,{value:g,onChange:d,placeholder:h})),o&&t.createElement(C.P,{onChange:o.onChange,value:o.value,getSortOptions:o.getSortOptions}),c&&t.createElement(O.Qj,{...D},c.title))}}},7965:(I,P,e)=>{e.d(P,{P:()=>g});var t=e(39953),M=e(20653),T=e(9558),O=e(12190),C=e(9738),B=e(17231);const a=()=>(0,B.getGrafanaSearcher)().getSortOptions();function g({onChange:c,value:d,placeholder:S,filter:h,getSortOptions:o,isClearable:D}){const y=(0,M.Z)(async()=>{const f=await(o??a)();return h?f.filter(L=>h.includes(L.value)):f},[o,h]);if(y.loading)return null;const x=!!(d?.includes("desc")||d?.startsWith("-"));return t.createElement(T.Ph,{key:d,width:28,onChange:c,value:y.value?.find(f=>f.value===d)??null,options:y.value,"aria-label":"Sort",placeholder:S??`Sort (Default ${C.yw.label})`,prefix:t.createElement(O.J,{name:x?"sort-amount-down":"sort-amount-up"}),isClearable:D})}},49061:(I,P,e)=>{e.r(P),e.d(P,{PlaylistPage:()=>b,default:()=>H});var t=e(39953),M=e(20653),T=e(32840),O=e(11906),C=e(13253),B=e(49995),a=e(62679),g=e(97125),c=e(41407),d=e(82803);const S=()=>{const l=(0,d.wW)(h);return t.createElement("div",{className:l.noResult},"No playlist found!")},h=l=>({noResult:(0,c.css)`
      padding: ${l.spacing(2)};
      background: ${l.colors.secondary.main};
      font-style: italic;
      margin-top: ${l.spacing(2)};
    `});var o=e(4236),D=e(39106),y=e(4919),x=e(86276),f=e(69307),L=e(73075),R=e(2827),A=e(96227),U=e(20454),W=e(13026),Z=e(38637),$=e(36210),z=e(20230);const Q=({playlistUid:l,onDismiss:p})=>{const[r,s]=(0,t.useState)(!1),[n,m]=(0,t.useState)(!1),u=[{label:(0,a.t)("share-playlist.mode-normal","Normal"),value:!1},{label:(0,a.t)("share-playlist.mode-tv","TV"),value:"tv"},{label:(0,a.t)("share-playlist.mode-kiosk","Kiosk"),value:!0}],E={};r&&(E.kiosk=r),n&&(E.autofitpanels=!0);const i=f.Cj.renderUrl(`${(0,z.OS)()}/play/${l}`,E);return t.createElement(L.u,{isOpen:!0,title:(0,a.t)("share-playlist.title","Share playlist"),onDismiss:p},t.createElement(R.C,null,t.createElement(A.g,{label:(0,a.t)("share-playlist.mode","Mode")},t.createElement(U.S,{value:r,options:u,onChange:s})),t.createElement(A.g,null,t.createElement(W.X,{label:(0,a.t)("share-playlist.checkbox-label","Autofit"),description:(0,a.t)("share-playlist.checkbox-description","Panel heights will be adjusted to fit screen size"),name:"autofix",value:n,onChange:v=>m(v.currentTarget.checked)})),t.createElement(A.g,{label:(0,a.t)("share-playlist.link-url-label","Link URL")},t.createElement(Z.I,{id:"link-url-input",value:i,readOnly:!0,addonAfter:t.createElement($.m,{icon:"copy",variant:"primary",getText:()=>i},t.createElement(a.cC,{i18nKey:"share-playlist.copy-link-button"},"Copy"))}))))},j=({playlists:l,setStartPlaylist:p,setPlaylistToDelete:r})=>{const s=(0,d.wW)(k);return t.createElement("ul",{className:s.list},l.map(n=>t.createElement("li",{className:s.listItem,key:n.uid},t.createElement(o.Z,null,t.createElement(o.Z.Heading,null,n.name,t.createElement(D.JY,{key:"button-share"},({showModal:m,hideModal:u})=>t.createElement(x.u,{tooltip:(0,a.t)("playlist-page.card.tooltip","Share playlist"),icon:"share-alt",iconSize:"lg",onClick:()=>{m(Q,{playlistUid:n.uid,onDismiss:u})}}))),t.createElement(o.Z.Actions,null,t.createElement(y.zx,{variant:"secondary",icon:"play",onClick:()=>p(n)},t.createElement(a.cC,{i18nKey:"playlist-page.card.start"},"Start playlist")),g.contextSrv.isEditor&&t.createElement(t.Fragment,null,t.createElement(y.Qj,{key:"edit",variant:"secondary",href:`/playlists/edit/${n.uid}`,icon:"cog"},t.createElement(a.cC,{i18nKey:"playlist-page.card.edit"},"Edit playlist")),t.createElement(y.zx,{disabled:!1,onClick:()=>r(n),icon:"trash-alt",variant:"destructive"},t.createElement(a.cC,{i18nKey:"playlist-page.card.delete"},"Delete playlist"))))))))};function k(l){return{list:(0,c.css)({display:"grid"}),listItem:(0,c.css)({listStyle:"none"})}}var G=e(13601);const V=({playlist:l,onDismiss:p})=>{const[r,s]=(0,t.useState)(!1),[n,m]=(0,t.useState)(!1),u=[{label:"Normal",value:!1},{label:"TV",value:"tv"},{label:"Kiosk",value:!0}],E=()=>{const i={};r&&(i.kiosk=r),n&&(i.autofitpanels=!0),G.E1.push(f.Cj.renderUrl(`/playlists/play/${l.uid}`,i))};return t.createElement(L.u,{isOpen:!0,icon:"play",title:"Start playlist",onDismiss:p},t.createElement(R.C,null,t.createElement(A.g,{label:"Mode"},t.createElement(U.S,{value:r,options:u,onChange:s})),t.createElement(W.X,{label:"Autofit",description:"Panel heights will be adjusted to fit screen size",name:"autofix",value:n,onChange:i=>m(i.currentTarget.checked)})),t.createElement(L.u.ButtonRow,null,t.createElement(y.zx,{variant:"primary",onClick:E},"Start ",l.name)))};var N=e(89633);const b=()=>{const l=(0,N.K9)(),[p,r]=(0,t.useState)(0),[s,n]=(0,t.useState)(""),m=(0,M.Z)(()=>l.getAllPlaylist(),[p]),u=(0,t.useMemo)(()=>(0,N.Ds)(m.value??[],s),[s,m]),[E,i]=(0,t.useState)(),[v,K]=(0,t.useState)(),J=u&&u.length>0,X=()=>K(void 0),Y=()=>{v&&l.deletePlaylist(v.uid).finally(()=>{r(p+1),K(void 0)})},w=t.createElement(O.Z,{title:(0,a.t)("playlist-page.empty.title","There are no playlists created yet"),buttonIcon:"plus",buttonLink:"playlists/new",buttonTitle:(0,a.t)("playlist-page.empty.button","Create Playlist"),buttonDisabled:!g.contextSrv.isEditor,proTip:(0,a.t)("playlist-page.empty.pro-tip","You can use playlists to cycle dashboards on TVs without user control"),proTipLink:"http://docs.grafana.org/reference/playlist/",proTipLinkTitle:(0,a.t)("playlist-page.empty.pro-tip-link-title","Learn more"),proTipTarget:"_blank"}),F=u.length>0||s.length>0;return t.createElement(C.T,{navId:"dashboards/playlists"},t.createElement(C.T.Contents,{isLoading:m.loading},F&&t.createElement(B.Z,{searchQuery:s,linkButton:g.contextSrv.isEditor?{title:(0,a.t)("playlist-page.create-button.title","New playlist"),href:"/playlists/new"}:void 0,setSearchQuery:n}),!J&&s?t.createElement(S,null):t.createElement(j,{playlists:u,setStartPlaylist:i,setPlaylistToDelete:K}),!F&&w,v&&t.createElement(T.s,{title:v.name,confirmText:(0,a.t)("playlist-page.delete-modal.confirm-text","Delete"),body:(0,a.t)("playlist-page.delete-modal.body","Are you sure you want to delete {{name}} playlist?",{name:v.name}),onConfirm:Y,isOpen:!!v,onDismiss:X}),E&&t.createElement(V,{playlist:E,onDismiss:()=>i(void 0)})))},H=b}}]);

//# sourceMappingURL=PlaylistPage.81c9cea578b220f928d8.js.map