Fix section visibility config when using ingress

matt8707 · Jul 6, 2024 · c1f963e · c1f963e
1 parent c8054e3
commit c1f963e
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 10 deletions.
diff --git a/src/lib/Modal/VisibilityConfig/AddConditionButtons.svelte b/src/lib/Modal/VisibilityConfig/AddConditionButtons.svelte
@@ -1,7 +1,8 @@
 <script lang="ts">
-	import { lang, ripple } from '$lib/Stores';
+	import { dashboard, lang, ripple } from '$lib/Stores';
 	import Ripple from 'svelte-ripple';
 	import type { Condition } from '$lib/Types';
+	import { generateId } from '$lib/Utils';
 
 	export let items: Condition[];
 
@@ -21,7 +22,7 @@
 		items = [
 			{
 				condition: option,
-				id: crypto.randomUUID(),
+				id: generateId($dashboard),
 				...(option === 'and' || option === 'or' ? { conditions: [] } : {})
 			},
 			...items

diff --git a/src/lib/Modal/VisibilityConfig/Index.svelte b/src/lib/Modal/VisibilityConfig/Index.svelte
@@ -15,6 +15,7 @@
 	import ItemHeader from '$lib/Modal/VisibilityConfig/ItemHeader.svelte';
 	import { closeModal } from 'svelte-modals';
 	import Ripple from 'svelte-ripple';
+	import { generateId } from '$lib/Utils';
 
 	export let isOpen: boolean;
 	export let sel: any;
@@ -29,12 +30,12 @@
 	 */
 	let items =
 		sel?.visibility?.map((item: Condition) => ({
-			id: crypto.randomUUID(),
+			id: generateId($dashboard),
 			...item,
 			...(item.condition === 'and' || item.condition === 'or'
 				? {
 						conditions: item.conditions?.map((condition: Condition) => ({
-							id: crypto.randomUUID(),
+							id: generateId($dashboard),
 							...condition
 						}))
 					}

diff --git a/src/lib/Modal/VisibilityConfig/NumericCondition.svelte b/src/lib/Modal/VisibilityConfig/NumericCondition.svelte
@@ -11,7 +11,7 @@
 	/**
 	 * Updates `entity` value
 	 */
-	function handleEntity(id: string | undefined, entity_id: string) {
+	function handleEntity(id: number | undefined, entity_id: string) {
 		items = items.map((condition: Condition) => {
 			if (id === condition.id) {
 				return { ...condition, entity: entity_id };
@@ -23,7 +23,7 @@
 	/**
 	 * Updates `above` or `below` value
 	 */
-	function handleRange(id: string | undefined, target: EventTarget | null, key: 'above' | 'below') {
+	function handleRange(id: number | undefined, target: EventTarget | null, key: 'above' | 'below') {
 		const input = target as HTMLInputElement;
 		const value = input.value;
 

diff --git a/src/lib/Modal/VisibilityConfig/StateCondition.svelte b/src/lib/Modal/VisibilityConfig/StateCondition.svelte
@@ -16,7 +16,7 @@
 	/**
 	 * Updates `entity` value
 	 */
-	function handleEntity(id: string | undefined, entity_id: string) {
+	function handleEntity(id: number | undefined, entity_id: string) {
 		items = items.map((condition: Condition) => {
 			if (id === condition.id) {
 				return { ...condition, entity: entity_id };
@@ -28,7 +28,7 @@
 	/**
 	 * Updates `state` or `state_not` keys
 	 */
-	function handleEquals(id: string | undefined, key: string) {
+	function handleEquals(id: number | undefined, key: string) {
 		items = items.map((condition: Condition) => {
 			if (id === condition.id) {
 				const _condition = { ...condition };
@@ -51,7 +51,7 @@
 	/**
 	 * Updates `state` value
 	 */
-	function handleState(id: string | undefined, target: EventTarget | null) {
+	function handleState(id: number | undefined, target: EventTarget | null) {
 		const input = target as HTMLInputElement;
 
 		items = items.map((condition: Condition) => {

diff --git a/src/lib/Types.ts b/src/lib/Types.ts
@@ -49,7 +49,7 @@ export interface Section {
 export interface Condition {
 	condition?: 'state' | 'numeric_state' | 'screen' | 'or' | 'and';
 	conditions?: Condition[];
-	id?: string;
+	id?: number;
 	entity?: string;
 	state?: string;
 	state_not?: string;