diff --git a/.env b/.env index b8fe071f7..eb9bcae21 100644 --- a/.env +++ b/.env @@ -1,4 +1,4 @@ ESLINT_NO_DEV_ERRORS=true TSC_COMPILE_ON_ERROR=true - +REACT_APP_DATA_SOURCE_IS_ENABLE=$DATA_SOURCE_IS_ENABLE diff --git a/package-lock.json b/package-lock.json index 6cd0b0063..9c0ddcb26 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7119,9 +7119,9 @@ } }, "apexcharts": { - "version": "3.35.2", - "resolved": "https://registry.npmjs.org/apexcharts/-/apexcharts-3.35.2.tgz", - "integrity": "sha512-VOSb25mrcSv/JjaWKjnasL8277cqnA0Gp20uV1+rlgE4U6j44fdTYW850Powl+S8RkXd/lPwzBB2jvKkEOHl0Q==", + "version": "3.36.3", + "resolved": "https://registry.npmjs.org/apexcharts/-/apexcharts-3.36.3.tgz", + "integrity": "sha512-8/FXEs0ohXMff07Gv28XjhPwEJphIUdq2/wii/pcvi54Tw6z1mjrV8ydN8rlWi/ve8BAPBefJkLmRWv7UOBsLw==", "requires": { "svg.draggable.js": "^2.2.2", "svg.easing.js": "^2.0.0", @@ -26491,7 +26491,7 @@ "svg.easing.js": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/svg.easing.js/-/svg.easing.js-2.0.0.tgz", - "integrity": "sha1-iqmUawqOJ4V6XEChDrpAkeVpHxI=", + "integrity": "sha512-//ctPdJMGy22YoYGV+3HEfHbm6/69LJUTAqI2/5qBvaNHZ9uUFVC82B0Pl299HzgH13rKrBgi4+XyXXyVWWthA==", "requires": { "svg.js": ">=2.3.x" } @@ -26499,7 +26499,7 @@ "svg.filter.js": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/svg.filter.js/-/svg.filter.js-2.0.2.tgz", - "integrity": "sha1-kQCOFROJ3ZIwd5/L5uLJo2LRwgM=", + "integrity": "sha512-xkGBwU+dKBzqg5PtilaTb0EYPqPfJ9Q6saVldX+5vCRy31P6TlRCP3U9NxH3HEufkKkpNgdTLBJnmhDHeTqAkw==", "requires": { "svg.js": "^2.2.5" } diff --git a/package.json b/package.json index 59b29791e..d988bdce4 100644 --- a/package.json +++ b/package.json @@ -41,8 +41,8 @@ "react-collapse": "^5.1.0", "qs": "^6.10.1", "virtualizedtableforantd4": "^1.1.2", - "apexcharts": "^3.28.1", - "react-apexcharts": "^1.3.9", + "apexcharts": "^3.36.3", + "react-apexcharts": "^1.4.0", "isnumber": "^1.0.0" }, "devDependencies": { diff --git a/src/Routes/Base/Header/Settings/SetDefaultTime.js b/src/Routes/Base/Header/Settings/SetDefaultTime.js new file mode 100644 index 000000000..d5248c3bf --- /dev/null +++ b/src/Routes/Base/Header/Settings/SetDefaultTime.js @@ -0,0 +1,68 @@ +import { Select as AntSelect, Typography } from 'antd'; +import { FlexBox } from 'components/common'; +import React, { useCallback } from 'react'; +import styled from 'styled-components'; +import { dateTimeDefaultVar, instanceFiltersVar } from 'cache'; +import { useReactiveVar } from '@apollo/client'; +import moment from 'moment'; +import { LOCAL_STORAGE_KEYS } from 'const'; + +const Select = styled(AntSelect)` + width: 190px; +`; + +// 1 hour / 24 hours/ 7 days/ 1 month + +const OptionDefaultTime = [ + { + value: 1, + label: '1 hour', + }, + { + value: 24, + label: '24 hour', + }, + { + value: 168, + label: '7 days', + }, + { + value: 720, + label: '1 month', + }, +]; + +const SetDefaultTime = () => { + const dateTimeDefault = useReactiveVar(dateTimeDefaultVar); + const instanceFilters = useReactiveVar(instanceFiltersVar); + + const onChange = useCallback( + itemSelect => { + window.localStorage.setItem( + LOCAL_STORAGE_KEYS.LOCAL_STORAGE_KEY_TIME, + itemSelect + ); + const newDefTime = moment().add(-itemSelect, 'hours'); + + dateTimeDefaultVar({ hour: parseInt(itemSelect, 10), time: newDefTime }); + + instanceFilters.jobs.datesRange.from = newDefTime; + instanceFilters.jobs.datesRange.to = null; + instanceFiltersVar({ ...instanceFilters }); + }, + [instanceFilters] + ); + + return ( + + Filter Default Time +