Merge pull request #8 from CropWatchDevelopment/develop

Develop

src/lib/components/StatsQuickViewModal/StatsQuickView.svelte

@@ -10,13 +10,9 @@
 	let open: boolean = false;
 </script>
 
-{#if sensor.type == 5}
-	<Icon data={mdiMeterGas} size="3em" class="text-blue-700" on:click={() => (open = true)} />
-{:else if sensor.type == 4 || sensor.type == 3}
-	<Icon data={mdiThermometer} size="3em" class="text-orange-900" on:click={() => (open = true)} />
-{:else}
-	<Icon data={mdiMapMarker} size="3em" class="text-slate-900" on:click={() => (open = true)} />
-{/if}
+<Icon data={mdiThermometer} size="3em" class="text-orange-900" on:click={() => {
+	open = true;
+}} />
 
 <Dialog bind:open>
 	<div slot="title">{DeviceIntToEnglish(sensor.type)}</div>
@@ -83,10 +79,27 @@
 				notation="PPM"
 			/>
 		</div>
+	{:else if sensor.type == 2}
+		<div class="grid grid-cols-1 md:grid-cols-2 gap-2 m-2">
+			<CwStatCard
+				title="Air Temperature"
+				counterStartTime={sensor.cw_air_thvd[0].created_at}
+				value={sensor.cw_air_thvd[0].temperatureC}
+				icon={mdiThermometer}
+				optimal={23.88}
+			/>
+			<CwStatCard
+				title="Air Humidity"
+				counterStartTime={sensor.cw_air_thvd[0].created_at}
+				value={sensor.cw_air_thvd[0].humidity}
+				icon={mdiThermometer}
+				optimal={23.88}
+			/>
+		</div>
 	{:else}
-		<pre>
-			{JSON.stringify(sensor,null, 2)}
-		</pre>
+		<!-- <pre>
+			{JSON.stringify(sensor, null, 2)}
+		</pre> -->
 	{/if}
 
 	<div slot="actions">

src/lib/components/leaflet/Marker.svelte

@@ -1,8 +1,7 @@
 <script lang="ts">
 	import L from 'leaflet';
 	import 'leaflet/dist/leaflet.css';
-	import { createEventDispatcher, getContext, onDestroy, onMount, setContext } from 'svelte';
-	import { Dialog } from 'svelte-ux';
+	import { getContext, onDestroy, onMount, setContext } from 'svelte';
 
 	export let width: number;
 	export let height: number;
@@ -12,7 +11,6 @@
 	let marker: L.Marker | undefined;
 	let markerElement: HTMLDivElement;
 
-	const dispatch = createEventDispatcher();
 
 	const { getMap }: { getMap: () => L.Map | undefined } = getContext('map');
 	const map = getMap();
@@ -29,9 +27,6 @@
 				iconSize: L.point(width, height)
 			});
 			marker = L.marker(latLng, { icon }).addTo(map);
-			// marker.on('click', (e) => {
-			// 	popupOpen = !popupOpen;
-			// });
 		}
 	});
 
@@ -45,7 +40,7 @@
 	});
 </script>
 
-<div bind:this={markerElement} style="z-index: 1000000;">
+<div bind:this={markerElement}>
 	{#if marker}
 		<slot />
 	{/if}

src/lib/components/leaflet/TempMarker.svelte

@@ -43,7 +43,7 @@
 	});
 </script>
 
-<div bind:this={markerElement} style="z-index: 1000000;">
+<div bind:this={markerElement}>
 	<Chart>
 		<Svg>
 			<Group center>

src/routes/api/rules/+server.ts

@@ -101,16 +101,21 @@ function insertCriteria(criteriaArray, supabase) {
 }
 
 async function saveRule(rule, supabase, session: Session) {
-    const { data, error } = await supabase.from('cw_rules').insert({
+    const aboutToInsert = {
         profile_id: session.user.id,
         dev_eui: rule.dev_eui,
         name: rule.ruleName,
-        action: rule.action,
+        babylon_notifier_type: 1,
         action_recipient: rule.action_recipient.join(),
         is_triggered: false,
         last_triggered: null,
         ruleGroupId: rule.groupId,
-    });
+    };
+
+    console.log('about to insert:', aboutToInsert);
+
+
+    const { data, error } = await supabase.from('cw_rules').insert();
     if (error) {
         console.log('Failed to insert rule criteria', error);
         return false;

src/routes/app/locations/[location_id]/+page.server.ts

@@ -38,6 +38,8 @@ async function load_AllSensors(supabase: SupabaseClient, location_id: number) {
         .select('*, cw_devices(*, cw_ss_tmepnpk(*), cw_air_thvd(*), seeed_co2_lorawan_uplinks(*))')
         .eq('location_id', location_id)
         .order('created_at', { referencedTable: 'cw_devices.seeed_co2_lorawan_uplinks', ascending: false })
+        .order('created_at', { referencedTable: 'cw_devices.cw_air_thvd', ascending: false })
+        .order('created_at', { referencedTable: 'cw_devices.cw_ss_tmepnpk', ascending: false })
         .limit(1, { referencedTable: 'cw_devices.cw_ss_tmepnpk' })
         .limit(1, { referencedTable: 'cw_devices.seeed_co2_lorawan_uplinks' })
         .limit(1, { referencedTable: 'cw_devices.cw_air_thvd' })

src/routes/app/locations/[location_id]/+page.svelte

@@ -163,12 +163,6 @@
 										height={40}
 									>
 										<StatsQuickView sensor={sensor.cw_devices} />
-										{#if sensor.cw_devices.type == 2}
-											<TempMarker
-												latLng={[sensor.cw_devices.lat, sensor.cw_devices.long]}
-												temp={sensor.cw_devices.cw_air_thvd.temperatureC}
-											/>
-										{/if}
 									</Marker>
 								{/if}
 							{/each}

src/routes/app/locations/[location_id]/device-type/CW-air-thvd/[sensor_eui]/+page.server.ts

@@ -9,7 +9,7 @@ export async function load({ params }) {
         sensor: await supabase.from('cw_air_thvd')
         .select('*')
         .eq('dev_eui', params.sensor_eui)
-        // .gte('created_at', moment().subtract(1, 'days').toISOString())
+        .gte('created_at', moment().subtract(1, 'days').toISOString())
         .order('created_at', { ascending: false })
     };
 }

src/routes/app/locations/[location_id]/device-type/CW-air-thvd/[sensor_eui]/+page.svelte

@@ -3,18 +3,18 @@
 	import { Button, Duration, Tabs } from 'svelte-ux';
 	import Details from './details/Details.svelte';
 	import History from './history/History.svelte';
-	import Rules from './rules/Rules.svelte';
 	import Notifications from './notifications/Notifications.svelte';
 	import Settings from './settings/Settings.svelte';
 	import Permissions from './permissions/Permissions.svelte';
+	import Rules from '../../shared/rules/Rules.svelte';
 	import { subSeconds } from 'date-fns';
 	import { mdiChevronLeft } from '@mdi/js';
 	import { goto } from '$app/navigation';
 	import { page } from '$app/stores';
 	import { supabase } from '$lib/supabaseClient';
 	import { onDestroy, onMount } from 'svelte';
 	import { browser } from '$app/environment';
-	import type { RealtimeChannel, SupabaseClient } from '@supabase/supabase-js';
+	import type { RealtimeChannel } from '@supabase/supabase-js';
 
 	export let data;
 	console.log('Data from the THVPD root page', data);
@@ -36,7 +36,12 @@
 				.channel('custom-insert-channel')
 				.on(
 					'postgres_changes',
-					{ event: 'INSERT', schema: 'public', table: 'cw_air_thvd', filter: `dev_eui=eq.${$page.params.sensor_eui}`},
+					{
+						event: 'INSERT',
+						schema: 'public',
+						table: 'cw_air_thvd',
+						filter: `dev_eui=eq.${$page.params.sensor_eui}`
+					},
 					(payload) => {
 						console.log('Change received!', payload);
 						data.sensor.data.unshift(payload.new);
@@ -49,8 +54,7 @@
 	});
 
 	onDestroy(() => {
-		if(channels)
-		channels.unsubscribe();
+		if (channels) channels.unsubscribe();
 	});
 </script>
 
@@ -110,7 +114,11 @@
 				<History {sensor} />
 			{/await}
 		{:else if value === 3}
-			<Rules />
+			{#await data}
+				loading...
+			{:then sensor}
+				<Rules sensor={sensor.sensor} />
+			{/await}
 		{:else if value === 4}
 			<Notifications />
 		{:else if value === 5}

src/routes/app/locations/[location_id]/device-type/shared/rules/Rules.svelte

@@ -51,7 +51,7 @@
 		groupId: ruleGroupId,
 		dev_eui: $page.params.sensor_eui,
 		ruleName: '',
-		action: 1,
+		babylon_notifier_type: 1,
 		action_recipient: []
 	};
 	let emailDialogOpen: boolean = false;
@@ -63,6 +63,7 @@
 	const onAdd = () => {
 		ruleGroup.root.push({
 			rule_id: uuidv4(),
+			dev_eui: $page.params.sensor_eui,
 			ruleGroupId: ruleGroupId,
 			parent_id: null,
 			subject: '',
@@ -79,7 +80,7 @@
 	};
 
 	const SaveRule = async () => {
-		console.log('about to post:', ruleGroup);
+		console.log('about to post:', JSON.stringify(ruleGroup));
 		let result = await fetch('/api/rules', {
 			method: 'POST',
 			headers: {
@@ -128,7 +129,7 @@
 			<div class="flex flex-row gap-1">
 				<TextField bind:value={ruleGroup.ruleName} label="Rule Name" />
 				<SelectField
-					bind:value={ruleGroup.action}
+					bind:value={ruleGroup.babylon_notifier_type}
 					options={[
 						{ value: 1, label: 'E-Mail', icon: mdiEmail },
 						{ value: 2, label: 'WellWatch Alert', icon: mdiWatchVibrate },
@@ -153,15 +154,15 @@
 					</div>
 				</SelectField>
 
-				{#if ruleGroup.action === 5}
+				{#if ruleGroup.babylon_notifier_type === 5}
 					<TextField bind:value={ruleGroup.action_recipient} />
-				{:else if ruleGroup.action === 4}
+				{:else if ruleGroup.babylon_notifier_type === 4}
 					<TextField bind:value={ruleGroup.action_recipient} />
-				{:else if ruleGroup.action === 3}
+				{:else if ruleGroup.babylon_notifier_type === 3}
 					<TextField mask="+1 (___) ___-____" replace="_" bind:value={ruleGroup.action_recipient} />
-				{:else if ruleGroup.action === 2}
-					<TextField bind:value={ruleGroup.action_recipient} />
-				{:else if ruleGroup.action === 1}
+				{:else if ruleGroup.babylon_notifier_type === 2}
+					<TextField bind:value={ruleGroup.babylon_notifier_type} />
+				{:else if ruleGroup.babylon_notifier_type === 1}
 					<ToggleButton let:on={open} let:toggleOff transition={false}>
 						{ruleGroup.action_recipient.length} selected
 						<MultiSelectMenu