change analytic status type && handle GET /status errors

client/src/components/AnlyticsStatus.vue

@@ -1,10 +1,12 @@
 <template>
   <div class="analytic-status">
-    analytic status: <strong> {{ status }} </strong>
+    analytic status: <strong> {{ status.message }} </strong>
   </div>
 </template>
 
 <script lang="ts">
+import { AnalyticStatus } from "@/store";
+
 import { defineComponent } from 'vue';
 
 
@@ -13,7 +15,7 @@ export default defineComponent({
   components: {
   },
   computed: {
-    status() {
+    status(): AnalyticStatus {
       return this.$store.state.analyticStatus;
     }
   }

client/src/services/analytics.service.ts

@@ -5,20 +5,33 @@ import axios from 'axios';
 
 import { getGenerator } from '@/utils';
 
-import _ from 'lodash';
+import {
-import { 
   AnalyticUnitType, AnlyticUnitConfig,
   PatternConfig, ThresholdConfig, AnomalyConfig
 } from "@/types/analytic_units";
 import { AnomalyHSR } from "@/types";
+import { AnalyticStatus } from "@/store";
+
+import _ from 'lodash';
+
 
 const ANALYTICS_API_URL = API_URL + "analytics/";
 
-export async function getStatus(): Promise<string> {
+export async function getStatus(): Promise<AnalyticStatus> {
   const uri = ANALYTICS_API_URL + `status`;
-  const res = await axios.get(uri);
+  try {
-  const data = res['data'] as any;
+    const res = await axios.get<{ status: string }>(uri);
-  return data.status;
+    const data = res.data;
+    return {
+      available: true,
+      message: data.status
+    };
+  } catch (e) {
+    return {
+      available: false,
+      message: e.message
+    };
+  }
 }
 
 export async function getConfig(): Promise<[AnalyticUnitType, AnlyticUnitConfig]> {
@@ -54,8 +67,8 @@ export async function patchConfig(patchObj: any) {
   await axios.patch(uri, patchObj);
 }
 
-export function getStatusGenerator(): AsyncIterableIterator<string> {
+export function getStatusGenerator(): AsyncIterableIterator<AnalyticStatus> {
-  return getGenerator<string>(100, getStatus);
+  return getGenerator<AnalyticStatus>(100, getStatus);
 }
 
 
@@ -68,6 +81,6 @@ export async function getHSRAnomaly(from: number, to: number): Promise<AnomalyHS
   const res = await axios.get(uri);
 
   const values = res["data"]["AnomalyHSR"];
-  
+
   return values as AnomalyHSR;
 }

client/src/store/index.ts

@@ -12,23 +12,30 @@ const _SET_STATUS_GENERATOR = '_SET_STATUS_GENERATOR';
 
 // TODO: consts for actions
 
+export type AnalyticStatus = {
+  available: boolean,
+  message: string,
+}
 
 type State = {
-  analyticStatus: string,
+  analyticStatus: AnalyticStatus,
   analyticUnitType?: AnalyticUnitType,
   analyticUnitConfig?: AnlyticUnitConfig,
-  _statusGenerator: AsyncIterableIterator<string>
+  _statusGenerator: AsyncIterableIterator<AnalyticStatus>
 }
 
 const store = createStore<State>({
   state: {
-    analyticStatus: 'loading...',
+    analyticStatus: {
+      available: false,
+      message: 'loading...',
+    },
     analyticUnitType: null,
     analyticUnitConfig: null,
     _statusGenerator: null
   },
   mutations: {
-    [SET_ANALYTICS_STATUS](state, status: string) {
+    [SET_ANALYTICS_STATUS](state, status: AnalyticStatus) {
       state.analyticStatus = status;
     },
     [SET_DETECTOR_CONFIG](state, { analyticUnitType, analyticUnitConfig }) {      
@@ -38,7 +45,7 @@ const store = createStore<State>({
     // [PATCH_CONFIG](state, patchObj) {
     //   patchConfig(patchConfig)
     // }
-    [_SET_STATUS_GENERATOR](state, generator: AsyncIterableIterator<string>) {
+    [_SET_STATUS_GENERATOR](state, generator: AsyncIterableIterator<AnalyticStatus>) {
       state._statusGenerator = generator;
     }
   },