Merge branch 'main' into jacovinus-search-history

jacovinus · jacovinus · commit efefb0d4893c · 2022-03-04T18:52:23.000+01:00
diff --git a/.babelrc b/.babelrc
@@ -2,7 +2,8 @@
     "plugins": [
         "transform-class-properties",
         "react-hot-loader/babel",
-        "syntax-dynamic-import"
+        "syntax-dynamic-import",
+        "@babel/plugin-transform-runtime"
     ],
     "presets": [
     
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -6,7 +6,7 @@
     "url": "git+ssh://git@github.com/metrico/cloki-view.git"
   },
   "author": "joel@qxip.net",
-  "version": "0.4.4",
+  "version": "0.7.0",
   "private": false,
   "dependencies": {
     "@emotion/react": "^11.7.1",
@@ -69,6 +69,7 @@
     "@babel/core": "^7.16.12",
     "@babel/plugin-proposal-class-properties": "^7.16.7",
     "@babel/plugin-proposal-object-rest-spread": "^7.16.7",
+    "@babel/plugin-transform-runtime": "^7.17.0",
     "@babel/preset-env": "^7.16.11",
     "@babel/preset-react": "^7.16.7",
     "babel-loader": "^8.2.3",
diff --git a/src/App.js b/src/App.js
@@ -1,11 +1,7 @@
 import { Provider } from "react-redux";
-import store from './store/store';
 import MainView from "./components/MainView";
-import localService from "./services/localService";
-
-
+import store from './store/store';
 export default function App() {
-window.LOCALSERVICE = localService
 		return (
 			<Provider store={store}>
 
@@ -14,4 +10,4 @@ window.LOCALSERVICE = localService
 			</Provider>
 		);
 	
-}
+}
diff --git a/src/actions/LoadLabels.js b/src/actions/LoadLabels.js
@@ -1,5 +1,5 @@
 import axios from "axios";
-import setLabels from "./setLabels";
+import { setLabels } from "./setLabels";
 import setLoading from "./setLoading";
 import { setApiError } from "./setApiError";
 import { errorHandler } from "./errorHandler";
@@ -21,11 +21,9 @@ export default function loadLabels(apiUrl) {
         mode: "cors",
     };
 
-    return function (dispatch) {
-
-     
+    return async (dispatch) => {
       
-        axios.get(`${url.trim()}/loki/api/v1/labels`, options)
+        await axios.get(`${url.trim()}/loki/api/v1/labels`, options)
             ?.then((response) => {
         if(response){
             if(response?.data?.data === []) console.log('no labels found')
@@ -39,20 +37,15 @@ export default function loadLabels(apiUrl) {
                     hidden: false,
                     facets: 0,
                 }));
-               
                 dispatch(setLabels(labels || []));
-             
-                dispatch(setApiError(''))
             }
 
         }
-            
 
             }).catch(error => {
                 console.log(error)
                 dispatch(setLoading(false))
                 const {message,status} = errorHandler(url, error)
-                dispatch(setApiError(message || status + 'Error'))
                 dispatch(setLabels([]))
              
             })
diff --git a/src/actions/index.js b/src/actions/index.js
@@ -10,3 +10,6 @@ export * from "./setIsSubmit";
 export * from "./setMatrixData";
 export * from "./setQueryHistory";
 export * from "./setHistoryOpen";
+export * from "./setApiError";
+export * from "./errorHandler";
+export * from "./setLabels";
diff --git a/src/actions/loadLabelValues.js b/src/actions/loadLabelValues.js
@@ -1,14 +1,14 @@
 import axios from "axios";
 import { errorHandler } from "./errorHandler";
 import { setApiError } from "./setApiError";
-import setLabels from "./setLabels";
+import { setLabels } from "./setLabels";
 import setLabelValues from "./setLabelValues";
 import setLoading from "./setLoading";
 
 
-export default function loadLaebelValues(label, labelList, apiUrl) {
-    if (label?.length <= 0 && label.lsList.length <= 0) {
-        return;
+export default function loadLabelValues(label, labelList, apiUrl) {
+    if (!label || (label?.length <= 0 && label.lsList.length <= 0)) {
+        return () => {};
     };
 
     const url = apiUrl;
@@ -28,18 +28,18 @@ export default function loadLaebelValues(label, labelList, apiUrl) {
 
     };
 
-    return function (dispatch) {
-
+    return async (dispatch) => {
         dispatch(setLoading(true))
 
-        axios.get(`${url}/loki/api/v1/label/${label.name}/values`, options)
+        await axios.get(`${url}/loki/api/v1/label/${label.name}/values`, options)
             ?.then(response => {
                 if (response?.data?.data) {
                     const values = response?.data?.data?.map?.((value) => ({
                         name: value,
                         selected: false,
                         loading: false,
                         hidden: false,
+                        inverted: false
                     }));
 
                     const lsList = [...labelList];
@@ -62,9 +62,9 @@ export default function loadLaebelValues(label, labelList, apiUrl) {
                 const { message } = errorHandler(url, error)
                 dispatch(setApiError(message))
 
-                console.log(error)
+                console.err(error)
             })
     }
 
 
-}
+}
diff --git a/src/actions/setApiError.js b/src/actions/setApiError.js
@@ -3,4 +3,4 @@ export const setApiError = (apiErrors) => (dispatch) => {
         type: 'SET_API_ERRORS',
         apiErrors
     })
-} 
+} 
diff --git a/src/actions/setApiUrl.js b/src/actions/setApiUrl.js
@@ -3,4 +3,4 @@ export const setApiUrl = ( apiUrl ) => (dispatch) => {
         type: 'SET_API_URL',
         apiUrl:apiUrl.trim()
     })
-}
+}
diff --git a/src/actions/setLabelValues.js b/src/actions/setLabelValues.js
@@ -1,6 +1,7 @@
-export default (labelValues) => (dispatch) => {
+const setLabelValues = (labelValues) => (dispatch) => {
     dispatch({
         type: 'SET_LABEL_VALUES',
        labelValues
     });
-}
+}
+export default setLabelValues;
diff --git a/src/actions/setLabels.js b/src/actions/setLabels.js
@@ -1,6 +1,6 @@
-export default (labels) => (dispatch) => {
+export const setLabels = (labels) => (dispatch) => {
     dispatch({
         type: 'SET_LABELS',
         labels: labels
     });
-}
+};
diff --git a/src/actions/setLabelsBrowserOpen.js b/src/actions/setLabelsBrowserOpen.js
@@ -3,4 +3,4 @@ export const setLabelsBrowserOpen = ( labelsBrowserOpen) => (dispatch) => {
         type: 'SET_BROWSER_OPEN',
         labelsBrowserOpen
     })
-}
+}
diff --git a/src/actions/setLoading.js b/src/actions/setLoading.js
@@ -3,4 +3,4 @@ export default  (loading) => (dispatch) => {
         type: 'SET_LOADING',
        loading
     });
-}
+}
diff --git a/src/actions/setLogs.js b/src/actions/setLogs.js
@@ -3,4 +3,4 @@ export default (logs) => (dispatch) => {
         type: 'SET_LOGS',
         logs
     });
-}
+}
diff --git a/src/actions/setMatrixData.js b/src/actions/setMatrixData.js
@@ -5,4 +5,4 @@ const  setMatrixData = (matrixData) => (dispatch) => {
      })
 }
 
-export default setMatrixData;
+export default setMatrixData;
diff --git a/src/actions/setQuery.js b/src/actions/setQuery.js
@@ -4,4 +4,3 @@
         query
     })
 }
-
diff --git a/src/actions/setQueryLimit.js b/src/actions/setQueryLimit.js
@@ -3,4 +3,4 @@ export const setQueryLimit = (limit) => (dispatch) => {
         type: 'SET_QUERY_LIMIT',
         limit
     });
-}
+}
diff --git a/src/actions/setQueryStep.js b/src/actions/setQueryStep.js
@@ -3,4 +3,4 @@ export const setQueryStep = (step) => (dispatch)=>{
         type: 'SET_QUERY_STEP',
         step
     })
-}
+}
diff --git a/src/actions/setRangeOpen.js b/src/actions/setRangeOpen.js
@@ -3,4 +3,4 @@ export const setRangeOpen = ( rangeOpen ) => (dispatch) => {
         type: 'SET_RANGE_OPEN',
         rangeOpen
     })
-}
+}
diff --git a/src/actions/setStartTime.js b/src/actions/setStartTime.js
@@ -3,4 +3,4 @@ export const setStartTime = (start) => (dispatch) => {
         type: 'SET_START_TIME',
         start
     });
-}
+}
diff --git a/src/actions/setStopTime.js b/src/actions/setStopTime.js
@@ -3,4 +3,4 @@ export const setStopTime = (stop) => (dispatch) => {
         type: 'SET_STOP_TIME',
         stop
     });
-}
+}
diff --git a/src/actions/setTimeRangeLabel.js b/src/actions/setTimeRangeLabel.js
@@ -3,4 +3,4 @@ export const setTimeRangeLabel = (label) => (dispatch) => {
         type: 'SET_TIME_RANGE_LABEL',
         label
     });
-}
+}
diff --git a/src/actions/setUrlQueryParams.js b/src/actions/setUrlQueryParams.js
@@ -4,4 +4,4 @@ export const setUrlQueryParams = (urlQueryParams) => (dispatch) => {
         urlQueryParams
 
     })
-}
+}
diff --git a/src/components/LabelBrowser/ValuesList.js b/src/components/LabelBrowser/ValuesList.js
@@ -8,6 +8,7 @@ import { setQuery } from "../../actions"
 import loadLabelValues from "../../actions/loadLabelValues"
 
 import Tooltip from '@mui/material/Tooltip';
+import store from "../../store/store";
 export const LabelsFetchError = () => {
     const labelError = useSelector((store) => store.apiErrors)
 
@@ -28,9 +29,18 @@ export const LabelsFetchError = () => {
 }
 
 export const ValuesList = (props) => {
-    const labels = useSelector(state => state.labels)
-    const [labelList, setLabelList] = useState(labels);
     const [labelsSelected, setLabelsSelected] = useState([]);
+    const labels = useSelector(state => { 
+        const selected = state.labels.filter((f) => f.selected);
+        console.log(JSON.stringify(selected) !== JSON.stringify(labelsSelected))
+        if (JSON.stringify(selected) !== JSON.stringify(labelsSelected)) {
+            setLabelsSelected(selected);
+        }
+        return state.labels
+    })
+    
+    const [labelList, setLabelList] = useState(labels);
+
     const dispatch = useDispatch()
     const debug = useSelector((store) => store.debug)
     const apiUrl = useSelector((store) => store.apiUrl)
@@ -94,6 +104,7 @@ export const ValuesList = (props) => {
     const onLabelValueClick = (e, value) => {
         e.preventDefault()
         value.selected = !value.selected;
+        value.inverted = false;
         onLabelValueChange();
     };
 
diff --git a/src/components/LabelBrowser/helpers/querybuilder.js b/src/components/LabelBrowser/helpers/querybuilder.js
@@ -1,19 +1,35 @@
+import { setQuery } from "../../../actions";
+import store from "../../../store/store";
 
 export function queryBuilder(labels) {
     const selectedLabels = [];
     for (const label of labels) {
         if (label.selected && label.values && label.values.length > 0) {
             const selectedValues = label.values
-                .filter((value) => value.selected)
+                .filter((value) => value.selected && !value.inverted)
                 .map((value) => value.name);
+            const invertedSelectedValues = label.values
+                .filter((value) => value.selected && value.inverted)
+                .map((value) => value.name);
+
             if (selectedValues.length > 1) {
                 selectedLabels.push(
                     `${label.name}=~"${selectedValues.join("|")}"`
                 );
             } else if (selectedValues.length === 1) {
                 selectedLabels.push(`${label.name}="${selectedValues[0]}"`);
             }
+            invertedSelectedValues.forEach(value => {
+                selectedLabels.push(`${label.name}!="${value}"`)
+            });
+
         }
     }
     return ["{", selectedLabels.join(","), "}"].join("");
 }
+export function queryBuilderWithLabels() {
+    const labels = store.getState().labels;
+    console.log(labels)
+    const query = queryBuilder(labels)
+    store.dispatch(setQuery(query));
+}
diff --git a/src/components/LogView.js b/src/components/LogView.js
diff --git a/src/components/MainView.js b/src/components/MainView.js
diff --git a/src/components/StatusBar/StatusBar.js b/src/components/StatusBar/StatusBar.js
diff --git a/src/components/UpdateStateFromQueryParams.js b/src/components/UpdateStateFromQueryParams.js
diff --git a/src/helpers/error.interceptor.js b/src/helpers/error.interceptor.js
diff --git a/src/helpers/httpclient.js b/src/helpers/httpclient.js
diff --git a/src/index.js b/src/index.js
diff --git a/src/scss/modules/log-view.scss b/src/scss/modules/log-view.scss
