chore(*): update eslint and run lint

Author: arashsheyda

package.json

@@ -25,7 +25,7 @@
     "@digitalroute/cz-conventional-changelog-for-jira": "^8.0.1",
     "@evilmartians/lefthook": "^1.8.1",
     "@kong/design-tokens": "1.17.3",
-    "@kong/eslint-config-kong-ui": "^1.1.2",
+    "@kong/eslint-config-kong-ui": "^1.2.8",
     "@kong/kongponents": "9.29.9",
     "@stylistic/stylelint-plugin": "^3.1.1",
     "@types/flat": "^5.0.5",
@@ -43,7 +43,7 @@
     "cross-env": "^7.0.3",
     "cypress": "^13.15.1",
     "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^9.14.0",
+    "eslint": "^9.25.1",
     "js-yaml": "^4.1.0",
     "jsdom": "^25.0.1",
     "lerna": "^8.1.8",

packages/analytics/analytics-chart/sandbox/pages/BarChartDemo.vue

@@ -238,8 +238,8 @@ enum Metrics {
 }
 
 interface MetricSelection {
-  name: Metrics,
-  unit: string,
+  name: Metrics
+  unit: string
 }
 
 // Inject the app-links from the entry file

packages/analytics/analytics-chart/sandbox/pages/DonutChartDemo.vue

@@ -54,7 +54,7 @@
       <KLabel>Dataset options</KLabel>
       <div class="dataset-options">
         <KButton
-          appearance="outline"
+          appearance="secondary"
           size="small"
           @click="addDataset()"
         >
@@ -175,8 +175,8 @@ enum Metrics {
 }
 
 interface MetricSelection {
-  name: Metrics,
-  unit: string,
+  name: Metrics
+  unit: string
 }
 
 // Inject the app-links from the entry file

packages/analytics/analytics-chart/sandbox/pages/TimeSeriesChartDemo.vue

@@ -274,8 +274,8 @@ enum Metrics {
 }
 
 interface MetricSelection {
-  name: Metrics,
-  unit: string,
+  name: Metrics
+  unit: string
 }
 
 // Inject the app-links from the entry file

packages/analytics/analytics-chart/src/components/AnalyticsChart.vue

@@ -198,7 +198,7 @@ const props = defineProps({
 })
 
 const emit = defineEmits<{
-  (e: 'zoom-time-range', newTimeRange: AbsoluteTimeRangeV4): void,
+  (e: 'zoom-time-range', newTimeRange: AbsoluteTimeRangeV4): void
 }>()
 
 const { i18n } = composables.useI18n()

packages/analytics/analytics-chart/src/components/CsvExportModal.vue

@@ -92,9 +92,9 @@ import type { CsvData, Header, TimeseriesColumn } from '../types'
 const { i18n } = composables.useI18n()
 
 const props = withDefaults(defineProps<{
-  filename: string,
-  modalDescription?: string,
-  chartData: ExploreResultV4,
+  filename: string
+  modalDescription?: string
+  chartData: ExploreResultV4
 }>(), {
   modalDescription: undefined,
 })
@@ -185,7 +185,7 @@ const tableData = computed(() => {
   ]
 
   interface AccumulatorRow {
-    [key: string]: string;
+    [key: string]: string
   }
 
   const csvHeaders: Record<string, string> = displayHeaders.reduce((accum: AccumulatorRow, h: TimeseriesColumn) => {

packages/analytics/analytics-chart/src/components/DownloadCsv.vue

@@ -17,9 +17,9 @@ import type { CsvData } from '../types'
 import VueJsonCsv from './vue-json-csv/VueJsonCsv.vue'
 
 const props = defineProps<{
-  rows: CsvData,
-  headers: Record<string, string>,
-  filename: string,
+  rows: CsvData
+  headers: Record<string, string>
+  filename: string
 }>()
 
 const fields = computed(() => Object.keys(props.headers))

packages/analytics/analytics-chart/src/components/chart-types/StackedBarChart.vue

@@ -438,6 +438,7 @@ const chartInstance = composables.useChartJSCommon(
 const maxOverflow = computed(() => {
   // Need this reactive dependency to re-compute the max overflow when the chart updates.
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-expressions
   dependsOnChartUpdate.value
 
   // ChartJS says that labels are optional, but we always provide them.

packages/analytics/analytics-chart/src/components/chart-types/TimeSeriesChart.vue

@@ -154,7 +154,7 @@ const props = defineProps({
 })
 
 const emit = defineEmits<{
-  (e: 'zoom-time-range', newTimeRange: AbsoluteTimeRangeV4): void,
+  (e: 'zoom-time-range', newTimeRange: AbsoluteTimeRangeV4): void
 }>()
 
 const verticalLinePlugin = new VerticalLinePlugin()
@@ -290,6 +290,7 @@ onUnmounted(() => {
     chartInstance.value.chart.canvas.removeEventListener('dragSelectMove', handleDragMove)
   }
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-expressions
   verticalLinePlugin
 })
 

packages/analytics/analytics-chart/src/components/vue-json-csv/VueJsonCsv.vue

@@ -20,8 +20,8 @@ import { saveAs } from 'file-saver'
 import { unparse } from 'papaparse'
 
 const emit = defineEmits<{
-  (event: 'export-started', data: CsvData): void,
-  (event: 'export-finished', data: string): void,
+  (event: 'export-started', data: CsvData): void
+  (event: 'export-finished', data: string): void
 }>()
 
 const props = defineProps({
@@ -89,7 +89,7 @@ const exportableData: ComputedRef<CsvData | null> = computed(() => {
 })
 
 // Replaces the keys in the key/value pairs with more human-readable ones (if provided)
-// eslint-disable-next-line @typescript-eslint/ban-types
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
 const labelsFunctionGenerator = (): Function => {
   const labels: any = props.labels
 
@@ -98,7 +98,7 @@ const labelsFunctionGenerator = (): Function => {
   }
 
   if (typeof labels as ValidType === ValidType.Object) {
-    // eslint-disable-next-line @typescript-eslint/ban-types
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
     return (item: Function) => {
       return mapKeys(item, (item, key) => {
         return labels[key] || key
@@ -111,7 +111,7 @@ const labelsFunctionGenerator = (): Function => {
 }
 
 // Trims each data row based, keeping only the columns (fields) passed in
-// eslint-disable-next-line @typescript-eslint/ban-types
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
 const fieldsFunctionGenerator = (): Function => {
   const fields: any = props.fields
   if (typeof props.fields as ValidType !== ValidType.Object && !Array.isArray(fields)) {
@@ -120,7 +120,7 @@ const fieldsFunctionGenerator = (): Function => {
 
   if (Array.isArray(fields)) {
     // Keep only requested object properties
-    // eslint-disable-next-line @typescript-eslint/ban-types
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
     return (item: Function) => {
       return pick(item, fields)
     }

packages/analytics/analytics-chart/src/composables/useBarChartOptions.ts

@@ -203,9 +203,9 @@ export default function useBarChartOptions(chartOptions: BarChartOptions) {
 
 declare module 'chart.js' {
   interface TooltipPositionerMap {
-    [key: string]: TooltipPositionerFunction<ChartType>;
+    [key: string]: TooltipPositionerFunction<ChartType>
   }
   interface InteractionModeMap {
-    customInteractionMode: InteractionModeFunction;
+    customInteractionMode: InteractionModeFunction
   }
 }

packages/analytics/analytics-chart/src/composables/useDonutChartOptions.ts

@@ -87,6 +87,6 @@ export default function useDonutChartOptions(chartOptions: DonutChartOptions) {
 
 declare module 'chart.js' {
   interface TooltipPositionerMap {
-    [key: string]: TooltipPositionerFunction<ChartType>;
+    [key: string]: TooltipPositionerFunction<ChartType>
   }
 }

packages/analytics/analytics-chart/src/composables/useLineChartOptions.ts

@@ -176,6 +176,6 @@ export default function useLinechartOptions(chartOptions: LineChartOptions) {
 
 declare module 'chart.js' {
   interface TooltipPositionerMap {
-    [key: string]: TooltipPositionerFunction<ChartType>;
+    [key: string]: TooltipPositionerFunction<ChartType>
   }
 }

packages/analytics/analytics-chart/src/types/chart-data.ts

@@ -5,13 +5,13 @@ import type { ExploreAggregations } from '@kong-ui-public/analytics-utilities'
 
 // Chart.js extended interfaces
 export type Dataset = ChartDataset & {
-  rawDimension: string,
-  rawMetric?: string,
-  total?: number,
-  lineTension?: number,
-  fill?: boolean,
-  isThreshold?: boolean,
-  isSegmentEmpty?: boolean,
+  rawDimension: string
+  rawMetric?: string
+  total?: number
+  lineTension?: number
+  fill?: boolean
+  isThreshold?: boolean
+  isSegmentEmpty?: boolean
 }
 
 export interface KChartData extends ChartData {
@@ -21,8 +21,8 @@ export interface KChartData extends ChartData {
 }
 
 export interface AnalyticsDataPoint {
-  x: number,
-  y: number,
+  x: number
+  y: number
 }
 
 /**
@@ -38,9 +38,9 @@ export interface AnalyticsChartColors {
 }
 
 export interface LegendValueEntry {
-  raw: number,
-  formatted: string,
-  isThreshold?: boolean,
+  raw: number
+  formatted: string
+  isThreshold?: boolean
 }
 
 /**
@@ -70,33 +70,33 @@ export interface AnalyticsChartOptions {
    * If stacked, the datasets are stacked on top of each other.
    * Applies to timeseries charts as well as bar charts.
    */
-  stacked?: boolean,
+  stacked?: boolean
   /**
    * Title to display for the metric axis
    * If not provided, show nothing
    */
-  metricAxesTitle?: string,
+  metricAxesTitle?: string
   /**
    * Title to display for the dimension axis
    * If not provided, show nothing
    */
-  dimensionAxesTitle?: string,
+  dimensionAxesTitle?: string
   /**
    * Chart dataset color palette
    */
-  chartDatasetColors?: AnalyticsChartColors | string[],
+  chartDatasetColors?: AnalyticsChartColors | string[]
   /**
    * Sort the datasets as they are displayed in the legend and tooltip
    */
-  chartLegendSortFn?: ChartLegendSortFn,
+  chartLegendSortFn?: ChartLegendSortFn
   /**
    * Sort tooltip entries
    */
-  chartTooltipSortFn?: ChartTooltipSortFn,
+  chartTooltipSortFn?: ChartTooltipSortFn
   /**
    * A static or dynamic metric threshold to be displayed on a timeseries chart
    */
-  threshold?: Record<ExploreAggregations, number>,
+  threshold?: Record<ExploreAggregations, number>
 }
 
 /**
@@ -117,23 +117,23 @@ export interface SimpleChartOptions {
   /**
    * Chart dataset color palette
    */
-  chartDatasetColors?: AnalyticsChartColors | string[],
+  chartDatasetColors?: AnalyticsChartColors | string[]
   /**
    * Determines how much detail about the metric (eg: value, info text, etc) is to be shown in the center
    */
-  metricDisplay?: SimpleChartMetricDisplay,
+  metricDisplay?: SimpleChartMetricDisplay
   /**
    * Determines whether the dataset order will be reversed
    */
-  reverseDataset?: boolean,
+  reverseDataset?: boolean
   /**
    * Determines which dataset value will be display as large text
    */
-  numerator?: number,
+  numerator?: number
   /**
    * Determines number of decimal points to display in SingleValue chart
    */
-  decimalPoints?: number,
+  decimalPoints?: number
 }
 
 export interface LegendValues {
@@ -148,8 +148,8 @@ export interface DonutChartData {
 }
 
 export interface DatasetLabel {
-  name: string,
-  id: string,
+  name: string
+  id: string
 }
 
 export interface TopNTableRecord {

packages/analytics/analytics-chart/src/types/chart-export.ts

@@ -16,8 +16,8 @@ export interface Header {
 }
 
 export interface TimeseriesColumn {
-  label: string;
-  key: string;
+  label: string
+  key: string
 }
 
 export type CsvData = CsvKeyValuePair[]