@spotify/backstage-plugin-soundcheck 0.18.1 → 0.19.0

package/dist/components/TrackPage/TrackPage.esm.js

@@ -1,2 +1,2 @@
-import{jsx as i,jsxs as u,Fragment as ee}from"react/jsx-runtime";import{useRouteRef as te}from"@backstage/core-plugin-api";import{EntityRefLink as re}from"@backstage/plugin-catalog-react";import{usePermission as I}from"@backstage/plugin-permission-react";import{makeStyles as ie,Button as oe,Box as ae,Tabs as se,Tab as N}from"@material-ui/core";import{soundcheckTrackReadPermission as ne,soundcheckTrackUpdatePermission as ce,toEntityFilterQuery as le}from"@spotify/backstage-plugin-soundcheck-common";import v from"lodash/isEqual";import{useState as y,useMemo as a,useEffect as me,useCallback as x}from"react";import{useNavigate as pe,useSearchParams as de,useParams as fe}from"react-router-dom";import"@backstage/catalog-model";import"@tanstack/react-query";import"../../api.esm.js";import"../../hooks/graphqlKeys.esm.js";import"../../hooks/useSoundcheckAlert.esm.js";import{useTrack as he}from"../../hooks/tracks/useTrack.esm.js";import"../../hooks/useConfirmationModal.esm.js";import{useCertificationStatus as ge}from"../../hooks/aggregations/useCertificationStatus.esm.js";import{useCertificationStatusHistory as ue}from"../../hooks/aggregations/useCertificationStatusHistory.esm.js";import{useCheckStatuses as ye}from"../../hooks/aggregations/useCheckStatuses.esm.js";import{trackEditRouteRef as ke}from"../../routes.esm.js";import{FilterSidebar as Ce}from"../FilterSidebar/FilterSidebar.esm.js";import{LevelsTable as ve}from"../LevelsTable/LevelsTable.esm.js";import{LoadingIndicator as be}from"../LoadingIndicator/LoadingIndicator.esm.js";import{PageWarningMessage as we}from"../PageWarningMessage/PageWarningMessage.esm.js";import"../SoundcheckHeader/SoundcheckHeader.esm.js";import"../SoundcheckHeader/SoundcheckHeaderContext.esm.js";import{useHeader as Ee}from"../SoundcheckHeader/useHeader.esm.js";import{SoundcheckMarkdownContent as Se}from"../SoundcheckMarkdownContent/SoundcheckMarkdownContent.esm.js";import"@backstage/core-components";import"react-markdown";import"rehype-raw";import"remark-gfm";import"../TechHealth/Filters/types.esm.js";import"../TechHealth/Filters/FacetFilter.esm.js";import"../TechHealth/Filters/FilterProvider.esm.js";import"../TechHealth/Filters/Filters.esm.js";import"../TechHealth/Filters/FiltersHeader.esm.js";import"../TechHealth/Filters/FiltersSection.esm.js";import"lodash";import"../../contexts/TrackFormContext.esm.js";import"../../contexts/CheckFormContext.esm.js";import"../../contexts/CampaignFormContext.esm.js";import"../../contexts/UserProvider.esm.js";import{parseNumberOfDays as Le}from"../TechHealth/Filters/utils.esm.js";import{TopFailingChecksTable as Te}from"../TopFailingChecksTable/TopFailingChecksTable.esm.js";import{toFilter as Ne}from"./FilterBar/util.esm.js";import{TrackEntitiesTable as xe}from"./TrackEntitiesTable/TrackEntitiesTable.esm.js";import{TrackProgressCard as Fe}from"./TrackProgressCard.esm.js";const Re=ie(e=>({root:{height:"100%",background:e.palette.background.default},pageContent:{display:"flex",minHeight:`calc(100vh - ${e.spacing(15)}px)`,borderTop:`1px solid ${e.palette.divider}`,height:"100%"},mainContentArea:{flex:1,display:"flex",flexDirection:"column",minWidth:0},trackProgressContainer:{padding:e.spacing(2,0,2,2),borderBottom:`1px solid ${e.palette.divider}`},levelCard:{margin:e.spacing(1,0,2)},editButton:{marginLeft:"auto"},contentArea:{flex:1,padding:e.spacing(0,2)},trackEntitiesContainer:{marginTop:e.spacing(1)},headerDescription:{fontSize:e.typography.body2.fontSize,margin:e.spacing(.5,0,0),"& p":{margin:0},"& a":{color:"inherit",textDecoration:"underline"}},ownerLink:{"& span":{color:"inherit","&:hover":{textDecoration:"underline"}}},tabs:{padding:e.spacing(2,2,0,2)}})),Be=()=>{const e=Re(),[k,O]=y("checksByLevel"),F=pe(),R=te(ke),[o,C]=de(),c=a(()=>o.getAll("owners"),[o]),l=a(()=>o.getAll("lifecycles"),[o]),m=a(()=>o.getAll("types"),[o]),p=a(()=>o.getAll("systems"),[o]),M=a(()=>Le(o.get("numberOfDays")),[o]),[d,b]=y(l),[f,w]=y(c),[h,E]=y(m),[g,S]=y(p);me(()=>{w(c??[]),b(l??[]),E(m??[]),S(p??[])},[c,l,m,p]);const $=a(()=>{const t={owners:!v(f,c??[]),lifecycles:!v(d,l??[]),types:!v(h,m??[]),systems:!v(g,p??[])};return Object.values(t).some(Boolean)},[f,c,d,l,h,m,g,p]),j=x(()=>{const t=new URLSearchParams(o);t.delete("lifecycles"),t.delete("owners"),t.delete("types"),t.delete("systems"),d.length>0&&d.forEach(n=>t.append("lifecycles",n)),f.length>0&&f.forEach(n=>t.append("owners",n)),h.length>0&&h.forEach(n=>t.append("types",n)),g.length>0&&g.forEach(n=>t.append("systems",n)),C(t)},[o,d,f,h,g,C]),H=x(()=>{b([]),w([]),E([]),S([]);const t=new URLSearchParams(o);t.delete("lifecycles"),t.delete("owners"),t.delete("types"),t.delete("systems"),C(t)},[o,C]),U=x((t,n)=>{O(n)},[]),{trackId:s}=fe(),L=a(()=>Ne({lifecycles:l,owners:c,types:m,systems:p}),[l,c,m,p]),{data:r,isLoading:T,isError:z}=he(s),{data:B,isLoading:W,isError:Q}=ge({trackId:s,filter:L},!!s),{data:V,isError:q}=ue({trackId:s,filter:L,numberOfDays:M},!!s),{loading:G,allowed:J}=I({permission:ne,resourceRef:s}),{loading:P,allowed:A}=I({permission:ce,resourceRef:s}),K=a(()=>r?.ownerEntityRef?i(re,{color:"inherit",entityRef:r.ownerEntityRef,className:e.ownerLink}):null,[r?.ownerEntityRef,e.ownerLink]),X=a(()=>!P&&A&&r?.isEditable?i(oe,{className:e.editButton,variant:"contained",color:"primary",onClick:()=>{F(R({trackId:r.id}))},children:"Edit Track"}):null,[A,e.editButton,R,P,F,r]),Y=a(()=>r?.description?i(Se,{className:e.headerDescription,content:r.description}):null,[e.headerDescription,r?.description]);Ee({title:r?.name,description:Y,customSubtitle:K,sectionRight:X});const Z=r?.levels?.flatMap(t=>t.checks)??[],{data:D}=ye({trackId:s,checkIds:Z.map(t=>t.id),filter:L},!!r),_=a(()=>le(r?.filter),[r]);return u(ee,{children:[i(we,{entityName:"track",entityId:s,showNotFound:!T&&!r,showCannotView:!G&&!J}),T&&i(be,{}),r&&i("div",{className:e.root,children:u("div",{className:e.pageContent,children:[i(Ce,{trackFilter:_,stagedTypes:h,stagedLifecycles:d,stagedOwners:f,stagedSystems:g,onTypesChange:E,onLifecyclesChange:b,onOwnersChange:w,onSystemsChange:S,onApplyFilters:j,onClearFilters:H,hasFilterChanges:$}),u("div",{className:e.mainContentArea,children:[i("div",{className:e.trackProgressContainer,children:i(Fe,{track:r,status:B,history:V,isError:z||Q||q})}),i(ae,{className:e.tabs,children:u(se,{value:k,onChange:U,indicatorColor:"primary",textColor:"primary",children:[i(N,{label:"Checks By Level",value:"checksByLevel"}),i(N,{label:"Top Failing Checks",value:"topFailingChecks"}),i(N,{label:"Entities",value:"entities"})]})}),u("div",{className:e.contentArea,children:[k==="checksByLevel"&&i("div",{className:e.levelCard,children:i(ve,{track:r,checkStatuses:D,isLoading:T||W})}),k==="entities"&&i("div",{className:e.trackEntitiesContainer,children:i(xe,{track:r,lifecycles:l,owners:c,types:m,systems:p})}),k==="topFailingChecks"&&i("div",{className:e.levelCard,children:i(Te,{track:r,checkStatuses:D,certificationStatus:B?.certificationStatus})})]})]})]})})]})};export{Be as TrackPage};
+import{jsx as i,jsxs as m,Fragment as G}from"react/jsx-runtime";import{useRouteRef as K}from"@backstage/core-plugin-api";import{EntityRefLink as Y}from"@backstage/plugin-catalog-react";import{usePermission as w}from"@backstage/plugin-permission-react";import{makeStyles as Z,Button as ee,Box as te,Tabs as ie,Tab as f}from"@material-ui/core";import{soundcheckTrackReadPermission as re,soundcheckTrackUpdatePermission as oe,toEntityFilterQuery as ae}from"@spotify/backstage-plugin-soundcheck-common";import{useState as se,useMemo as o,useCallback as ne}from"react";import{useNavigate as ce,useSearchParams as le,useParams as me}from"react-router-dom";import"@backstage/catalog-model";import"@tanstack/react-query";import"../../api.esm.js";import"../../hooks/graphqlKeys.esm.js";import"../../hooks/useSoundcheckAlert.esm.js";import{useTrack as de}from"../../hooks/tracks/useTrack.esm.js";import"../../hooks/useConfirmationModal.esm.js";import{useCertificationStatus as pe}from"../../hooks/aggregations/useCertificationStatus.esm.js";import{useCertificationStatusHistory as ge}from"../../hooks/aggregations/useCertificationStatusHistory.esm.js";import{useCheckStatuses as fe}from"../../hooks/aggregations/useCheckStatuses.esm.js";import{useLCPReporting as he}from"../../hooks/useLCPReporting.esm.js";import{trackEditRouteRef as ue}from"../../routes.esm.js";import{FilterSidebar as ke}from"../FilterSidebar/FilterSidebar.esm.js";import"../FilterSidebar/StateFilter.esm.js";import{useTrackFilterSidebar as ye}from"../FilterSidebar/useTrackFilterSidebar.esm.js";import{toFilter as Ce}from"../FilterSidebar/util.esm.js";import{LevelsTable as ve}from"../LevelsTable/LevelsTable.esm.js";import{LoadingIndicator as Se}from"../LoadingIndicator/LoadingIndicator.esm.js";import{PageWarningMessage as be}from"../PageWarningMessage/PageWarningMessage.esm.js";import"../SoundcheckHeader/SoundcheckHeader.esm.js";import"../SoundcheckHeader/SoundcheckHeaderContext.esm.js";import{useHeader as we}from"../SoundcheckHeader/useHeader.esm.js";import{SoundcheckMarkdownContent as Fe}from"../SoundcheckMarkdownContent/SoundcheckMarkdownContent.esm.js";import"@backstage/core-components";import"react-markdown";import"rehype-raw";import"remark-gfm";import"../TechHealth/Filters/types.esm.js";import"../TechHealth/Filters/FacetFilter.esm.js";import"../TechHealth/Filters/FilterProvider.esm.js";import"../TechHealth/Filters/Filters.esm.js";import"../TechHealth/Filters/FiltersHeader.esm.js";import"../TechHealth/Filters/FiltersSection.esm.js";import"lodash";import"../../contexts/TrackFormContext.esm.js";import"../../contexts/CheckFormContext.esm.js";import"../../contexts/CampaignFormContext.esm.js";import"../../contexts/UserProvider.esm.js";import{parseNumberOfDays as Te}from"../TechHealth/Filters/utils.esm.js";import{TopFailingChecksTable as Le}from"../TopFailingChecksTable/TopFailingChecksTable.esm.js";import{TrackEntitiesTable as Ne}from"./TrackEntitiesTable/TrackEntitiesTable.esm.js";import{TrackProgressCard as Ee}from"./TrackProgressCard.esm.js";const xe=Z(e=>({root:{height:"100%",background:e.palette.background.default},pageContent:{display:"flex",minHeight:`calc(100vh - ${e.spacing(15)}px)`,borderTop:`1px solid ${e.palette.divider}`,height:"100%"},mainContentArea:{flex:1,display:"flex",flexDirection:"column",minWidth:0},trackProgressContainer:{padding:e.spacing(2,0,2,2),borderBottom:`1px solid ${e.palette.divider}`},levelCard:{margin:e.spacing(1,0,2)},editButton:{marginLeft:"auto"},contentArea:{flex:1,padding:e.spacing(0,2)},trackEntitiesContainer:{marginTop:e.spacing(1)},headerDescription:{fontSize:e.typography.body2.fontSize,margin:e.spacing(.5,0,0),"& p":{margin:0},"& a":{color:"inherit",textDecoration:"underline"}},ownerLink:{"& span":{color:"inherit","&:hover":{textDecoration:"underline"}}},tabs:{padding:e.spacing(2,2,0,2)}})),Re=()=>{const e=xe(),[a,F]=se("checksByLevel"),h=ce(),u=K(ue),[k]=le(),y=o(()=>Te(k.get("numberOfDays")),[k]),{owners:s,lifecycles:n,types:c,systems:l,stagedLifecycles:T,setStagedLifecycles:L,stagedOwners:N,setStagedOwners:E,stagedTypes:x,setStagedTypes:R,stagedSystems:P,setStagedSystems:B,hasFilterChanges:D,handleApplyFilters:I,handleClearFilters:A}=ye(),O=ne((d,q)=>{F(q)},[]),{trackId:r}=me(),p=o(()=>Ce({lifecycles:n,owners:s,types:c,systems:l}),[n,s,c,l]),{data:t,isLoading:g,isError:j}=de(r),{data:C,isLoading:M,isError:H}=pe({trackId:r,filter:p},!!r),{data:$,isError:z}=ge({trackId:r,filter:p,numberOfDays:y},!!r),{loading:V,allowed:W}=w({permission:re,resourceRef:r}),{loading:v,allowed:S}=w({permission:oe,resourceRef:r}),Q=o(()=>t?.ownerEntityRef?i(Y,{color:"inherit",entityRef:t.ownerEntityRef,className:e.ownerLink}):null,[t?.ownerEntityRef,e.ownerLink]),U=o(()=>!v&&S&&t?.isEditable?i(ee,{className:e.editButton,variant:"contained",color:"primary",onClick:()=>{h(u({trackId:t.id}))},children:"Edit Track"}):null,[S,e.editButton,u,v,h,t]),J=o(()=>t?.description?i(Fe,{className:e.headerDescription,content:t.description}):null,[e.headerDescription,t?.description]);we({title:t?.name,description:J,customSubtitle:Q,sectionRight:U}),he({routeName:"soundcheck-track-details",additionalAttributes:{trackId:r||"unknown",trackName:t?.name||"unknown",selectedView:a,filtersApplied:(s.length+n.length+c.length+l.length).toString(),ownersFilter:s.join(",")||"none",lifecyclesFilter:n.join(",")||"none",typesFilter:c.join(",")||"none",systemsFilter:l.join(",")||"none",numberOfDays:y.toString()}});const X=t?.levels?.flatMap(d=>d.checks)??[],{data:b}=fe({trackId:r,checkIds:X.map(d=>d.id),filter:p},!!t),_=o(()=>ae(t?.filter),[t]);return m(G,{children:[i(be,{entityName:"track",entityId:r,showNotFound:!g&&!t,showCannotView:!V&&!W}),g&&i(Se,{}),t&&i("div",{className:e.root,children:m("div",{className:e.pageContent,children:[i(ke,{trackFilter:_,stagedTypes:x,stagedLifecycles:T,stagedOwners:N,stagedSystems:P,onTypesChange:R,onLifecyclesChange:L,onOwnersChange:E,onSystemsChange:B,onApplyFilters:I,onClearFilters:A,hasFilterChanges:D}),m("div",{className:e.mainContentArea,children:[i("div",{className:e.trackProgressContainer,children:i(Ee,{track:t,status:C,history:$,isError:j||H||z})}),i(te,{className:e.tabs,children:m(ie,{value:a,onChange:O,indicatorColor:"primary",textColor:"primary",children:[i(f,{label:"Checks By Level",value:"checksByLevel"}),i(f,{label:"Top Failing Checks",value:"topFailingChecks"}),i(f,{label:"Entities",value:"entities"})]})}),m("div",{className:e.contentArea,children:[a==="checksByLevel"&&i("div",{className:e.levelCard,children:i(ve,{track:t,checkStatuses:b,isLoading:g||M})}),a==="entities"&&i("div",{className:e.trackEntitiesContainer,children:i(Ne,{track:t,lifecycles:n,owners:s,types:c,systems:l})}),a==="topFailingChecks"&&i("div",{className:e.levelCard,children:i(Le,{track:t,checkStatuses:b,certificationStatus:C?.certificationStatus})})]})]})]})})]})};export{Re as TrackPage};
 //# sourceMappingURL=TrackPage.esm.js.map

package/dist/components/TrackPage/TrackStatusBar.esm.js

@@ -1,2 +1,2 @@
-import{jsx as n}from"react/jsx-runtime";import{useTheme as y,Box as v}from"@material-ui/core";import{makeStyles as B}from"@material-ui/core/styles";import{Skeleton as k}from"@material-ui/lab";import{useMemo as f}from"react";import{CategoryBar as C}from"../CategoryBar/CategoryBar.esm.js";import{getChartColors as N}from"../Charts/chartUtils.esm.js";const x=B(t=>({categoryBar:{"& .MuiBox-root > div":{height:"8px"}},skeleton:{height:"8px",width:"100%",margin:0,padding:0,display:"block"}})),L=({track:t,status:o,className:m})=>{const c=x(),l=y(),u=f(()=>{if(!o||!t)return{};const e={};let r=0;return o.statusByLevel.forEach(({ordinal:a,cumulativelyPassed:s})=>{const i=t.levels.find(h=>h.ordinal===a)?.name??`Level ${a}`;e[i]=s,r+=s}),e["Not Certified"]=o.numberOfEntities-r,e},[o,t]),p=f(()=>{if(!o||!t)return{};const e=N(l),r={};return o.statusByLevel.forEach(({ordinal:a})=>{const s=t.levels.find(i=>i.ordinal===a)?.name??`Level ${a}`;r[s]=e[a%e.length]}),r["Not Certified"]=l.palette.grey[700],r},[l,o,t]);if(!t||!o)return n(k,{className:`${c.skeleton} ${m}`});const g=e=>e,d=o.statusByLevel.map(({ordinal:e})=>t.levels.find(r=>r.ordinal===e)?.name??`Level ${e}`);return d.push("Not Certified"),n(v,{className:m,style:{width:"100%"},children:n(C,{className:c.categoryBar,data:u,categories:d,categoryColors:p,showTooltip:!1,valueFormatter:e=>e.toString(),categoryFormatter:g})})};export{L as TrackStatusBar};
+import{jsx as n}from"react/jsx-runtime";import{useTheme as B,Box as L}from"@material-ui/core";import{makeStyles as x}from"@material-ui/core/styles";import{Skeleton as k}from"@material-ui/lab";import{useMemo as f}from"react";import{CategoryBar as N}from"../CategoryBar/CategoryBar.esm.js";import{getChartColors as $}from"../Charts/chartUtils.esm.js";const C=x(t=>({categoryBar:{"& .MuiBox-root > div":{height:"8px"}},skeleton:{height:"8px",width:"100%",margin:0,padding:0,display:"block"}})),S=({track:t,status:r,className:m})=>{const c=C(),i=B(),p=f(()=>{if(!r||!t)return{};const e={};let a=0,o=0;return(r.statusByLevel||[]).sort((s,l)=>l.ordinal-s.ordinal).forEach(({ordinal:s,cumulativelyPassed:l})=>{const g=t.levels.find(y=>y.ordinal===s)?.name??`Level ${s}`,u=l-o;e[g]=u,a+=u,o=l}),(r.statusByLevel||[]).reverse(),e["No Level"]=Math.max(0,r.numberOfEntities-a),e},[r,t]),v=f(()=>{if(!r||!t)return{};const e=$(i),a={};return(r.statusByLevel||[]).forEach(({ordinal:o})=>{const s=t.levels.find(l=>l.ordinal===o)?.name??`Level ${o}`;a[s]=e[o%e.length]}),a["No Level"]=i.palette.action.disabled,a},[i,r,t]);if(!t||!r)return n(k,{className:`${c.skeleton} ${m}`});const h=e=>e,d=(r.statusByLevel||[]).map(({ordinal:e})=>t.levels.find(a=>a.ordinal===e)?.name??`Level ${e}`);return d.push("No Level"),n(L,{className:m,style:{width:"100%"},children:n(N,{className:c.categoryBar,data:p,categories:d,categoryColors:v,showTooltip:!1,valueFormatter:e=>e.toString(),categoryFormatter:h})})};export{S as TrackStatusBar};
 //# sourceMappingURL=TrackStatusBar.esm.js.map

package/dist/components/TrackPage/TrackStatusTable.esm.js

@@ -1,2 +1,2 @@
-import{jsx as a,jsxs as l}from"react/jsx-runtime";import{useTheme as y,Typography as p}from"@material-ui/core";import{makeStyles as v,createStyles as k}from"@material-ui/core/styles";import{Skeleton as d}from"@material-ui/lab";import{memo as x,useMemo as N,Fragment as S}from"react";import{compactNumberFormatter as h}from"../../utils/formatters.esm.js";import{getChartColors as w}from"../Charts/chartUtils.esm.js";const C=v(e=>k({container:{display:"grid",gridTemplateColumns:"3fr 2fr",gap:e.spacing(1),minWidth:0},item:{display:"flex",alignItems:"center",fontSize:"0.875rem",minWidth:0},legendDash:{width:e.spacing(2),height:e.spacing(.75),borderRadius:e.spacing(.375),marginRight:e.spacing(1)},category:{display:"flex",alignItems:"center",fontSize:"0.875rem",minWidth:0,flex:1},categoryText:{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",fontSize:"0.875rem",minWidth:0,flex:1},value:{fontSize:"0.875rem",color:e.palette.text.primary},valueCell:{justifyContent:"flex-end",whiteSpace:"nowrap"},percentage:{color:e.palette.text.secondary,marginLeft:e.spacing(1)},skeleton:{backgroundColor:e.palette.action.hover}})),T=x(({track:e,status:s})=>{const r=y(),t=C(),g=N(()=>{if(!e)return[{name:"",key:1,color:r.palette.action.hover},{name:"",key:2,color:r.palette.action.hover},{name:"",key:3,color:r.palette.action.hover}];const n=w(r);return e.levels.map(({name:i,ordinal:o})=>({name:i??`Level ${o}`,key:o,color:n[o%n.length]}))},[r,e]),c=s?.numberOfEntities??0;return a("div",{className:t.container,children:g.map(({name:n,key:i,color:o})=>{const m=s?.statusByLevel.find(({ordinal:u})=>u===i)?.cumulativelyPassed??0,f=c>0?Math.round(m/c*100):0;return l(S,{children:[a("div",{className:t.item,children:l("div",{className:t.category,children:[a("span",{className:t.legendDash,style:{backgroundColor:o}}),e?a(p,{className:t.categoryText,children:n}):a(d,{width:80,height:20,className:t.skeleton})]})}),a("div",{className:`${t.item} ${t.valueCell}`,children:e&&s?l(p,{className:t.value,children:[h(m)," of"," ",h(c),l("span",{className:t.percentage,children:["(",f,"%)"]})]}):a(d,{width:120,height:20,className:t.skeleton})})]},i)})})});export{T as TrackStatusTable};
+import{jsx as a,jsxs as m}from"react/jsx-runtime";import{useTheme as w,Typography as v}from"@material-ui/core";import{makeStyles as b,createStyles as C}from"@material-ui/core/styles";import{Skeleton as f}from"@material-ui/lab";import{memo as T,useMemo as z,Fragment as L}from"react";import{compactNumberFormatter as y}from"../../utils/formatters.esm.js";import{getChartColors as O}from"../Charts/chartUtils.esm.js";const W=b(e=>C({container:{display:"grid",gridTemplateColumns:"3fr 2fr",gap:e.spacing(1),minWidth:0},item:{display:"flex",alignItems:"center",fontSize:"0.875rem",minWidth:0},legendDash:{width:e.spacing(2),height:e.spacing(.75),borderRadius:e.spacing(.375),marginRight:e.spacing(1)},category:{display:"flex",alignItems:"center",fontSize:"0.875rem",minWidth:0,flex:1},categoryText:{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",fontSize:"0.875rem",minWidth:0,flex:1},value:{fontSize:"0.875rem",color:e.palette.text.primary},valueCell:{justifyContent:"flex-end",whiteSpace:"nowrap"},percentage:{color:e.palette.text.secondary,marginLeft:e.spacing(1)},skeleton:{backgroundColor:e.palette.action.hover}})),j=T(({track:e,status:l})=>{const r=w(),t=W(),k=z(()=>{if(!e)return[{name:"",key:1,color:r.palette.action.hover,value:0},{name:"",key:2,color:r.palette.action.hover,value:0},{name:"",key:3,color:r.palette.action.hover,value:0}];const i=O(r);let s=0,c=0;const n=e.levels.sort((h,o)=>o.ordinal-h.ordinal).map(({name:h,ordinal:o})=>{const g=l?.statusByLevel.find(S=>S.ordinal===o)?.cumulativelyPassed??0,u=g-c,N={name:h??`Level ${o}`,key:o,color:i[o%i.length],value:u};return s+=u,c=g,N}).reverse();e.levels.reverse();const p=l?.numberOfEntities??0,x=Math.max(0,p-s);return n.push({name:"No Level",key:-1,color:r.palette.action.disabled,value:x}),n},[r,e,l]),d=l?.numberOfEntities??0;return a("div",{className:t.container,children:k.map(({name:i,key:s,color:c,value:n})=>{const p=d>0?Math.round(n/d*100):0;return m(L,{children:[a("div",{className:t.item,children:m("div",{className:t.category,children:[a("span",{className:t.legendDash,style:{backgroundColor:c}}),e?a(v,{className:t.categoryText,children:i}):a(f,{width:80,height:20,className:t.skeleton})]})}),a("div",{className:`${t.item} ${t.valueCell}`,children:e&&l?m(v,{className:t.value,children:[y(n)," of"," ",y(d),m("span",{className:t.percentage,children:["(",p,"%)"]})]}):a(f,{width:120,height:20,className:t.skeleton})})]},s)})})});export{j as TrackStatusTable};
 //# sourceMappingURL=TrackStatusTable.esm.js.map

package/dist/components/TrackSelection/TrackSelection.esm.js

@@ -1,2 +1,2 @@
-import{jsx as y}from"react/jsx-runtime";import{TextField as G}from"@material-ui/core";import{Autocomplete as b}from"@material-ui/lab";import{sortBy as w,isEmpty as x}from"lodash";import{useState as E,useMemo as r}from"react";import"@backstage/catalog-model";import"@backstage/core-plugin-api";import"@tanstack/react-query";import"../../api.esm.js";import"../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"@spotify/backstage-plugin-soundcheck-common";import"../../hooks/useSoundcheckAlert.esm.js";import{useGetCampaigns as I}from"../../hooks/campaigns/useGetCampaigns.esm.js";import{useGetAllTracks as S}from"../../hooks/tracks/useGetAllTracks.esm.js";import"../../hooks/useConfirmationModal.esm.js";import"react-router-dom";import{useGetTracksApplicableEntityCount as $}from"../../hooks/tracks/useGetTracksApplicableEntityCount.esm.js";const B=({selectTrack:h,selectedTrackId:n,showArchived:p,showDraft:m,selectedGroupRef:k})=>{const{data:d,isLoading:T}=S({}),{data:s,isLoading:C}=I({}),[v,L]=E(n??""),u=r(()=>new Set(s?.edges.filter(({node:t})=>t.archived).map(({node:t})=>t.track.id)??[]),[s?.edges]),o=r(()=>{let t=d?.edges?.map(({node:e})=>({id:e.id,name:e.name,type:e.type==="campaign"?"Campaign":"Track",draft:!!e.draft}))??[];return t=t?.filter(e=>(p||!u.has(e.id))&&(m||!e.draft)),w(t,"type")},[u,p,m,d?.edges]),{data:l,isLoading:c}=$(k??"",{ids:o.map(t=>t.id)}),a=r(()=>{if(c)return o;const t=l??[],e=o.map(i=>{const g=t.find(({id:A})=>A===i.id);return{...i,count:g?g.applicableEntityCount:void 0}}).filter(i=>i.count!==0);return x(e)?o:e},[l,c,o]),f=r(()=>a?.find(t=>t.id===n),[n,a]);return y(b,{loading:T||C,options:a,onChange:(t,e)=>h(e?.id??""),inputValue:v,value:f??null,getOptionLabel:t=>`${t.name}${t.count?` (${t.count})`:""}`,groupBy:t=>t.type,fullWidth:!0,onInputChange:(t,e)=>L(e),renderInput:t=>y(G,{...t,style:{margin:0},margin:"dense"})},f?.id??"no-value")};export{B as TrackSelection};
+import{jsx as y}from"react/jsx-runtime";import{makeStyles as A,TextField as G}from"@material-ui/core";import{Autocomplete as w}from"@material-ui/lab";import{sortBy as x,isEmpty as E}from"lodash";import{useState as I,useMemo as o}from"react";import"@backstage/catalog-model";import"@backstage/core-plugin-api";import"@tanstack/react-query";import"../../api.esm.js";import"../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"@spotify/backstage-plugin-soundcheck-common";import"../../hooks/useSoundcheckAlert.esm.js";import{useGetCampaigns as $}from"../../hooks/campaigns/useGetCampaigns.esm.js";import{useGetAllTracks as B}from"../../hooks/tracks/useGetAllTracks.esm.js";import"../../hooks/useConfirmationModal.esm.js";import"react-router-dom";import{useGetTracksApplicableEntityCount as F}from"../../hooks/tracks/useGetTracksApplicableEntityCount.esm.js";const j=A(a=>({input:{backgroundColor:a.palette.background.paper}})),D=({selectTrack:a,selectedTrackId:n,showArchived:d,showDraft:m,selectedGroupRef:h})=>{const T=j(),{data:s,isLoading:C}=B({}),{data:l,isLoading:v}=$({}),[S,b]=I(n??""),u=o(()=>new Set(l?.edges.filter(({node:t})=>t.archived).map(({node:t})=>t.track.id)??[]),[l?.edges]),r=o(()=>{let t=s?.edges?.map(({node:e})=>({id:e.id,name:e.name,type:e.type==="campaign"?"Campaign":"Track",draft:!!e.draft}))??[];return t=t?.filter(e=>(d||!u.has(e.id))&&(m||!e.draft)),x(t,"type")},[u,d,m,s?.edges]),{data:c,isLoading:f}=F(h??"",{ids:r.map(t=>t.id)}),p=o(()=>{if(f)return r;const t=c??[],e=r.map(i=>{const k=t.find(({id:L})=>L===i.id);return{...i,count:k?k.applicableEntityCount:void 0}}).filter(i=>i.count!==0);return E(e)?r:e},[c,f,r]),g=o(()=>p?.find(t=>t.id===n),[n,p]);return y(w,{loading:C||v,options:p,onChange:(t,e)=>a(e?.id??""),inputValue:S,value:g??null,getOptionLabel:t=>`${t.name}${t.count?` (${t.count})`:""}`,groupBy:t=>t.type,fullWidth:!0,onInputChange:(t,e)=>b(e),renderInput:t=>y(G,{...t,placeholder:"Select Track",className:T.input,style:{margin:0},margin:"dense",variant:"outlined"})},g?.id??"no-value")};export{D as TrackSelection};
 //# sourceMappingURL=TrackSelection.esm.js.map

package/dist/components/TracksPage/TrackListPage/TrackListPage.esm.js

@@ -1,2 +1,2 @@
-import{jsx as r,jsxs as g}from"react/jsx-runtime";import{useRouteRef as X,useApi as A,featureFlagsApiRef as Y}from"@backstage/core-plugin-api";import{usePermission as _}from"@backstage/plugin-permission-react";import{makeStyles as ee,Button as w,Grid as o}from"@material-ui/core";import{soundcheckTrackCreatePermission as re}from"@spotify/backstage-plugin-soundcheck-common";import{useState as i,useEffect as I}from"react";import{useNavigate as ae}from"react-router-dom";import te from"react-use/lib/useDebounce";import{soundcheckApiRef as oe}from"../../../api.esm.js";import"@backstage/catalog-model";import"@tanstack/react-query";import"../../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"../../../hooks/useSoundcheckAlert.esm.js";import{useGetAllTracks as ie}from"../../../hooks/tracks/useGetAllTracks.esm.js";import"../../../hooks/useConfirmationModal.esm.js";import{useGetTrackOwners as se}from"../../../hooks/tracks/useGetTrackOwners.esm.js";import{useImportTracks as ne}from"../../../hooks/tracks/useImportTracks.esm.js";import ce from"../../../images/no-results.svg";import{trackCreateRouteRef as le}from"../../../routes.esm.js";import{exportTracks as me}from"../../../utils/export.esm.js";import{FilterDefault as N}from"../../../utils/filters.esm.js";import{EmptyState as S}from"../../EmptyState/EmptyState.esm.js";import{ImportExportPanel as pe}from"../../ImportExportPanel/ImportExportPanel.esm.js";import{Pagination as de}from"../../Pagination/Pagination.esm.js";import{SearchFilters as ge}from"../../SearchFilters/SearchFilters.esm.js";import{TrackEmptyState as u,TrackNoResults as B}from"./TrackEmptyState.esm.js";import{TracksOverviewSkeleton as ue}from"./TracksOverviewSkeleton.esm.js";import{TrackSummaryCard as fe}from"./TrackSummaryCard.esm.js";const he=ee(a=>({headerButtons:{display:"flex",gap:a.spacing(1),flexWrap:"nowrap",justifyContent:"end",alignItems:"end"},header:{padding:a.spacing(0,0,1)},container:{padding:a.spacing(3),gap:a.spacing(3)},createButton:{lineHeight:"1.25rem",paddingTop:a.spacing(1.5),paddingBottom:a.spacing(1.5)}})),ke=({tracksPerPage:a,currentCursor:R})=>{const s=he(),[f,h]=i(R),[m,F]=i(""),[k,O]=i(N.Alpha),[P,E]=i(N.Owner),[C,L]=i(""),{data:j,isLoading:D}=se();te(()=>{L(m)},500,[m]);const{loading:T,allowed:G}=_({permission:re}),H=ae(),W=X(le),y=()=>H(W()),{data:t,isLoading:n}=ie({ids:void 0,types:["standard","playlist"],first:a,after:f,orderAlphabetical:k,searchByOwner:P,searchByName:C}),[p,$]=i(t),c=p?.edges?.map(e=>e.node),[x,v]=i([]);I(()=>{h(void 0),v([])},[C]);const b=A(Y),q=!b.getRegisteredFlags().find(e=>e.name==="soundcheck-enable-track-creation")||b.isActive("soundcheck-enable-track-creation"),d=!G||!q,z=e=>{O(e.target.value)},J=e=>{E(e.target.value)};I(()=>{t&&$(()=>({totalCount:t.totalCount,edges:t.edges,pageInfo:{startCursor:t.pageInfo.startCursor,endCursor:t.pageInfo.endCursor,hasNextPage:t?.pageInfo.hasNextPage??!1,hasPreviousPage:t?.pageInfo.hasPreviousPage??!1}}))},[t]);const K=A(oe),{mutateAsync:M}=ne(),Q=async e=>M(e),U=async()=>{const e=await K.getTracks({orderAlphabetical:"asc"});return me(e.edges.map(Z=>Z.node))};if(!n&&!c)return r(S,{title:u.title,description:u.description,imgSrc:ce,action:!T&&r(w,{disabled:d,variant:"contained",color:"primary",onClick:y,children:u.callToAction})});let l;n?l=r(ue,{}):c?.length?l=c?.map(e=>r(o,{xs:12,sm:12,md:6,lg:4,xl:3,item:!0,role:"listitem","aria-label":`track card ${e.id}`,children:r(fe,{summary:e})},e.id)):l=r(o,{xs:12,item:!0,role:"listitem","aria-label":"result",children:r(S,{title:B.title,description:B.description})});const V=p?.pageInfo.hasNextPage||x?.length>0;return g(o,{container:!0,direction:"row",className:s.container,children:[g(o,{container:!0,className:s.header,children:[r(ge,{searchPlaceholder:"Search Available Tracks",isLoading:n||D,searchTerm:m,setSearchTerm:F,filterAlpha:k,handleAlphabeticalFilterChange:z,filterOwner:P,handleOwnerFilterChange:J,owners:j}),g(o,{item:!0,xs:4,className:s.headerButtons,children:[r(pe,{resourceType:"track",disableImport:d,disableExport:n||!c?.length,onImport:Q,onExport:U}),!T&&r(w,{disabled:d,variant:"contained",color:"primary",onClick:y,className:s.createButton,children:"Create Track"})]})]}),r(o,{container:!0,spacing:4,role:"list","aria-label":"tracks",children:l}),V&&r(o,{item:!0,xs:12,children:r(de,{response:p,listingsPerPage:a,cursor:f,setCursor:h,prevCursors:x,setPrevCursors:v,labelPerPageDropdown:"Tracks Per Page:",urlRoute:"tracks?tracksPerPage="})})]})};export{ke as TrackListPage};
+import{jsx as r,jsxs as d}from"react/jsx-runtime";import{useRouteRef as K,useApi as C,featureFlagsApiRef as Q}from"@backstage/core-plugin-api";import{usePermission as U}from"@backstage/plugin-permission-react";import{makeStyles as Y,Button as v,Grid as a}from"@material-ui/core";import{soundcheckTrackCreatePermission as Z}from"@spotify/backstage-plugin-soundcheck-common";import{useState as i,useEffect as _}from"react";import{useNavigate as ee}from"react-router-dom";import re from"react-use/lib/useDebounce";import{soundcheckApiRef as te}from"../../../api.esm.js";import"@backstage/catalog-model";import"@tanstack/react-query";import"../../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"../../../hooks/useSoundcheckAlert.esm.js";import{useGetAllTracks as ae}from"../../../hooks/tracks/useGetAllTracks.esm.js";import"../../../hooks/useConfirmationModal.esm.js";import{useGetTrackOwners as ie}from"../../../hooks/tracks/useGetTrackOwners.esm.js";import{useImportTracks as oe}from"../../../hooks/tracks/useImportTracks.esm.js";import se from"../../../images/no-results.svg";import{trackCreateRouteRef as ne}from"../../../routes.esm.js";import{exportTracks as ce}from"../../../utils/export.esm.js";import{FilterDefault as w}from"../../../utils/filters.esm.js";import{EmptyState as S}from"../../EmptyState/EmptyState.esm.js";import{ImportExportPanel as le}from"../../ImportExportPanel/ImportExportPanel.esm.js";import{Pagination as me}from"../../Pagination/Pagination.esm.js";import{SearchFilters as pe}from"../../SearchFilters/SearchFilters.esm.js";import{TrackEmptyState as g,TrackNoResults as B}from"./TrackEmptyState.esm.js";import{TracksOverviewSkeleton as de}from"./TracksOverviewSkeleton.esm.js";import{TrackSummaryCard as ge}from"./TrackSummaryCard.esm.js";const ue=Y(t=>({headerButtons:{display:"flex",gap:t.spacing(1),flexWrap:"nowrap",justifyContent:"end",alignItems:"end"},header:{padding:t.spacing(0,0,1)},container:{padding:t.spacing(3),gap:t.spacing(3)},createButton:{lineHeight:"1.25rem",paddingTop:t.spacing(1.5),paddingBottom:t.spacing(1.5)}})),fe=({tracksPerPage:t,currentCursor:N})=>{const o=ue(),[u,f]=i(N),[l,R]=i(""),[h,F]=i(w.Alpha),[k,I]=i(w.Owner),[T,O]=i(""),{data:E,isLoading:L}=ie();re(()=>{O(l)},500,[l]);const{loading:P,allowed:j}=U({permission:Z}),G=ee(),D=K(ne),y=()=>G(D()),{data:m,isLoading:s}=ae({ids:void 0,types:["standard","playlist"],first:t,after:u,orderAlphabetical:h,searchByOwner:k,searchByName:T}),n=m?.edges?.map(e=>e.node),[b,x]=i([]);_(()=>{f(void 0),x([])},[T]);const A=C(Q),H=!A.getRegisteredFlags().find(e=>e.name==="soundcheck-enable-track-creation")||A.isActive("soundcheck-enable-track-creation"),p=!j||!H,W=e=>{F(e.target.value)},$=e=>{I(e.target.value)},q=C(te),{mutateAsync:z}=oe(),J=async e=>z(e),M=async()=>{const e=await q.getTracks({orderAlphabetical:"asc"});return ce(e.edges.map(X=>X.node))};if(!s&&!n)return r(S,{title:g.title,description:g.description,imgSrc:se,action:!P&&r(v,{disabled:p,variant:"contained",color:"primary",onClick:y,children:g.callToAction})});let c;s?c=r(de,{}):n?.length?c=n?.map(e=>r(a,{xs:12,sm:12,md:6,lg:4,xl:3,item:!0,role:"listitem","aria-label":`track card ${e.id}`,children:r(ge,{summary:e})},e.id)):c=r(a,{xs:12,item:!0,role:"listitem","aria-label":"result",children:r(S,{title:B.title,description:B.description})});const V=m?.pageInfo.hasNextPage||b?.length>0;return d(a,{container:!0,direction:"row",className:o.container,children:[d(a,{container:!0,className:o.header,children:[r(pe,{searchPlaceholder:"Search Available Tracks",isLoading:s||L,searchTerm:l,setSearchTerm:R,filterAlpha:h,handleAlphabeticalFilterChange:W,filterOwner:k,handleOwnerFilterChange:$,owners:E}),d(a,{item:!0,xs:4,className:o.headerButtons,children:[r(le,{resourceType:"track",disableImport:p,disableExport:s||!n?.length,onImport:J,onExport:M}),!P&&r(v,{disabled:p,variant:"contained",color:"primary",onClick:y,className:o.createButton,children:"Create Track"})]})]}),r(a,{container:!0,spacing:4,role:"list","aria-label":"tracks",children:c}),V&&r(a,{item:!0,xs:12,children:r(me,{response:m,listingsPerPage:t,cursor:u,setCursor:f,prevCursors:b,setPrevCursors:x,labelPerPageDropdown:"Tracks Per Page:",urlRoute:"tracks?tracksPerPage="})})]})};export{fe as TrackListPage};
 //# sourceMappingURL=TrackListPage.esm.js.map

package/dist/components/TracksPage/TracksPage.esm.js

@@ -1,2 +1,2 @@
-import{jsx as m}from"react/jsx-runtime";import{useSearchParams as p}from"react-router-dom";import{RESULTS_PER_PAGE as i}from"../../utils/filters.esm.js";import{TrackListPage as a}from"./TrackListPage/TrackListPage.esm.js";import"@backstage/core-plugin-api";import"@backstage/plugin-permission-react";import"@spotify/backstage-plugin-soundcheck-common";import"react";import"@backstage/catalog-model";import"@tanstack/react-query";import"../../api.esm.js";import"../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"../../hooks/useSoundcheckAlert.esm.js";import"../../hooks/useConfirmationModal.esm.js";import"../../routes.esm.js";import"js-yaml";import"lodash";import"../SummaryCard/SummaryCard.esm.js";import"./TrackListPage/TrackMetadata.esm.js";const e=()=>{const[t]=p(),r=t.get("tracksPerPage"),o=r?parseInt(r,10):i;return m(a,{tracksPerPage:o})};export{e as TracksPage};
+import{jsx as m}from"react/jsx-runtime";import{useSearchParams as i}from"react-router-dom";import{useLCPReporting as p}from"../../hooks/useLCPReporting.esm.js";import{RESULTS_PER_PAGE as e}from"../../utils/filters.esm.js";import{TrackListPage as a}from"./TrackListPage/TrackListPage.esm.js";import"@backstage/core-plugin-api";import"@backstage/plugin-permission-react";import"@spotify/backstage-plugin-soundcheck-common";import"react";import"@backstage/catalog-model";import"@tanstack/react-query";import"../../api.esm.js";import"../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"../../hooks/useSoundcheckAlert.esm.js";import"../../hooks/useConfirmationModal.esm.js";import"../../routes.esm.js";import"js-yaml";import"lodash";import"../SummaryCard/SummaryCard.esm.js";import"./TrackListPage/TrackMetadata.esm.js";const s=()=>{const[o]=i(),r=o.get("tracksPerPage"),t=r?parseInt(r,10):e;return p({routeName:"soundcheck-tracks",additionalAttributes:{tracksPerPage:t.toString()}}),m(a,{tracksPerPage:t})};export{s as TracksPage};
 //# sourceMappingURL=TracksPage.esm.js.map