From f313e97447345b84ed281b548aecacbbe53f6374 Mon Sep 17 00:00:00 2001
From: Tony Bentley <tonybentley@Tonys-MacBook-Pro-3.local>
Date: Tue, 2 Jan 2024 11:49:12 -0800
Subject: [PATCH] docs: Update README with badges

---
 README.md    | 13 +++++++---
 package.json |  2 ++
 src/App.tsx  | 69 +++++++++++++++++++++++++++-------------------------
 3 files changed, 48 insertions(+), 36 deletions(-)

diff --git a/README.md b/README.md
index ab516df..0dda145 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,11 @@
-[![semantic-release: angular](https://img.shields.io/badge/semantic--release-angular-e10079?logo=semantic-release)](https://github.com/semantic-release/semantic-release)
-
 # signalk-multiplex-viewer
-A plugin for tracing multiplexing routes and events
+A plugin for tracing NMEA 0183 and 2000 multiplexed events from Signalk server
+
+- Select from one or more event emitters
+- Choose from a list of associated events
+- Filter and search for targeted NMEA sentences/pgns
+- Find duplicates or missing values and validate that Signalk is providing the correct values for your NMEA connections
+
+NOTE: Depends on signalk-server branch [ws-events](https://github.com/SignalK/signalk-server/tree/ws-events) until merged.
+
+ [![npm version](https://img.shields.io/npm/v/signalk-multiplex-viewer/latest.svg?logo=npm)](https://badge.fury.io/js/signalk-multiplex-viewer) ![github actions](https://github.com/tonybentley/signalk-multiplex-viewer/actions/workflows/actions.yaml/badge.svg?branch=main) [![signalk](https://img.shields.io/badge/signalk--node--server--plugin-blue?logo=nodedotjs)](https://www.npmjs.com/search?q=keywords:signalk-node-server-plugin) [![semantic-release: nodejs](https://img.shields.io/badge/semantic--release-nodejs-e10079?logo=semantic-release)](https://github.com/semantic-release/semantic-release) [![mui](https://img.shields.io/badge/MUI-v.5.15.2-e10079?logo=mui)](https://mui.com/material-ui/) [![React](https://img.shields.io/badge/React-v.18.2.0-e10079?logo=react)](https://mui.com/material-ui/)
\ No newline at end of file
diff --git a/package.json b/package.json
index 9fd5ea0..d119b51 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,7 @@
 {
   "name": "signalk-multiplex-viewer",
+  "author": "Tony Bentley",
+  "description": "View multiplexed data from Signal K data sources",
   "version": "1.0.4",
   "private": false,
   "repository": "https://github.com/tonybentley/signalk-multiplex-viewer",
diff --git a/src/App.tsx b/src/App.tsx
index 6e2bf36..ce4e6a8 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -42,7 +42,6 @@ const CustomToolbar = () => {
 
 function App() {
   
-  const [data] = useState(Array<Event>());
   const [events, setEvents] = useState(Array<EEListItem> ());
   const [emitters, setEmitters] = useState(Array<EListItem> ());
   const [eventItems, setEventItems] = useState(Array<EventItem> ());
@@ -54,6 +53,38 @@ function App() {
     { field: 'data', headerName: 'Data', description:'NMEA 0183 string, or NMEA 2000 JSON', width: 650 },
   ];
 
+  const initData = (eventData: Data) => {
+    let eventList: Array<EEListItem> = []
+    let emittersList: Array<EListItem> = []
+    eventData.events.forEach((event: Event) => {
+      const hasEventListItem = eventList.filter((e: EEListItem) => e.value === event.event);
+      const boundEmitters = Object.keys(event.emitters).filter(key=> key !== 'NO_EMITTER_ID')
+      //add event to eventsList
+      if(hasEventListItem.length === 0 && boundEmitters.length > 0){
+        eventList.push({
+          id: uuid(),
+          value: event.event,
+          emitters: boundEmitters,
+          checked: false,
+          visible: false
+        })
+      }
+      //add emitters to emittersList
+      Object.keys(event.emitters).forEach((emitter: string) => {
+        const hasEmitterListItem = emittersList.filter((e: EListItem) => e.value === emitter);
+        if(hasEmitterListItem.length === 0 && emitter !== 'NO_EMITTER_ID'){
+          emittersList.push({
+            id: uuid(),
+            value: emitter,
+            checked: false
+          })
+        }
+      })
+    });
+    setEmitters([...emittersList]);
+    setEvents([ ...eventList]);
+  }
+
   const updateEventsChecked = (event: React.ChangeEvent<HTMLInputElement>) => {
     const { value, checked } = event.target;
     setEvents((prev: Array<EEListItem>) => {
@@ -132,42 +163,14 @@ function App() {
     }
   }, [events])
   
+  // on page load get data
   useEffect(() => {
     getData()
-      .then((eventData: Data) => {
-        let eventList: Array<EEListItem> = []
-        let emittersList: Array<EListItem> = []
-        eventData.events.forEach((event: Event) => {
-          const hasEventListItem = eventList.filter((e: EEListItem) => e.value === event.event);
-          const boundEmitters = Object.keys(event.emitters).filter(key=> key !== 'NO_EMITTER_ID')
-          //add event to eventsList
-          if(hasEventListItem.length === 0 && boundEmitters.length > 0){
-            eventList.push({
-              id: uuid(),
-              value: event.event,
-              emitters: boundEmitters,
-              checked: false,
-              visible: false
-            })
-          }
-          //add emitters to emittersList
-          Object.keys(event.emitters).forEach((emitter: string) => {
-            const hasEmitterListItem = emittersList.filter((e: EListItem) => e.value === emitter);
-            if(hasEmitterListItem.length === 0 && emitter !== 'NO_EMITTER_ID'){
-              emittersList.push({
-                id: uuid(),
-                value: emitter,
-                checked: false
-              })
-            }
-          })
-        });
-        setEmitters([...emittersList]);
-        setEvents([ ...eventList]);
-      }).catch((err) => {    
+      .then(initData)
+      .catch((err) => {    
         throw err;
       })
-  }, [data]);
+  }, []);
 
 
   useEffect(() => {