"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[4620],{59507:(e,a,t)=>{t.d(a,{Z:()=>n});var s=t(68404),r=t(69783),o=t(45916);class n extends s.PureComponent{render(){const{searchQuery:e,linkButton:a,setSearchQuery:t,target:s,placeholder:n="Search by name or type"}=this.props,d={href:null==a?void 0:a.href,disabled:null==a?void 0:a.disabled};return s&&(d.target=s),(0,o.jsxs)("div",{className:"page-action-bar",children:[(0,o.jsx)("div",{className:"gf-form gf-form--grow",children:(0,o.jsx)(r.FilterInput,{value:e,onChange:t,placeholder:n})}),a&&(0,o.jsx)(r.LinkButton,Object.assign({},d,{children:a.title}))]})}}},76887:(e,a,t)=>{t.r(a),t.d(a,{DataSourcesListPage:()=>C,default:()=>k});var s,r=t(68404),o=t(18745),n=t(28436),d=t(33801),c=t(59507),i=t(98163),u=t(8674),l=t(58170),h=t(36636),p=t(69783),g=t(45916);const S=e=>{let{dataSources:a,layoutMode:t}=e;const r=(0,p.useStyles)(x);return(0,g.jsx)("ul",{className:r.list,children:a.map((e=>(0,g.jsx)("li",{children:(0,g.jsxs)(p.Card,{href:`datasources/edit/${e.uid}`,children:[(0,g.jsx)(p.Card.Heading,{children:e.name}),(0,g.jsx)(p.Card.Figure,{children:(0,g.jsx)("img",{src:e.typeLogoUrl,alt:"",height:"40px",width:"40px",className:r.logo})}),(0,g.jsx)(p.Card.Meta,{children:[e.typeName,e.url,e.isDefault&&(s||(s=(0,g.jsx)(p.Tag,{name:"default",colorIndex:1},"default-tag")))]})]})},e.id)))})},x=()=>({list:(0,h.css)({listStyle:"none",display:"grid"}),logo:(0,h.css)({objectFit:"contain"})});var f=t(87993),j=t(75375),b=t(77197);const m={loadDataSources:f.bZ,setDataSourcesSearchQuery:j.zT,setDataSourcesLayoutMode:j.Dy},y=(0,o.connect)((function(e){return{navModel:(0,u.h)(e.navIndex,"datasources"),dataSources:(0,b.mt)(e.dataSources),layoutMode:(0,b.pc)(e.dataSources),dataSourcesCount:(0,b.r7)(e.dataSources),searchQuery:(0,b.IO)(e.dataSources),hasFetched:e.dataSources.hasFetched}}),m),v={title:"No data sources defined",buttonIcon:"database",buttonLink:"datasources/new",buttonTitle:"Add data source",proTip:"You can also define data sources through configuration files.",proTipLink:"http://docs.grafana.org/administration/provisioning/#datasources?utm_source=grafana_ds_list",proTipLinkTitle:"Learn more",proTipTarget:"_blank"};class C extends r.PureComponent{componentDidMount(){this.props.loadDataSources()}render(){const{dataSources:e,dataSourcesCount:a,navModel:t,layoutMode:s,searchQuery:r,setDataSourcesSearchQuery:o,hasFetched:u}=this.props,h=i.Vt.hasPermission(l.bW.DataSourcesCreate),p={href:"datasources/new",title:"Add data source",disabled:!h},x=Object.assign({},v,{buttonDisabled:!h});return(0,g.jsx)(d.Z,{navModel:t,children:(0,g.jsx)(d.Z.Contents,{isLoading:!u,children:(0,g.jsxs)(g.Fragment,{children:[u&&0===a&&(0,g.jsx)(n.Z,Object.assign({},x)),u&&a>0&&[(0,g.jsx)(c.Z,{searchQuery:r,setSearchQuery:e=>o(e),linkButton:p},"action-bar"),(0,g.jsx)(S,{dataSources:e,layoutMode:s},"list")]]})})})}}const k=y(C)}}]);
//# sourceMappingURL=DataSourcesListPage.7315de5f2dd21cfa5fae.js.map