useEnergyOverviewTimeframe

This hook is used to transform the data from the useMeasurementsFilters hook into an object that can be used to control the timeframe of the EnergyOverview compound component.

Basic Usage


import {
	useMeasurementFilters,
	useMeasurements,
} from "@krakentech/blueprint-utils/client";
import { useEnergyOverviewTimeframe } from "@krakentech/coral-molecules";
 
const measurementFilters = useMeasurementFilters();
const electricityMeasurements = useMeasurements({
	variables: {
		accountNumber,
		dateLocale,
		propertyId,
		utilityType: FuelType.Electricity,
		measurementFilters,
	},
});
 
const {
	anchorDate,
	setAnchorDate,
	toggleIntervalValue,
	setToggleIntervalValue,
	dateRangeIntervalValue,
	setDateRangeIntervalValue,
	dateRangeDisplay,
	dateRange,
	nextDateRangeIsFuture,
	DATE_RANGE_SET_ANCHOR_DATE_MAPPING,
} = useEnergyOverviewTimeframe({
	measurementFiltersData: measurementFilters,
	dateLocale: electricityMeasurements.dateLocale,
});

Please see the EnergyOverview component for a full example of how to use this object within the compound component.

Full API

Arguments

Name	Description	type	Default value	Required
`measurementFiltersData`	The initial data provided by the consumer from the `useMeasurementsFilters` hook	`EnergyOverviewFilterType`	`undefined`	`true`
`dateLocale`	The `dateLocale` object provided by the `useMeasurements` hook	`object`	`undefined`	`true`

Return

Name	Description	type
`anchorDate`	The `anchorDate` object from `useMeasurementsFilters`, used to provide the starting date point for your current timeframe	`object`
`setAnchorDate`	The `setAnchorDate` function from `useMeasurementsFilters`, used to update the starting date point for your current timeframe	`function`
`toggleIntervalValue`	A string returned from `useMeasurementFilters`, used to control the current interval value	`string`
`setToggleIntervalValue`	A function returned from `useMeasurementFilters`, used to set the current interval value and update the data	`function`
`dateRangeIntervalValue`	A string returned from `useMeasurementFilters`, used to control the custom date range value in the date picker	`string`
`setDateRangeIntervalValue`	A function returned from `useMeasurementFilters`, used to set the custom date range value in the date picker and update the data	`function`
`dateRangeDisplay`	A formatted string used to display the current date range in the UI	`string`
`dateRange`	Used in conjunction with `DATE_RANGE_SET_ANCHOR_DATE_MAPPING` to set the `anchorDate`	`string`
`nextDateRangeIsFuture`	Indicates whether the next date range is in the future	`boolean`
`DATE_RANGE_SET_ANCHOR_DATE_MAPPING`	Used in conjunction with `setAnchorDate` to set the `anchorDate`	`object`