API: publish forecast as arrays with unix timestamps (BC)

assets/js/components/Battery/BatteryExperimental.vue

@@ -117,8 +117,8 @@ export default defineComponent({
 			return this.gridChargePossible || this.gridChargeLimit !== null;
 		},
 		gridChargeTariff() {
-			const { forecast, smartCostType } = this.state;
-			return smartCostType === SMART_COST_TYPE.CO2 ? forecast?.co2 : forecast?.grid;
+			const { co2, grid } = store.uiForecast.value;
+			return this.state.smartCostType === SMART_COST_TYPE.CO2 ? co2 : grid;
 		},
 		smartCostLimitProps() {
 			return {

assets/js/components/BottomTabs/Bar.vue

@@ -53,7 +53,6 @@ import MoreItem from "./MoreItem.vue";
 import { defineComponent, type PropType } from "vue";
 import type {
 	FatalError,
-	Forecast,
 	Sponsor,
 	EvOpt,
 	AuthProviders,
@@ -74,7 +73,6 @@ export default defineComponent({
 		battery: { type: Object as PropType<Battery> },
 		batteryGridChargeActive: Boolean,
 		batteryMode: { type: String as PropType<string> },
-		forecast: { type: Object as PropType<Forecast> },
 		vehicles: { type: Object as PropType<Record<string, Vehicle>>, default: () => ({}) },
 		authProviders: { type: Object as PropType<AuthProviders>, default: () => ({}) },
 		sponsor: { type: Object as PropType<Sponsor>, default: () => ({}) },

assets/js/components/ChargingPlans/ChargingPlan.vue

@@ -38,7 +38,7 @@ import formatter from "@/mixins/formatter";
 import minuteTicker from "@/mixins/minuteTicker";
 import { optionStep, fmtEnergy } from "@/utils/energyOptions.ts";
 import { defineComponent, type PropType } from "vue";
-import type { CURRENCY, Forecast, PlanStrategy, Vehicle } from "@/types/evcc";
+import type { CURRENCY, UiForecast, PlanStrategy, Vehicle } from "@/types/evcc";
 
 export default defineComponent({
 	name: "ChargingPlan",
@@ -71,7 +71,7 @@ export default defineComponent({
 		vehicleSoc: Number,
 		vehicleLimitSoc: Number,
 		vehicleNotReachable: Boolean,
-		forecast: Object as PropType<Forecast>,
+		forecast: Object as PropType<UiForecast>,
 	},
 	emits: ["open-modal"],
 	data() {

assets/js/components/ChargingPlans/ChargingPlanModal.vue

@@ -48,7 +48,7 @@ import PlansSettings from "./PlansSettings.vue";
 import api from "@/api";
 import type {
 	CURRENCY,
-	Forecast,
+	UiForecast,
 	PlanStrategy,
 	RepeatingPlan,
 	SMART_COST_TYPE,
@@ -70,7 +70,7 @@ export default defineComponent({
 		vehicles: { type: Array as PropType<Vehicle[]>, default: () => [] },
 		smartCostType: String as PropType<SMART_COST_TYPE>,
 		currency: String as PropType<CURRENCY>,
-		forecast: Object as PropType<Forecast>,
+		forecast: Object as PropType<UiForecast>,
 	},
 	data() {
 		return {

assets/js/components/ChargingPlans/PlansSettings.vue

@@ -83,7 +83,7 @@ import { debounceLeading } from "@/utils/debounceLeading";
 import { defineComponent, type PropType } from "vue";
 import type {
 	CURRENCY,
-	Forecast,
+	UiForecast,
 	PlanResponse,
 	PlanStrategy,
 	PlanWrapper,
@@ -124,7 +124,7 @@ export default defineComponent({
 		vehicle: Object as PropType<Vehicle>,
 		vehicleLimitSoc: Number,
 		planOverrun: Number,
-		forecast: Object as PropType<Forecast>,
+		forecast: Object as PropType<UiForecast>,
 	},
 	emits: [
 		"static-plan-removed",

assets/js/components/Energyflow/Energyflow.vue

@@ -328,7 +328,7 @@ import {
 	type Battery,
 	type Meter,
 	type CURRENCY,
-	type Forecast,
+	type UiForecast,
 	type UiLoadpoint,
 } from "@/types/evcc";
 
@@ -371,7 +371,7 @@ export default defineComponent({
 		prioritySoc: { type: Number },
 		bufferSoc: { type: Number },
 		bufferStartSoc: { type: Number },
-		forecast: { type: Object as PropType<Forecast>, default: () => ({}) },
+		forecast: { type: Object as PropType<UiForecast>, default: () => ({}) },
 	},
 	data: () => {
 		return {

assets/js/components/Forecast/Chart.vue

@@ -42,7 +42,7 @@ import "chartjs-adapter-dayjs-4/dist/chartjs-adapter-dayjs-4.esm";
 import { registerChartComponents, commonOptions } from "../Sessions/chartConfig";
 import formatter, { POWER_UNIT } from "@/mixins/formatter";
 import colors, { lighterColor } from "@/colors";
-import type { CURRENCY, ForecastSlot, SolarDetails, TimeseriesEntry } from "@/types/evcc";
+import type { CURRENCY, UiForecastSlot, UiSolarDetails, UiTimeseriesEntry } from "@/types/evcc";
 import { ForecastType, highestSlotIndexByDay } from "@/utils/forecast";
 
 registerChartComponents([
@@ -64,9 +64,9 @@ export default defineComponent({
 	components: { Bar },
 	mixins: [formatter],
 	props: {
-		grid: { type: Array as PropType<ForecastSlot[]> },
-		solar: { type: Object as PropType<SolarDetails> },
-		co2: { type: Array as PropType<ForecastSlot[]> },
+		grid: { type: Array as PropType<UiForecastSlot[]> },
+		solar: { type: Object as PropType<UiSolarDetails> },
+		co2: { type: Array as PropType<UiForecastSlot[]> },
 		currency: { type: String as PropType<CURRENCY> },
 		selected: { type: String as PropType<ForecastType> },
 	},
@@ -452,7 +452,7 @@ export default defineComponent({
 			now.setMilliseconds(0);
 			this.startDate = now;
 		},
-		filterSlots(slots: ForecastSlot[] = []) {
+		filterSlots(slots: UiForecastSlot[] = []) {
 			if (!slots) {
 				return undefined;
 			}
@@ -462,7 +462,7 @@ export default defineComponent({
 					new Date(slot.end) >= this.startDate && new Date(slot.start) <= this.endDate
 			);
 		},
-		filterEntries(entries: TimeseriesEntry[] = []) {
+		filterEntries(entries: UiTimeseriesEntry[] = []) {
 			return entries.filter(
 				(entry) =>
 					new Date(entry.ts) >= this.startDate && new Date(entry.ts) <= this.endDate
@@ -491,37 +491,37 @@ export default defineComponent({
 				}, 100);
 			}
 		},
-		yMax(slots: ForecastSlot[] = []): number | undefined {
+		yMax(slots: UiForecastSlot[] = []): number | undefined {
 			const max = this.maxValue(slots);
 			if (!max) return undefined;
 			const fixedValues = slots.every((slot) => slot.value === max);
 			// add space to the top of the scale; shrink fixed-value datasets, they are not interesting and should not dominate the chart
 			const topSpace = fixedValues ? 3 : 1.15;
 			return max * topSpace;
 		},
-		yMaxEntry(entries: TimeseriesEntry[] = [], scale: number = 1): number | undefined {
+		yMaxEntry(entries: UiTimeseriesEntry[] = [], scale: number = 1): number | undefined {
 			const maxValue = this.maxEntryValue(entries);
 			if (!maxValue) return undefined;
 			// use scale and unscaled to determine max scale
 			return Math.max(maxValue * scale, maxValue) * 1.15;
 		},
-		maxIndex(slots: ForecastSlot[] = []) {
+		maxIndex(slots: UiForecastSlot[] = []) {
 			return slots.reduce((max, slot, index) => {
 				return slot.value > (slots[max]?.value || 0) ? index : max;
 			}, 0);
 		},
-		minIndex(slots: ForecastSlot[] = []) {
+		minIndex(slots: UiForecastSlot[] = []) {
 			return slots.reduce((min, slot, index) => {
 				return slot.value < (slots[min]?.value || 0) ? index : min;
 			}, 0);
 		},
-		maxValue(slots: ForecastSlot[] = []) {
+		maxValue(slots: UiForecastSlot[] = []) {
 			return slots[this.maxIndex(slots)]?.value || null;
 		},
-		maxEntryValue(entries: TimeseriesEntry[] = []) {
+		maxEntryValue(entries: UiTimeseriesEntry[] = []) {
 			return entries[this.maxEntryIndex(entries)]?.val || null;
 		},
-		maxEntryIndex(entries: TimeseriesEntry[] = []) {
+		maxEntryIndex(entries: UiTimeseriesEntry[] = []) {
 			return entries.reduce((max, entry, index) => {
 				return entry.val > (entries[max]?.val || 0) ? index : max;
 			}, 0);

assets/js/components/Forecast/GridDetails.vue

@@ -50,7 +50,7 @@
 <script lang="ts">
 import { defineComponent, type PropType } from "vue";
 import formatter from "@/mixins/formatter";
-import type { CURRENCY, ForecastSlot } from "@/types/evcc";
+import type { CURRENCY, UiForecastSlot } from "@/types/evcc";
 import { isStaticTariff } from "@/utils/forecast";
 
 const MAX_HOURS = 96;
@@ -60,8 +60,8 @@ export default defineComponent({
 	name: "GridDetails",
 	mixins: [formatter],
 	props: {
-		grid: { type: Array as PropType<ForecastSlot[]> },
-		feedin: { type: Array as PropType<ForecastSlot[]> },
+		grid: { type: Array as PropType<UiForecastSlot[]> },
+		feedin: { type: Array as PropType<UiForecastSlot[]> },
 		currency: { type: String as PropType<CURRENCY> },
 		showFeedin: { type: Boolean, default: true },
 	},
@@ -81,7 +81,7 @@ export default defineComponent({
 		toggleFeedin() {
 			this.$emit("toggle-feedin");
 		},
-		summarize(slots?: ForecastSlot[]): { avg: string; range: string } | null {
+		summarize(slots?: UiForecastSlot[]): { avg: string; range: string } | null {
 			const upcoming = this.upcomingSlots(slots);
 			if (upcoming.length === 0) return null;
 			const values = upcoming.map((s) => s.value);
@@ -94,7 +94,7 @@ export default defineComponent({
 			const fmtMax = this.fmtPricePerKWh(max, this.currency, false, true);
 			return { avg: `⌀ ${fmtAvg}`, range: `${fmtMin} – ${fmtMax}` };
 		},
-		upcomingSlots(slots?: ForecastSlot[]): ForecastSlot[] {
+		upcomingSlots(slots?: UiForecastSlot[]): UiForecastSlot[] {
 			if (!Array.isArray(slots)) return [];
 			const now = new Date();
 			return slots

assets/js/components/Forecast/PriceChart.vue

@@ -23,32 +23,32 @@ import {
 import colors, { lighterColor } from "@/colors";
 import formatter from "@/mixins/formatter";
 import chartMixin from "./chartMixin";
-import type { CURRENCY, ForecastSlot } from "@/types/evcc";
+import type { CURRENCY, UiForecastSlot } from "@/types/evcc";
 
 export default defineComponent({
 	name: "PriceChart",
 	mixins: [formatter, chartMixin],
 	props: {
-		grid: { type: Array as PropType<ForecastSlot[]>, required: true },
-		feedin: { type: Array as PropType<ForecastSlot[]> },
+		grid: { type: Array as PropType<UiForecastSlot[]>, required: true },
+		feedin: { type: Array as PropType<UiForecastSlot[]> },
 		currency: { type: String as PropType<CURRENCY> },
 		zoom: { type: Boolean, default: false },
 	},
 	computed: {
-		slots(): ForecastSlot[] {
+		slots(): UiForecastSlot[] {
 			return filterForecastSlots(this.grid, this.startDate, this.endDate);
 		},
-		feedinSlots(): ForecastSlot[] {
+		feedinSlots(): UiForecastSlot[] {
 			return this.feedin
 				? filterForecastSlots(this.feedin, this.startDate, this.endDate)
 				: [];
 		},
-		markPoints(): { coord: [string, number]; value: string }[] {
+		markPoints(): { coord: [number, number]; value: string }[] {
 			const slots = this.slots;
 			if (!slots.length) return [];
 			const minIdx = minSlotIndex(slots);
 			const maxIdx = maxSlotIndex(slots);
-			const points: { coord: [string, number]; value: string }[] = [];
+			const points: { coord: [number, number]; value: string }[] = [];
 			if (slots[minIdx]) {
 				points.push({
 					coord: [clampStart(slots[minIdx]!.start, this.startDate), slots[minIdx]!.value],
@@ -144,9 +144,9 @@ export default defineComponent({
 	},
 	methods: {
 		priceSeries(
-			slots: ForecastSlot[],
+			slots: UiForecastSlot[],
 			color: string,
-			points?: { coord: [string, number]; value: string }[]
+			points?: { coord: [number, number]; value: string }[]
 		): Record<string, unknown> {
 			const avg = slots.length ? slots.reduce((a, s) => a + s.value, 0) / slots.length : 0;
 			const gradientDown = avg >= 0;

assets/js/components/Forecast/SolarChart.vue

@@ -19,17 +19,17 @@ import colors, { lighterColor } from "@/colors";
 import formatter, { POWER_UNIT } from "@/mixins/formatter";
 import chartMixin from "./chartMixin";
 import { highestSlotIndexByDay } from "@/utils/forecast";
-import type { SolarDetails, TimeseriesEntry } from "@/types/evcc";
+import type { UiSolarDetails, UiTimeseriesEntry } from "@/types/evcc";
 
 export default defineComponent({
 	name: "SolarChart",
 	mixins: [formatter, chartMixin],
 	props: {
-		solar: { type: Object as PropType<SolarDetails> },
-		rawSolar: { type: Object as PropType<SolarDetails> },
+		solar: { type: Object as PropType<UiSolarDetails> },
+		rawSolar: { type: Object as PropType<UiSolarDetails> },
 	},
 	computed: {
-		entries(): TimeseriesEntry[] {
+		entries(): UiTimeseriesEntry[] {
 			return (this.solar?.timeseries || []).filter(
 				(e) => new Date(e.ts) >= this.startDate && new Date(e.ts) <= this.endDate
 			);
@@ -43,8 +43,8 @@ export default defineComponent({
 			}
 			return max;
 		},
-		markPoints(): { coord: [string, number]; value: string }[] {
-			const points: { coord: [string, number]; value: string }[] = [];
+		markPoints(): { coord: [number, number]; value: string }[] {
+			const points: { coord: [number, number]; value: string }[] = [];
 			const days = [
 				{ energy: this.solar?.today?.energy, day: 0 },
 				{ energy: this.solar?.tomorrow?.energy, day: 1 },

assets/js/components/Forecast/SolarDetails.vue

@@ -19,13 +19,13 @@
 <script lang="ts">
 import { defineComponent, type PropType } from "vue";
 import formatter, { POWER_UNIT } from "@/mixins/formatter";
-import type { SolarDetails } from "@/types/evcc";
+import type { UiSolarDetails } from "@/types/evcc";
 
 export default defineComponent({
 	name: "SolarDetails",
 	mixins: [formatter],
 	props: {
-		solar: { type: Object as PropType<SolarDetails> },
+		solar: { type: Object as PropType<UiSolarDetails> },
 	},
 	computed: {
 		days(): {

assets/js/components/Forecast/ValueChart.vue

@@ -22,7 +22,7 @@ import {
 import colors from "@/colors";
 import formatter from "@/mixins/formatter";
 import chartMixin from "./chartMixin";
-import type { ForecastSlot } from "@/types/evcc";
+import type { UiForecastSlot } from "@/types/evcc";
 
 export type ValueChartType = "co2" | "temperature";
 
@@ -31,13 +31,13 @@ export default defineComponent({
 	mixins: [formatter, chartMixin],
 	props: {
 		type: { type: String as PropType<ValueChartType>, required: true },
-		rates: { type: Array as PropType<ForecastSlot[]>, required: true },
+		rates: { type: Array as PropType<UiForecastSlot[]>, required: true },
 	},
 	computed: {
 		color(): string {
 			return (this.type === "co2" ? colors.co2 : colors.temperature) || "";
 		},
-		slots(): ForecastSlot[] {
+		slots(): UiForecastSlot[] {
 			return filterForecastSlots(this.rates, this.startDate, this.endDate);
 		},
 		yMin(): number {
@@ -46,7 +46,7 @@ export default defineComponent({
 			return Math.min(0, Math.floor(Math.min(...this.slots.map((s) => s.value))));
 		},
 		markPoints(): {
-			coord: [string, number];
+			coord: [number, number];
 			value: string;
 			label?: Record<string, unknown>;
 		}[] {
@@ -55,7 +55,7 @@ export default defineComponent({
 			const minIdx = minSlotIndex(slots);
 			const maxIdx = maxSlotIndex(slots);
 			const points: {
-				coord: [string, number];
+				coord: [number, number];
 				value: string;
 				label?: Record<string, unknown>;
 			}[] = [];

assets/js/components/Forecast/ValueDetails.vue

@@ -20,7 +20,7 @@
 <script lang="ts">
 import { defineComponent, type PropType } from "vue";
 import formatter from "@/mixins/formatter";
-import type { ForecastSlot } from "@/types/evcc";
+import type { UiForecastSlot } from "@/types/evcc";
 import type { ValueChartType } from "./ValueChart.vue";
 
 const MAX_HOURS = 96;
@@ -31,10 +31,10 @@ export default defineComponent({
 	mixins: [formatter],
 	props: {
 		type: { type: String as PropType<ValueChartType>, required: true },
-		rates: { type: Array as PropType<ForecastSlot[]> },
+		rates: { type: Array as PropType<UiForecastSlot[]> },
 	},
 	computed: {
-		upcomingSlots(): ForecastSlot[] {
+		upcomingSlots(): UiForecastSlot[] {
 			if (!Array.isArray(this.rates)) return [];
 			const now = new Date();
 			return this.rates