feat(model): Re-structure user configuration and add more dashboards …

…based on #69

src/components/app.tsx

@@ -12,7 +12,7 @@ import {
 	useUserConfig
 } from '@wuespace/telestion-client-common';
 
-import { userConfig } from '../model/sample-user-config';
+import { userConfig } from '../model/user-config';
 import { projectWidgets } from '../widgets';
 
 import { Header } from './header';

src/model/dashboards/index.ts

@@ -0,0 +1,4 @@
+export * from './overview';
+export * from './system-state';
+export * from './recovery';
+export * from './sounding-rocket';

src/model/dashboards/overview.ts

@@ -0,0 +1,116 @@
+import { Dashboard } from '@wuespace/telestion-client-types';
+import {
+	accLineGraph,
+	altitudeGraph,
+	amplitudeGraph,
+	gyroLineGraph,
+	magLineGraph,
+	pressureGraph,
+	temperatureGraph
+} from './widget-props';
+
+export const overviewDashboard: Dashboard = {
+	title: 'Overview',
+	columns: 12,
+	rows: 12,
+	widgets: [
+		{
+			widgetName: 'stateWidget',
+			width: 2,
+			height: 4,
+			title: 'stateWidget'
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 2,
+			height: 4,
+			title: 'Altitude',
+			initialProps: {
+				...altitudeGraph,
+				maxDataSamples: 60,
+				isCartesianGrid: true
+			}
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 2,
+			height: 4,
+			title: 'Pressure',
+			initialProps: {
+				...pressureGraph,
+				maxDataSamples: 60,
+				isCartesianGrid: true
+			}
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 2,
+			height: 4,
+			title: 'Temperature',
+			initialProps: {
+				...temperatureGraph,
+				maxDataSamples: 60,
+				isCartesianGrid: true
+			}
+		},
+		{
+			widgetName: 'mapWidget',
+			width: 4,
+			height: 8,
+			title: 'GPS Data'
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 4,
+			height: 4,
+			title: 'Amplitude',
+			initialProps: {
+				...amplitudeGraph,
+				maxDataSamples: 60,
+				isCartesianGrid: true
+			}
+		},
+		{
+			widgetName: 'spectrogramWidget',
+			width: 4,
+			height: 4,
+			title: 'Spectrogram Widget'
+		},
+		{
+			widgetName: '9dof-widget',
+			width: 3,
+			height: 4,
+			title: 'Current values'
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 3,
+			height: 4,
+			title: 'Accelerometer',
+			initialProps: {
+				...accLineGraph,
+				maxDataSamples: 20
+			}
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 3,
+			height: 4,
+			title: 'Gyroscope',
+			initialProps: {
+				...gyroLineGraph,
+				maxDataSamples: 20
+			}
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 3,
+			height: 4,
+			title: 'Magnetometer',
+			initialProps: {
+				...magLineGraph,
+				maxDataSamples: 20
+			}
+		}
+	]
+};

src/model/dashboards/recovery.ts

@@ -0,0 +1,15 @@
+import { Dashboard } from '@wuespace/telestion-client-types';
+
+export const recoveryDashboard: Dashboard = {
+	title: 'Recovery',
+	columns: 12,
+	rows: 12,
+	widgets: [
+		{
+			widgetName: 'mapWidget',
+			width: 12,
+			height: 12,
+			title: 'GPS Position'
+		}
+	]
+};

src/model/dashboards/sounding-rocket.ts

@@ -0,0 +1,44 @@
+import { Dashboard } from '@wuespace/telestion-client-types';
+import { amplitudeGraph, velocityGraph } from './widget-props';
+
+export const soundingRocketDashboard: Dashboard = {
+	title: 'Sounding Rocket',
+	columns: 12,
+	rows: 12,
+	widgets: [
+		{
+			widgetName: 'stateWidget',
+			width: 2,
+			height: 4,
+			title: 'stateWidget'
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 10,
+			height: 4,
+			title: 'Amplitude',
+			initialProps: {
+				...amplitudeGraph,
+				maxDataSamples: 100,
+				isCartesianGrid: true
+			}
+		},
+		{
+			widgetName: 'spectrogramWidget',
+			width: 12,
+			height: 4,
+			title: 'Spectrogram Widget'
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 12,
+			height: 4,
+			title: 'Velocity',
+			initialProps: {
+				...velocityGraph,
+				maxDataSamples: 100,
+				isCartesianGrid: true
+			}
+		}
+	]
+};

src/model/dashboards/system-state.ts

@@ -0,0 +1,62 @@
+import { Dashboard } from '@wuespace/telestion-client-types';
+import { altitudeGraph, pressureGraph, temperatureGraph } from './widget-props';
+
+export const systemStateDashboard: Dashboard = {
+	title: 'System State',
+	columns: 12,
+	rows: 12,
+	widgets: [
+		{
+			widgetName: 'stateWidget',
+			width: 4,
+			height: 3,
+			title: 'stateWidget'
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 4,
+			height: 6,
+			title: 'Pressure',
+			initialProps: {
+				...pressureGraph,
+				maxDataSamples: 60,
+				isCartesianGrid: true
+			}
+		},
+		{
+			widgetName: 'mapWidget',
+			width: 4,
+			height: 12,
+			title: 'GPS Data'
+		},
+		{
+			widgetName: '9dof-widget',
+			width: 4,
+			height: 3,
+			title: 'Current values'
+		},
+
+		{
+			widgetName: 'graphWidget',
+			width: 4,
+			height: 6,
+			title: 'Altitude',
+			initialProps: {
+				...altitudeGraph,
+				maxDataSamples: 60,
+				isCartesianGrid: true
+			}
+		},
+		{
+			widgetName: 'graphWidget',
+			width: 4,
+			height: 6,
+			title: 'Temperature',
+			initialProps: {
+				...temperatureGraph,
+				maxDataSamples: 60,
+				isCartesianGrid: true
+			}
+		}
+	]
+};

src/model/sample-graph-definitions.ts → src/model/dashboards/widget-props/graph-widget-props.ts

@@ -1,5 +1,5 @@
-import { GraphWidgetProps } from '../widgets/graph-widget';
-import { Amplitude, BaroData, NineDOF } from './channels';
+import { GraphWidgetProps } from '../../../widgets/graph-widget';
+import { Amplitude, BaroData, NineDOF, Velocity } from '../../channels';
 
 export const accLineGraph: GraphWidgetProps = {
 	connections: [
@@ -102,8 +102,7 @@ export const altitudeGraph: GraphWidgetProps = {
 			]
 		}
 	],
-	maxDataSamples: 60,
-	isCartesianGrid: true
+	maxDataSamples: 20
 };
 
 export const pressureGraph: GraphWidgetProps = {
@@ -120,8 +119,7 @@ export const pressureGraph: GraphWidgetProps = {
 			]
 		}
 	],
-	maxDataSamples: 60,
-	isCartesianGrid: true
+	maxDataSamples: 20
 };
 
 export const temperatureGraph: GraphWidgetProps = {
@@ -138,8 +136,7 @@ export const temperatureGraph: GraphWidgetProps = {
 			]
 		}
 	],
-	maxDataSamples: 60,
-	isCartesianGrid: true
+	maxDataSamples: 20
 };
 
 export const amplitudeGraph: GraphWidgetProps = {
@@ -169,8 +166,31 @@ export const amplitudeGraph: GraphWidgetProps = {
 			]
 		}
 	],
-	maxDataSamples: 60,
-	isArea: false,
-	isCartesianGrid: true,
+	maxDataSamples: 20,
 	scale: 'log'
 };
+
+export const velocityGraph: GraphWidgetProps = {
+	connections: [
+		{
+			channel: Velocity,
+			descriptors: [
+				{
+					key: 'result[0].estimated',
+					title: 'Estimated',
+					unit: 'm/s',
+					color: 'indigo-500',
+					isDashed: true,
+					strokeWidth: 2
+				},
+				{
+					key: 'result[0].measured',
+					title: 'Measured',
+					unit: 'm/s',
+					color: 'orange-500'
+				}
+			]
+		}
+	],
+	maxDataSamples: 20
+};

src/model/dashboards/widget-props/index.ts

@@ -0,0 +1 @@
+export * from './graph-widget-props';