PlaylistPage.5727e4f76f59ce023d3e.js 6.2 KB

1234567
  1. "use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[9218],{59507:(e,t,l)=>{l.d(t,{Z:()=>n});var s=l(68404),a=l(69783),i=l(45916);class n extends s.PureComponent{render(){const{searchQuery:e,linkButton:t,setSearchQuery:l,target:s,placeholder:n="Search by name or type"}=this.props,o={href:null==t?void 0:t.href,disabled:null==t?void 0:t.disabled};return s&&(o.target=s),(0,i.jsxs)("div",{className:"page-action-bar",children:[(0,i.jsx)("div",{className:"gf-form gf-form--grow",children:(0,i.jsx)(a.FilterInput,{value:e,onChange:l,placeholder:n})}),t&&(0,i.jsx)(a.LinkButton,Object.assign({},o,{children:t.title}))]})}}},11168:(e,t,l)=>{l.r(t),l.d(t,{PlaylistPage:()=>D,default:()=>$});var s=l(68404),a=l(18745),i=l(17873),n=l(69783),o=l(33801),r=l(59507),d=l(8674),c=l(61959),u=l(28436),p=l(36636),y=l(45916);const h=()=>{const e=(0,n.useStyles2)(v);return(0,y.jsx)("div",{className:e.noResult,children:"No playlist found!"})},v=e=>({noResult:p.css`
  2. padding: ${e.spacing(2)};
  3. background: ${e.colors.secondary.main};
  4. font-style: italic;
  5. margin-top: ${e.spacing(2)};
  6. `});var x,g=l(16461),j=l(43215),m=l(5831),b=l(58648);const f=e=>{let{playlistUid:t,onDismiss:l}=e;const[a,i]=(0,s.useState)(!1),[o,r]=(0,s.useState)(!1),d={};a&&(d.kiosk=a),o&&(d.autofitpanels=!0);const c=j.urlUtil.renderUrl(`${(0,b.OS)()}/play/${t}`,d);return(0,y.jsx)(n.Modal,{isOpen:!0,title:"Share playlist",onDismiss:l,children:(0,y.jsxs)(n.FieldSet,{children:[(0,y.jsx)(n.Field,{label:"Mode",children:(0,y.jsx)(n.RadioButtonGroup,{value:a,options:[{label:"Normal",value:!1},{label:"TV",value:"tv"},{label:"Kiosk",value:!0}],onChange:i})}),(0,y.jsx)(n.Field,{children:(0,y.jsx)(n.Checkbox,{label:"Autofit",description:"Panel heights will be adjusted to fit screen size",name:"autofix",value:o,onChange:e=>r(e.currentTarget.checked)})}),(0,y.jsx)(n.Field,{label:"Link URL",children:(0,y.jsx)(n.Input,{id:"link-url-input",value:c,readOnly:!0,addonAfter:(0,y.jsxs)(n.ClipboardButton,{variant:"primary",getText:()=>c,onClipboardCopy:()=>{m.Z.emit(j.AppEvents.alertSuccess,["Content copied to clipboard"])},children:[x||(x=(0,y.jsx)(n.Icon,{name:"copy"}))," Copy"]})})})]})})},S=e=>{let{playlists:t,setStartPlaylist:l,setPlaylistToDelete:s}=e;const a=(0,n.useStyles2)(k);return(0,y.jsx)("ul",{className:a.list,children:t.map((e=>(0,y.jsx)("li",{className:a.listItem,children:(0,y.jsxs)(n.Card,{children:[(0,y.jsxs)(n.Card.Heading,{children:[e.name,(0,y.jsx)(n.ModalsController,{children:t=>{let{showModal:l,hideModal:s}=t;return(0,y.jsx)(g.u,{tooltip:"Share playlist",icon:"share-alt",iconSize:"lg",onClick:()=>{l(f,{playlistUid:e.uid,onDismiss:s})}})}},"button-share")]}),(0,y.jsxs)(n.Card.Actions,{children:[(0,y.jsx)(n.Button,{variant:"secondary",icon:"play",onClick:()=>l(e),children:"Start playlist"}),c.Vt.isEditor&&(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(n.LinkButton,{variant:"secondary",href:`/playlists/edit/${e.uid}`,icon:"cog",children:"Edit playlist"},"edit"),(0,y.jsx)(n.Button,{disabled:!1,onClick:()=>s({id:e.id,uid:e.uid,name:e.name}),icon:"trash-alt",variant:"destructive",children:"Delete playlist"})]})]})]})},e.uid)))})};function k(e){return{list:(0,p.css)({display:"grid"}),listItem:(0,p.css)({listStyle:"none"})}}var C=l(90923);const w=e=>{let{playlist:t,onDismiss:l}=e;const[a,i]=(0,s.useState)(!1),[o,r]=(0,s.useState)(!1);return(0,y.jsxs)(n.Modal,{isOpen:!0,icon:"play",title:"Start playlist",onDismiss:l,children:[(0,y.jsxs)(n.FieldSet,{children:[(0,y.jsx)(n.Field,{label:"Mode",children:(0,y.jsx)(n.RadioButtonGroup,{value:a,options:[{label:"Normal",value:!1},{label:"TV",value:"tv"},{label:"Kiosk",value:!0}],onChange:i})}),(0,y.jsx)(n.Checkbox,{label:"Autofit",description:"Panel heights will be adjusted to fit screen size",name:"autofix",value:o,onChange:e=>r(e.currentTarget.checked)})]}),(0,y.jsx)(n.Modal.ButtonRow,{children:(0,y.jsxs)(n.Button,{variant:"primary",onClick:()=>{const e={};a&&(e.kiosk=a),o&&(e.autofitpanels=!0),C.locationService.push(j.urlUtil.renderUrl(`/playlists/play/${t.uid}`,e))},children:["Start ",t.name]})})]})};var T,B=l(20607);const D=e=>{let{navModel:t}=e;const[l,a]=(0,s.useState)(""),[d,p]=(0,s.useState)(l),[v,x]=(0,s.useState)(!1),[g,j]=(0,s.useState)(),[m,b]=(0,s.useState)(),[f,k]=(0,s.useState)(0),[C,D]=(0,s.useState)([]);(0,i.Z)((async()=>{const e=await(0,B.Dv)(l);v||x(!0),D(e),p(l)}),350,[f,l]);const $=C&&C.length>0,M=(0,y.jsx)(u.Z,{title:"There are no playlists created yet",buttonIcon:"plus",buttonLink:"playlists/new",buttonTitle:"Create Playlist",buttonDisabled:!c.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"}),P=C.length>0||l.length>0||d.length>0;return(0,y.jsx)(o.Z,{navModel:t,children:(0,y.jsxs)(o.Z.Contents,{isLoading:!v,children:[P&&(0,y.jsx)(r.Z,{searchQuery:l,linkButton:c.Vt.isEditor&&{title:"New playlist",href:"/playlists/new"},setSearchQuery:a}),!$&&l?T||(T=(0,y.jsx)(h,{})):(0,y.jsx)(S,{playlists:C,setStartPlaylist:j,setPlaylistToDelete:b}),!P&&M,m&&(0,y.jsx)(n.ConfirmModal,{title:m.name,confirmText:"Delete",body:`Are you sure you want to delete '${m.name}' playlist?`,onConfirm:()=>{m&&(0,B.l8)(m.uid).finally((()=>{k(f+1),b(void 0)}))},isOpen:Boolean(m),onDismiss:()=>b(void 0)}),g&&(0,y.jsx)(w,{playlist:g,onDismiss:()=>j(void 0)})]})})},$=(0,a.connect)((e=>({navModel:(0,d.h)(e.navIndex,"playlists")})))(D)},20607:(e,t,l)=>{l.d(t,{A5:()=>c,CE:()=>r,Dv:()=>u,cg:()=>o,l8:()=>d});var s=l(90923),a=l(36537),i=l(58257),n=l(56340);async function o(e){await p((()=>(0,s.getBackendSrv)().post("/api/playlists",e)))}async function r(e,t){await p((()=>(0,s.getBackendSrv)().put(`/api/playlists/${e}`,t)))}async function d(e){await p((()=>(0,s.getBackendSrv)().delete(`/api/playlists/${e}`)),"Playlist deleted")}async function c(e){return await(0,s.getBackendSrv)().get(`/api/playlists/${e}`)}async function u(e){return await(0,s.getBackendSrv)().get("/api/playlists/",{query:e})}async function p(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"Playlist saved";try{await e(),(0,n.WI)((0,a.$l)((0,i.AT)(t)))}catch(e){(0,n.WI)((0,a.$l)((0,i.t_)("Unable to save playlist",e)))}}}}]);
  7. //# sourceMappingURL=PlaylistPage.5727e4f76f59ce023d3e.js.map