refactor: add MetricModes

src/views/dashboard/configuration/Widget.vue

@@ -86,6 +86,7 @@ limitations under the License. -->
   import type { Option } from "@/types/app";
   import graphs from "../graphs";
   import CustomOptions from "./widget/index";
+  import { MetricModes } from "../data";
 
   export default defineComponent({
     name: "WidgetEdit",
@@ -133,7 +134,7 @@ limitations under the License. -->
         dashboardStore.setConfigPanel(false);
         const { metricMode } = dashboardStore.selectedGrid;
         let p = {};
-        if (metricMode === "Expression") {
+        if (metricMode === MetricModes.Expression) {
           p = {
             metrics: [],
             metricTypes: [],

src/views/dashboard/configuration/widget/metric/Index.vue

@@ -116,6 +116,7 @@ limitations under the License. -->
     MetricsType,
     ProtocolTypes,
     ExpressionResultType,
+    MetricModes,
   } from "../../../data";
   import { ElMessage } from "element-plus";
   import Icon from "@/components/Icon.vue";
@@ -129,7 +130,7 @@ limitations under the License. -->
   const { t } = useI18n();
   const emit = defineEmits(["update", "loading"]);
   const dashboardStore = useDashboardStore();
-  const isExpression = ref<boolean>(dashboardStore.selectedGrid.metricMode === "Expression" ? true : false);
+  const isExpression = ref<boolean>(dashboardStore.selectedGrid.metricMode === MetricModes.Expression ? true : false);
   const metrics = computed(
     () => (isExpression.value ? dashboardStore.selectedGrid.expressions : dashboardStore.selectedGrid.metrics) || [],
   );
@@ -467,7 +468,7 @@ limitations under the License. -->
     const config = dashboardStore.selectedGrid.metricTypes;
     dashboardStore.selectWidget({
       ...dashboardStore.selectedGrid,
-      metricMode: isExpression.value ? "Expression" : "General",
+      metricMode: isExpression.value ? MetricModes.Expression : MetricModes.General,
       metricTypes: backupMetricConfig.value,
     });
     backupMetricConfig.value = config;

src/views/dashboard/configuration/widget/metric/Standard.vue

@@ -97,7 +97,7 @@ limitations under the License. -->
   import { ref, watch, computed } from "vue";
   import type { PropType } from "vue";
   import { useI18n } from "vue-i18n";
-  import { SortOrder, CalculationOpts } from "../../../data";
+  import { SortOrder, CalculationOpts, MetricModes } from "../../../data";
   import { useDashboardStore } from "@/store/modules/dashboard";
   import type { MetricConfigOpt } from "@/types/dashboard";
   import { ListChartTypes, ProtocolTypes, ExpressionResultType } from "../../../data";
@@ -113,7 +113,7 @@ limitations under the License. -->
   const { t } = useI18n();
   const emit = defineEmits(["update"]);
   const dashboardStore = useDashboardStore();
-  const isExpression = ref<boolean>(dashboardStore.selectedGrid.metricMode === "Expression" ? true : false);
+  const isExpression = ref<boolean>(dashboardStore.selectedGrid.metricMode === MetricModes.Expression ? true : false);
   const currentMetric = ref<MetricConfigOpt>({
     ...props.currentMetricConfig,
     topN: props.currentMetricConfig.topN || 10,
@@ -140,7 +140,7 @@ limitations under the License. -->
   );
   const isExec = computed(() => {
     const graph = dashboardStore.selectedGrid.graph || {};
-    return dashboardStore.selectedGrid.metricMode !== "Expression" || ListChartTypes.includes(graph.type);
+    return dashboardStore.selectedGrid.metricMode === MetricModes.General || ListChartTypes.includes(graph.type);
   });
   function updateConfig(index: number, param: { [key: string]: string }) {
     const key = Object.keys(param)[0];

src/views/dashboard/controls/Widget.vue

@@ -84,6 +84,7 @@ limitations under the License. -->
   import { EntityType, ListChartTypes } from "../data";
   import type { EventParams } from "@/types/dashboard";
   import getDashboard from "@/hooks/useDashboardsSession";
+  import { MetricModes } from "../data";
 
   const props = {
     data: {
@@ -117,7 +118,7 @@ limitations under the License. -->
       }
 
       async function queryMetrics() {
-        const isExpression = props.data.metricMode === "Expression";
+        const isExpression = props.data.metricMode === MetricModes.Expression;
         const params = isExpression
           ? await useExpressionsQueryProcessor({
               metrics: props.data.expressions,

src/views/dashboard/data.ts

@@ -331,3 +331,8 @@ export const RefreshOptions = [
   { label: "Last 8 hours", value: "8", step: "HOUR" },
   { label: "Last 7 days", value: "7", step: "DAY" },
 ];
+
+export enum MetricModes {
+  Expression = "Expression",
+  General = "General",
+}

src/views/dashboard/graphs/EndpointList.vue

@@ -59,7 +59,7 @@ limitations under the License. -->
   import { useDashboardStore } from "@/store/modules/dashboard";
   import { useQueryPodsMetrics, usePodsSource } from "@/hooks/useMetricsProcessor";
   import { useExpressionsQueryPodsMetrics } from "@/hooks/useExpressionsProcessor";
-  import { EntityType } from "../data";
+  import { EntityType, MetricModes } from "../data";
   import router from "@/router";
   import getDashboard from "@/hooks/useDashboardsSession";
   import type { MetricConfigOpt } from "@/types/dashboard";
@@ -132,7 +132,7 @@ limitations under the License. -->
         merge: d.merge,
       };
     });
-    if (props.config.metricMode === "Expression") {
+    if (props.config.metricMode === MetricModes.Expression) {
       queryEndpointExpressions(currentPods);
       return;
     }

src/views/dashboard/graphs/InstanceList.vue

@@ -88,7 +88,7 @@ limitations under the License. -->
   import type { Instance } from "@/types/selector";
   import { useQueryPodsMetrics, usePodsSource } from "@/hooks/useMetricsProcessor";
   import { useExpressionsQueryPodsMetrics } from "@/hooks/useExpressionsProcessor";
-  import { EntityType } from "../data";
+  import { EntityType, MetricModes } from "../data";
   import router from "@/router";
   import getDashboard from "@/hooks/useDashboardsSession";
   import type { MetricConfigOpt } from "@/types/dashboard";
@@ -165,7 +165,7 @@ limitations under the License. -->
         attributes: d.attributes,
       };
     });
-    if (props.config.metricMode === "Expression") {
+    if (props.config.metricMode === MetricModes.Expression) {
       queryInstanceExpressions(currentInstances);
       return;
     }

src/views/dashboard/graphs/ServiceList.vue

@@ -81,7 +81,7 @@ limitations under the License. -->
   import type { Service } from "@/types/selector";
   import { useQueryPodsMetrics, usePodsSource } from "@/hooks/useMetricsProcessor";
   import { useExpressionsQueryPodsMetrics } from "@/hooks/useExpressionsProcessor";
-  import { EntityType } from "../data";
+  import { EntityType, MetricModes } from "../data";
   import router from "@/router";
   import getDashboard from "@/hooks/useDashboardsSession";
   import type { MetricConfigOpt } from "@/types/dashboard";
@@ -206,7 +206,7 @@ limitations under the License. -->
         merge: d.merge,
       };
     });
-    if (props.config.metricMode === "Expression") {
+    if (props.config.metricMode === MetricModes.Expression) {
       queryServiceExpressions(currentServices);
       return;
     }