Check version of the network protocol

dcsFiles/TheWay.lua

@@ -140,6 +140,7 @@ function LuaExportAfterNextFrame()
     local selfData = LoGetSelfData()
     local model = selfData and selfData['Name'] or 'Spectator'
     local message = {}
+    message["version"] = 1
     message["model"] = model
     message["coords"] = {}
     message["coords"]["lat"] = tostring(coords.latitude)

src/App.js

@@ -13,14 +13,15 @@ import GetModuleCommands from "./moduleCommands/GetModuleCommands";
 import askUserAboutSeat from "./moduleCommands/askUserAboutSeat";
 import useElectronIpcListeners from "./hooks/useElectronIpcListeners";
 import SettingsDialog from "./components/settings/SettingsDialog";
+import Error from "./components/Error";
 import { uiActions } from "./store/ui";
 
 const { ipcRenderer } = window.require("electron");
 
 const theme = createTheme(theWayTheme);
 
 function App() {
-  const { module } = useSelector((state) => state.dcsPoint);
+  const { module, error } = useSelector((state) => state.dcsPoint);
   const dcsWaypoints = useSelector((state) => state.waypoints.dcsWaypoints);
   const userPreferences = useSelector((state) => state.ui.userPreferences);
   const [settingsModalOpen, setSettingsModalOpen] = useState(false);
@@ -87,6 +88,14 @@ function App() {
     };
   }, [handleTransfer, handleSelectionToggle]);
 
+  function mainContent() {
+    if(error == null) {
+      return <WaypointList />;
+    } else {
+      return <Error error={error} />;
+    }
+  }
+
   return (
     <ThemeProvider theme={theme}>
       <CssBaseline enableColorScheme />
@@ -107,7 +116,7 @@ function App() {
           />
         </Box>
         <Box sx={{ height: "60%", paddingX: 2 }}>
-          <WaypointList />
+          { mainContent() }
         </Box>
         <Box sx={{ height: "15%" }}>
           <TransferControls

src/components/Error.js

@@ -0,0 +1,11 @@
+import { Card } from "@mui/material";
+
+const Error = (props) => {
+  return (
+    <Card sx={{ backgroundColor: "darkred", borderRadius: "10px", padding: 1 }}>
+      { props.error }
+    </Card>
+  );
+};
+
+export default Error;

src/hooks/useElectronIpcListeners.js

@@ -49,7 +49,12 @@ const useElectronIpcListeners = () => {
     ipcRenderer.on(
       "dataReceived",
       throttle((event, msg) => {
-        dispatch(dcsPointActions.changeCoords(JSON.parse(msg)));
+        let parsed = JSON.parse(msg);
+        if(parsed.version !== 1) {
+          dispatch(dcsPointActions.setError("The version of the lua script does not match with the version of this UI."))
+        } else {
+          dispatch(dcsPointActions.changeCoords(parsed));
+        }
       }, 100),
     );
 

src/store/dcsPoint.js

@@ -1,6 +1,6 @@
 import { createSlice } from "@reduxjs/toolkit";
 
-const initialState = { module: null, lat: null, long: null, elev: null };
+const initialState = { module: null, lat: null, long: null, elev: null, error: null };
 
 const dcsPointSlice = createSlice({
   name: "dcsPoint",
@@ -12,6 +12,14 @@ const dcsPointSlice = createSlice({
       state.lat = Number(action.payload.coords.lat);
       state.long = Number(action.payload.coords.long);
       state.elev = Number(action.payload.elev);
+      state.error = null
+    },
+    setError(state, action) {
+      state.module = null;
+      state.lat = null;
+      state.long = null;
+      state.elev = null;
+      state.error = action.payload
     },
   },
 });