;
}>();
@@ -161,7 +161,7 @@ watch(
(model) => {
if (model) expression.value = model.expression;
},
- { immediate: true }
+ { immediate: true },
);
watch(
() => ({ expression: expression.value, errors: !!error.value }),
@@ -170,7 +170,7 @@ watch(
emit("update:modelValue", value);
}
},
- { immediate: true }
+ { immediate: true },
);
// https://github.com/surmon-china/vue-codemirror/blob/59598ff72327ab6c5ee70a640edc9e2eb2518775/src/codemirror.ts#L52
@@ -198,7 +198,7 @@ const filterTheme = computed(() => [
{ tag: t.string, color: isDark.value ? "#ff0086" : "#880000" },
{ tag: t.comment, color: isDark.value ? "#7d8799" : "#4f4f4f" },
{ tag: t.operator, color: isDark.value ? "#00a3ff" : "#333399" },
- ])
+ ]),
),
/* Theme is in tailwind.css */
EditorView.theme({}, { dark: isDark.value }),
@@ -274,7 +274,7 @@ onMounted(() => {
});
}
},
- { immediate: true }
+ { immediate: true },
);
// Dynamic extensions
@@ -286,7 +286,7 @@ onMounted(() => {
const exts = extensions.filter((e) => !!e);
if (component.view !== null) dynamicExtensions(component.view, exts);
},
- { immediate: true }
+ { immediate: true },
);
});
onBeforeUnmount(() => component.view?.destroy());
diff --git a/console/frontend/src/components/InputListBox.vue b/console/frontend/src/components/InputListBox.vue
index 1954b4fd..85978a71 100644
--- a/console/frontend/src/components/InputListBox.vue
+++ b/console/frontend/src/components/InputListBox.vue
@@ -7,7 +7,9 @@
:class="$attrs['class']"
:multiple="multiple"
:model-value="modelValue"
- @update:model-value="(selected: any) => $emit('update:modelValue', selected)"
+ @update:model-value="
+ (selected: any) => $emit('update:modelValue', selected)
+ "
>
@@ -118,7 +120,7 @@ const props = withDefaults(
filter: null,
error: "",
multiple: false,
- }
+ },
);
defineEmits<{
(e: "update:modelValue", value: typeof props.modelValue): void;
@@ -142,7 +144,7 @@ const component = computed(() =>
Options: ComboboxOptions,
Option: ComboboxOption,
Input: ComboboxInput,
- }
+ },
);
const filteredItems = computed(() => {
if (props.filter === null) return props.items;
@@ -150,7 +152,7 @@ const filteredItems = computed(() => {
query.value
.toLowerCase()
.split(/\W+/)
- .every((w) => `${it[props.filter!]}`.toLowerCase().includes(w))
+ .every((w) => `${it[props.filter!]}`.toLowerCase().includes(w)),
);
});
const otherAttrs = computed(() => {
diff --git a/console/frontend/src/components/InputTimeRange.vue b/console/frontend/src/components/InputTimeRange.vue
index 68af1814..7cb2cfbc 100644
--- a/console/frontend/src/components/InputTimeRange.vue
+++ b/console/frontend/src/components/InputTimeRange.vue
@@ -39,7 +39,7 @@ const parsedTimes = computed(() => ({
end: SugarDate.create(endTime.value),
}));
const startTimeError = computed(() =>
- isNaN(parsedTimes.value.start.valueOf()) ? "Invalid date" : ""
+ isNaN(parsedTimes.value.start.valueOf()) ? "Invalid date" : "",
);
const endTimeError = computed(
() =>
@@ -47,10 +47,10 @@ const endTimeError = computed(
(!isNaN(parsedTimes.value.start.valueOf()) &&
parsedTimes.value.start > parsedTimes.value.end &&
"End date should be before start date") ||
- ""
+ "",
);
const hasErrors = computed(
- () => !!(startTimeError.value || endTimeError.value)
+ () => !!(startTimeError.value || endTimeError.value),
);
const presets = [
@@ -127,7 +127,7 @@ watch(
endTime.value = m.end;
}
},
- { immediate: true, deep: true }
+ { immediate: true, deep: true },
);
watch(
[startTime, endTime, hasErrors] as const,
@@ -149,7 +149,7 @@ watch(
emit("update:modelValue", newModel);
}
},
- { immediate: true }
+ { immediate: true },
);
diff --git a/console/frontend/src/components/TitleProvider.vue b/console/frontend/src/components/TitleProvider.vue
index 4ad7f066..2ee280e3 100644
--- a/console/frontend/src/components/TitleProvider.vue
+++ b/console/frontend/src/components/TitleProvider.vue
@@ -21,7 +21,7 @@ const documentTitle = ref(null);
const title = computed(() =>
[applicationName, viewName.value, documentTitle.value]
.filter((k) => !!k)
- .join(" | ")
+ .join(" | "),
);
useTitle(title);
useRouter().beforeEach((to, from) => {
diff --git a/console/frontend/src/components/UserProvider.vue b/console/frontend/src/components/UserProvider.vue
index c17b5c8b..f9e52980 100644
--- a/console/frontend/src/components/UserProvider.vue
+++ b/console/frontend/src/components/UserProvider.vue
@@ -33,7 +33,7 @@ watch(
execute(false);
}
},
- { immediate: true }
+ { immediate: true },
);
provide(UserKey, {
diff --git a/console/frontend/src/utils/palette.ts b/console/frontend/src/utils/palette.ts
index 07d7e5a3..df1b2ad1 100644
--- a/console/frontend/src/utils/palette.ts
+++ b/console/frontend/src/utils/palette.ts
@@ -75,8 +75,8 @@ const orderedColors = ["blue", "orange", "aqua", "green", "magenta"] as const;
const darkPalette = [5, 6, 7, 8, 9, 10]
.map((idx) =>
orderedColors.map(
- (colorName: keyof typeof colors) => colors[colorName][idx]
- )
+ (colorName: keyof typeof colors) => colors[colorName][idx],
+ ),
)
.flat();
const lightPalette = [5, 4, 3, 2, 1, 0]
@@ -90,13 +90,13 @@ const lightenColor = (color: string, amount: number) =>
(
"0" +
Math.min(255, Math.max(0, parseInt(color, 16) + amount)).toString(16)
- ).slice(-2)
+ ).slice(-2),
);
export function dataColor(
index: number,
alternate = false,
- theme: "light" | "dark" = "light"
+ theme: "light" | "dark" = "light",
) {
const palette = theme === "light" ? lightPalette : darkPalette;
const correctedIndex = index % 2 === 0 ? index : index + orderedColors.length;
@@ -110,7 +110,7 @@ export function dataColor(
export function dataColorGrey(
index: number,
alternate = false,
- theme: "light" | "dark" = "light"
+ theme: "light" | "dark" = "light",
) {
const palette =
theme === "light"
diff --git a/console/frontend/src/views/DocumentationPage.vue b/console/frontend/src/views/DocumentationPage.vue
index de2d47ff..12a79fda 100644
--- a/console/frontend/src/views/DocumentationPage.vue
+++ b/console/frontend/src/views/DocumentationPage.vue
@@ -100,7 +100,7 @@ const errorMessage = computed(
data.value &&
"message" in data.value &&
(data.value.message || `Server returned an error: ${error.value}`)) ||
- ""
+ "",
);
const markdown = computed(
() =>
@@ -108,11 +108,11 @@ const markdown = computed(
data.value &&
"markdown" in data.value &&
data.value.markdown) ||
- ""
+ "",
);
const toc = computed(
() =>
- (!error.value && data.value && "toc" in data.value && data.value.toc) || []
+ (!error.value && data.value && "toc" in data.value && data.value.toc) || [],
);
const activeDocument = computed(() => props.id || null);
const activeSlug = useRouteHash();
@@ -133,7 +133,7 @@ watch([markdown, activeSlug] as const, async () => {
(activeSlug.value &&
(
document.querySelector(
- `#${CSS.escape(activeSlug.value.slice(1))}`
+ `#${CSS.escape(activeSlug.value.slice(1))}`,
) as HTMLElement | null
)?.offsetTop) ||
0;
diff --git a/console/frontend/src/views/HomePage.vue b/console/frontend/src/views/HomePage.vue
index d4aefd84..e52d1296 100644
--- a/console/frontend/src/views/HomePage.vue
+++ b/console/frontend/src/views/HomePage.vue
@@ -58,7 +58,7 @@ import { ServerConfigKey } from "@/components/ServerConfigProvider.vue";
const serverConfiguration = inject(ServerConfigKey)!;
const topWidgets = computed(
- () => serverConfiguration.value?.homepageTopWidgets ?? []
+ () => serverConfiguration.value?.homepageTopWidgets ?? [],
);
const widgetTitle = (name: string) =>
({
@@ -71,7 +71,7 @@ const widgetTitle = (name: string) =>
etype: "IPv4/IPv6",
"src-port": "Top source ports",
"dst-port": "Top destination ports",
- }[name] ?? "???");
+ })[name] ?? "???";
const refreshOften = useInterval(10_000);
const refreshOccasionally = useInterval(60_000);
diff --git a/console/frontend/src/views/HomePage/WidgetFlowRate.vue b/console/frontend/src/views/HomePage/WidgetFlowRate.vue
index ad6b83d8..ba901826 100644
--- a/console/frontend/src/views/HomePage/WidgetFlowRate.vue
+++ b/console/frontend/src/views/HomePage/WidgetFlowRate.vue
@@ -22,7 +22,7 @@ const props = withDefaults(
}>(),
{
refresh: 0,
- }
+ },
);
const url = computed(() => `/api/v0/console/widget/flow-rate?${props.refresh}`);
diff --git a/console/frontend/src/views/HomePage/WidgetGraph.vue b/console/frontend/src/views/HomePage/WidgetGraph.vue
index 7bcbd000..0d501300 100644
--- a/console/frontend/src/views/HomePage/WidgetGraph.vue
+++ b/console/frontend/src/views/HomePage/WidgetGraph.vue
@@ -36,7 +36,7 @@ const props = withDefaults(
}>(),
{
refresh: 0,
- }
+ },
);
type ECOption = ComposeOption<
@@ -95,6 +95,6 @@ const option = computed(
: data.value.data.map(({ t, gbps }) => [t, gbps]).slice(0, -1),
},
],
- })
+ }),
);
diff --git a/console/frontend/src/views/HomePage/WidgetLastFlow.vue b/console/frontend/src/views/HomePage/WidgetLastFlow.vue
index c2128b9c..c67066e2 100644
--- a/console/frontend/src/views/HomePage/WidgetLastFlow.vue
+++ b/console/frontend/src/views/HomePage/WidgetLastFlow.vue
@@ -28,7 +28,7 @@ const props = withDefaults(
defineProps<{
refresh?: number;
}>(),
- { refresh: 0 }
+ { refresh: 0 },
);
const url = computed(() => `/api/v0/console/widget/flow-last?${props.refresh}`);
@@ -37,7 +37,7 @@ const { data } = useFetch(url, { refetch: true })
.json>();
const lastFlow = computed((): [string, string | number][] => ({
...Object.entries(data.value || {}).sort(([f1], [f2]) =>
- compareFields(f1, f2)
+ compareFields(f1, f2),
),
}));
diff --git a/console/frontend/src/views/HomePage/WidgetTop.vue b/console/frontend/src/views/HomePage/WidgetTop.vue
index 586986ba..7aa5a489 100644
--- a/console/frontend/src/views/HomePage/WidgetTop.vue
+++ b/console/frontend/src/views/HomePage/WidgetTop.vue
@@ -44,7 +44,7 @@ type ECOption = ComposeOption<
>;
const url = computed(
- () => `/api/v0/console/widget/top/${props.what}?${props.refresh}`
+ () => `/api/v0/console/widget/top/${props.what}?${props.refresh}`,
);
const { data } = useFetch(url, { refetch: true })
.get()
@@ -98,9 +98,9 @@ const options = computed(
100 -
(data.value?.top || []).reduce(
(c, n) => c + n.percent,
- 0
+ 0,
),
- 0
+ 0,
),
},
].filter(({ value }) => value > 0.05),
@@ -115,6 +115,6 @@ const options = computed(
},
},
],
- })
+ }),
);
diff --git a/console/frontend/src/views/VisualizePage.vue b/console/frontend/src/views/VisualizePage.vue
index b29c23b7..603a6bbd 100644
--- a/console/frontend/src/views/VisualizePage.vue
+++ b/console/frontend/src/views/VisualizePage.vue
@@ -109,7 +109,7 @@ const decodeState = (serialized: string | undefined): ModelType => {
const encodeState = (state: ModelType) => {
if (state === null) return "";
return LZString.compressToBase64(
- JSON.stringify(state, Object.keys(state).sort())
+ JSON.stringify(state, Object.keys(state).sort()),
);
};
watch(
@@ -120,7 +120,7 @@ watch(
state.value = newState;
}
},
- { immediate: true }
+ { immediate: true },
);
const encodedState = computed(() => encodeState(state.value));
@@ -133,7 +133,7 @@ const orderedJSONPayload = >(input: T): T => {
.sort()
.reduce(
(o, k) => ((o[k] = input[k]), o),
- {} as { [key: string]: any }
+ {} as { [key: string]: any },
) as T;
};
const jsonPayload = computed(
@@ -163,7 +163,7 @@ const jsonPayload = computed(
};
return orderedJSONPayload(input);
}
- }
+ },
);
const request = ref(null); // Same as state, but once request is successful
const { data, execute, isFetching, aborted, abort, canAbort, error } = useFetch(
@@ -191,7 +191,7 @@ const { data, execute, isFetching, aborted, abort, canAbort, error } = useFetch(
};
},
async afterFetch(
- ctx: AfterFetchContext
+ ctx: AfterFetchContext,
) {
// Update data. Not done in a computed value as we want to keep the
// previous data in case of errors.
@@ -199,7 +199,7 @@ const { data, execute, isFetching, aborted, abort, canAbort, error } = useFetch(
if (data === null || !state.value) return ctx;
console.groupCollapsed("SQL query");
console.info(
- response.headers.get("x-sql-query")?.replace(/ {2}( )*/g, "\n$1")
+ response.headers.get("x-sql-query")?.replace(/ {2}( )*/g, "\n$1"),
);
console.groupEnd();
if (state.value.graphType === "sankey") {
@@ -239,7 +239,7 @@ const { data, execute, isFetching, aborted, abort, canAbort, error } = useFetch(
return ctx;
},
immediate: false,
- }
+ },
)
.post(jsonPayload, "json")
.json<
diff --git a/console/frontend/src/views/VisualizePage/DataGraphLine.vue b/console/frontend/src/views/VisualizePage/DataGraphLine.vue
index dc5c33da..cb2c44b6 100644
--- a/console/frontend/src/views/VisualizePage/DataGraphLine.vue
+++ b/console/frontend/src/views/VisualizePage/DataGraphLine.vue
@@ -93,7 +93,7 @@ const graph = computed((): ECOption => {
// Unfortunately, eCharts does not seem to make it easy
// to inverse an axis and put the result below. Therefore,
// we use negative values for the second axis.
- (row, rowIdx) => row[timeIdx] * (data.axis[rowIdx] % 2 ? 1 : -1)
+ (row, rowIdx) => row[timeIdx] * (data.axis[rowIdx] % 2 ? 1 : -1),
),
];
if (data.graphType === "stacked100") {
@@ -101,11 +101,11 @@ const graph = computed((): ECOption => {
const [, ...values] = result;
const positiveSum = values.reduce(
(prev, cur) => (cur > 0 ? prev + cur : prev),
- 0
+ 0,
);
const negativeSum = values.reduce(
(prev, cur) => (cur < 0 ? prev + cur : prev),
- 0
+ 0,
);
result = [
t,
@@ -114,7 +114,7 @@ const graph = computed((): ECOption => {
? v / positiveSum
: v < 0 && negativeSum < 0
? -v / negativeSum
- : v
+ : v,
),
];
}
@@ -210,13 +210,13 @@ const graph = computed((): ECOption => {
``,
`| ${row.marker} ${row.seriesName} | `,
`${data.bidirectional ? "↑" : ""}${formatXps(
- row.up
+ row.up,
)} | `,
data.bidirectional
? `↓${formatXps(row.down)} | `
: "",
`
`,
- ].join("")
+ ].join(""),
)
.join("");
return `${
@@ -324,7 +324,7 @@ const graph = computed((): ECOption => {
}
if (data.graphType === "grid") {
const uniqRows = uniqWith(data.rows, isEqual).filter((row) =>
- row.some((name) => name !== "Other")
+ row.some((name) => name !== "Other"),
),
uniqRowIndex = (row: string[]) =>
findIndex(uniqRows, (orow) => isEqual(row, orow)),
@@ -338,9 +338,9 @@ const graph = computed((): ECOption => {
const [, ...cdr] = row;
return fn.apply(
null,
- cdr.filter((_, idx) => !otherIndexes.includes(idx + 1))
+ cdr.filter((_, idx) => !otherIndexes.includes(idx + 1)),
);
- })
+ }),
),
maxY = somethingY(Math.max),
minY = somethingY(Math.min);
@@ -454,7 +454,7 @@ const updateTimeRange = (evt: BrushModel) => {
return;
}
const [start, end] = evt.areas[0].coordRange.map(
- (t) => new Date(t as number)
+ (t) => new Date(t as number),
);
chartComponent.value.dispatchAction({
type: "brush",
@@ -472,6 +472,6 @@ watch(
type: "highlight",
seriesIndex: index,
});
- }
+ },
);
diff --git a/console/frontend/src/views/VisualizePage/DataGraphSankey.vue b/console/frontend/src/views/VisualizePage/DataGraphSankey.vue
index 45603efe..3d3e076e 100644
--- a/console/frontend/src/views/VisualizePage/DataGraphSankey.vue
+++ b/console/frontend/src/views/VisualizePage/DataGraphSankey.vue
@@ -54,7 +54,7 @@ const option = computed((): ECOption => {
marker,
`${nodeData.name}`,
`${formatXps(
- value.valueOf() as number
+ value.valueOf() as number,
)}`,
].join("");
} else if (dataType === "edge") {
@@ -69,7 +69,7 @@ const option = computed((): ECOption => {
? [
`${source} → ${target}`,
`${formatXps(
- value.valueOf() as number
+ value.valueOf() as number,
)}`,
].join("")
: "";
diff --git a/console/frontend/src/views/VisualizePage/DataTable.vue b/console/frontend/src/views/VisualizePage/DataTable.vue
index ff22237f..ced53c9a 100644
--- a/console/frontend/src/views/VisualizePage/DataTable.vue
+++ b/console/frontend/src/views/VisualizePage/DataTable.vue
@@ -116,7 +116,7 @@ const highlight = (index: number | null) => {
(() => {
let count = 0;
return (_, idx) => axis[idx] != displayedAxis.value || count++ < index;
- })()
+ })(),
).length;
emit("highlighted", originalIndex);
};
@@ -221,6 +221,6 @@ const table = computed(
};
}
return null;
- }
+ },
);
diff --git a/console/frontend/src/views/VisualizePage/OptionsPanel.vue b/console/frontend/src/views/VisualizePage/OptionsPanel.vue
index 8ecd4f58..8ab492d8 100644
--- a/console/frontend/src/views/VisualizePage/OptionsPanel.vue
+++ b/console/frontend/src/views/VisualizePage/OptionsPanel.vue
@@ -146,7 +146,7 @@ const props = withDefaults(
}>(),
{
loading: false,
- }
+ },
);
const emit = defineEmits<{
(e: "update:modelValue", value: typeof props.modelValue): void;
@@ -217,7 +217,7 @@ const options = computed((): InternalModelType => {
const applyLabel = computed(() =>
isEqual(options.value, omit(props.modelValue, ["start", "end"]))
? "Refresh"
- : "Apply"
+ : "Apply",
);
const hasErrors = computed(
() =>
@@ -225,7 +225,7 @@ const hasErrors = computed(
timeRange.value?.errors ||
dimensions.value?.errors ||
filter.value?.errors
- )
+ ),
);
const serverConfiguration = inject(ServerConfigKey)!;
@@ -281,7 +281,7 @@ watch(
submitOptions(true);
}
},
- { immediate: true, deep: true }
+ { immediate: true, deep: true },
);
diff --git a/console/frontend/src/views/VisualizePage/RequestSummary.vue b/console/frontend/src/views/VisualizePage/RequestSummary.vue
index d06b4a70..7893faa2 100644
--- a/console/frontend/src/views/VisualizePage/RequestSummary.vue
+++ b/console/frontend/src/views/VisualizePage/RequestSummary.vue
@@ -67,7 +67,7 @@ import { TitleKey } from "@/components/TitleProvider.vue";
const props = defineProps<{ request: ModelType }>();
const start = computed(() =>
- props.request ? SugarDate(props.request.start).long() : null
+ props.request ? SugarDate(props.request.start).long() : null,
);
const end = computed(() => {
if (props.request === null) return null;
@@ -75,7 +75,7 @@ const end = computed(() => {
SugarDate(props.request.start).toDateString().raw ===
SugarDate(props.request.end).toDateString().raw
? "%X"
- : "{long}"
+ : "{long}",
);
});
@@ -90,7 +90,7 @@ const computedTitle = computed(() =>
end.value,
]
.filter((e) => !!e)
- .join(" · ")
+ .join(" · "),
);
watch(computedTitle, (t) => title.set(t));