fix: ESLint issues (#387)

Also add action to test on each PR

Author: praveen5959

.github/workflows/prettier.yaml

@@ -1,13 +1,21 @@
 name: Continuous Integration
 
-on: pull_request
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
 
 jobs:
   prettier:
+    timeout-minutes: 60
     runs-on: ubuntu-latest
-
     steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-      - name: Prettify code
-        uses: creyD/[email protected]
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+      - name: Install dependencies
+        run: npm install -g pnpm && pnpm install
+      - name: Run ESLint
+        run: pnpm run lint

package.json

@@ -7,7 +7,7 @@
 		"dev": "vite --host --port 3001",
 		"build": "tsc && vite build",
 		"build:test": "tsc && vite build --mode test",
-		"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+		"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --quiet",
 		"start": "vite preview --host --port 3002",
 		"tsCheck": "tsc --noEmit",
 		"pq": "pretty-quick",

src/@types/parseable/api/dashboards.ts

@@ -44,11 +44,11 @@ export type TickConfig = {
 export type Visualization = {
 	visualization_type: VizType;
 	size: TileSize;
-	circular_chart_config?: null | { name_key: string; value_key: string } | {};
+	circular_chart_config?: null | { name_key: string; value_key: string } | object;
 	graph_config?:
 		| null
 		| { x_key: string; y_keys: string[]; type: CommonGraphBasicType; orientation: CommonGraphOrientationType }
-		| {};
+		| object;
 	color_config: ColorConfig[];
 	tick_config: TickConfig[];
 };
@@ -116,9 +116,9 @@ export type BarChartBasicTypes = 'default' | 'stacked' | 'percent';
 export type AreaChartBasicTypes = 'default' | 'stacked' | 'percent';
 
 // orientation
-export type BarChartOrientationType = 'horizontal' | 'vertical'
-export type AreaChartOrientationType =  'horizontal' | 'vertical'
-export type LineChartOrientationType =  'horizontal' | 'vertical'
+export type BarChartOrientationType = 'horizontal' | 'vertical';
+export type AreaChartOrientationType = 'horizontal' | 'vertical';
+export type LineChartOrientationType = 'horizontal' | 'vertical';
 
 export type BarChartProps = {
 	data: TileData;
@@ -137,7 +137,7 @@ export type LineChartProps = {
 	xUnit: UnitType;
 	yUnit: UnitType;
 	orientation: LineChartOrientationType;
-}
+};
 
 export type AreaChartProps = {
 	data: TileData;

src/@types/parseable/api/stream.ts

@@ -53,7 +53,7 @@ export type HotTierConfig =
 			available_size: string;
 			oldest_date_time_entry: string;
 	  }
-	| {};
+	| object;
 
 export type UpdateHotTierConfig = {
 	size: string;

src/api/auth.ts

@@ -13,4 +13,4 @@ export const loginIn = (username: string, password: string) => {
 
 export const logOut = () => {
 	return Axios().get(LOGOUT_URL);
-}
+};

src/api/constants.ts

@@ -2,7 +2,7 @@ import _ from 'lodash';
 
 const API_V1 = 'api/v1';
 
-export type Params = Record<string, string> | null | {} | undefined;
+export type Params = Record<string, string> | null | object | undefined;
 
 const parseParamsToQueryString = (params: Params) => {
 	if (_.isEmpty(params) || _.isNil(params) || !params) return '';
@@ -20,7 +20,7 @@ const parseParamsToQueryString = (params: Params) => {
 // Streams Management
 export const LOG_STREAM_LIST_URL = `${API_V1}/logstream`;
 export const LOG_STREAMS_SCHEMA_URL = (streamName: string) => `${LOG_STREAM_LIST_URL}/${streamName}/schema`;
-export const LOG_QUERY_URL = (params?: Params, resourcePath: string = 'query') =>
+export const LOG_QUERY_URL = (params?: Params, resourcePath = 'query') =>
 	`${API_V1}/${resourcePath}` + parseParamsToQueryString(params);
 export const LOG_STREAMS_ALERTS_URL = (streamName: string) => `${LOG_STREAM_LIST_URL}/${streamName}/alert`;
 export const LIST_SAVED_FILTERS_URL = `${API_V1}/filters`;

src/api/query.ts

@@ -1,4 +1,3 @@
-import _ from 'lodash';
 import { Axios } from './axios';
 import { LOG_QUERY_URL } from './constants';
 import { Log, LogsQuery, LogsResponseWithHeaders } from '@/@types/parseable/api/query';

src/assets/customLoader/ParseableAnimate.tsx

@@ -57,4 +57,6 @@ const ParseableAnimated: MantineLoaderComponent = forwardRef(() => (
 	</svg>
 ));
 
+ParseableAnimated.displayName = 'ParsableAnimated';
+
 export default ParseableAnimated;

src/components/Header/RefreshInterval.tsx

@@ -12,7 +12,7 @@ import { appStoreReducers, useAppStore } from '@/layouts/MainLayout/providers/Ap
 const { setRefreshInterval, getCleanStoreForRefetch } = logsStoreReducers;
 const { syncTimeRange } = appStoreReducers;
 const RefreshInterval: FC = () => {
-	const [, setAppStore] = useAppStore((_store) => null);
+	const [, setAppStore] = useAppStore(() => null);
 	const [refreshInterval, setLogsStore] = useLogsStore((store) => store.refreshInterval);
 	const Icon = useMemo(() => (refreshInterval ? IconRefresh : IconRefreshOff), [refreshInterval]);
 	const timerRef = useRef<NodeJS.Timer | null>(null);

src/components/Header/RefreshNow.tsx

@@ -11,8 +11,8 @@ const { syncTimeRange } = appStoreReducers;
 const renderRefreshIcon = () => <IconReload size={px('1rem')} stroke={1.5} />;
 
 const RefreshNow: FC = () => {
-	const [, setLogsStore] = useLogsStore((_store) => null);
-	const [, setAppStore] = useAppStore((_store) => null);
+	const [, setLogsStore] = useLogsStore(() => null);
+	const [, setAppStore] = useAppStore(() => null);
 
 	const onRefresh = useCallback(() => {
 		setAppStore((store) => syncTimeRange(store));