"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[9975],{"./public/app/features/playlist/PlaylistForm.tsx":(e,a,s)=>{s.d(a,{H:()=>P});var t=s("./node_modules/react/index.js"),l=s("./packages/grafana-runtime/src/index.ts"),i=s("./packages/grafana-ui/src/index.ts"),n=s("./packages/grafana-e2e-selectors/src/index.ts"),r=s("./public/app/core/components/TagFilter/TagFilter.tsx"),o=s("./public/app/core/services/search_srv.ts");var d=s("./node_modules/@emotion/css/dist/emotion-css.esm.js"),c=s("./public/app/core/components/TagFilter/TagBadge.tsx"),p=s("./node_modules/react/jsx-runtime.js");const u=({item:e,onDelete:a,onMoveDown:s,onMoveUp:t,first:l,last:r})=>{const o=(0,i.useStyles)(m);return(0,p.jsxs)("tr",{"aria-label":n.wl.pages.PlaylistForm.itemRow,children:["dashboard_by_id"===e.type?(0,p.jsxs)("td",{className:(0,d.cx)(o.td,o.item),children:[(0,p.jsx)(i.Icon,{name:"apps","aria-label":n.wl.pages.PlaylistForm.itemIdType}),(0,p.jsx)("span",{children:e.title})]}):null,"dashboard_by_tag"===e.type?(0,p.jsxs)("td",{className:(0,d.cx)(o.td,o.item),children:[(0,p.jsx)(i.Icon,{name:"tag-alt","aria-label":n.wl.pages.PlaylistForm.itemTagType}),(0,p.jsx)(c.e,{label:e.title,removeIcon:!1,count:0},e.id)]}):null,(0,p.jsxs)("td",{className:(0,d.cx)(o.td,o.settings),children:[l?null:(0,p.jsx)(i.IconButton,{name:"arrow-up",size:"md",onClick:a=>{a.preventDefault(),t(e)},"aria-label":n.wl.pages.PlaylistForm.itemMoveUp,type:"button"}),r?null:(0,p.jsx)(i.IconButton,{name:"arrow-down",size:"md",onClick:a=>{a.preventDefault(),s(e)},"aria-label":n.wl.pages.PlaylistForm.itemMoveDown,type:"button"}),(0,p.jsx)(i.IconButton,{name:"times",size:"md",onClick:s=>{s.preventDefault(),a(e)},"aria-label":n.wl.pages.PlaylistForm.itemDelete,type:"button"})]})]},e.title)};function m(e){return{td:d.css`
      label: td;
      line-height: 28px;
      max-width: 335px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
    `,item:d.css`
      label: item;
      span {
        margin-left: ${e.spacing.xs};
      }
    `,settings:d.css`
      label: settings;
      text-align: right;
    `}}var g;const b=({items:e,onMoveUp:a,onMoveDown:s,onDelete:t})=>0===e.length?g||(g=(0,p.jsx)("tr",{children:(0,p.jsx)("td",{children:(0,p.jsx)("em",{children:"Playlist is empty. Add dashboards below."})})})):(0,p.jsx)(p.Fragment,{children:e.map(((l,i)=>{const n=0===i,r=i===e.length-1;return(0,p.jsx)(u,{first:n,last:r,item:l,onDelete:t,onMoveDown:s,onMoveUp:a},l.title)}))});var y;const h=({items:e,onMoveUp:a,onMoveDown:s,onDelete:t})=>(0,p.jsxs)("div",{className:"gf-form-group",children:[y||(y=(0,p.jsx)("h3",{className:"page-headering",children:"Dashboards"})),(0,p.jsx)("table",{className:"filter-table",children:(0,p.jsx)("tbody",{children:(0,p.jsx)(b,{items:e,onMoveUp:a,onMoveDown:s,onDelete:t})})})]});var v=s("./node_modules/debounce-promise/dist/index.js"),x=s.n(v),f=s("./public/app/core/services/backend_srv.ts");const j=(e="")=>f.ae.search({type:"dash-db",query:e,limit:100}).then((e=>e.map((e=>{var a;return{id:e.id,uid:e.uid,value:e.id,label:`${null!==(a=null==e?void 0:e.folderTitle)&&void 0!==a?a:"General"}/${e.title}`}})))),w=({onChange:e,value:a,width:s,isClearable:t=!1,invalid:l,disabled:n,id:r})=>{const o=x()(j,300);return(0,p.jsx)(i.AsyncSelect,{inputId:r,menuShouldPortal:!0,width:s,isClearable:t,defaultOptions:!0,loadOptions:o,onChange:e,placeholder:"Select dashboard",noOptionsMessage:"No dashboards found",value:a,invalid:l,disabled:n})};var k;const D=new o.i,P=({onSubmit:e,playlist:a})=>{var s,o;const{name:d,interval:c,items:u}=a,{items:m,addById:g,addByTag:b,deleteItem:y,moveDown:v,moveUp:x}=function(e){const[a,s]=(0,t.useState)(null!=e?e:[]),l=(0,t.useCallback)((e=>{if(!e||a.find((a=>a.id===e.id)))return;const t={id:e.id,title:e.label,type:"dashboard_by_id",value:e.id.toString(10),order:a.length+1};s([...a,t])}),[a]),i=(0,t.useCallback)((e=>{const t=e[0];if(!t||a.find((e=>e.value===t)))return;const l={title:t,type:"dashboard_by_tag",value:t,order:a.length+1};s([...a,l])}),[a]),n=(0,t.useCallback)(((e,t)=>{const l=[...a],i=l.indexOf(e),n=i+t;n>=0&&n<l.length&&(l.splice(i,1),l.splice(n,0,e)),s(l)}),[a]),r=(0,t.useCallback)((e=>{n(e,-1)}),[n]),o=(0,t.useCallback)((e=>{n(e,1)}),[n]),d=(0,t.useCallback)((e=>{s(a.filter((a=>a!==e)))}),[a]);return{items:a,addById:l,addByTag:i,deleteItem:d,moveDown:o,moveUp:r}}(u);return(0,p.jsx)(p.Fragment,{children:(0,p.jsx)(i.Form,{onSubmit:a=>e(Object.assign({},a,{items:m})),validateOn:"onBlur",children:({register:e,errors:a})=>{var t,u;const f=0===m.length||Object.keys(a).length>0;return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(i.Field,{label:"Name",invalid:!!a.name,error:null==a||null===(t=a.name)||void 0===t?void 0:t.message,children:(0,p.jsx)(i.Input,Object.assign({type:"text"},e("name",{required:"Name is required"}),{placeholder:"Name",defaultValue:d,"aria-label":n.wl.pages.PlaylistForm.name}))}),(0,p.jsx)(i.Field,{label:"Interval",invalid:!!a.interval,error:null==a||null===(u=a.interval)||void 0===u?void 0:u.message,children:(0,p.jsx)(i.Input,Object.assign({type:"text"},e("interval",{required:"Interval is required"}),{placeholder:"5m",defaultValue:null!=c?c:"5m","aria-label":n.wl.pages.PlaylistForm.interval}))}),s||(s=(0,p.jsx)(h,{items:m,onMoveUp:x,onMoveDown:v,onDelete:y})),(0,p.jsxs)("div",{className:"gf-form-group",children:[k||(k=(0,p.jsx)("h3",{className:"page-headering",children:"Add dashboards"})),o||(o=(0,p.jsx)(i.Field,{label:"Add by title",children:(0,p.jsx)(w,{onChange:g,id:"dashboard-picker",isClearable:!0})})),(0,p.jsx)(i.Field,{label:"Add by tag",children:(0,p.jsx)(r.D,{isClearable:!0,tags:[],hideValues:!0,tagOptions:D.getDashboardTags,onChange:b,placeholder:""})})]}),(0,p.jsxs)(i.HorizontalGroup,{children:[(0,p.jsx)(i.Button,{variant:"primary",disabled:f,children:"Save"}),(0,p.jsx)(i.LinkButton,{variant:"secondary",href:`${l.config.appSubUrl}/playlists`,children:"Cancel"})]})]})}})})}},"./public/app/features/playlist/PlaylistNewPage.tsx":(e,a,s)=>{s.r(a),s.d(a,{PlaylistNewPage:()=>m,default:()=>g});s("./node_modules/react/index.js");var t=s("./node_modules/react-redux/es/index.js"),l=s("./packages/grafana-runtime/src/index.ts"),i=s("./packages/grafana-ui/src/index.ts"),n=s("./public/app/core/components/Page/Page.tsx"),r=s("./public/app/core/selectors/navModel.ts"),o=s("./public/app/features/playlist/PlaylistForm.tsx"),d=s("./public/app/features/playlist/api.ts"),c=s("./public/app/features/playlist/usePlaylist.tsx"),p=s("./public/app/features/playlist/styles.ts"),u=s("./node_modules/react/jsx-runtime.js");const m=({navModel:e})=>{const a=(0,i.useStyles2)(p.e),{playlist:s,loading:t}=(0,c.Z)();return(0,u.jsx)(n.Z,{navModel:e,children:(0,u.jsxs)(n.Z.Contents,{isLoading:t,children:[(0,u.jsx)("h3",{className:a.subHeading,children:"New Playlist"}),(0,u.jsx)("p",{className:a.description,children:"A playlist rotates through a pre-selected list of dashboards. A playlist can be a great way to build situational awareness, or just show off your metrics to your team or visitors."}),(0,u.jsx)(o.H,{onSubmit:async e=>{await(0,d.cg)(e),l.locationService.push("/playlists")},playlist:s})]})})},g=(0,t.connect)((e=>({navModel:(0,r.h)(e.navIndex,"playlists")})))(m)},"./public/app/features/playlist/api.ts":(e,a,s)=>{s.d(a,{cg:()=>r,CE:()=>o,l8:()=>d,A5:()=>c,Dv:()=>p});var t=s("./packages/grafana-runtime/src/index.ts"),l=s("./public/app/store/store.ts"),i=s("./public/app/core/actions/index.ts"),n=s("./public/app/core/copy/appNotification.ts");async function r(e){await u((()=>(0,t.getBackendSrv)().post("/api/playlists",e)))}async function o(e,a){await u((()=>(0,t.getBackendSrv)().put(`/api/playlists/${e}`,a)))}async function d(e){await u((()=>(0,t.getBackendSrv)().delete(`/api/playlists/${e}`)),"Playlist deleted")}async function c(e){return await(0,t.getBackendSrv)().get(`/api/playlists/${e}`)}async function p(e){return await(0,t.getBackendSrv)().get("/api/playlists/",{query:e})}async function u(e,a="Playlist saved"){try{await e(),(0,l.WI)((0,i.$l)((0,n.AT)(a)))}catch(e){(0,l.WI)((0,i.$l)((0,n.t_)("Unable to save playlist",e)))}}},"./public/app/features/playlist/styles.ts":(e,a,s)=>{s.d(a,{e:()=>l});var t=s("./node_modules/@emotion/css/dist/emotion-css.esm.js");function l(e){return{description:t.css`
      label: description;
      width: 555px;
      margin-bottom: 20px;
    `,subHeading:t.css`
      label: sub-heading;
      margin-bottom: ${e.spacing(2)};
    `}}},"./public/app/features/playlist/usePlaylist.tsx":(e,a,s)=>{s.d(a,{Z:()=>i});var t=s("./node_modules/react/index.js"),l=s("./public/app/features/playlist/api.ts");function i(e){const[a,s]=(0,t.useState)({items:[],interval:"5m",name:""}),[i,n]=(0,t.useState)(!0);return(0,t.useEffect)((()=>{(async()=>{if(!e)return void n(!1);const a=await(0,l.A5)(e);s(a),n(!1)})()}),[e]),{playlist:a,loading:i}}}}]);
//# sourceMappingURL=PlaylistNewPage.8128b05ac04b15cbf98d.js.map