"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[4620],{78014:(T,m,t)=>{t.d(m,{Z:()=>v});var a=t(66111),e=t(14747),E=t(31403),l=t(95509);class v extends a.PureComponent{render(){const{searchQuery:h,linkButton:c,setSearchQuery:f,target:d,placeholder:P="Search by name or type",sortPicker:n}=this.props,s={href:c?.href,disabled:c?.disabled};return d&&(s.target=d),a.createElement("div",{className:"page-action-bar"},a.createElement("div",{className:"gf-form gf-form--grow"},a.createElement(e.H,{value:h,onChange:f,placeholder:P})),n&&a.createElement(l.P,{onChange:n.onChange,value:n.value,getSortOptions:n.getSortOptions}),c&&a.createElement(E.Qj,{...s},c.title))}}},95509:(T,m,t)=>{t.d(m,{P:()=>c});var a=t(66111),e=t(59679),E=t(8581),l=t(39904),v=t(10216),u=t(82e3);const h=()=>(0,u.getGrafanaSearcher)().getSortOptions();function c({onChange:f,value:d,placeholder:P,filter:n,getSortOptions:s,isClearable:C}){const D=(0,e.Z)(async()=>{const o=await(s??h)();return n?o.filter(p=>n.includes(p.value)):o},[s,n]);if(D.loading)return null;const S=Boolean(d?.includes("desc")||d?.startsWith("-"));return a.createElement(E.Ph,{key:d,width:28,onChange:f,value:D.value?.find(o=>o.value===d)??null,options:D.value,"aria-label":"Sort",placeholder:P??`Sort (Default ${v.yw.label})`,prefix:a.createElement(l.J,{name:S?"sort-amount-down":"sort-amount-up"}),isClearable:C})}},19703:(T,m,t)=>{t.d(m,{G:()=>h});var a=t(66111),e=t(35645),E=t(31403),l=t(77582),v=t(27876),u=t(25e3);function h(){const c=l.Vt.hasPermission(v.AccessControlAction.DataSourcesCreate),f=(0,u.d7)();return c?a.createElement(E.Qj,{icon:"plus",href:e.v.appSubUrl+f.New},"Add new data source"):null}},81955:(T,m,t)=>{t.d(m,{c:()=>W});var a=t(9892),e=t(66111),E=t(56895),l=t(35645),v=t(72648),u=t(72948),h=t(34719),c=t(31403),f=t(69142),d=t(2555),P=t(77582),n=t(27876),s=t(25e3),C=t(63065),D=t(85597),S=t(78014);const o="alpha-asc",p="alpha-desc",I=[{label:"Sort by A\u2013Z",value:o},{label:"Sort by Z\u2013A",value:p}];function U(){const g=(0,n.useDispatch)(),O=(0,e.useCallback)(r=>g((0,s.zT)(r)),[g]),A=(0,n.useSelector)(({dataSources:r})=>(0,s.IO)(r)),L=(0,e.useCallback)(r=>g((0,s.Nu)(r.value===o)),[g]),y=(0,n.useSelector)(({dataSources:r})=>(0,s.IA)(r)),M={onChange:L,value:y?o:p,getSortOptions:()=>Promise.resolve(I)};return e.createElement(S.Z,{searchQuery:A,setSearchQuery:O,key:"action-bar",sortPicker:M})}function W(){const{isLoading:g}=(0,s.zJ)(),O=(0,n.useSelector)(r=>(0,s.mt)(r.dataSources)),A=(0,n.useSelector)(({dataSources:r})=>(0,s.r7)(r)),L=P.Vt.hasPermission(n.AccessControlAction.DataSourcesCreate),y=P.Vt.hasPermission(n.AccessControlAction.DataSourcesWrite),M=P.Vt.hasPermission(n.AccessControlAction.DataSourcesExplore);return e.createElement(K,{dataSources:O,dataSourcesCount:A,isLoading:g,hasCreateRights:L,hasWriteRights:y,hasExploreRights:M})}function K({dataSources:g,dataSourcesCount:O,isLoading:A,hasCreateRights:L,hasWriteRights:y,hasExploreRights:M}){const r=(0,v.wW)(N),R=(0,s.d7)(),B=(0,E.TH)();return(0,e.useEffect)(()=>{(0,C.dF)({grafana_version:l.v.buildInfo.version,path:B.pathname})},[B]),A?e.createElement(d.Z,null):O===0?e.createElement(f.Z,{buttonDisabled:!L,title:"No data sources defined",buttonIcon:"database",buttonLink:R.New,buttonTitle:"Add data source",proTip:"You can also define data sources through configuration files.",proTipLink:"http://docs.grafana.org/administration/provisioning/?utm_source=grafana_ds_list#data-sources",proTipLinkTitle:"Learn more",proTipTarget:"_blank"}):e.createElement(e.Fragment,null,e.createElement(U,null),e.createElement("ul",{className:r.list},g.map(i=>{const x=l.v.appSubUrl+R.Edit.replace(/:uid/gi,i.uid);return e.createElement("li",{key:i.uid},e.createElement(u.Z,{href:y?x:void 0},e.createElement(u.Z.Heading,null,i.name),e.createElement(u.Z.Figure,null,e.createElement("img",{src:i.typeLogoUrl,alt:"",height:"40px",width:"40px",className:r.logo})),e.createElement(u.Z.Meta,null,[i.typeName,i.url,i.isDefault&&e.createElement(h.V,{key:"default-tag",name:"default",colorIndex:1})]),e.createElement(u.Z.Tags,null,e.createElement(c.Qj,{icon:"apps",fill:"outline",variant:"secondary",href:`dashboard/new-with-ds/${i.uid}`,onClick:()=>{(0,C.hJ)({grafana_version:l.v.buildInfo.version,datasource_uid:i.uid,plugin_name:i.typeName,path:B.pathname})}},"Build a dashboard"),M&&e.createElement(c.Qj,{icon:"compass",fill:"outline",variant:"secondary",className:r.button,href:(0,D.iU)(i),onClick:()=>{(0,C.U4)({grafana_version:l.v.buildInfo.version,datasource_uid:i.uid,plugin_name:i.typeName,path:B.pathname})}},"Explore"))))})))}const N=g=>({list:(0,a.css)({listStyle:"none",display:"grid"}),logo:(0,a.css)({objectFit:"contain"}),button:(0,a.css)({marginLeft:g.spacing(2)})})},99113:(T,m,t)=>{t.r(m),t.d(m,{DataSourcesListPage:()=>D,default:()=>S});var a=t(66111),e=t(35645),E=t(8412),l=t(9892),v=t(72648),u=t(45253),h=t(31403),c=t(86475);const f=o=>({alertContent:l.css`
    display: flex;
    flex-direction: row;
    padding: 0;
    justify-content: space-between;
    align-items: center;
  `,alertParagraph:l.css`
    margin: 0 ${o.spacing(1)} 0 0;
    line-height: ${o.spacing(o.components.height.sm)};
  `});function d(){const o=(0,v.wW)(f);return a.createElement(u.b,{severity:"warning",title:""},a.createElement("div",{className:o.alertContent},a.createElement("p",{className:o.alertParagraph},"Data sources have a new home! You can discover new data sources or manage existing ones in the new Connections page, accessible from the lefthand nav."),a.createElement(h.Qj,{"aria-label":"Link to Connections",icon:"arrow-right",href:c.Z.DataSources,fill:"text"},"Go to connections")))}var P=t(27876),n=t(19703),s=t(81955),C=t(25e3);function D(){const p=(0,P.useSelector)(({dataSources:I})=>(0,C.r7)(I))>0?a.createElement(n.G,null):void 0;return a.createElement(E.T,{navId:"datasources",actions:p},a.createElement(E.T.Contents,null,e.v.featureToggles.dataConnectionsConsole&&a.createElement(d,null),a.createElement(s.c,null)))}const S=D}}]);

//# sourceMappingURL=DataSourcesListPage.74588a7d125d570d9c50.js.map