Upgrade Basenine version to v0.7.1 (#984)

* Basenine MongoDB mess

* Fix more

* Fix the `mongodb` container arguments

* Add Basenine ARM64 binary

* Make the changes related to `leftOff` becoming a string value

* Make `leftOffTop` state string

* Handle `CloseConnection` in `Fetch`

* Upgrade Basenine to `0.7.0`

* Revert the changes in `package.json` and `package-lock.json`

* Fix the `Dockerfile`

* Remove the binaries

* Increase the Basenine up deadline to 20 seconds

* Revert the changes in `shared/kubernetes/provider.go`

* Fix the OAS generator tests

* Protect from race condition

* Fix mutexes

* Fix unlock

* Fix logging data types

* Try to stabilize the tests

* Remove the `replace` statement

* revert the change the done in 2899414f2b to not change the leftOff

* Change `leftOffBottom` empty string default value to `latest`

* Upgrade Basenine to `0.7.1`

* Handle the Basenine client library errors better

* Use `DEFAULT_QUERY` constant

* Remove `min=-1`

* Replace some `Errorf`s with `Panicf`s

* Remove the closure in `runGenerator` method

* Remove an unnecessary check

Co-authored-by: M. Mert Yildiran <mehmet@up9.com>
Co-authored-by: Andrey Pokhilko <apc4@ya.ru>
Co-authored-by: undera <undera@undera-old-desktop.home>
Co-authored-by: AmitUp9 <96980485+AmitUp9@users.noreply.github.com>

ui-common/src/components/TrafficViewer/EntriesList.tsx

@@ -55,7 +55,7 @@ export const EntriesList: React.FC<EntriesListProps> = ({
   const [startTime, setStartTime] = useState(0);
   const [truncatedTimestamp, setTruncatedTimestamp] = useState(0);
 
-  const leftOffBottom = entries.length > 0 ? entries[entries.length - 1].id + 1 : -1;
+  const leftOffBottom = entries.length > 0 ? entries[entries.length - 1].id : "latest";
 
   useEffect(() => {
     const list = document.getElementById('list').firstElementChild;
@@ -76,7 +76,7 @@ export const EntriesList: React.FC<EntriesListProps> = ({
 
   const getOldEntries = useCallback(async () => {
     setLoadMoreTop(false);
-    if (leftOffTop === null || leftOffTop <= 0) {
+    if (leftOffTop === "") {
       return;
     }
     setIsLoadingTop(true);
@@ -127,7 +127,7 @@ export const EntriesList: React.FC<EntriesListProps> = ({
       switch (message.messageType) {
         case "entry":
           const entry = message.data;
-          if (!focusedEntryId) setFocusedEntryId(entry.id.toString());
+          if (!focusedEntryId) setFocusedEntryId(entry.id);
           const newEntries = [...entries, entry];
           if (newEntries.length > 10000) {
             setLeftOffTop(newEntries[0].id);
@@ -151,14 +151,14 @@ export const EntriesList: React.FC<EntriesListProps> = ({
         case "queryMetadata":
           setTruncatedTimestamp(message.data.truncatedTimestamp);
           setQueriedTotal(message.data.total);
-          if (leftOffTop === null) {
-            setLeftOffTop(message.data.leftOff - 1);
+          if (leftOffTop === "") {
+            setLeftOffTop(message.data.leftOff);
           }
           break;
         case "startTime":
           setStartTime(message.data);
           break;
-      };
+      }
     }
   }
 
@@ -180,7 +180,7 @@ export const EntriesList: React.FC<EntriesListProps> = ({
         </ScrollableFeedVirtualized>
         <button type="button"
                 title="Fetch old records"
-                className={`${styles.btnOld} ${!scrollbarVisible && leftOffTop > 0 ? styles.showButton : styles.hideButton}`}
+                className={`${styles.btnOld} ${!scrollbarVisible && leftOffTop !== "" ? styles.showButton : styles.hideButton}`}
                 onClick={(_) => {
                   trafficViewerApi.webSocket.close()
                   getOldEntries();
@@ -193,9 +193,9 @@ export const EntriesList: React.FC<EntriesListProps> = ({
                 onClick={(_) => {
                   if (isWsConnectionClosed) {
                     if (query) {
-                      openWebSocket(`(${query}) and leftOff(${leftOffBottom})`, false);
+                      openWebSocket(`(${query}) and leftOff("${leftOffBottom}")`, false);
                     } else {
-                      openWebSocket(`leftOff(${leftOffBottom})`, false);
+                      openWebSocket(`leftOff("${leftOffBottom}")`, false);
                     }
                   }
                   scrollableRef.current.jumpToBottom();

ui-common/src/components/TrafficViewer/EntryListItem/EntryListItem.tsx

@@ -67,7 +67,7 @@ export const EntryItem: React.FC<EntryProps> = ({entry, style, headingMode, name
 
     const [focusedEntryId, setFocusedEntryId] = useRecoilState(focusedEntryIdAtom);
     const [queryState, setQuery] = useRecoilState(queryAtom);
-    const isSelected = focusedEntryId === entry.id.toString();
+    const isSelected = focusedEntryId === entry.id;
 
     const classification = getClassification(entry.status)
     const numberOfRules = entry.rules.numberOfRules
@@ -144,12 +144,12 @@ export const EntryItem: React.FC<EntryProps> = ({entry, style, headingMode, name
 
     return <React.Fragment>
         <div
-            id={`entry-${entry.id.toString()}`}
+            id={`entry-${entry.id}`}
             className={`${styles.row}
             ${isSelected && !rule && !contractEnabled ? styles.rowSelected : additionalRulesProperties}`}
             onClick={() => {
                 if (!setFocusedEntryId) return;
-                setFocusedEntryId(entry.id.toString());
+                setFocusedEntryId(entry.id);
             }}
             style={{
                 border: isSelected && !headingMode ? `1px ${entry.proto.backgroundColor} solid` : "1px transparent solid",

ui-common/src/components/TrafficViewer/TrafficViewer.tsx

@@ -21,6 +21,7 @@ import {StatusBar} from "../UI/StatusBar";
 import tappingStatusAtom from "../../recoil/tappingStatus/atom";
 import {TOAST_CONTAINER_ID} from "../../configs/Consts";
 import leftOffTopAtom from "../../recoil/leftOffTop";
+import { DEFAULT_QUERY } from '../../hooks/useWS';
 
 const useLayoutStyles = makeStyles(() => ({
   details: {
@@ -119,9 +120,9 @@ export const TrafficViewer: React.FC<TrafficViewerProps> = ({
 
   const openEmptyWebSocket = () => {
     if (query) {
-      openWebSocket(`(${query}) and leftOff(-1)`, true);
+      openWebSocket(`(${query}) and ${DEFAULT_QUERY}`, true);
     } else {
-      openWebSocket(`leftOff(-1)`, true);
+      openWebSocket(DEFAULT_QUERY, true);
     }
   }
 
@@ -137,7 +138,7 @@ export const TrafficViewer: React.FC<TrafficViewerProps> = ({
     if (resetEntries) {
       setFocusedEntryId(null);
       setEntries([]);
-      setLeftOffTop(null);
+      setLeftOffTop("");
       setNoMoreDataTop(false);
     }
     try {

ui-common/src/hooks/useWS.tsx

@@ -7,7 +7,7 @@ enum WebSocketReadyState {
   CLOSED
 }
 
-export const DEFAULT_QUERY = "leftOff(-1)";
+export const DEFAULT_QUERY = `leftOff("latest")`;
 
 const useWS = (wsUrl: string) => {
   const [message, setMessage] = useState(null);

ui-common/src/recoil/leftOffTop/atom.ts

@@ -2,7 +2,7 @@ import { atom } from "recoil"
 
 const leftOffTopAtom = atom({
     key: "leftOffTopAtom",
-    default: null
+    default: ""
 })
 
 export default leftOffTopAtom;