diff --git a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap index 1e7bcab26ddfd1f3f6c32c02827d8e24dfb1e12d..e6a14291099cc5cd7e0e7255efc6f0e2513423df 100644 --- a/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap +++ b/src/components/Analysis/ElecHalfHourMonthlyAnalysis/__snapshots__/ElecHalfHourChart.spec.tsx.snap @@ -104,6 +104,42 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = ` y="0" /> </g> + <g + className="barFill" + transform="translate(79.09090909090912, 0)" + > + <defs> + <linearGradient + id="gradient" + x1="0" + x2="0" + y1="0" + y2="1" + > + <stop + id="stop-color-1" + offset="0%" + /> + <stop + id="stop-color-2" + offset="100%" + /> + </linearGradient> + </defs> + <path + className="bar-ELECTRICITY weekend bounce-3 delay--0" + d=" + M0,4 + a4,4 0 0 1 4,-4 + h-5 + a4,4 0 0 1 4,4 + v136 + h-3 + z" + onAnimationEnd={[Function]} + onClick={[Function]} + /> + </g> <g transform="translate(79.09090909090912, 0)" > @@ -179,6 +215,42 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = ` y="0" /> </g> + <g + className="barFill" + transform="translate(79.09090909090912, 0)" + > + <defs> + <linearGradient + id="gradient" + x1="0" + x2="0" + y1="0" + y2="1" + > + <stop + id="stop-color-1" + offset="0%" + /> + <stop + id="stop-color-2" + offset="100%" + /> + </linearGradient> + </defs> + <path + className="bar-ELECTRICITY weekend bounce-3 delay--1" + d=" + M0,4 + a4,4 0 0 1 4,-4 + h-5 + a4,4 0 0 1 4,4 + v136 + h-3 + z" + onAnimationEnd={[Function]} + onClick={[Function]} + /> + </g> <g transform="translate(79.09090909090912, 0)" > @@ -254,6 +326,42 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = ` y="0" /> </g> + <g + className="barFill" + transform="translate(79.09090909090912, 0)" + > + <defs> + <linearGradient + id="gradient" + x1="0" + x2="0" + y1="0" + y2="1" + > + <stop + id="stop-color-1" + offset="0%" + /> + <stop + id="stop-color-2" + offset="100%" + /> + </linearGradient> + </defs> + <path + className="bar-ELECTRICITY weekend bounce-3 delay--2" + d=" + M0,4 + a4,4 0 0 1 4,-4 + h-5 + a4,4 0 0 1 4,4 + v136 + h-3 + z" + onAnimationEnd={[Function]} + onClick={[Function]} + /> + </g> <g transform="translate(79.09090909090912, 0)" > @@ -329,6 +437,42 @@ exports[`ElecHalfHourChart component should be rendered correctly 1`] = ` y="0" /> </g> + <g + className="barFill" + transform="translate(79.09090909090912, 0)" + > + <defs> + <linearGradient + id="gradient" + x1="0" + x2="0" + y1="0" + y2="1" + > + <stop + id="stop-color-1" + offset="0%" + /> + <stop + id="stop-color-2" + offset="100%" + /> + </linearGradient> + </defs> + <path + className="bar-ELECTRICITY weekend bounce-3 delay--3" + d=" + M0,4 + a4,4 0 0 1 4,-4 + h-5 + a4,4 0 0 1 4,4 + v136 + h-3 + z" + onAnimationEnd={[Function]} + onClick={[Function]} + /> + </g> <g transform="translate(79.09090909090912, 0)" > diff --git a/src/components/Charts/Bar.tsx b/src/components/Charts/Bar.tsx index d0ccd177170d02496e14e84a7c5f146569861175..cc5f723bef3a1c85d640681cd5d1bc54ad8f9f3f 100644 --- a/src/components/Charts/Bar.tsx +++ b/src/components/Charts/Bar.tsx @@ -130,13 +130,14 @@ const Bar = ({ return compare ? xScale.bandwidth() / 2 : xScale.bandwidth() } - const lastDataDate = - fluidType !== FluidType.MULTIFLUID && fluidStatus[fluidType].lastDataDate + /** Get date of each fluid to display placeholder bar for multifluid */ + const lastDataDates = fluidStatus.map( + fluid => fluid.lastDataDate ?? DateTime.local(0) + ) + const lastDataDate = DateTime.max(...lastDataDates) const dataMissingUpcoming = Boolean( - lastDataDate && - dataload.date > lastDataDate && - dataload.date < DateTime.local() + dataload.date > lastDataDate && dataload.date < DateTime.local() ) const topRoundedRect = ( @@ -208,7 +209,7 @@ const Bar = ({ /> </g> )} - {/* hashed bars */} + {/* hashed or filled bars */} {height > 0 && dataload.value >= 0 && isMultiMissingFluid ? ( <g transform={`translate(${xScaleValue}, ${yScaleValue})`}