{"version":3,"sources":["components/Dashboards/Widgets/taskDoneBar.jsx"],"names":["TaskDoneBar","props","db","reduxStore","getState","_useState","useState","index","showQuantity","number","finalIndex","dataStructure","_useState2","_slicedToArray","filter","setFilter","_useState3","_useState4","data","setData","keysRef","useRef","filterRef","hashs","window","location","hash","split","replace","usersUsed","useEffect","tags","current","_toConsumableArray","key","forEach","item","concat","label","timeTasks","updateTaskInfo","dateCard","_timeTasks$monthKey","_timeTasks$monthKey2","monthKey","date","format","_objectSpread","_defineProperty","total","month","includes","planCards","Object","keys","planCard","_db$cards$planCard$co","moment","cards","completed_at","low","_tags","i","startDate","startOf","add","endDate","endOf","isBetween","_filter$tags","length","values","load","console","log","React","createElement","className","style","width","height","alignSelf","borderRadius","backgroundColor","display","flexFlow","overflow","Header","handleSetSelected","value","handleSetFilter","id","filterConfig","filterSelect","filterItems","filterData","tittle","translate","icon","styles","datafilter","indicators","handleRemoveObject","edit","handleSetoption","borderBottom","position","flex","fontSize","Icon","onClick","zIndex","top","left","right","fontWeight","ResponsiveBar","layers","bars","yScale","Fragment","fill","stroke","pointerEvents","bar","_bar$data$data","map","_bar$data$data2","cx","x","Math","trunc","cy","r","colors","indexBy","margin","bottom","padding","valueScale","type","indexScale","round","enableLabel","max","minValue","theme","color","background","axis","match","borderColor","from","modifiers","axisTop","axisRight","axisBottom","preview","tickSize","tickPadding","tickRotation","legendPosition","legendOffset","axisLeft","role","justifyContent","maxHeight","Legend","legend","status","a"],"mappings":"qOAkSeA,UAhRK,SAACC,GAEjB,IAAQC,EAAOC,IAAWC,WAAlBF,GACRG,EAA4BC,mBAAS,CACjCC,MAAO,EACPC,aAAc,GACdC,OAAQ,GACRC,WAAY,GACZC,cAAe,UACjBC,EAAAC,YAAAR,EAAA,GANKS,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAOxBI,EAAwBV,mBAAS,IAAGW,EAAAJ,YAAAG,EAAA,GAA7BE,EAAID,EAAA,GAAEE,EAAOF,EAAA,GACdG,EAAUC,iBAAO,CAAC,UAClBC,EAAYD,iBAAO,IAGrBE,EAAQC,OAAOC,SAASC,KAAKC,MAAM,KACvCJ,EAAM,GAAKA,EAAM,GAAGK,QAAQ,IAAK,IACjC,IAAIC,EAAY,GAIhBC,qBAAU,WACF7B,EAAMa,QACNC,EAAUd,EAAMa,UAErB,CAACb,EAAMa,SAEVgB,qBAAU,WACFhB,EAAOiB,OACPX,EAAQY,QAAOC,YAAOb,EAAQY,QAAQlB,QAAO,SAAAoB,GAAG,MAAY,UAARA,MACpDpB,EAAOiB,KAAKI,SAAQ,SAACC,GACjBd,EAAUU,QAAO,GAAAK,OAAAJ,YAAOX,EAAUU,SAAO,CAAEI,EAAKE,cAGzD,CAACxB,IAGJgB,qBAAU,WACN,IAAIS,EAAY,GAEVC,EAAiB,SAACC,EAAUH,GAAW,IAADI,EAAAC,EAClCC,EAAWH,EAASI,KAAKC,OAAO,QACtCP,EAASQ,wBAAA,GACFR,GAAS,GAAAS,YAAA,GACXJ,EAAQG,wBAAA,GACFR,EAAUK,IAAa,IAAE,GAAAI,YAAA,CAC5BC,QAA2B,QAAnBP,EAAAH,EAAUK,UAAS,IAAAF,OAAA,EAAnBA,EAAqBO,QAAS,GAAK,EAC3CC,MAAOT,EAASI,KAAKC,OAAO,SAC3BR,IAA4B,QAAnBK,EAAAJ,EAAUK,UAAS,IAAAD,OAAA,EAAnBA,EAAsBL,KAAU,GAAK,MAIlDlB,EAAQY,QAAQmB,SAASb,KAC1BlB,EAAQY,QAAO,GAAAK,OAAAJ,YAAOb,EAAQY,SAAO,CAAEM,MAI/C,GAAIrC,EAAMmD,UAAW,CACjBC,OAAOC,KAAKrD,EAAMmD,WAAWjB,SAAQ,SAAAoB,GAAa,IAADC,EACvCf,EAAW,CACbI,KAAMY,IAA8C,KAAR,QAA/BD,EAAAtD,EAAGwD,MAAMH,GAAUI,oBAAY,IAAAH,OAAA,EAA/BA,EAAiCI,MAC9C7B,KAAM7B,EAAGwD,MAAMH,GAAUM,OAI7B,GAAkB,UAFA/C,EAAOH,cAGrB,IAAK,IAAImD,EAAI,EAAGA,EAAI,GAAIA,IAAK,CACzB,IAAMC,EAAYN,MAASO,QAAQ,QAAQC,IAAIH,EAAG,SAC5CI,EAAUT,IAAOM,GAAWI,MAAM,SAExC,GAAI1B,EAASI,KAAKuB,UAAUL,EAAWG,EAAS,KAAM,MAAO,CAAC,IAADG,EACnDzB,EAAWH,EAASI,KAAKC,OAAO,QACtCP,EAASQ,wBAAA,GACFR,GAAS,GAAAS,YAAA,GACXJ,EAAQG,wBAAA,GACFR,EAAUK,IAAa,IAAE,IAC5B,MAASL,GAAaA,EAAUK,IAAaL,EAAUK,GAAiB,MAAIL,EAAUK,GAAiB,MAAI,EAAI,EAC/G,MAASA,OAGP,OAAN9B,QAAM,IAANA,GAAY,QAANuD,EAANvD,EAAQiB,YAAI,IAAAsC,OAAN,EAANA,EAAcC,QAAS,EACvB7B,EAASV,KACJjB,QAAO,SAAAsB,GAAI,OAAIA,EAAKE,OAAShB,EAAUU,QAAQmB,SAASf,EAAKE,UAC7DH,SAAQ,SAAAC,GACLI,EAAeC,EAAUL,EAAKE,UAGtClB,EAAQY,QAAU,CAAC,cAOvC,IAAMd,EAAOmC,OAAOkB,OAAOhC,GACvBrB,IAASW,GACTV,EAAQD,MAIjB,CAACjB,EAAMmD,UAAWnD,EAAMuE,KAAM1D,IAmCjC,OAFA2D,QAAQC,IAAI5D,GAGR6D,IAAAC,cAAA,OAAKC,UAAU,MAAMC,MAAO,CAAEC,MAAO,OAAQC,OAAQ,OAAQC,UAAW,SAAUC,aAAc,MAAOC,gBAAiB,cAAeC,QAAS,OAAQC,SAAU,SAAUC,SAAU,YAClLX,IAAAC,cAACW,IAAM,CACHC,kBAAmB,SAACC,GAChB1E,EAASgC,wBAAC,GAAKjC,GAAW2E,IAC1BxF,EAAMyF,gBAAe3C,oCAAC,GAAKjC,GAAW2E,GAAK,IAAEE,GAAI1F,EAAM0F,OAE3DC,aAAc,CAAEC,aAAcxC,OAAOC,KAAKpC,GAAMoD,OAAS,GAAKjB,OAAOkB,OAAOrD,GAAMoD,OAAQwB,YAAa,CAAC,QAAS,QAASC,WAAYjF,GACtIkF,OAAQC,YAAU,MAAQhG,EAAM+F,QAChCE,KAAMjG,EAAMiG,KACZC,OAAQlG,EAAMkG,OACdC,YAAY,EACZC,WAAYvF,GAAkB,KAC9BwF,mBAAoB,kBAAMrG,EAAMqG,mBAAmBrG,EAAM0F,KACzDY,KAAMtG,EAAMsG,KACZC,gBAAiB,SAACf,GACd1E,EAASgC,YAAC,GAAK0C,IACfxF,EAAMyF,gBAAe3C,oCAAC,GAAKjC,GAAW2E,GAAK,IAAEE,GAAI1F,EAAM0F,SAG/DhB,IAAAC,cAAA,OAAKE,MAAO,CAAE2B,aAAc,oBAAqB1B,MAAO,UACxDJ,IAAAC,cAAA,OAAKE,MAAO,KAEZH,IAAAC,cAAA,OAAKE,MAAO,CAAE4B,SAAU,WAAYC,KAAM,WAAYC,SAAU,SACzC,IAAjB9F,EAAOP,OACLoE,IAAAC,cAACiC,IAAI,CACDC,QAAS,kBACL/F,EAASgC,wBAAC,GAECjC,GAAM,IACTP,MAAOO,EAAOP,MAAQ,EACtBG,WAAYI,EAAOJ,WAAa,MAG5CoE,MACI,CACI4B,SAAU,WACVK,OAAQ,MACRC,IAAK,MACLC,KAAM,SACP,kBAIb5D,OAAOC,KAAKpC,GAAMoD,SAAWxD,EAAOP,MAAQO,EAAOL,QAAU4C,OAAOC,KAAKpC,GAAMoD,OAASxD,EAAON,cAAiBmE,IAAAC,cAACiC,IAAI,CAACC,QAAS,kBAAM/F,EAASgC,wBAAC,GAAKjC,GAAM,IAAEP,MAAOO,EAAOP,MAAQ,EAAGG,WAAYI,EAAOJ,WAAa,MAAMoE,MAAO,CAAE4B,SAAU,WAAYK,OAAQ,MAAOC,IAAK,MAAOE,MAAO,SAAU,qBACxSvC,IAAAC,cAAA,OAAKE,MAAO,CAAEC,MAAO,OAAQC,OAAQ,OAAQ0B,SAAU,WAAYS,WAAY,UAAWhC,gBAAiB,YACrG9B,OAAOC,KAAKpC,GAAMoD,OAAS,IAAMrE,EAAMuE,KACrCG,IAAAC,cAAA,OAAKC,UAAU,YAAYC,MAAO,CAAEC,MAAO,OAAQC,OAAQ,SACvDL,IAAAC,cAACwC,IAAa,CACVlG,KAAMA,EACNmG,OAAQ,CAAC,OAAQ,OAAQ,OA/ExC,SAACpH,GACV,IAAQqH,EAAiBrH,EAAjBqH,KAAMC,EAAWtH,EAAXsH,OACd,OACI5C,IAAAC,cAAC4C,WAAQ,KACL7C,IAAAC,cAAA,QACI6C,KAAK,OACLC,OATE,uBAUF5C,MAAO,CAAE6C,cAAe,UAE3BL,EACIxG,QAAO,SAAA8G,GAAG,IAAAC,EAAA,OAAiB,QAAjBA,EAAID,EAAI1G,KAAKA,YAAI,IAAA2G,OAAA,EAAbA,EAAyB,WACvCC,KAAI,SAAAF,GAAQ,IAADG,EACR,OAAOpD,IAAAC,cAAA,UACH1C,IAAK0F,EAAI1F,IACT8F,GAAI/H,EAAMqH,KAAK,GAAGW,EAAIC,KAAKC,MAAMP,EAAI7C,OAAS,EAC9CqD,GAAIb,EAAoB,QAAdQ,EAACH,EAAI1G,KAAKA,YAAI,IAAA6G,OAAA,EAAbA,EAAyB,SACpCM,EAAG,EACHZ,KAAK,QACLC,OArBN,uBAsBM5C,MAAO,CAAE6C,cAAe,eA4DmB,UAAW,WAClDrE,KAAMlC,EAAQY,QACdsG,OAAQ,CAAC,UAAW,UAAW,UAAW,UAAW,QACrDC,QAAS,QACTC,OAAQ,CAAExB,IAAK,GAAIE,MAAO,GAAIuB,OAAQ,GAAIxB,KAAM,IAChDyB,QAAS,GACTC,WAAY,CAAEC,KAAM,UACpBC,WAAY,CAAED,KAAM,OAAQE,OAAO,GACnCC,aAAa,EACbxB,OAAQ,CACJyB,IAAK,KAETC,SAAU,EACVC,MAAO,CACHtC,SAAU,OACVuC,MAAO,QACPC,WAAY,UACZC,KAAM,CACF,MAAS,CACL,KAAQ,CACJ5B,KAAM,sBACN,SAAY,OAO5BA,KAAM,CACF,CACI6B,MAAO,CACH3D,GAAI,SAERA,GAAI,QAER,CACI2D,MAAO,CACH3D,GAAI,YAERA,GAAI,UAGZ4D,YAAa,CACTC,KAAM,QACNC,UAAW,CACP,CACI,SACA,OAIZC,QAAS,KACTC,UAAW,KACXC,WAAa3J,EAAM4J,QAMf,KANyB,CACzBC,SAAU,EACVC,YAAa,EACbC,aAAc,EACdC,eAAgB,SAChBC,aAAc,IAElBC,SAAWlK,EAAM4J,QAMb,KANuB,CACvBC,SAAU,EACVC,YAAa,EACbC,aAAc,EACdC,eAAgB,SAChBC,cAAe,IAEnBE,KAAK,gBACP,KAAUzF,IAAAC,cAAA,OAAKE,MAAO,CAAEC,MAAO,OAAQC,OAAQ,OAAQI,QAAS,OAAQiF,eAAgB,WAC1F1F,IAAAC,cAAA,OAAKE,MAAO,CAAEG,UAAW,WAAY,KAAEN,IAAAC,cAAA,OAAKC,UAAU,eAItEF,IAAAC,cAAA,OAAKE,MAAO,CAAEE,OAAQ,MAAOsF,UAAW,OAAQlF,QAAS,OAAQD,gBAAiB,UAC9ER,IAAAC,cAAC2F,IAAM,CACHC,OAAMvI,YAAM/B,EAAGuK,OAAO3C,KAAI,SAAC4C,EAAG5G,GAC1B,MAAO,CACH5B,IAAK4B,EACLqF,MAAOuB,EAAEvB,MACT7G,MAAOoI,EAAEpI","file":"static/js/0.71c8f52b.chunk.js","sourcesContent":["import React, { useEffect, useState, useRef, Fragment } from 'react'\n//COMPONENTS\nimport Legend from '../Legend';\nimport { ResponsiveBar } from '@nivo/bar'\nimport Header from 'components/Dashboards/Header'\nimport './Loader.css';\n\n//REDUX\nimport reduxStore from \"store/\"\nimport moment from \"moment-timezone\"\nimport { translate } from 'functions';\nimport Icon from 'components/Icon';\n\n\n\n//https://codesandbox.io/s/m4ro13jjn8?file=/src/index.js\n\n\nconst TaskDoneBar = (props) => {\n\n    const { db } = reduxStore.getState()\n    const [filter, setFilter] = useState({\n        index: 0,\n        showQuantity: 12,\n        number: 12,\n        finalIndex: 12,\n        dataStructure: 'month',\n    })\n    const [data, setData] = useState({})\n    const keysRef = useRef(['total'])\n    const filterRef = useRef([])\n\n\n    let hashs = window.location.hash.split(\"/\")\n    hashs[0] = hashs[0].replace('#', '')\n    let usersUsed = {}\n\n    // number: filter?.users ? filter?.users?.length : 10,\n\n    useEffect(() => {\n        if (props.filter) {\n            setFilter(props.filter)\n        }\n    }, [props.filter]);\n\n    useEffect(() => {\n        if (filter.tags) {\n            keysRef.current = [...keysRef.current.filter(key => key !== 'total')];\n            filter.tags.forEach((item) => {\n                filterRef.current = [...filterRef.current, item.label];\n            })\n        }\n    }, [filter]);\n\n\n    useEffect(() => {\n        let timeTasks = {};\n\n        const updateTaskInfo = (dateCard, label) => {\n            const monthKey = dateCard.date.format('MMMM');\n            timeTasks = {\n                ...timeTasks,\n                [monthKey]: {\n                    ...timeTasks[monthKey] || {},\n                    total: (timeTasks[monthKey]?.total || 0) + 1,\n                    month: dateCard.date.format('MMMM'),\n                    [label]: (timeTasks[monthKey]?.[label] || 0) + 1,\n                }\n            };\n\n            if (!keysRef.current.includes(label)) {\n                keysRef.current = [...keysRef.current, label];\n            }\n        };\n\n        if (props.planCards) {\n            Object.keys(props.planCards).forEach(planCard => {\n                const dateCard = {\n                    date: moment(db.cards[planCard].completed_at?.low * 1000),\n                    tags: db.cards[planCard]._tags\n                };\n                const structure = filter.dataStructure;\n\n                if (structure === 'month') {\n                    for (let i = 0; i < 12; i++) {\n                        const startDate = moment().startOf('year').add(i, 'month');\n                        const endDate = moment(startDate).endOf('month');\n\n                        if (dateCard.date.isBetween(startDate, endDate, null, '[]')) {\n                            const monthKey = dateCard.date.format('MMMM');\n                            timeTasks = {\n                                ...timeTasks,\n                                [monthKey]: {\n                                    ...timeTasks[monthKey] || {},\n                                    \"total\": timeTasks && timeTasks[monthKey] && timeTasks[monthKey][\"total\"] ? timeTasks[monthKey][\"total\"] + 1 : 1,\n                                    \"month\": monthKey,\n                                }\n                            }\n                            if (filter?.tags?.length > 0) {\n                                dateCard.tags\n                                    .filter(item => item.label && filterRef.current.includes(item.label))\n                                    .forEach(item => {\n                                        updateTaskInfo(dateCard, item.label);\n                                    });\n                            } else {\n                                keysRef.current = [\"total\"];\n                            }\n                        }\n                    }\n                }\n            });\n\n            const data = Object.values(timeTasks);\n            if (data !== usersUsed) {\n                setData(data);\n            }\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [props.planCards, props.load, filter]);\n\n    // const barColor = \"#0095ff\";\n    const lineColor = \"rgba(200, 30, 15, 1)\";\n    // const areaColor = \"#0095ff\";\n\n    const Line = (props) => {\n        const { bars, yScale } = props\n        return (\n            <Fragment>\n                <path\n                    fill=\"none\"\n                    stroke={lineColor}\n                    style={{ pointerEvents: \"none\" }}\n                />\n                {bars\n                    .filter(bar => bar.data.data?.[\"RELEASE\"])\n                    .map(bar => {\n                        return <circle\n                            key={bar.key}\n                            cx={props.bars[2].x + Math.trunc(bar.width) / 2}\n                            cy={yScale(bar.data.data?.[\"RELEASE\"])}\n                            r={4}\n                            fill=\"white\"\n                            stroke={lineColor}\n                            style={{ pointerEvents: \"none\" }}\n                        />\n                    }\n                    )}\n            </Fragment>\n        );\n    };\n\n    console.log(filter)\n\n    return (\n        <div className='box' style={{ width: '100%', height: '100%', alignSelf: 'center', borderRadius: '5px', backgroundColor: 'transparent', display: 'flex', flexFlow: 'column', overflow: 'visible' }}>\n            <Header\n                handleSetSelected={(value) => {\n                    setFilter({ ...filter, ...value })\n                    props.handleSetFilter({ ...filter, ...value, id: props.id })\n                }}\n                filterConfig={{ filterSelect: Object.keys(data).length > 0 && Object.values(data).length, filterItems: ['users', 'tags'], filterData: filter }}\n                tittle={translate(\"$__\" + props.tittle)}\n                icon={props.icon}\n                styles={props.styles}\n                datafilter={true}\n                indicators={filter ? filter : null}\n                handleRemoveObject={() => props.handleRemoveObject(props.id)}\n                edit={props.edit}\n                handleSetoption={(value) => {\n                    setFilter({ ...value })\n                    props.handleSetFilter({ ...filter, ...value, id: props.id })\n                }}\n            />\n            <div style={{ borderBottom: '1px solid #D3D3D3', width: '100%' }}></div>\n            <div style={{}} >\n            </div>\n            <div style={{ position: 'relative', flex: '1 1 auto', fontSize: '16px' }}>\n                {(filter.index !== 0) &&\n                    <Icon\n                        onClick={() =>\n                            setFilter(\n                                {\n                                    ...filter,\n                                    index: filter.index - 1,\n                                    finalIndex: filter.finalIndex - 1\n                                })\n                        }\n                        style={\n                            {\n                                position: 'absolute',\n                                zIndex: '999',\n                                top: '48%',\n                                left: '10px'\n                            }}>\n                        arrow_back_ios\n                    </Icon>\n                }\n                {(Object.keys(data).length !== filter.index + filter.number && Object.keys(data).length > filter.showQuantity) && <Icon onClick={() => setFilter({ ...filter, index: filter.index + 1, finalIndex: filter.finalIndex + 1 })} style={{ position: 'absolute', zIndex: '999', top: '48%', right: '10px' }}>arrow_forward_ios</Icon>}\n                <div style={{ width: '100%', height: '100%', position: 'absolute', fontWeight: 'lighter', backgroundColor: '#f5f5f5' }}>\n                    {(Object.keys(data).length > 0 && !props.load) ?\n                        <div className='component' style={{ width: '100%', height: '100%' }}>\n                            <ResponsiveBar\n                                data={data}\n                                layers={[\"grid\", \"axes\", \"bars\", Line, \"markers\", \"legends\"]}\n                                keys={keysRef.current} // data\n                                colors={[\"#011E41\", \"#5A7F71\", \"#929497\", \"#EBA900\", \"pink\"]}\n                                indexBy={\"month\"} //data\n                                margin={{ top: 40, right: 20, bottom: 30, left: 40 }}\n                                padding={0.3}\n                                valueScale={{ type: 'linear' }}\n                                indexScale={{ type: 'band', round: false }}\n                                enableLabel={false}\n                                yScale={{\n                                    max: 100,\n                                }}\n                                minValue={0}\n                                theme={{\n                                    fontSize: '14px',\n                                    color: 'white',\n                                    background: '#f5f5f5',\n                                    axis: {\n                                        \"ticks\": {\n                                            \"text\": {\n                                                fill: 'rgba(0, 0, 0, 0.50)',\n                                                \"fontSize\": 14,\n                                                //cor dos numeros\n                                            },\n                                        }\n                                    },\n                                }}\n\n                                fill={[\n                                    {\n                                        match: {\n                                            id: 'fries'\n                                        },\n                                        id: 'dots'\n                                    },\n                                    {\n                                        match: {\n                                            id: 'sandwich'\n                                        },\n                                        id: 'lines'\n                                    }\n                                ]}\n                                borderColor={{\n                                    from: 'color',\n                                    modifiers: [\n                                        [\n                                            'darker',\n                                            1.6\n                                        ]\n                                    ]\n                                }}\n                                axisTop={null}\n                                axisRight={null}\n                                axisBottom={!props.preview ? {\n                                    tickSize: 5,\n                                    tickPadding: 5,\n                                    tickRotation: 0,\n                                    legendPosition: 'middle',\n                                    legendOffset: 32,\n                                } : null}\n                                axisLeft={!props.preview ? {\n                                    tickSize: 5,\n                                    tickPadding: 5,\n                                    tickRotation: 0,\n                                    legendPosition: 'middle',\n                                    legendOffset: -40\n                                } : null}\n                                role=\"application\"\n                            /> </div> : <div style={{ width: '100%', height: '100%', display: 'flex', justifyContent: 'center' }}>\n                            <div style={{ alignSelf: 'center' }}>  <div className=\"loader\"></div></div>\n                        </div>}\n                </div>\n            </div>\n            <div style={{ height: '15%', maxHeight: '60px', display: 'flex', backgroundColor: 'white' }}>\n                <Legend\n                    legend={[...db.status.map((a, i) => {\n                        return {\n                            key: i,\n                            color: a.color,\n                            label: a.label\n                        }\n                    })]} />\n            </div>\n        </div >\n    )\n}\n\nexport default TaskDoneBar\n"],"sourceRoot":""}