Fixed few ESLint issues

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

@@ -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/api/auth.ts

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

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));

src/components/Header/TimeRange.tsx

@@ -43,7 +43,7 @@ const RelativeTimeIntervals = (props: {
 
 const TimeRange: FC = () => {
 	const [timeRange, setAppStore] = useAppStore((store) => store.timeRange);
-	const [, setLogStore] = useLogsStore((_store) => null);
+	const [, setLogStore] = useLogsStore(() => null);
 	const { label, shiftInterval, interval, startTime, endTime, type } = timeRange;
 	const handleOuterClick = useCallback((event: any) => {
 		const targetClassNames: string[] = event.target?.classList || [];
@@ -204,7 +204,7 @@ function isDateInRange(startDate: Date, endDate: Date, currentDate: Date) {
 }
 
 const CustomTimeRange: FC<CustomTimeRangeProps> = ({ setOpened, resetToRelative }) => {
-	const [, setLogStore] = useLogsStore((_store) => null);
+	const [, setLogStore] = useLogsStore(() => null);
 	const [{ startTime: startTimeFromStore, endTime: endTimeFromStore, type }, setAppStore] = useAppStore(
 		(store) => store.timeRange,
 	);

src/components/Navbar/index.tsx

@@ -202,7 +202,9 @@ const Navbar: FC = () => {
 									? toggleUserModal
 									: navAction.key === 'logout'
 									? signOutHandler
-									: () => {};
+									: () => {
+											return;
+									  };
 							return (
 								<Stack
 									className={`${styles.navItemContainer} ${isActiveItem && styles.navItemActive}`}

src/components/Navbar/rolesHandler.ts

@@ -72,9 +72,9 @@ const getStreamsSepcificAccess = (rolesWithRoleName: UserRoles | null, stream?:
 		return null;
 	}
 
-	let access: string[] = [];
+	const access: string[] = [];
 	let roles: any[] = [];
-	for (var prop in rolesWithRoleName) {
+	for (const prop in rolesWithRoleName) {
 		roles = [...roles, ...rolesWithRoleName[prop]];
 	}
 	roles.forEach((role: any) => {
@@ -121,7 +121,7 @@ const getStreamsSepcificAccess = (rolesWithRoleName: UserRoles | null, stream?:
 const getUserSepcificStreams = (rolesWithRoleName: object[], streams: any[]) => {
 	let userStreams: any[] = [];
 	let roles: any[] = [];
-	for (var prop in rolesWithRoleName) {
+	for (const prop in rolesWithRoleName) {
 		roles = [...roles, ...(rolesWithRoleName[prop] as any)];
 	}
 	roles.forEach((role: any) => {

src/constants/theme.ts

@@ -12,4 +12,4 @@ export const DASHBOARDS_SIDEBAR_WIDTH = 200;
 export const DASHBOARD_TOOLBAR_HEIGHT = 50;
 export const JSON_VIEW_TOOLBAR_HEIGHT = 50;
 export const LOGS_CONFIG_SIDEBAR_WIDTH = 200;
-export const LOGS_FOOTER_HEIGHT = 50;
+export const LOGS_FOOTER_HEIGHT = 50;

src/hooks/useAlertsEditor.tsx

@@ -6,7 +6,7 @@ import { useStreamStore, streamStoreReducers } from '@/pages/Stream/providers/St
 const { setAlertsConfig } = streamStoreReducers;
 
 const useAlertsQuery = (streamName: string, hasAlertsAccess: boolean, isStandAloneMode: boolean | null) => {
-	const [, setStreamStore] = useStreamStore((_store) => null);
+	const [, setStreamStore] = useStreamStore(() => null);
 	const { data, isError, isSuccess, isLoading, refetch } = useQuery(
 		['fetch-log-stream-alert', streamName, hasAlertsAccess],
 		() => getLogStreamAlerts(streamName),

src/hooks/useCacheToggle.tsx

@@ -6,7 +6,7 @@ import { useStreamStore, streamStoreReducers } from '@/pages/Stream/providers/St
 const { setCacheEnabled } = streamStoreReducers;
 
 export const useCacheToggle = (streamName: string) => {
-	const [, setStreamStore] = useStreamStore((_store) => null);
+	const [, setStreamStore] = useStreamStore(() => null);
 	const {
 		data: checkCacheData,
 		refetch: getCacheStatusRefetch,

src/hooks/useClusterInfo.ts

@@ -8,7 +8,7 @@ import { useClusterStore, clusterStoreReducers } from '@/pages/Systems/providers
 const { setIngestorMachines, setCurrentMachineData } = clusterStoreReducers;
 
 export const useClusterInfo = () => {
-	const [, setClusterStore] = useClusterStore((_store) => null);
+	const [, setClusterStore] = useClusterStore(() => null);
 	const {
 		data: clusterInfoData,
 		isError: getClusterInfoError,

src/hooks/useDashboards.tsx

@@ -154,7 +154,7 @@ export const useTileQuery = (opts: {
 	onSuccess?: (data: TileQueryResponse) => void;
 	enabled?: boolean;
 }) => {
-	const [, setDashboardsStore] = useDashboardsStore((_store) => null);
+	const [, setDashboardsStore] = useDashboardsStore(() => null);
 	const { query, startTime, endTime, tileId, enabled = true } = opts;
 	const { isLoading, isFetching, isError, refetch } = useQuery(
 		[tileId, startTime, endTime],

src/hooks/useGetLogStreamSchema.ts

@@ -1,15 +1,14 @@
 import { getLogStreamSchema } from '@/api/logStream';
 import { useStreamStore, streamStoreReducers } from '@/pages/Stream/providers/StreamProvider';
 import { AxiosError, isAxiosError } from 'axios';
-import _ from 'lodash';
 import { useQuery } from 'react-query';
 import { useState } from 'react';
 
 const { setStreamSchema } = streamStoreReducers;
 
 export const useGetStreamSchema = (opts: { streamName: string }) => {
 	const { streamName } = opts;
-	const [, setStreamStore] = useStreamStore((_store) => null);
+	const [, setStreamStore] = useStreamStore(() => null);
 	const [errorMessage, setErrorMesssage] = useState<string | null>(null);
 
 	const { isError, isSuccess, isLoading, refetch, isRefetching } = useQuery(

src/hooks/useGetStreamInfo.tsx

@@ -7,7 +7,7 @@ import { useQuery } from 'react-query';
 const { setStreamInfo } = streamStoreReducers;
 
 export const useGetStreamInfo = (currentStream: string, initialFetch: boolean) => {
-	const [, setStreamStore] = useStreamStore((_store) => null);
+	const [, setStreamStore] = useStreamStore(() => null);
 	const {
 		data: getStreamInfoData,
 		isError: getStreamInfoError,

src/hooks/useLogStreamStats.tsx

@@ -8,7 +8,7 @@ import { AxiosError, isAxiosError } from 'axios';
 const { setStats } = streamStoreReducers;
 
 export const useLogStreamStats = (streamName: string, fetchStartTime?: Dayjs) => {
-	const [, setStreamStore] = useStreamStore((_store) => null);
+	const [, setStreamStore] = useStreamStore(() => null);
 	const {
 		data: getLogStreamStatsData,
 		isSuccess: getLogStreamStatsDataIsSuccess,

src/hooks/useLoginForm.ts

@@ -9,13 +9,13 @@ import { HOME_ROUTE } from '@/constants/routes';
 import { useId } from '@mantine/hooks';
 import { useEffect } from 'react';
 import Cookies from 'js-cookie';
-import { getQueryParam } from '@/utils';
+import { useGetQueryParam } from '@/utils';
 import { isAxiosError } from 'axios';
 import _ from 'lodash';
 
 export const useLoginForm = () => {
 	const notificationId = useId();
-	const queryParams = getQueryParam();
+	const queryParams = useGetQueryParam();
 	const [loading, setLoading] = useMountedState(false);
 	const [error, setError] = useMountedState<string | null>(null);
 	const auth = Cookies.get('session');

src/hooks/useQueryResult.tsx

@@ -60,7 +60,7 @@ export const useFetchCount = () => {
 	const { setTotalCount } = logsStoreReducers;
 	const [custQuerySearchState] = useLogsStore((store) => store.custQuerySearchState);
 	const [timeRange] = useAppStore((store) => store.timeRange);
-	const [, setLogsStore] = useLogsStore((_store) => null);
+	const [, setLogsStore] = useLogsStore(() => null);
 	const { isQuerySearchActive, custSearchQuery, activeMode } = custQuerySearchState;
 	const [appliedQuery] = useFilterStore((store) => store.appliedQuery);
 

src/hooks/useRetentionEditor.tsx

@@ -8,7 +8,7 @@ import _ from 'lodash';
 const { setRetention } = streamStoreReducers;
 
 export const useRetentionQuery = (streamName: string, hasSettingsAccess: boolean) => {
-	const [, setStreamStore] = useStreamStore((_store) => null);
+	const [, setStreamStore] = useStreamStore(() => null);
 	const {
 		data: getLogRetentionData,
 		isError: getLogRetentionIsError,

src/hooks/useSavedFilters.tsx

@@ -10,8 +10,8 @@ const { setSavedFilters } = appStoreReducers;
 const { updateSavedFilterId } = logsStoreReducers;
 
 const useSavedFiltersQuery = () => {
-	const [, setAppStore] = useAppStore((_store) => null);
-	const [, setLogsStore] = useLogsStore((_store) => null);
+	const [, setAppStore] = useAppStore(() => null);
+	const [, setLogsStore] = useLogsStore(() => null);
 	const { isError, isSuccess, isLoading, refetch, isRefetching } = useQuery(
 		['saved-filters'],
 		() => getSavedFilters(),

src/pages/Dashboards/CreateDashboardModal.tsx

@@ -29,7 +29,7 @@ const useDashboardForm = (opts: FormOpts) => {
 		initialValues: opts,
 		validate: {
 			name: (val) => (_.isEmpty(val) ? 'Name cannot be empty' : null),
-			description: (_val) => null,
+			description: () => null,
 		},
 		validateInputOnChange: true,
 		validateInputOnBlur: true,

src/pages/Dashboards/Dashboard.tsx

@@ -254,7 +254,7 @@ const ImportDashboardModal = () => {
 };
 
 const NoDashboardsView = () => {
-	const [, setDashboardsStore] = useDashboardsStore((_store) => null);
+	const [, setDashboardsStore] = useDashboardsStore(() => null);
 
 	const openCreateDashboardModal = useCallback(() => {
 		setDashboardsStore((store) => toggleCreateDashboardModal(store, true));
@@ -289,7 +289,7 @@ const NoDashboardsView = () => {
 };
 
 const NoTilesView = () => {
-	const [, setDashbaordsStore] = useDashboardsStore((_store) => null);
+	const [, setDashbaordsStore] = useDashboardsStore(() => null);
 
 	const openCreateTileModal = useCallback(() => {
 		setDashbaordsStore((store) => toggleCreateTileModal(store, true));

src/pages/Dashboards/SideBar.tsx

@@ -68,7 +68,7 @@ const DashboardList = (props: { updateTimeRange: (dashboard: Dashboard) => void
 const renderShareIcon = () => <IconFileDownload size={px('1rem')} stroke={1.5} />;
 
 const ImportDashboardButton = () => {
-	const [_store, setDashbaordsStore] = useDashboardsStore((_store) => null);
+	const [, setDashbaordsStore] = useDashboardsStore(() => null);
 	const onClick = useCallback(() => {
 		setDashbaordsStore((store) => toggleImportDashboardModal(store, true));
 	}, []);

src/pages/Dashboards/Table.tsx

@@ -59,7 +59,7 @@ const TableViz = (props: { data: TileQueryResponse; tick_config: TickConfig[] })
 
 	return (
 		<Stack ref={containerRef} style={{ flex: 1, width: '100%' }}>
-			<Stack style={{ height: initialHeight }} className='png-export-table-container'>
+			<Stack style={{ height: initialHeight }} className="png-export-table-container">
 				{hasNoData ? (
 					<NoDataView />
 				) : (

src/pages/Dashboards/Tile.tsx

@@ -165,7 +165,7 @@ function TileControls(props: { tile: TileType; data: TileQueryResponse }) {
 	} = props;
 	const { records = [], fields = [] } = data;
 	const [allowDrag] = useDashboardsStore((store) => store.allowDrag);
-	const [, setDashboardsStore] = useDashboardsStore((_store) => null);
+	const [, setDashboardsStore] = useDashboardsStore(() => null);
 
 	const exportPng = useCallback(() => {
 		handleCapture({ className: makeExportClassName(tile_id), fileName: name });

src/pages/Dashboards/Toolbar.tsx

@@ -77,7 +77,7 @@ const EditLayoutButton = (props: { layoutRef: React.MutableRefObject<ReactGridLa
 };
 
 const AddTileButton = () => {
-	const [, setDashbaordsStore] = useDashboardsStore((_store) => null);
+	const [, setDashbaordsStore] = useDashboardsStore(() => null);
 
 	const onClick = useCallback(() => {
 		setDashbaordsStore((store) => toggleCreateTileModal(store, true));
@@ -97,7 +97,7 @@ const AddTileButton = () => {
 };
 
 const ImportTileButton = () => {
-	const [, setDashbaordsStore] = useDashboardsStore((_store) => null);
+	const [, setDashbaordsStore] = useDashboardsStore(() => null);
 
 	const onClick = useCallback(() => {
 		setDashbaordsStore((store) => toggleImportTileModal(store, true));
@@ -157,7 +157,7 @@ const renderDeleteIcon = () => <IconTrash size={px('1rem')} stroke={1.5} />;
 const renderShareIcon = () => <IconShare size={px('1rem')} stroke={1.5} />;
 
 const DeleteDashboardButton = () => {
-	const [_store, setDashbaordsStore] = useDashboardsStore((_store) => null);
+	const [, setDashbaordsStore] = useDashboardsStore(() => null);
 	const onClick = useCallback(() => setDashbaordsStore((store) => toggleDeleteDashboardModal(store, true)), []);
 	return <IconButton renderIcon={renderDeleteIcon} size={36} onClick={onClick} tooltipLabel="Delete Dashboard" />;
 };

src/pages/Dashboards/VizEditorModal.tsx

@@ -604,7 +604,7 @@ const Config = (props: { form: TileFormType }) => {
 const VizEditorModal = (props: { form: TileFormType }) => {
 	const { form } = props;
 	const [vizEditorModalOpen] = useDashboardsStore((store) => store.vizEditorModalOpen);
-	const [, setDashboardStore] = useDashboardsStore((_store) => null);
+	const [, setDashboardStore] = useDashboardsStore(() => null);
 	const closeVizModal = useCallback(() => {
 		setDashboardStore((store) => toggleVizEditorModal(store, false));
 	}, []);

src/pages/Dashboards/hooks.ts

@@ -11,8 +11,8 @@ const { getCleanStoreForRefetch } = logsStoreReducers;
 
 export const useSyncTimeRange = () => {
 	const [dashboards] = useDashboardsStore((store) => store.dashboards);
-	const [, setLogStore] = useLogsStore((_store) => null);
-	const [, setAppStore] = useAppStore((_store) => null);
+	const [, setLogStore] = useLogsStore(() => null);
+	const [, setAppStore] = useAppStore(() => null);
 
 	const updateTimeRange = useCallback(
 		(dashboard: Dashboard) => {

src/pages/Dashboards/hooks/useParamsController.ts

@@ -74,7 +74,7 @@ const useParamsController = () => {
 	const [isStoreSynced, setStoreSynced] = useState(false);
 	const [activeDashboard, setDashboardsStore] = useDashboardsStore((store) => store.activeDashboard);
 	const [timeRange, setAppStore] = useAppStore((store) => store.timeRange);
-	const [, setLogStore] = useLogsStore((_store) => null);
+	const [, setLogStore] = useLogsStore(() => null);
 	const [searchParams, setSearchParams] = useSearchParams();
 	const dashboardId = activeDashboard?.dashboard_id || '';
 

src/pages/Dashboards/index.tsx

@@ -9,7 +9,6 @@ import { useEffect } from 'react';
 import { useDashboardsQuery } from '@/hooks/useDashboards';
 import CreateTileForm from './CreateTileForm';
 import { useSyncTimeRange } from './hooks';
-import _ from 'lodash';
 import useParamsController from './hooks/useParamsController';
 import { useDocumentTitle } from '@mantine/hooks';
 import SavedFiltersModal from '../Stream/components/Querier/SavedFiltersModal';

src/pages/Dashboards/providers/DashboardsProvider.ts

@@ -194,8 +194,7 @@ const setDashboards = (store: DashboardsStore, dashboards: Dashboard[], dashboar
 	const activeDashboard = (() => {
 		if (_.isString(dashboardId) && !_.isEmpty(dashboardId)) {
 			return _.find(dashboards, (dashboard) => dashboard.dashboard_id === dashboardId);
-		}	
-		else if (activeDashboardFromStore) {
+		} else if (activeDashboardFromStore) {
 			const id = activeDashboardFromStore.dashboard_id;
 			const dashboard = _.find(dashboards, (dashboard) => dashboard.dashboard_id === id);
 			return dashboard || defaultActiveDashboard;
@@ -288,7 +287,7 @@ const dashboardsStoreReducers: DashboardsStoreReducers = {
 	toggleImportTileModal,
 	toggleImportDashboardModal,
 	handlePaging,
-	toggleDuplicateTileModal
+	toggleDuplicateTileModal,
 };
 
 export { DashbaordsProvider, useDashboardsStore, dashboardsStoreReducers };

src/pages/Home/CreateStreamModal.tsx

@@ -344,7 +344,7 @@ const useCreateStreamForm = () => {
 					if (allValues.schemaType === dynamicType) return null;
 
 					const { fields } = allValues;
-					const existingNames = _.map(fields, (v, _k) => v.name);
+					const existingNames = _.map(fields, (v) => v.name);
 					return isValidFieldName(val, existingNames);
 				},
 				data_type: (val, allValues) => {

src/pages/Stream/Views/Explore/LoadingViews.tsx

@@ -9,8 +9,8 @@ const { getCleanStoreForRefetch } = logsStoreReducers;
 const { syncTimeRange } = appStoreReducers;
 
 export const ErrorView = (props: { message: string }) => {
-	const [, setLogsStore] = useLogsStore((_store) => null);
-	const [, setAppStore] = useAppStore((_store) => null);
+	const [, setLogsStore] = useLogsStore(() => null);
+	const [, setAppStore] = useAppStore(() => null);
 
 	const { message } = props;
 	const onRetry = useCallback(() => {

src/pages/Stream/Views/Explore/LogsView.tsx

@@ -4,7 +4,6 @@ import JsonView from './JSONView';
 import LogTable from './StaticLogTable';
 import useLogsFetcher from './useLogsFetcher';
 import LogsViewConfig from './LogsViewConfig';
-import _ from 'lodash';
 
 const LogsView = (props: { schemaLoading: boolean; infoLoading: boolean }) => {
 	const { schemaLoading, infoLoading } = props;