Merge pull request #1008 from akto-api-security/develop

Develop

apps/api-runtime/src/main/java/com/akto/dependency/store/HashSetStore.java

@@ -11,15 +11,15 @@ public HashSetStore(int maxCount) {
         this.maxCount = maxCount;
     }
 
-    private final Set<String> set = new HashSet<>();
+    private final Set<Integer> set = new HashSet<>();
     @Override
     public boolean contains(String val) {
-        return set.contains(val);
+        return set.contains(val.hashCode());
     }
 
     @Override
     public boolean add(String val) {
         if (set.size() >= maxCount) return false;
-        return set.add(val);
+        return set.add(val.hashCode());
     }
 }

apps/api-runtime/src/main/java/com/akto/parsers/HttpCallParser.java

@@ -204,17 +204,17 @@ public void syncFunction(List<HttpResponseParams> responseParams, boolean syncIm
             apiCatalogSync.computeDelta(aggregator, false, apiCollectionId);
         }
 
-//        for (HttpResponseParams responseParam: filteredResponseParams) {
-//            dependencyAnalyser.analyse(responseParam.getOrig(), responseParam.requestParams.getApiCollectionId());
-//        }
+         for (HttpResponseParams responseParam: filteredResponseParams) {
+             dependencyAnalyser.analyse(responseParam.getOrig(), responseParam.requestParams.getApiCollectionId());
+         }
 
         this.sync_count += filteredResponseParams.size();
         int syncThresh = numberOfSyncs < 10 ? 10000 : sync_threshold_count;
         if (syncImmediately || this.sync_count >= syncThresh || (Context.now() - this.last_synced) > this.sync_threshold_time || isHarOrPcap) {
             numberOfSyncs++;
             apiCatalogSync.syncWithDB(syncImmediately, fetchAllSTI);
             dependencyAnalyser.dbState = apiCatalogSync.dbState;
-//            dependencyAnalyser.syncWithDb();
+            dependencyAnalyser.syncWithDb();
             syncTrafficMetricsWithDB();
             this.last_synced = Context.now();
             this.sync_count = 0;

apps/dashboard/src/main/java/com/akto/utils/Utils.java

@@ -485,13 +485,13 @@ public static void pushDataToKafka(int apiCollectionId, String topic, List<Strin
 //                info.getResourceAnalyser().analyse(responseParams);
 //            }
 //            info.getResourceAnalyser().syncWithDb();
-//            try {
-//                DependencyFlow dependencyFlow = new DependencyFlow();
-//                dependencyFlow.run();
-//                dependencyFlow.syncWithDb();
-//            } catch (Exception e) {
-//                loggerMaker.errorAndAddToDb(e,"Exception while running dependency flow", LoggerMaker.LogDb.DASHBOARD);
-//            }
+           try {
+               DependencyFlow dependencyFlow = new DependencyFlow();
+               dependencyFlow.run();
+               dependencyFlow.syncWithDb();
+           } catch (Exception e) {
+               loggerMaker.errorAndAddToDb(e,"Exception while running dependency flow", LoggerMaker.LogDb.DASHBOARD);
+           }
         }
     }
 

apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/GithubServerTable.js

@@ -11,31 +11,58 @@ import {
   ChoiceList,
   Tabs} from '@shopify/polaris';
 import {GithubRow} from './rows/GithubRow';
-import { useState, useCallback, useEffect, useReducer } from 'react';
-import DateRangePicker from '../layouts/DateRangePicker';
+import { useState, useCallback, useEffect } from 'react';
 import "./style.css"
-import func from '@/util/func';
-import { produce } from "immer"
-import values from "@/util/values"
 import transform from '../../pages/observe/transform';
 import DropdownSearch from '../shared/DropdownSearch';
+import PersistStore from '../../../main/PersistStore';
+import tableFunc from './transform';
+import useTable from './TableContext';
 
 function GithubServerTable(props) {
 
+  const filtersMap = PersistStore(state => state.filtersMap)
+  const setFiltersMap = PersistStore(state => state.setFiltersMap)
+  const tableInitialState = PersistStore(state => state.tableInitialState)
+  const setTableInitialState = PersistStore(state => state.setTableInitialState)
+
+  const currentPageKey = window.location.href
+
+  const pageFiltersMap = filtersMap[currentPageKey]
+  const initialStateFilters = tableFunc.mergeFilters(props.appliedFilters || [], (pageFiltersMap?.filters || []),props.disambiguateLabel)
   const { mode, setMode } = useSetIndexFiltersMode(props?.mode ? props.mode : IndexFiltersMode.Filtering);
-  const [sortSelected, setSortSelected] = useState(props?.sortOptions?.length > 0 ? [props.sortOptions[0].value] : []);
+  const [sortSelected, setSortSelected] = useState(tableFunc.getInitialSortSelected(props.sortOptions, pageFiltersMap))
   const [data, setData] = useState([]);
   const [total, setTotal] = useState([]);
   const [page, setPage] = useState(0);
   const pageLimit = props?.pageLimit || 20;
-  const [appliedFilters, setAppliedFilters] = useState(props.appliedFilters || []);
+  const [appliedFilters, setAppliedFilters] = useState(initialStateFilters);
   const [queryValue, setQueryValue] = useState('');
+
+  const { applyFilter } = useTable()
+
+  const [sortableColumns, setSortableColumns] = useState([])
+  const [activeColumnSort, setActiveColumnSort] = useState({columnIndex: -1, sortDirection: 'descending'})
+
   let filterOperators = props.headers.reduce((map, e) => { map[e.sortKey || e.value] = 'OR'; return map }, {})
 
-  const [currDateRange, dispatchCurrDateRange] = useReducer(produce((draft, action) => func.dateRangeReducer(draft, action)), values.ranges[3]);
+  const handleSelectedTab = (x) => {
+    const tableTabs = props.tableTabs ? props.tableTabs : props.tabs
+    if(tableTabs){
+      const primitivePath = window.location.origin + window.location.pathname
+      const newUrl = primitivePath + "#" +  tableTabs[x].id
+      window.history.replaceState(null, null, newUrl)
+    } 
+  }
+
+  useEffect(()=> {
+    setAppliedFilters(initialStateFilters)
+    setSortSelected(tableFunc.getInitialSortSelected(props.sortOptions, pageFiltersMap))
+  },[currentPageKey])
 
   useEffect(() => {
     let [sortKey, sortOrder] = sortSelected.length == 0 ? ["", ""] : sortSelected[0].split(" ");
+    setActiveColumnSort(tableFunc.getColumnSort(sortSelected, props?.sortOptions))
     let filters = props.headers.reduce((map, e) => { map[e.filterKey || e.value] = []; return map }, {})
     appliedFilters.forEach((filter) => {
       filters[filter.key] = filter.value
@@ -44,31 +71,61 @@ function GithubServerTable(props) {
       let tempData = await props.fetchData(sortKey, sortOrder == 'asc' ? -1 : 1, page * pageLimit, pageLimit, filters, filterOperators, queryValue);
       tempData ? setData([...tempData.value]) : setData([])
       tempData ? setTotal(tempData.total) : setTotal(0)
+      applyFilter(tempData.total)
+
+      setTableInitialState({
+        ...tableInitialState,
+        [currentPageKey]: tempData.total
+      })
     }
+    handleSelectedTab(props?.selected)
     fetchData();
-  }, [sortSelected, appliedFilters, queryValue, page])
+  }, [sortSelected, appliedFilters, queryValue, page, pageFiltersMap])
+
+  useEffect(()=> {
+    setSortableColumns(tableFunc.getSortableChoices(props?.headers))
+  },[props?.headers])
+
+  const handleSort = (col, dir) => {
+    let tempSortSelected = props?.sortOptions.filter(x => x.columnIndex === (col + 1))
+    let sortVal = [tempSortSelected[0].value]
+    if(dir.includes("desc")){
+      setSortSelected([tempSortSelected[1].value])
+      sortVal = [tempSortSelected[1].value]
+    }else{
+      setSortSelected([tempSortSelected[0].value])
+    }
+    let copyFilters = filtersMap
+    copyFilters[currentPageKey] = {
+      'filters': pageFiltersMap?.filters || [],
+      'sort': sortVal
+    }
+    setFiltersMap(copyFilters)
+  }
 
   const handleRemoveAppliedFilter = (key) => {
     let temp = appliedFilters
     temp = temp.filter((filter) => {
       return filter.key != key
     })
     props?.appliedFilters?.forEach((defaultAppliedFilter) => {
-      if (key == defaultAppliedFilter.key) {
+      if (key === defaultAppliedFilter.key) {
         temp.push(defaultAppliedFilter)
       }
     })
-    if (key == "dateRange") {
-      getDate({ type: "update", period: values.ranges[3] });
-    } else {
-      setAppliedFilters(temp);
+    setAppliedFilters(temp);
+    let tempFilters = filtersMap
+    tempFilters[currentPageKey] = {
+      'filters': temp,
+      'sort': pageFiltersMap?.sort || []
     }
+    setFiltersMap(tempFilters)
   }
 
   const changeAppliedFilters = (key, value) => {
     let temp = appliedFilters
     temp = temp.filter((filter) => {
-      return filter.key != key
+      return filter.key !== key
     })
     if (value.length > 0 || Object.keys(value).length > 0) {
       temp.push({
@@ -79,6 +136,12 @@ function GithubServerTable(props) {
       })
     }
     setPage(0);
+    let tempFilters = filtersMap
+    tempFilters[currentPageKey] = {
+      'filters': temp,
+      'sort': pageFiltersMap?.sort || []
+    }
+    setFiltersMap(tempFilters)
     setAppliedFilters(temp);
   };
 
@@ -95,12 +158,6 @@ function GithubServerTable(props) {
     changeAppliedFilters(key, value);
   }
 
-  const getDate = (dateObj) => {
-    dispatchCurrDateRange({type: "update", period: dateObj.period, title: dateObj.title, alias: dateObj.alias})
-    let obj = dateObj.period.period;
-    handleFilterStatusChange("dateRange",obj)
-  }
-
   const getSortedChoices = (choices) => {
     return choices.sort((a, b) => (a?.label || a) - (b?.label || b));
   }
@@ -148,24 +205,15 @@ function GithubServerTable(props) {
         }
       })
   }
-  if (props.calenderFilter) {
-    filters.push({
-      key: "dateRange",
-      label: props.calenderLabel || "Discovered",
-      filter:
-        (
-          <DateRangePicker ranges={values.ranges}
-          initialDispatch = {currDateRange} 
-          dispatch={(dateObj) => getDate(dateObj)}
-          setPopoverState={() => {}}
-        />),
-      pinned: true
-    })
-  }
 
   const handleFiltersClearAll = useCallback(() => {
-    setAppliedFilters(props.appliedFilters || [])
-    getDate({ type: "update", period: values.ranges[3] });
+    setFiltersMap({
+      ...filtersMap,
+      [currentPageKey]:{
+        sort: filtersMap[currentPageKey]?.sort || []
+      }
+    })
+    setAppliedFilters([])
   }, []);
 
   const resourceIDResolver = (data) => {
@@ -222,11 +270,10 @@ function GithubServerTable(props) {
 
   let tableHeightClass = props.increasedHeight ? "control-row" : (props.condensedHeight ? "condensed-row" : '') 
   let tableClass = props.useNewRow ? "new-table" : (props.selectable ? "removeHeaderColor" : "hideTableHead")
-
   return (
     <div className={tableClass}>
       <LegacyCard>
-        {props.tabs && <Tabs tabs={props.tabs} selected={props.selected} onSelect={props.onSelect}></Tabs>}
+        {props.tabs && <Tabs tabs={props.tabs} selected={props.selected} onSelect={(x) => {props?.onSelect(x); handleSelectedTab(x)}}></Tabs>}
         {props.tabs && props.tabs[props.selected].component ? props.tabs[props.selected].component :
           <div>
             <LegacyCard.Section flush>
@@ -252,7 +299,7 @@ function GithubServerTable(props) {
                 setMode={setMode}
                 loading={props.loading || false}
                 selected={props?.selected}
-                onSelect={props?.onSelect}
+                onSelect={(x) => {props?.onSelect(x); handleSelectedTab(x)}}
               />
               <div className={tableHeightClass}>
               <IndexTable
@@ -274,6 +321,10 @@ function GithubServerTable(props) {
                 bulkActions={props.selectable ? props.bulkActions && props.bulkActions(selectedResources) : []}
                 promotedBulkActions={props.selectable ? props.promotedBulkActions && props.promotedBulkActions(selectedResources) : []}
                 hasZebraStriping={props.hasZebraStriping || false}
+                sortable={sortableColumns}
+                sortColumnIndex={activeColumnSort.columnIndex}
+                sortDirection={activeColumnSort.sortDirection}
+                onSort={handleSort}
               >
                 {rowMarkup}
               </IndexTable>

apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/TableContext.js

@@ -0,0 +1,35 @@
+import { createContext, useReducer, useContext } from "react";
+import tableReducer, {initialState} from "./tableReducer";
+
+const TableContext = createContext(initialState);
+
+export const TableContextProvider = ({ children }) => {
+  const [state, dispatch] = useReducer(tableReducer, initialState);
+
+  const applyFilter = (filter) => {
+    dispatch({
+      type: "APPLY_FILTER",
+      payload: {
+        tabsInfo: filter
+      }
+    });
+  };
+
+  const value = {
+    tabsInfo: state.tabsInfo,
+    applyFilter,
+  };
+  return <TableContext.Provider value={value}>{children}</TableContext.Provider>;
+};
+
+const useTable = () => {
+  const context = useContext(TableContext);
+
+  if (context === undefined) {
+    throw new Error("useTable must be used within TableContext");
+  }
+
+  return context;
+};
+
+export default useTable;

apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/tableReducer.js

@@ -0,0 +1,21 @@
+import PersistStore from "../../../main/PersistStore";
+const tableInitialState = PersistStore.getState().tableInitialState[window.location.href] || {}
+
+export const initialState = {
+    tabsInfo : tableInitialState
+}
+
+const tableReducer = (state, action) =>{
+    const { type, payload } = action;
+    switch (type) {
+        case "APPLY_FILTER":
+            return {
+                ...state,
+                tabsInfo: payload.tabsInfo,
+              };
+        default:
+            return{...state}
+    }
+}
+
+export default tableReducer