detector config on client begin

client/src/services/analytics.service.ts

@@ -16,6 +16,12 @@ export async function getStatus(): Promise<string> {
   return data.status;
 }
 
+export async function getConfig(): Promise<string> {
+  const uri = ANALYTICS_API_URL + `config`;
+  const res = await axios.get(uri);
+  return res['data'] as any;
+}
+
 export function getStatusGenerator(): AsyncIterableIterator<string> {
   return getGenerator<string>(100, getStatus);
 }

client/src/store/index.ts

@@ -1,37 +1,43 @@
 import { auth } from "./auth.module";
 import { createStore } from 'vuex'
-import { getStatusGenerator } from "@/services/analytics.service";
-import { AnalyticType } from './types'
+import { getConfig, getStatusGenerator } from "@/services/analytics.service";
+import { DetectorConfig, DetectorType } from '@/types/analytic_units'
 // import { notify } from "@kyvg/vue3-notification";
 
 
 const SET_ANALYTICS_STATUS = 'SET_ANALYTICS_STATUS';
-const SET_ANALYTICS_TYPE = 'SET_ANALYTICS_TYPE';
+const SET_DETECTOR_CONFIG = 'SET_DETECTOR_CONFIG';
 const _SET_STATUS_GENERATOR = '_SET_STATUS_GENERATOR';
 
 
-
 type State = {
   analyticStatus: string,
-  analyticType?: AnalyticType,
+  detectorType?: DetectorType,
+  // TODO: maybe rename it
+  analyticUnitConfig?: DetectorConfig,
   _statusGenerator: AsyncIterableIterator<string>
 }
 
 const store = createStore<State>({
   state: {
     analyticStatus: 'loading...',
-    analyticType: null,
+    detectorType: null,
+    analyticUnitConfig: null,
     _statusGenerator: null
   },
   mutations: {
     [SET_ANALYTICS_STATUS](state, status: string) {
       state.analyticStatus = status;
     },
-    [SET_ANALYTICS_TYPE](state, atype: AnalyticType) {
-      state.analyticType = atype;
+    [SET_DETECTOR_CONFIG](state, { detectorType, detectorConfig }) {
+      console.log(detectorType);
+      console.log(detectorConfig);
+      
+      state.detectorType = detectorType;
+      state.analyticUnitConfig = detectorConfig;
     },
     [_SET_STATUS_GENERATOR](state, generator: AsyncIterableIterator<string>) {
-      this._statusGenerator = generator;
+      state._statusGenerator = generator;
     }
   },
   actions: {
@@ -43,11 +49,25 @@ const store = createStore<State>({
       if(state._statusGenerator !== null) {
         return;
       }
+
       const g = getStatusGenerator();
-      for await (const data of g) {
+      commit(_SET_STATUS_GENERATOR, g);
+      for await (const data of state._statusGenerator) {
+        const st = data.toLocaleLowerCase();
+        if(state.analyticStatus.toLocaleLowerCase() != 'ready' && st == 'ready') {
+          this.dispatch('fetchConfig');
+          // TODO: update segments from here
+        }
         // this.status = data.toLowerCase();
         commit(SET_ANALYTICS_STATUS, data);
       }
+    },
+    async fetchConfig({commit}) {
+      const c = await getConfig();
+      // TODO: move this logic to service getConfig()
+      const detectorType = c['PatternDetector'] !== undefined ? DetectorType.PATTERN : DetectorType.ANOMALY;
+      const detectorConfig = c['PatternDetector'] as DetectorConfig;
+      commit(SET_DETECTOR_CONFIG, { detectorType, detectorConfig });
     }
   },
   modules: {

client/src/store/types.ts

@@ -1,4 +0,0 @@
-export enum AnalyticType {
-  PATTERN_DETECTOR = 'pattern detector',
-  ANOMALY_DETECTOR = 'anomaly detector',
-}

client/src/types/analytic_units/index.ts

@@ -13,14 +13,18 @@ export enum DetectorType {
   PATTERN = 'pattern',
   THRESHOLD = 'threshold',
   ANOMALY = 'anomaly'
-};
+}
+
+export type DetectorConfig = {
+  correlation_score: number, model_score: number
+}
 
 export enum LabelingMode {
   LABELING = 'LABELING',
   UNLABELING = 'UNLABELING',
   DELETING = 'DELETING',
   NOT_IN_LABELING_MODE = 'NOT_IN_LABELING_MODE'
-};
+}
 
 export type AnalyticSegmentPair = { analyticUnit: AnalyticUnit, segment: AnalyticSegment };
 export type AnalyticSegmentsSearcher = (point: number, rangeDist: number) => AnalyticSegmentPair[];
@@ -56,8 +60,8 @@ const LABELING_MODES = [];
 export class AnalyticUnit {
 
   private _labelingMode: LabelingMode = LabelingMode.LABELING;
-  private _selected: boolean = false;
-  private _saving: boolean = false;
+  private _selected = false;
+  private _saving = false;
   private _segmentSet = new SegmentArray<AnalyticSegment>();
   private _detectionSpans: DetectionSpan[];
   private _inspect = false;
@@ -143,7 +147,7 @@ export class AnalyticUnit {
   }
 
   removeSegmentsInRange(from: number, to: number): AnalyticSegment[] {
-    let deletedSegments = this._segmentSet.removeInRange(from, to);
+    const deletedSegments = this._segmentSet.removeInRange(from, to);
     return deletedSegments;
   }
 

client/src/views/Home.vue

@@ -21,7 +21,7 @@
 import { defineComponent } from 'vue';
 import Graph from '@/components/Graph.vue';
 import AnalyticStatus from '@/components/AnlyticsStatus.vue';
-import { AnalyticType } from '@/store/types';
+import { DetectorType } from '@/types/analytic_units';
 
 
 export default defineComponent({
@@ -37,12 +37,12 @@ export default defineComponent({
   },
   data: function () {
     return {
-      analyticTypes: [AnalyticType.PATTERN_DETECTOR, AnalyticType.ANOMALY_DETECTOR],
+      analyticTypes: [DetectorType.PATTERN, DetectorType.ANOMALY],
     }
   },
   computed: {
     analyticType() {
-      return this.$store.state.analyticType;
+      return this.$store.state.detectorType;
     }
   }
 });

client/src/views/Model.vue

@@ -2,7 +2,6 @@
   <div class="home">
     <img alt="Vue logo" src="../assets/logo.png">
     <scatter-plot />
-
   </div>
 </template>