@bygd/nc-report-ui 0.1.17 → 0.1.18

package/dist/default/cjs/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@material-ui/core/Paper"),a=require("@material-ui/core/styles"),r=require("@material-ui/core/LinearProgress"),n=require("react-google-charts"),l=require("numeral"),o=require("axios"),u=require("@material-ui/core/Typography"),s=require("nunjucks"),i=require("@material-ui/core/FormControl"),c=require("@material-ui/core/Select"),d=require("@material-ui/core/MenuItem"),f=require("react-intersection-observer"),m=require("@mui/material"),p=require("@mui/icons-material/CheckBoxOutlineBlank"),h=require("@mui/icons-material/CheckBox"),y=require("@mui/material/Box"),g=require("@mui/material/InputLabel"),b=require("@mui/material/MenuItem"),E=require("@mui/material/FormControl"),v=require("@mui/material/Select"),w=require("eventemitter3"),x=require("@material-ui/core/Grid"),S=require("@material-ui/core/Box"),C=require("@material-ui/core/Container");function k(e){return e&&e.__esModule?e:{default:e}}function q(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach(function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}}),t.default=e,Object.freeze(t)}var M=q(e),R=k(t),I=k(r),T=k(l),A=k(o),O=k(u),_=k(s),F=k(i),z=k(c),Y=k(d),P=k(p),j=k(h),D=k(y),B=k(g),$=k(b),W=k(E),L=k(v),U=k(w),V=k(x),G=k(S),H=k(C);function K(){return K=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)({}).hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},K.apply(null,arguments)}const N=a.makeStyles(e=>({root:{width:"100%","& > * + *":{marginTop:e.spacing(2)}}}));function J(e){const t=N();return M.default.createElement("div",K({className:t.root},e),M.default.createElement(I.default,null))}function Q(e,t,a="array"){const r=e.columns,n=[...t.doc.metrics,...t.doc.dimensions].reduce((e,t)=>(e[t.name]=t,e),{});return e=>{const t="array"===a?[]:{};return r.reduce((t,r)=>{const l=e[r.name],o=n[r.name];let u=l;return u="timestamp"===o.type?new Date(l):o.format?o.format&&o.prefix?{v:+l,f:o.prefix+" "+T.default(l).format(o.format)}:o.format?{v:+l,f:T.default(l).format(o.format)}:l:l,"array"===a?t.push(u):t[r.name]=u?.f||u,t},t)}}const X="https://report-api.netcapital.pro",Z=A.default.create({baseURL:X,headers:{"Content-Type":"application/json"}}),ee={},te=()=>{const e=Object.keys(ee);return e.length>0?e[0]:null},ae={setBaseUrl(e){Z.defaults.baseURL=e||X},setToken(e){e&&(Z.defaults.headers.common.Authorization=`Bearer ${e}`)},loadDashboardMeta:async({dashboardId:e})=>{const{data:t}=await Z.get(`/dashboard-meta/${e}`);return ee[e]={dashboards:t.dashboards||{},charts:t.charts||{},reports:t.reports||{},reportMetadata:t.reportMetadata||{},dateRanges:t.dateRanges||[]},ee[e]},getDashboard:async({id:e,dashboardId:t})=>{const a=t||te();if(a&&ee[a]?.dashboards?.[e])return ee[a].dashboards[e];const{data:r}=await Z.get(`/entity/dashboards/${e}`);return r},getChart:async({id:e,dashboardId:t})=>{const a=t||te();if(a&&ee[a]?.charts?.[e])return ee[a].charts[e];const{data:r}=await Z.get(`/entity/charts/${e}`);return r},getReport:async({id:e,dashboardId:t})=>{const a=t||te();if(a&&ee[a]?.reports?.[e])return ee[a].reports[e];const{data:r}=await Z.get(`/entity/reports/${e}`);return r},getProviders:async()=>{const{data:e}=await Z.get("/entity/providers");return e},getReportSchema:async({id:e,dashboardId:t,query:a={}})=>{const r=t||te();if(r&&ee[r]?.reportMetadata?.[e])return ee[r].reportMetadata[e];const{data:n}=await Z.post(`/reports/${e}/metadata`,a);return n},runReport:async({id:e,query:t={}})=>{const{data:a}=await Z.post(`/reports/${e}/run`,t);return a},runAdHocReport:async({report:e})=>{const{data:t}=await Z.post("/report-build/run",e);return t},getDateRanges:async({dashboardId:e}={})=>{const t=e||te();if(t&&ee[t]?.dateRanges)return ee[t].dateRanges;const{data:a}=await Z.get("/globals/date-ranges");return a}},re=a.makeStyles(e=>({headerRow:{fontFamily:e.typography.fontFamily,fontSize:e.typography.fontSize},tableRow:{fontFamily:e.typography.fontFamily,fontSize:e.typography.fontSize},oddTableRow:{fontFamily:e.typography.fontFamily,fontSize:e.typography.fontSize},headerCell:{backgroundColor:"white",padding:"4px !important"}})),ne={none:"YYYY-MM-dd",day:"MMM dd",week:"MMM dd",month:"YYYY MMM",year:"YYYY"};const le={GoogleChart:function({chart:t,source:a,view:r,report:l,schema:o,dashboard:u,query:s}){const[i,c]=M.default.useState([]),d=re(),[f,m]=M.default.useState([]);e.useEffect(()=>{(async()=>{const e=await ae.getDateRanges();m(e)})()},[]);const p=e.useMemo(()=>{const e="YYYY-MM-dd",t=s?.date_range?.name,a=f.find(e=>e.name===t);if(!a)return e;return ne[a?.granularity]||e},[f,s]);return M.default.useEffect(()=>{if(!(t&&r&&a&&l&&o))return;let e=[];e.push(function(e,t){const a=[...t.doc.metrics,...t.doc.dimensions];return e.columns.reduce((e,t)=>{const r=a.find(e=>e.name===t.name)||t;return e.push(r.title||r.name),e},[])}(r,o));const n=Q(r,o);a?.forEach(t=>{const a=n(t);e.push(a)}),a?.length?c(e):c()},[t,a,r,l,o]),i?M.default.createElement("div",{style:{}},M.default.createElement(n.Chart,K({width:t?.doc.size?.width||"100%",chartType:t?.doc.chart?.type,data:i,options:(e=>{if("Table"===t?.doc.chart?.type)return{...t?.doc.chart?.options,cssClassNames:d};if("AreaChart"===t?.doc.chart?.type){const a=t?.doc.chart?.options?.hAxis||{},r={...{ticks:e.slice(1).map(e=>e[0]),format:p},...a};return{...t?.doc.chart?.options,hAxis:r,focusTarget:"category"}}return t?.doc.chart?.options})(i)},t?.doc.chart?.props))):M.default.createElement("div",null)},LabelChart:function({chart:e,source:t,view:a,report:r,schema:n}){const[l,o]=M.default.useState([]),[u,s]=M.default.useState(),[i,c]=M.default.useState();return M.default.useEffect(()=>{if(!(e&&a&&t&&r&&n))return;let l=[];const u=Q(a,n);t.forEach(e=>l.push(u(e))),o(l);const i=e?.doc?.chart?.options||{},d=i?.index||0;if(l.length>0&&s(l[0][d]),i.subText?.format){_.default.configure({autoescape:!1});const e=Q(a,n,"object")(t[0]),r=_.default.renderString(i.subText?.format,e);c(r)}},[e,t,a,r,n]),M.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignContent:"center",height:"100%",flexDirection:"column"}},M.default.createElement(O.default,{variant:"h6"},u?.f||u),M.default.createElement(O.default,{variant:"caption"},i))}};function oe(e,t){return void 0!==le[e]?M.default.createElement(le[e],t):M.default.createElement(J,t)}const ue=M.createElement(P.default,{fontSize:"small"}),se=M.createElement(j.default,{fontSize:"small"});function ie({items:t,selectedKeys:a,defaultSelectedKeys:r,onChange:n,inputValue:l,defaultInputValue:o,onInputChange:u,debounceMs:s=300,label:i,placeholder:c,loading:d,disabled:f,size:p="small",error:h,helperText:y,limitTags:g=3,disableClearable:b,id:E,textFieldProps:v}){const w=e.useMemo(()=>Array.isArray(t)?t:[],[t]),x=Array.isArray(a),[S,C]=e.useState(Array.isArray(r)?r:[]),k=x?a:S,q=e.useMemo(()=>{const e=new Map;for(const t of w)e.set(t&&t.key,t);return e},[w]),R=e.useMemo(()=>(Array.isArray(k)?k:[]).map(e=>q.get(e)).filter(Boolean),[k,q]),I="string"==typeof l,[T,A]=e.useState("string"==typeof o?o:""),O=I?l:T,_=function(t,a=300){const r=e.useRef(t),n=e.useRef(null);return r.current=t,e.useEffect(()=>()=>{n.current&&window.clearTimeout(n.current)},[]),M.useCallback((...e)=>{r.current&&(n.current&&window.clearTimeout(n.current),n.current=window.setTimeout(()=>{r.current&&r.current(...e)},a))},[a])}(e=>{u&&u(e)},s),F=R;return M.createElement(m.FormControl,{fullWidth:!0,error:h,disabled:f},M.createElement(m.Autocomplete,{openOnFocus:!0,forcePopupIcon:!0,id:E,multiple:!0,disableCloseOnSelect:!0,options:w,value:F,inputValue:O,getOptionLabel:e=>e&&"object"==typeof e?e.value??"":"",isOptionEqualToValue:(e,t)=>e&&t&&e.key===t.key,loading:d,limitTags:g,disableClearable:b,onChange:(e,t)=>{const a=Array.isArray(t)?t.map(e=>e&&e.key):[];x||C(a),n&&n(a,Array.isArray(t)?t:[])},onInputChange:(e,t,a)=>{I||A(t??""),"input"===a?_(t??""):"clear"===a&&_("")},renderOption:(e,t,{selected:a})=>M.createElement("li",K({},e,{key:t&&t.key||Math.random().toString(36)}),M.createElement(m.Checkbox,{icon:ue,checkedIcon:se,style:{marginRight:8},checked:!!a}),t&&t.value),renderTags:(e,t)=>(Array.isArray(e)?e:[]).map((e,a)=>M.createElement(m.Chip,K({},t({index:a}),{key:e&&e.key||a,label:e&&e.value||""}))),renderInput:e=>M.createElement(m.TextField,K({},e,{label:i,placeholder:c,InputProps:{...e.InputProps,endAdornment:M.createElement(M.Fragment,null,d?M.createElement(m.CircularProgress,{size:18}):null,e.InputProps.endAdornment)},size:p},v))}),y?M.createElement(m.FormHelperText,null,y):null)}const ce=({filter:t,channel:a,query:r})=>{const[n,l]=e.useState([]),[o,u]=e.useState([]),[s,i]=e.useState(!1),[c,d]=e.useState("");return e.useEffect(()=>{u(r?.filter?.[t?.filter]||[])},[r]),e.useEffect(()=>{(async()=>{i(!0);const e=await async function(e,t){return t?.source?(await ae.runReport({id:t.source})).map(e=>({key:e[t.field],value:e[t.field]})):[]}(0,t);l(e),i(!1)})()},[c]),M.default.createElement("div",{style:{display:"flex"}},M.default.createElement("div",{style:{maxWidth:640,minWidth:200}},M.default.createElement(ie,{id:t?.title,label:t?.title,placeholder:"Type to search…",items:n,selectedKeys:o,onChange:(e,r)=>{u(e),a.emit("filterChanged",t,{[t.filter]:e})},onInputChange:e=>{d(e)},loading:s,debounceMs:300,helperText:o.length?`${o.length} selected`:""})))};function de({items:e,value:t,label:a,onChange:r,sx:n={width:"100%"}}){const l=e.some(e=>e.key===t)?t:"";return M.default.createElement(D.default,{sx:n},M.default.createElement(W.default,{fullWidth:!0},M.default.createElement(B.default,{id:"demo-simple-select-label"},a),M.default.createElement(L.default,{labelId:"demo-simple-select-label",id:"demo-simple-select",value:l,label:a,onChange:r,MenuProps:{style:{maxHeight:"300px"}},size:"small"},e.map(e=>{const{key:t,value:a}=e;return M.default.createElement($.default,{key:t,value:t},a)}))))}const fe=({filter:t,channel:a,query:r})=>{const[n,l]=e.useState([]),[o,u]=e.useState("");return e.useEffect(()=>{u(r?.date_range?.name)},[r]),e.useEffect(()=>{(async()=>{const e=(await ae.getDateRanges()).filter(e=>!(t.allowedOptions.length>0)||t.allowedOptions.some(t=>t===e.name)).map(e=>({key:e.name,value:e.title}));l(e)})()},[]),M.default.createElement("div",{style:{minWidth:"200px",maxWidth:"640px"}},M.default.createElement(de,{items:n,value:o,label:t?.title,onChange:(e,r)=>{const n=e.target.value;u(n),a.emit("filterChanged",t,{date_range:{name:n}})}}))},me=({filters:e=[],channel:t,query:a})=>M.default.createElement("div",{style:{display:"flex",flexWrap:"wrap",gap:"8px"}},e.map(e=>"multi-select"===e.type?M.default.createElement(ce,{key:e.title,channel:t,filter:e,query:a}):"date-range"===e.type?M.default.createElement(fe,{key:e.title,channel:t,filter:e,query:a}):null));var pe=e=>M.default.useRef(e||new U.default).current,he=e=>{const t=M.default.useState({}),a=M.default.useCallback((a,r)=>{let n={...t.current,...r};for(var l in t.current=n,n)"date_range"===l||n[l].length||delete n[l];e?.emit("mergedFilterChanged",{value:n})},[e]);M.default.useEffect(()=>(e?.on("filterChanged",a),()=>{e?.off("filterChanged",a)}),[e])},ye=({id:e,cache:t,dashboard:a,channel:r,...n})=>{const[l,o]=M.default.useState(),[u,s]=M.default.useState(),[i,c]=M.default.useState(),[d,m]=M.default.useState(),[p,h]=M.default.useState(oe()),[y,g]=M.default.useState(),[b,E]=M.default.useState(0),[v,w]=M.default.useState(!1),[x,S]=M.default.useState(),[C,k]=M.default.useState(!1),q=M.default.useRef({value:n?.filter}),[I,T]=M.default.useState({}),{ref:A,inView:_,entry:P}=f.useInView({threshold:.1,delay:1e3}),j=pe(r);he(j);const D=M.default.useCallback(e=>{const t=e.target.value;E(t),g(l.doc.view[t])},[l]);M.default.useEffect(()=>{e&&(async()=>{const a=e,r=t?.[a]||await ae.getChart({id:a}),l=r.doc.source?.id,u=l?t?.[l]||await ae.getReport({id:l}):void 0,i=t?.[`schema_${l}`]||n?.schema||await ae.getReportSchema({id:l}),d=r.doc?.view?.[0];E(0),s(u),o(r),g(d),c(i),k(!0)})().catch(e=>{console.error(e.message)})},[e]),M.default.useEffect(()=>{l&&d&&(!l?.doc?.source?.id||u)&&i&&(async()=>{h(oe(l.doc.chart?.component,{view:y,source:d,chart:l,report:u,schema:i,dashboard:a,query:I}))})().catch(e=>{console.error(e.message)})},[l,d,y,u,i]);const B=e=>{const t={...u?.doc.query.filter||{},...n?.filter,...e?.value},a=t.date_range||u?.doc.query.date_range;if(delete t.date_range,k(!1),S(),w(!0),"context"===l?.doc?.source?.type)return m({filter:t}),void w(!1);const r={filter:t,date_range:a,parameters:n?.params};T(r),ae.runReport({id:u.id,query:r}).then(e=>{m(l.doc.source.reverse?e.reverse():e)}).catch(e=>{m([])}).finally(()=>{w(!1)})},$=e=>{q.current=e,_?B(e):(S(e),k(!0))};return M.default.useEffect(()=>(j?.on("mergedFilterChanged",$),()=>{j?.off("mergedFilterChanged",$)}),[j,u,l,_]),M.default.useEffect(()=>{_&&C&&B(x)},[_,C]),M.default.useEffect(()=>{k(!0)},[n.params]),M.default.createElement(R.default,{ref:A,style:{padding:"16px",paddingTop:0,flexGrow:1,borderRadius:12,display:"flex",flexDirection:"column",gap:"16px"},elevation:2},M.default.createElement(J,{style:{visibility:v?"visible":"hidden"}}),M.default.createElement("div",{style:{display:"flex"}},M.default.createElement("div",null,l&&M.default.createElement("div",{style:{display:"flex",alignItems:"center",lineHeight:0}},M.default.createElement(O.default,{noWrap:!0,variant:"caption"},n?.title||l.doc.name," "))),M.default.createElement("div",{style:{flexGrow:1}}),M.default.createElement("div",null,l?.doc?.view?.length>1&&M.default.createElement(F.default,null,M.default.createElement(z.default,{labelId:"date-range-select-label",id:"date-range-select",value:b,onChange:D,style:{fontSize:"12px"},disableUnderline:!0},l.doc.view.map((e,t)=>M.default.createElement(Y.default,{key:t,value:t},e.title)))))),M.default.createElement("div",{style:{position:"relative",flexGrow:a?void 0:1,display:"flex",flexDirection:"column"}},M.default.createElement(me,{filters:l?.doc?.filters,channel:j,query:I}),p))};var ge={Chart:ye,Dashboard:function({id:t="sample_dashboard",api:a,params:r}){const[n,l]=M.default.useState(),[o]=M.default.useState(),[u,s]=M.default.useState([]),i=M.default.useRef({}),c=pe();he(c),e.useEffect(()=>{ae.setBaseUrl(a.base_url),ae.setToken(a.token)},[a]);const d=async e=>{const t=e?.doc?.rows||[],a=[];for(let e=0;e<t.length;e++){const r=t[e];r.columns?.forEach(e=>{if(e.override?.filter?.length){const t={};e.override.filter.forEach(e=>{e.hasOwnProperty("value")&&(t[e.field]=[e.value])}),e.filter=t}}),a.push(r)}s(a)};return M.default.useEffect(()=>{t&&(async()=>{ae.setBaseUrl(a.base_url),ae.setToken(a.token),await ae.loadDashboardMeta({dashboardId:t});const e=await ae.getDashboard({id:t});i.current[e?.id]=e,l(e),await d(e)})().catch(e=>console.error(e.message))},[t]),M.default.createElement(H.default,null,M.default.createElement(V.default,{container:!0,spacing:2},u?.map((e,t)=>M.default.createElement(V.default,{key:t,container:!0,item:!0,alignItems:"stretch",spacing:2},e?.columns?.map((e,t)=>M.default.createElement(V.default,{key:t,item:!0,xs:!0,style:{display:"flex"}},M.default.createElement(G.default,{style:{flex:1,display:"flex",flexDirection:"column"}},M.default.createElement(ye,{api:a,cache:i.current,id:e.id,dashboard:n,schema:o,channel:null,title:e.title,filter:e.filter,params:r}))))))))}};exports.default=ge;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@material-ui/core/Paper"),a=require("@material-ui/core/styles"),r=require("@material-ui/core/LinearProgress"),n=require("react-google-charts"),l=require("numeral"),i=require("axios"),o=require("@material-ui/core/Typography"),s=require("nunjucks"),u=require("@material-ui/core/FormControl"),d=require("@material-ui/core/Select"),c=require("@material-ui/core/MenuItem"),f=require("react-intersection-observer"),m=require("@mui/material"),p=require("@mui/icons-material/CheckBoxOutlineBlank"),h=require("@mui/icons-material/CheckBox"),y=require("@mui/material/Box"),g=require("@mui/material/InputLabel"),b=require("@mui/material/MenuItem"),v=require("@mui/material/FormControl"),E=require("@mui/material/Select"),w=require("eventemitter3"),x=require("@material-ui/core/Grid"),S=require("@material-ui/core/Box"),C=require("@material-ui/core/Container");function k(e){return e&&e.__esModule?e:{default:e}}function q(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach(function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}}),t.default=e,Object.freeze(t)}var M=q(e),R=k(t),I=k(r),T=k(l),A=k(i),D=k(o),O=k(s),_=k(u),F=k(d),z=k(c),Y=k(p),P=k(h),j=k(y),$=k(g),B=k(b),W=k(v),G=k(E),L=k(w),U=k(x),V=k(S),H=k(C);function K(){return K=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)({}).hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},K.apply(null,arguments)}const N=a.makeStyles(e=>({root:{width:"100%","& > * + *":{marginTop:e.spacing(2)}}}));function J(e){const t=N();return M.default.createElement("div",K({className:t.root},e),M.default.createElement(I.default,null))}function Q(e,t,a="array"){const r=e.columns,n=[...t.doc.metrics,...t.doc.dimensions].reduce((e,t)=>(e[t.name]=t,e),{});return e=>{const t="array"===a?[]:{};return r.reduce((t,r)=>{const l=e[r.name],i=n[r.name];let o=l;return o="timestamp"===i.type?new Date(l):i.format?i.format&&i.prefix?{v:+l,f:i.prefix+" "+T.default(l).format(i.format)}:i.format?{v:+l,f:T.default(l).format(i.format)}:l:l,"array"===a?t.push(o):t[r.name]=o?.f||o,t},t)}}const X="https://report-api.netcapital.pro",Z=A.default.create({baseURL:X,headers:{"Content-Type":"application/json"}}),ee={},te=()=>{const e=Object.keys(ee);return e.length>0?e[0]:null},ae={setBaseUrl(e){Z.defaults.baseURL=e||X},setToken(e){e&&(Z.defaults.headers.common.Authorization=`Bearer ${e}`)},loadDashboardMeta:async({dashboardId:e})=>{const{data:t}=await Z.get(`/dashboard-meta/${e}`);return ee[e]={dashboards:t.dashboards||{},charts:t.charts||{},reports:t.reports||{},reportMetadata:t.reportMetadata||{},dateRanges:t.dateRanges||[]},ee[e]},getDashboard:async({id:e,dashboardId:t})=>{const a=t||te();if(a&&ee[a]?.dashboards?.[e])return ee[a].dashboards[e];const{data:r}=await Z.get(`/entity/dashboards/${e}`);return r},getChart:async({id:e,dashboardId:t})=>{const a=t||te();if(a&&ee[a]?.charts?.[e])return ee[a].charts[e];const{data:r}=await Z.get(`/entity/charts/${e}`);return r},getReport:async({id:e,dashboardId:t})=>{const a=t||te();if(a&&ee[a]?.reports?.[e])return ee[a].reports[e];const{data:r}=await Z.get(`/entity/reports/${e}`);return r},getProviders:async()=>{const{data:e}=await Z.get("/entity/providers");return e},getReportSchema:async({id:e,dashboardId:t,query:a={}})=>{const r=t||te();if(r&&ee[r]?.reportMetadata?.[e])return ee[r].reportMetadata[e];const{data:n}=await Z.post(`/reports/${e}/metadata`,a);return n},runReport:async({id:e,query:t={}})=>{const{data:a}=await Z.post(`/reports/${e}/run`,t);return a},runAdHocReport:async({report:e})=>{const{data:t}=await Z.post("/report-build/run",e);return t},getDateRanges:async({dashboardId:e}={})=>{const t=e||te();if(t&&ee[t]?.dateRanges)return ee[t].dateRanges;const{data:a}=await Z.get("/globals/date-ranges");return a},getReportDefinitions:async()=>{const{data:e}=await Z.get("/report-definitions");return e},getReportDefinition:async({id:e})=>{const{data:t}=await Z.get(`/report-definitions/${e}`);return t},createReportDefinition:async({reportDefinition:e})=>{const{data:t}=await Z.post("/report-definitions",e);return t},updateReportDefinition:async({id:e,reportDefinition:t})=>{const{data:a}=await Z.put(`/report-definitions/${e}`,t);return a},deleteReportDefinition:async({id:e})=>{const{data:t}=await Z.delete(`/report-definitions/${e}`);return t}},re=a.makeStyles(e=>({headerRow:{fontFamily:e.typography.fontFamily,fontSize:e.typography.fontSize},tableRow:{fontFamily:e.typography.fontFamily,fontSize:e.typography.fontSize},oddTableRow:{fontFamily:e.typography.fontFamily,fontSize:e.typography.fontSize},headerCell:{backgroundColor:"white",padding:"4px !important"}})),ne={none:"YYYY-MM-dd",day:"MMM dd",week:"MMM dd",month:"YYYY MMM",year:"YYYY"};const le={GoogleChart:function({chart:t,source:a,view:r,report:l,schema:i,dashboard:o,query:s}){const[u,d]=M.default.useState([]),c=re(),[f,m]=M.default.useState([]);e.useEffect(()=>{(async()=>{const e=await ae.getDateRanges();m(e)})()},[]);const p=e.useMemo(()=>{const e="YYYY-MM-dd",t=s?.date_range?.name,a=f.find(e=>e.name===t);if(!a)return e;return ne[a?.granularity]||e},[f,s]);return M.default.useEffect(()=>{if(!(t&&r&&a&&l&&i))return;let e=[];e.push(function(e,t){const a=[...t.doc.metrics,...t.doc.dimensions];return e.columns.reduce((e,t)=>{const r=a.find(e=>e.name===t.name)||t;return e.push(r.title||r.name),e},[])}(r,i));const n=Q(r,i);a?.forEach(t=>{const a=n(t);e.push(a)}),a?.length?d(e):d()},[t,a,r,l,i]),u?M.default.createElement("div",{style:{}},M.default.createElement(n.Chart,K({width:t?.doc.size?.width||"100%",chartType:t?.doc.chart?.type,data:u,options:(e=>{if("Table"===t?.doc.chart?.type)return{...t?.doc.chart?.options,cssClassNames:c};if("AreaChart"===t?.doc.chart?.type){const a=t?.doc.chart?.options?.hAxis||{},r={...{ticks:e.slice(1).map(e=>e[0]),format:p},...a};return{...t?.doc.chart?.options,hAxis:r,focusTarget:"category"}}return t?.doc.chart?.options})(u)},t?.doc.chart?.props))):M.default.createElement("div",null)},LabelChart:function({chart:e,source:t,view:a,report:r,schema:n}){const[l,i]=M.default.useState([]),[o,s]=M.default.useState(),[u,d]=M.default.useState();return M.default.useEffect(()=>{if(!(e&&a&&t&&r&&n))return;let l=[];const o=Q(a,n);t.forEach(e=>l.push(o(e))),i(l);const u=e?.doc?.chart?.options||{},c=u?.index||0;if(l.length>0&&s(l[0][c]),u.subText?.format){O.default.configure({autoescape:!1});const e=Q(a,n,"object")(t[0]),r=O.default.renderString(u.subText?.format,e);d(r)}},[e,t,a,r,n]),M.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignContent:"center",height:"100%",flexDirection:"column"}},M.default.createElement(D.default,{variant:"h6"},o?.f||o),M.default.createElement(D.default,{variant:"caption"},u))}};function ie(e,t){return void 0!==le[e]?M.default.createElement(le[e],t):M.default.createElement(J,t)}const oe=M.createElement(Y.default,{fontSize:"small"}),se=M.createElement(P.default,{fontSize:"small"});function ue({items:t,selectedKeys:a,defaultSelectedKeys:r,onChange:n,inputValue:l,defaultInputValue:i,onInputChange:o,debounceMs:s=300,label:u,placeholder:d,loading:c,disabled:f,size:p="small",error:h,helperText:y,limitTags:g=3,disableClearable:b,id:v,textFieldProps:E}){const w=e.useMemo(()=>Array.isArray(t)?t:[],[t]),x=Array.isArray(a),[S,C]=e.useState(Array.isArray(r)?r:[]),k=x?a:S,q=e.useMemo(()=>{const e=new Map;for(const t of w)e.set(t&&t.key,t);return e},[w]),R=e.useMemo(()=>(Array.isArray(k)?k:[]).map(e=>q.get(e)).filter(Boolean),[k,q]),I="string"==typeof l,[T,A]=e.useState("string"==typeof i?i:""),D=I?l:T,O=function(t,a=300){const r=e.useRef(t),n=e.useRef(null);return r.current=t,e.useEffect(()=>()=>{n.current&&window.clearTimeout(n.current)},[]),M.useCallback((...e)=>{r.current&&(n.current&&window.clearTimeout(n.current),n.current=window.setTimeout(()=>{r.current&&r.current(...e)},a))},[a])}(e=>{o&&o(e)},s),_=R;return M.createElement(m.FormControl,{fullWidth:!0,error:h,disabled:f},M.createElement(m.Autocomplete,{openOnFocus:!0,forcePopupIcon:!0,id:v,multiple:!0,disableCloseOnSelect:!0,options:w,value:_,inputValue:D,getOptionLabel:e=>e&&"object"==typeof e?e.value??"":"",isOptionEqualToValue:(e,t)=>e&&t&&e.key===t.key,loading:c,limitTags:g,disableClearable:b,onChange:(e,t)=>{const a=Array.isArray(t)?t.map(e=>e&&e.key):[];x||C(a),n&&n(a,Array.isArray(t)?t:[])},onInputChange:(e,t,a)=>{I||A(t??""),"input"===a?O(t??""):"clear"===a&&O("")},renderOption:(e,t,{selected:a})=>M.createElement("li",K({},e,{key:t&&t.key||Math.random().toString(36)}),M.createElement(m.Checkbox,{icon:oe,checkedIcon:se,style:{marginRight:8},checked:!!a}),t&&t.value),renderTags:(e,t)=>(Array.isArray(e)?e:[]).map((e,a)=>M.createElement(m.Chip,K({},t({index:a}),{key:e&&e.key||a,label:e&&e.value||""}))),renderInput:e=>M.createElement(m.TextField,K({},e,{label:u,placeholder:d,InputProps:{...e.InputProps,endAdornment:M.createElement(M.Fragment,null,c?M.createElement(m.CircularProgress,{size:18}):null,e.InputProps.endAdornment)},size:p},E))}),y?M.createElement(m.FormHelperText,null,y):null)}const de=({filter:t,channel:a,query:r})=>{const[n,l]=e.useState([]),[i,o]=e.useState([]),[s,u]=e.useState(!1),[d,c]=e.useState("");return e.useEffect(()=>{o(r?.filter?.[t?.filter]||[])},[r]),e.useEffect(()=>{(async()=>{u(!0);const e=await async function(e,t){return t?.source?(await ae.runReport({id:t.source})).map(e=>({key:e[t.field],value:e[t.field]})):[]}(0,t);l(e),u(!1)})()},[d]),M.default.createElement("div",{style:{display:"flex"}},M.default.createElement("div",{style:{maxWidth:640,minWidth:200}},M.default.createElement(ue,{id:t?.title,label:t?.title,placeholder:"Type to search…",items:n,selectedKeys:i,onChange:(e,r)=>{o(e),a.emit("filterChanged",t,{[t.filter]:e})},onInputChange:e=>{c(e)},loading:s,debounceMs:300,helperText:i.length?`${i.length} selected`:""})))};function ce({items:e,value:t,label:a,onChange:r,sx:n={width:"100%"}}){const l=e.some(e=>e.key===t)?t:"";return M.default.createElement(j.default,{sx:n},M.default.createElement(W.default,{fullWidth:!0},M.default.createElement($.default,{id:"demo-simple-select-label"},a),M.default.createElement(G.default,{labelId:"demo-simple-select-label",id:"demo-simple-select",value:l,label:a,onChange:r,MenuProps:{style:{maxHeight:"300px"}},size:"small"},e.map(e=>{const{key:t,value:a,disabled:r}=e;return M.default.createElement(B.default,{key:t,value:t,disabled:r},a)}))))}const fe=({filter:t,channel:a,query:r})=>{const[n,l]=e.useState([]),[i,o]=e.useState("");return e.useEffect(()=>{o(r?.date_range?.name)},[r]),e.useEffect(()=>{(async()=>{const e=(await ae.getDateRanges()).filter(e=>!(t.allowedOptions.length>0)||t.allowedOptions.some(t=>t===e.name)).map(e=>({key:e.name,value:e.title}));l(e)})()},[]),M.default.createElement("div",{style:{minWidth:"200px",maxWidth:"640px"}},M.default.createElement(ce,{items:n,value:i,label:t?.title,onChange:(e,r)=>{const n=e.target.value;o(n),a.emit("filterChanged",t,{date_range:{name:n}})}}))},me=({filters:e=[],channel:t,query:a})=>M.default.createElement("div",{style:{display:"flex",flexWrap:"wrap",gap:"8px"}},e.map(e=>"multi-select"===e.type?M.default.createElement(de,{key:e.title,channel:t,filter:e,query:a}):"date-range"===e.type?M.default.createElement(fe,{key:e.title,channel:t,filter:e,query:a}):null));var pe=e=>M.default.useRef(e||new L.default).current,he=e=>{const t=M.default.useState({}),a=M.default.useCallback((a,r)=>{let n={...t.current,...r};for(var l in t.current=n,n)"date_range"===l||n[l].length||delete n[l];e?.emit("mergedFilterChanged",{value:n})},[e]);M.default.useEffect(()=>(e?.on("filterChanged",a),()=>{e?.off("filterChanged",a)}),[e])},ye=({id:e,cache:t,dashboard:a,channel:r,...n})=>{const[l,i]=M.default.useState(),[o,s]=M.default.useState(),[u,d]=M.default.useState(),[c,m]=M.default.useState(),[p,h]=M.default.useState(ie()),[y,g]=M.default.useState(),[b,v]=M.default.useState(0),[E,w]=M.default.useState(!1),[x,S]=M.default.useState(),[C,k]=M.default.useState(!1),q=M.default.useRef({value:n?.filter}),[I,T]=M.default.useState({}),{ref:A,inView:O,entry:Y}=f.useInView({threshold:.1,delay:1e3}),P=pe(r);he(P);const j=M.default.useCallback(e=>{const t=e.target.value;v(t),g(l.doc.view[t])},[l]);M.default.useEffect(()=>{e&&(async()=>{const a=e,r=t?.[a]||await ae.getChart({id:a}),l=r.doc.source?.id,o=l?t?.[l]||await ae.getReport({id:l}):void 0,u=t?.[`schema_${l}`]||n?.schema||await ae.getReportSchema({id:l}),c=r.doc?.view?.[0];v(0),s(o),i(r),g(c),d(u),k(!0)})().catch(e=>{console.error(e.message)})},[e]),M.default.useEffect(()=>{l&&c&&(!l?.doc?.source?.id||o)&&u&&(async()=>{h(ie(l.doc.chart?.component,{view:y,source:c,chart:l,report:o,schema:u,dashboard:a,query:I}))})().catch(e=>{console.error(e.message)})},[l,c,y,o,u]);const $=e=>{const t={...o?.doc.query.filter||{},...n?.filter,...e?.value},a=t.date_range||o?.doc.query.date_range;if(delete t.date_range,k(!1),S(),w(!0),"context"===l?.doc?.source?.type)return m({filter:t}),void w(!1);const r={filter:t,date_range:a,parameters:n?.params};T(r),ae.runReport({id:o.id,query:r}).then(e=>{m(l.doc.source.reverse?e.reverse():e)}).catch(e=>{m([])}).finally(()=>{w(!1)})},B=e=>{q.current=e,O?$(e):(S(e),k(!0))};return M.default.useEffect(()=>(P?.on("mergedFilterChanged",B),()=>{P?.off("mergedFilterChanged",B)}),[P,o,l,O]),M.default.useEffect(()=>{O&&C&&$(x)},[O,C]),M.default.useEffect(()=>{k(!0)},[n.params]),M.default.createElement(R.default,{ref:A,style:{padding:"16px",paddingTop:0,flexGrow:1,borderRadius:12,display:"flex",flexDirection:"column",gap:"16px"},elevation:2},M.default.createElement(J,{style:{visibility:E?"visible":"hidden"}}),M.default.createElement("div",{style:{display:"flex"}},M.default.createElement("div",null,l&&M.default.createElement("div",{style:{display:"flex",alignItems:"center",lineHeight:0}},M.default.createElement(D.default,{noWrap:!0,variant:"caption"},n?.title||l.doc.name," "))),M.default.createElement("div",{style:{flexGrow:1}}),M.default.createElement("div",null,l?.doc?.view?.length>1&&M.default.createElement(_.default,null,M.default.createElement(F.default,{labelId:"date-range-select-label",id:"date-range-select",value:b,onChange:j,style:{fontSize:"12px"},disableUnderline:!0},l.doc.view.map((e,t)=>M.default.createElement(z.default,{key:t,value:t},e.title)))))),M.default.createElement("div",{style:{position:"relative",flexGrow:a?void 0:1,display:"flex",flexDirection:"column"}},M.default.createElement(me,{filters:l?.doc?.filters,channel:P,query:I}),p))};var ge={Chart:ye,Dashboard:function({id:t="sample_dashboard",api:a,params:r}){const[n,l]=M.default.useState(),[i]=M.default.useState(),[o,s]=M.default.useState([]),u=M.default.useRef({}),d=pe();he(d),e.useEffect(()=>{ae.setBaseUrl(a.base_url),ae.setToken(a.token)},[a]);const c=async e=>{const t=e?.doc?.rows||[],a=[];for(let e=0;e<t.length;e++){const r=t[e];r.columns?.forEach(e=>{if(e.override?.filter?.length){const t={};e.override.filter.forEach(e=>{e.hasOwnProperty("value")&&(t[e.field]=[e.value])}),e.filter=t}}),a.push(r)}s(a)};return M.default.useEffect(()=>{t&&(async()=>{ae.setBaseUrl(a.base_url),ae.setToken(a.token),await ae.loadDashboardMeta({dashboardId:t});const e=await ae.getDashboard({id:t});u.current[e?.id]=e,l(e),await c(e)})().catch(e=>console.error(e.message))},[t]),M.default.createElement(H.default,{maxWidth:!1,disableGutters:!0,style:{height:"100vh",padding:0,margin:0,overflow:"hidden"}},M.default.createElement(U.default,{container:!0,spacing:2,style:{height:"100%",width:"100%"}},o?.map((e,t)=>M.default.createElement(U.default,{key:t,container:!0,item:!0,alignItems:"stretch",spacing:2},e?.columns?.map((e,t)=>M.default.createElement(U.default,{key:t,item:!0,xs:!0,style:{display:"flex"}},M.default.createElement(V.default,{style:{flex:1,display:"flex",flexDirection:"column"}},M.default.createElement(ye,{api:a,cache:u.current,id:e.id,dashboard:n,schema:i,channel:null,title:e.title,filter:e.filter,params:r}))))))))}};exports.default=ge;

package/dist/default/esm/index.js

@@ -291,6 +291,74 @@ const Api = {
       data
     } = await apiClient.get(`/globals/date-ranges`);
     return data;
+  },
+  /**
+   * Get all report definitions
+   * @returns {Promise} Axios response promise with array of report definitions
+   */
+  getReportDefinitions: async () => {
+    const {
+      data
+    } = await apiClient.get(`/report-definitions`);
+    return data;
+  },
+  /**
+   * Get report definition by ID
+   * @param {Object} params - Parameters object
+   * @param {string} params.id - Report definition ID
+   * @returns {Promise} Axios response promise with report definition
+   */
+  getReportDefinition: async ({
+    id
+  }) => {
+    const {
+      data
+    } = await apiClient.get(`/report-definitions/${id}`);
+    return data;
+  },
+  /**
+   * Create a new report definition
+   * @param {Object} params - Parameters object
+   * @param {Object} params.reportDefinition - Report definition object to create
+   * @returns {Promise} Axios response promise with created report definition
+   */
+  createReportDefinition: async ({
+    reportDefinition
+  }) => {
+    const {
+      data
+    } = await apiClient.post(`/report-definitions`, reportDefinition);
+    return data;
+  },
+  /**
+   * Update an existing report definition
+   * @param {Object} params - Parameters object
+   * @param {string} params.id - Report definition ID
+   * @param {Object} params.reportDefinition - Updated report definition object
+   * @returns {Promise} Axios response promise with updated report definition
+   */
+  updateReportDefinition: async ({
+    id,
+    reportDefinition
+  }) => {
+    const {
+      data
+    } = await apiClient.put(`/report-definitions/${id}`, reportDefinition);
+    return data;
+  },
+  /**
+   * Delete a report definition
+   * @param {Object} params - Parameters object
+   * @param {string} params.id - Report definition ID
+   * @returns {Promise} Axios response promise
+   */
+  deleteReportDefinition: async ({
+    id
+  }) => {
+    const {
+      data
+    } = await apiClient.delete(`/report-definitions/${id}`);
+    return data;
   }
 };
 
@@ -698,11 +766,13 @@ function SingleSelect({
   }, items.map(itm => {
     const {
       key,
-      value
+      value,
+      disabled
     } = itm;
     return /*#__PURE__*/React__default.createElement(MenuItem, {
       key: key,
-      value: key
+      value: key,
+      disabled: disabled
     }, value);
   }))));
 }
@@ -1131,9 +1201,23 @@ function Dashboard({
     //         )}
     //     </Grid>
     // </Container>
-    React__default.createElement(Container, null, /*#__PURE__*/React__default.createElement(Grid, {
+    React__default.createElement(Container, {
+      maxWidth: false,
+      disableGutters: true,
+      style: {
+        // backgroundColor:'yellow',
+        height: '100vh',
+        padding: 0,
+        margin: 0,
+        overflow: 'hidden'
+      }
+    }, /*#__PURE__*/React__default.createElement(Grid, {
       container: true,
-      spacing: 2
+      spacing: 2,
+      style: {
+        height: '100%',
+        width: '100%'
+      }
     }, rows?.map((row, rowIndex) => /*#__PURE__*/React__default.createElement(Grid, {
       key: rowIndex,
       container: true,