\n {(error || differenceValue.error).toString()} ;\n }\n if (!resultSet || !differenceValue.resultSet) {\n return null;\n }\n if (resultSet && differenceValue.resultSet) {\n let postfix = null;\n let prefix = null;\n const measureKey = resultSet.seriesNames()[0].key;\n const annotations = resultSet\n .tableColumns()\n .find((tableColumn) => tableColumn.key === measureKey);\n const format =\n annotations.format || (annotations.meta && annotations.meta.format);\n if (format === \"percent\") {\n postfix = \"%\";\n } else if (format === \"currency\") {\n prefix = \"$\";\n }\n\n let value = null;\n let fullValue = resultSet\n .seriesNames()\n .map((s) => resultSet.totalRow()[s.key])[0];\n if (difference) {\n value =\n (differenceValue.resultSet.totalRow()[differenceQuery.measures[0]] /\n fullValue) *\n 100;\n }\n return (\n \n \n \n \n \n {title}\n \n \n {prefix}\n \n \n \n {progress ? (\n \n \n {value > 1 ? (\n {value.toFixed(1)}% \n ) : (\n {value.toFixed(1)}% \n )}\n \n \n Since this year\n \n
\n ) : null}\n \n \n );\n }\n};\n\nKPIChart.propTypes = {\n className: PropTypes.string,\n title: PropTypes.string,\n};\n\nexport default KPIChart;\n","import React from \"react\";\nimport { Grid } from \"@material-ui/core\";\nimport { makeStyles } from \"@material-ui/styles\";\nimport KPIChart from \"./KPIChart\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n padding: theme.spacing(4),\n },\n}));\n\nconst cards = [\n {\n title: \"TOTAL PUBLIC CONDOMS\",\n query: {\n measures: [\"distributions.public_total\"],\n timeDimensions: [\n {\n dimension: \"distributions.distributed_at\",\n granularity: null,\n // dateRange: \"Last year\",\n },\n ],\n filters: [\n {\n member: \"distributions.year\",\n operator: \"equals\",\n values: [\"2018\"],\n },\n ],\n },\n duration: 1.75,\n },\n {\n title: \"TOTAL SOCIAL MARKETING\",\n query: {\n measures: [\"distributions.social_marketing_total\"],\n timeDimensions: [\n {\n dimension: \"distributions.distributed_at\",\n granularity: null,\n // dateRange: \"Last year\",\n },\n ],\n filters: [\n {\n member: \"distributions.year\",\n operator: \"equals\",\n values: [\"2018\"],\n },\n ],\n },\n duration: 1.75,\n },\n {\n title: \"TOTAL COMMERCIAL\",\n query: {\n measures: [\"distributions.commercial_total\"],\n timeDimensions: [\n {\n dimension: \"distributions.distributed_at\",\n granularity: null,\n // dateRange: \"Last year\",\n },\n ],\n filters: [\n {\n member: \"distributions.year\",\n operator: \"equals\",\n values: [\"2018\"],\n },\n ],\n },\n duration: 1.75,\n },\n {\n title: \"TOTAL MALE\",\n query: {\n measures: [\"distributions.male\"],\n timeDimensions: [\n {\n dimension: \"distributions.distributed_at\",\n granularity: null,\n // dateRange: \"Last year\",\n },\n ],\n filters: [\n {\n member: \"distributions.year\",\n operator: \"equals\",\n values: [\"2018\"],\n },\n ],\n },\n duration: 1.75,\n },\n {\n title: \"TOTAL FEMALE\",\n query: {\n measures: [\"distributions.female\"],\n timeDimensions: [\n {\n dimension: \"distributions.distributed_at\",\n granularity: null,\n // dateRange: \"Last year\",\n },\n ],\n filters: [\n {\n member: \"distributions.year\",\n operator: \"equals\",\n values: [\"2018\"],\n },\n ],\n },\n duration: 1.75,\n },\n {\n title: \"TOTAL LUBRICANTS\",\n query: {\n measures: [\"distributions.lubricant\"],\n timeDimensions: [\n {\n dimension: \"distributions.distributed_at\",\n granularity: null,\n // dateRange: \"Last year\",\n },\n ],\n filters: [\n {\n member: \"distributions.year\",\n operator: \"equals\",\n values: [\"2018\"],\n },\n ],\n },\n duration: 1.75,\n },\n];\n\nconst KPIHeader = () => {\n const classes = useStyles();\n return (\n \n \n {cards.map((item, index) => {\n return (\n \n \n );\n })}\n \n
\n );\n};\n\nexport default KPIHeader;\n","import React from \"react\";\nimport { Spin, Button, Alert, Typography } from \"antd\";\nimport { Link } from \"react-router-dom\";\nimport { useQuery } from \"@apollo/react-hooks\";\nimport { GET_DASHBOARD_ITEMS } from \"../graphql/queries\";\nimport ChartRenderer from \"../components/ChartRenderer\";\nimport Dashboard from \"../components/Dashboard\";\nimport DashboardItem from \"../components/DashboardItem\";\nimport PageHeader from \"../components/PageHeader\";\nimport KPIHeader from \"../components/KPIHeader\";\n\nconst deserializeItem = i => ({\n ...i,\n layout: JSON.parse(i.layout) || {},\n vizState: JSON.parse(i.vizState)\n});\n\nconst defaultLayout = i => ({\n x: i.layout.x || 0,\n y: i.layout.y || 0,\n w: i.layout.w || 4,\n h: i.layout.h || 8,\n minW: 4,\n minH: 8\n});\n\nconst DashboardPage = () => {\n const { loading, error, data } = useQuery(GET_DASHBOARD_ITEMS);\n\n if (loading) {\n return \n \n \n
\n );\n\n const Empty = () => (\n \n There are no charts on this dashboard \n \n Add chart\n \n \n \n );\n\n return !data || data.dashboardItems.length ? (\n \n
\n
Dashboard}\n button={\n Add chart\n \n }\n />\n \n {data && data.dashboardItems.map(deserializeItem).map(dashboardItem)}\n \n \n \n \n ,\n document.getElementById(\"root\")\n); // If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\n\nserviceWorker.unregister();\n","module.exports = __webpack_public_path__ + \"static/media/drag-background.faaee4c4.svg\";"],"sourceRoot":""}