PluginListPage.c7454f0a41bdabf7d9d4.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. "use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[94],{13548:(e,r,s)=>{s.d(r,{SX:()=>n,IF:()=>p,oZ:()=>c,xh:()=>g});s(68404);var a=s(43215),t=s(69783),l=s(45916);function n(e){let{error:r}=e;const s=function(e){switch(e){case a.PluginErrorCode.modifiedSignature:return"Plugin disabled due to modified content";case a.PluginErrorCode.invalidSignature:return"Plugin disabled due to invalid plugin signature";case a.PluginErrorCode.missingSignature:return"Plugin disabled due to missing plugin signature";default:return`Plugin disabled due to unkown error: ${e}`}}(r);return(0,l.jsx)(t.Badge,{icon:"exclamation-triangle",text:"Disabled",color:"red",tooltip:s})}var i=s(36636);const o=e=>i.css`
  2. background: ${e.colors.background.primary};
  3. border-color: ${e.colors.border.strong};
  4. color: ${e.colors.text.secondary};
  5. `;function c(){const e=(0,t.useStyles2)(o);return(0,l.jsx)(t.Badge,{text:"Installed",color:"orange",className:e})}var u,d=s(90923);function p(e){let{plugin:r}=e;const s=(0,t.useStyles2)(o);return(0,d.featureEnabled)("enterprise.plugins")?u||(u=(0,l.jsx)(t.Badge,{text:"Enterprise",color:"blue"})):(0,l.jsxs)(t.HorizontalGroup,{children:[(0,l.jsx)(t.PluginSignatureBadge,{status:r.signature}),(0,l.jsx)(t.Badge,{icon:"lock","aria-label":"lock icon",text:"Enterprise",color:"blue",className:s}),(0,l.jsx)(t.Button,{size:"sm",fill:"text",icon:"external-link-alt",onClick:e=>{e.preventDefault(),window.open(`https://grafana.com/grafana/plugins/${r.id}?utm_source=grafana_catalog_learn_more`,"_blank","noopener,noreferrer")},children:"Learn more"})]})}function g(e){let{plugin:r}=e;const s=(0,t.useStyles2)(h);return r.hasUpdate&&!r.isCore&&r.type!==a.PluginType.renderer?(0,l.jsx)("p",{className:s.hasUpdate,children:"Update available!"}):null}const h=e=>({hasUpdate:i.css`
  6. color: ${e.colors.text.secondary};
  7. font-size: ${e.typography.bodySmall.fontSize};
  8. margin-bottom: 0;
  9. `})},845:(e,r,s)=>{s.d(r,{E:()=>t});s(68404);var a=s(45916);function t(e){let{alt:r,className:s,src:t,height:l}=e;return(0,a.jsx)("img",{src:t,className:s,alt:r,loading:"lazy",height:l})}},62591:(e,r,s)=>{s.r(r),s.d(r,{default:()=>D});var a=s(36636),t=s(68404),l=s(18745),n=s(42326),i=s(90923),o=s(69783),c=s(33801),u=s(8674),d=s(45916);const p=e=>{let{children:r,wrap:s,className:t}=e;const l=(0,o.useTheme2)(),n=g(l,s);return(0,d.jsx)("div",{className:(0,a.cx)(n.container,t),children:r})},g=(e,r)=>({container:a.css`
  10. display: flex;
  11. flex-direction: row;
  12. flex-wrap: ${r?"wrap":"no-wrap"};
  13. & > * {
  14. margin-bottom: ${e.spacing()};
  15. margin-right: ${e.spacing()};
  16. }
  17. & > *:last-child {
  18. margin-right: 0;
  19. }
  20. `});var h,x=s(79729),y=s(13548);function m(e){let{plugin:r}=e;return r.isEnterprise?(0,d.jsxs)(o.HorizontalGroup,{height:"auto",wrap:!0,children:[(0,d.jsx)(y.IF,{plugin:r}),r.isDisabled&&(0,d.jsx)(y.SX,{error:r.error}),(0,d.jsx)(y.xh,{plugin:r})]}):(0,d.jsxs)(o.HorizontalGroup,{height:"auto",wrap:!0,children:[(0,d.jsx)(o.PluginSignatureBadge,{status:r.signature}),r.isDisabled&&(0,d.jsx)(y.SX,{error:r.error}),r.isInstalled&&(h||(h=(0,d.jsx)(y.oZ,{}))),(0,d.jsx)(y.xh,{plugin:r})]})}var f=s(845);const v="48px";function b(e){let{plugin:r,pathName:s,displayMode:t=x.lL.Grid}=e;const l=(0,o.useStyles2)(j),n=t===x.lL.List;return(0,d.jsxs)("a",{href:`${s}/${r.id}`,className:(0,a.cx)(l.container,{[l.list]:n}),children:[(0,d.jsx)(f.E,{src:r.info.logos.small,className:l.pluginLogo,height:v,alt:""}),(0,d.jsx)("h2",{className:(0,a.cx)(l.name,"plugin-name"),children:r.name}),(0,d.jsxs)("div",{className:(0,a.cx)(l.content,"plugin-content"),children:[(0,d.jsxs)("p",{children:["By ",r.orgName]}),(0,d.jsx)(m,{plugin:r})]}),(0,d.jsx)("div",{className:l.pluginType,children:r.type&&(0,d.jsx)(o.Icon,{name:x.Co[r.type],title:`${r.type} plugin`})})]})}const j=e=>({container:a.css`
  21. display: grid;
  22. grid-template-columns: ${v} 1fr ${e.spacing(3)};
  23. grid-template-rows: auto;
  24. gap: ${e.spacing(2)};
  25. grid-auto-flow: row;
  26. background: ${e.colors.background.secondary};
  27. border-radius: ${e.shape.borderRadius()};
  28. padding: ${e.spacing(3)};
  29. transition: ${e.transitions.create(["background-color","box-shadow","border-color","color"],{duration:e.transitions.duration.short})};
  30. &:hover {
  31. background: ${e.colors.emphasize(e.colors.background.secondary,.03)};
  32. }
  33. `,list:a.css`
  34. row-gap: 0px;
  35. > img {
  36. align-self: start;
  37. }
  38. > .plugin-content {
  39. min-height: 0px;
  40. grid-area: 2 / 2 / 4 / 3;
  41. > p {
  42. margin: ${e.spacing(0,0,.5,0)};
  43. }
  44. }
  45. > .plugin-name {
  46. align-self: center;
  47. grid-area: 1 / 2 / 2 / 3;
  48. }
  49. `,pluginType:a.css`
  50. grid-area: 1 / 3 / 2 / 4;
  51. color: ${e.colors.text.secondary};
  52. `,pluginLogo:a.css`
  53. grid-area: 1 / 1 / 3 / 2;
  54. max-width: 100%;
  55. align-self: center;
  56. object-fit: contain;
  57. `,content:a.css`
  58. grid-area: 3 / 1 / 4 / 3;
  59. color: ${e.colors.text.secondary};
  60. `,name:a.css`
  61. grid-area: 1 / 2 / 3 / 3;
  62. align-self: center;
  63. font-size: ${e.typography.h4.fontSize};
  64. color: ${e.colors.text.primary};
  65. margin: 0;
  66. `}),S=e=>{let{plugins:r,displayMode:s}=e;const t=s===x.lL.List,l=(0,o.useStyles2)(P),i=(0,n.TH)();return(0,d.jsx)("div",{className:(0,a.cx)(l.container,{[l.list]:t}),"data-testid":"plugin-list",children:r.map((e=>(0,d.jsx)(b,{plugin:e,pathName:i.pathname,displayMode:s},e.id)))})},P=e=>({container:a.css`
  67. display: grid;
  68. grid-template-columns: repeat(auto-fill, minmax(288px, 1fr));
  69. gap: ${e.spacing(3)};
  70. `,list:a.css`
  71. grid-template-columns: 1fr;
  72. `});var w=s(17873);const B=e=>{let{value:r,onSearch:s}=e;const[a,l]=(0,t.useState)(r);return function(e){let r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[];const a=(0,t.useRef)(!0),l=[...s,a];(0,w.Z)((()=>{if(!a.current)return e();a.current=!1}),r,l)}((()=>s(null!=a?a:"")),500,[a]),(0,d.jsx)(o.FilterInput,{value:a,onKeyDown:e=>{"Enter"!==e.key&&13!==e.keyCode||s(e.currentTarget.value)},placeholder:"Search Grafana plugins",onChange:e=>{l(e)},width:46})};var $=s(4936);var N=s(30110);function D(e){let{route:r}=e;const s=(0,n.TH)(),t=(0,i.locationSearchToObject)(s.search),g=L(r.routeName),h=(0,l.useSelector)((e=>(0,u.h)(e.navIndex,g))),{displayMode:y,setDisplayMode:m}=(0,N.iY)(),f=(0,o.useStyles2)(C),v={push:e=>{let{query:r}=e;i.locationService.partial(r)}},b=(0,N.y9)(),j=t.q||"",P=t.filterBy||"installed",w=t.filterByType||"all",D=t.sortBy||$.Nh.nameAsc,{isLoading:k,error:T,plugins:E}=(0,N.GE)({query:j,filterBy:P,filterByType:w,sortBy:D}),A=[{value:"all",label:"All"},{value:"installed",label:"Installed"}],z=e=>{v.push({query:{filterBy:e}})};return T?(console.error(T.message),null):(0,d.jsx)(c.T,{navModel:h,children:(0,d.jsxs)(c.T.Contents,{children:[(0,d.jsxs)(p,{wrap:!0,children:[(0,d.jsx)(B,{value:j,onSearch:e=>{v.push({query:{filterBy:"all",filterByType:"all",q:e}})}}),(0,d.jsxs)(p,{wrap:!0,className:f.actionBar,children:[(0,d.jsx)("div",{children:(0,d.jsx)(o.RadioButtonGroup,{value:w,onChange:e=>{v.push({query:{filterByType:e}})},options:[{value:"all",label:"All"},{value:"datasource",label:"Data sources"},{value:"panel",label:"Panels"},{value:"app",label:"Applications"}]})}),b?(0,d.jsx)("div",{children:(0,d.jsx)(o.RadioButtonGroup,{value:P,onChange:z,options:A})}):(0,d.jsx)(o.Tooltip,{content:"This filter has been disabled because the Grafana server cannot access grafana.com",placement:"top",children:(0,d.jsx)("div",{children:(0,d.jsx)(o.RadioButtonGroup,{disabled:!0,value:P,onChange:z,options:A})})}),(0,d.jsx)("div",{children:(0,d.jsx)(o.Select,{"aria-label":"Sort Plugins List",width:24,value:D,onChange:e=>{v.push({query:{sortBy:e.value}})},options:[{value:"nameAsc",label:"Sort by name (A-Z)"},{value:"nameDesc",label:"Sort by name (Z-A)"},{value:"updated",label:"Sort by updated date"},{value:"published",label:"Sort by published date"},{value:"downloads",label:"Sort by downloads"}]})}),(0,d.jsx)("div",{children:(0,d.jsx)(o.RadioButtonGroup,{className:f.displayAs,value:y,onChange:m,options:[{value:x.lL.Grid,icon:"table",description:"Display plugins in a grid layout"},{value:x.lL.List,icon:"list-ul",description:"Display plugins in list"}]})})]})]}),(0,d.jsx)("div",{className:f.listWrap,children:k?(0,d.jsx)(o.LoadingPlaceholder,{className:a.css`
  73. margin-bottom: 0;
  74. `,text:"Loading results"}):(0,d.jsx)(S,{plugins:E,displayMode:y})})]})})}const C=e=>({actionBar:a.css`
  75. ${e.breakpoints.up("xl")} {
  76. margin-left: auto;
  77. }
  78. `,listWrap:a.css`
  79. margin-top: ${e.spacing(2)};
  80. `,displayAs:a.css`
  81. svg {
  82. margin-right: 0;
  83. }
  84. `}),L=e=>e===x.cd.HomeAdmin||e===x.cd.BrowseAdmin?"admin-plugins":"plugins"},30110:(e,r,s)=>{s.d(r,{iY:()=>E,bt:()=>D,ZV:()=>N,GE:()=>j,UQ:()=>P,bJ:()=>S,x3:()=>w,IS:()=>C,y9:()=>$,S1:()=>B,wq:()=>L});var a=s(68404),t=s(18745),l=s(4936),n=s(72192),i=s(1250),o=s(98335),c=s(79729);const u=e=>e.plugins,d=(0,o.P1)(u,(e=>{let{items:r}=e;return r})),p=(0,o.P1)(u,(e=>{let{settings:r}=e;return r.displayMode})),{selectAll:g,selectById:h}=i.CD.getSelectors(d),x=(e,r)=>(0,o.P1)((e=>(0,o.P1)(g,(r=>r.filter((r=>"installed"===e?r.isInstalled:!r.isCore)))))(e),(e=>e.filter((e=>"all"===r||e.type===r)))),y=(e,r,s)=>(0,o.P1)(x(r,s),(e=>(0,o.P1)(g,(r=>""===e?[]:r.filter((r=>{const s=[];return r.name&&s.push(r.name.toLowerCase()),r.orgName&&s.push(r.orgName.toLowerCase()),s.some((r=>r.includes(e.toLowerCase())))})))))(e),((r,s)=>""===e?r:s)),m=(0,o.P1)(g,(e=>e?e.filter((e=>Boolean(e.error))).map((e=>({pluginId:e.id,errorCode:e.error}))):[])),f=e=>(0,o.P1)(u,(r=>{let{requests:s={}}=r;return s[e]})),v=e=>(0,o.P1)(f(e),(e=>(null==e?void 0:e.status)===c.eE.Pending)),b=e=>(0,o.P1)(f(e),(e=>(null==e?void 0:e.status)===c.eE.Rejected?null==e?void 0:e.error:null)),j=e=>{let{query:r="",filterBy:s="installed",filterByType:a="all",sortBy:n=l.Nh.nameAsc}=e;k();const i=(0,t.useSelector)(y(r,s,a)),{isLoading:o,error:c}=N();return{isLoading:o,error:c,plugins:(0,l.AA)(i,n)}},S=e=>(k(),T(e),(0,t.useSelector)((r=>h(r,e)))),P=()=>(k(),(0,t.useSelector)(m)),w=()=>{const e=(0,t.useDispatch)();return(r,s,a)=>e((0,n.N9)({id:r,version:s,isUpdating:a}))},B=()=>{const e=(0,t.useDispatch)();return r=>e((0,n.Tz)(r))},$=()=>null===(0,t.useSelector)(b(n.tQ.typePrefix)),N=()=>({isLoading:(0,t.useSelector)(v(n.Qd.typePrefix)),error:(0,t.useSelector)(b(n.Qd.typePrefix))}),D=()=>({isLoading:(0,t.useSelector)(v(n.DD.typePrefix)),error:(0,t.useSelector)(b(n.DD.typePrefix))}),C=()=>({isInstalling:(0,t.useSelector)(v(n.N9.typePrefix)),error:(0,t.useSelector)(b(n.N9.typePrefix))}),L=()=>({isUninstalling:(0,t.useSelector)(v(n.Tz.typePrefix)),error:(0,t.useSelector)(b(n.Tz.typePrefix))}),k=()=>{const e=(0,t.useDispatch)(),r=(0,t.useSelector)((s=n.Qd.typePrefix,(0,o.P1)(f(s),(e=>void 0===e))));var s;(0,a.useEffect)((()=>{r&&e((0,n.Qd)())}),[])},T=e=>{const r=(0,t.useDispatch)(),s=(0,t.useSelector)((r=>h(r,e))),l=!(0,t.useSelector)(v(n.DD.typePrefix))&&s&&!s.details;(0,a.useEffect)((()=>{l&&r((0,n.DD)(e))}),[s])},E=()=>{const e=(0,t.useDispatch)();return{displayMode:(0,t.useSelector)(p),setDisplayMode:r=>e((0,i.UC)(r))}}}}]);
  85. //# sourceMappingURL=PluginListPage.c7454f0a41bdabf7d9d4.js.map