@devgateway/dvz-ui-react
Version:
A modular, embeddable React component library for data visualization and UI, built with TypeScript. Provides reusable components for charts, maps, dashboards, and more, with built-in support for internationalization and Redux integration.
2 lines (1 loc) • 2.59 kB
JavaScript
"use strict";const e=require("react/jsx-runtime"),m=require("react"),N=require("react-redux"),k=require("react-intl"),w=require("./DataContext.js"),I=require("../reducers/data.js"),i=require("semantic-ui-react"),P=a=>{const{app:t,source:n,store:s,params:r,csv:c,group:u,editing:q,style:h,isSvg:A,children:C,data:O,filters:g,autoApply:y,apply:l,error:v,loading:x,time:S,onSetData:D,onLoadData:j}=a,[T,p]=m.useState(!1),o=m.useRef({filters:g,params:r,app:t,source:n,csv:c,apply:l}),f=()=>{const d=Date.now()-S;x&&S&&d>1e3?p(!0):x&&setTimeout(f,100)};if(m.useEffect(()=>{t==="csv"?D({app:t,csv:c,store:s,params:r,group:u}):(p(!1),j({app:t,source:n,store:s,params:r,group:u}),setTimeout(f,100))},[]),m.useEffect(()=>{let d=!1;l!=null&&l!==o.current.apply&&(d=!0),y!==!1?(g!==o.current.filters||JSON.stringify(r)!==JSON.stringify(o.current.params)||t!==o.current.app||JSON.stringify(n)!==JSON.stringify(o.current.source)||c!==o.current.csv)&&(t==="csv"?D({app:t,csv:c,store:s,params:r,group:u}):(p(!1),j({app:t,source:n,store:s,params:r,group:u}),setTimeout(f,100))):d&&(j({app:t,source:n,store:s,params:r,group:u}),p(!1),setTimeout(f,100)),o.current={filters:g,params:r,app:t,source:n,csv:c,apply:l}},[g,r,t,n,c,l,y]),x&&T&&!q){const d={width:"100%",height:"100%",background:"transparent",verticalAlign:"middle",overflow:"hidden"},L=Object.assign({},h,{height:"90%",background:"transparent",textAlign:"center",margin:"30px"}),b=e.jsx(i.Segment,{basic:!0,padded:!0,style:L,children:e.jsx(i.Dimmer,{active:!0,inverted:!0,style:{background:"transparent"},children:e.jsx(i.Loader,{size:"medium",style:{background:"transparent"}})})});return A?e.jsx("foreignObject",{style:d,children:e.jsx(i.Container,{style:h,className:"loading",children:b})}):e.jsx(i.Container,{style:h,className:"loading",children:b})}else return v?v?e.jsxs(i.Segment,{color:"red",children:[e.jsx("h1",{children:"500"}),e.jsx("p",{children:"Wasn't able to load data"})]}):e.jsx(i.Container,{children:e.jsxs(i.Segment,{color:"red",children:[e.jsx("h1",{children:"404"}),e.jsx("p",{children:"Can't find this page"})]})}):e.jsx(w.DataContext.Provider,{value:O,children:C})},R=(a,t)=>{const{store:n,group:s,app:r}=t;return{data:a.getIn(["data",...n,"data"]),filters:a.getIn(["data","filters",r,s]),autoApply:a.getIn(["data","filters-settings",r,s,"autoApply"]),apply:a.getIn(["data","filters-settings",r,s,"apply"]),error:a.getIn(["data",...n,"error"]),loading:a.getIn(["data",...n,"loading"]),time:a.getIn(["data",...n,"time"])}},J={onSetData:I.setData,onLoadData:I.getData},E=N.connect(R,J)(k.injectIntl(P));module.exports=E;