linter fixes (#2561)

frontend/src/component/admin/apiToken/ConfirmToken/ConfirmToken.tsx

@@ -1,5 +1,5 @@
-import { Alert, Box, Typography } from '@mui/material';
+import { Alert, Typography } from '@mui/material';
-import { useNavigate, Link } from 'react-router-dom';
+import { Link } from 'react-router-dom';
 import { useThemeStyles } from 'themes/themeStyles';
 import { Dialogue } from 'component/common/Dialogue/Dialogue';
 import { UserToken } from './UserToken/UserToken';

frontend/src/component/admin/instance-admin/InstanceStats/InstanceStats.tsx

@@ -15,7 +15,7 @@ import { PageContent } from '../../../common/PageContent/PageContent';
 import { PageHeader } from '../../../common/PageHeader/PageHeader';
 
 export const InstanceStats: VFC = () => {
-    const { stats, loading } = useInstanceStats();
+    const { stats } = useInstanceStats();
 
     let versionTitle;
     let version;

frontend/src/component/admin/projectRoles/EditProjectRole/EditProjectRole.tsx

@@ -1,4 +1,3 @@
-import { useEffect } from 'react';
 import FormTemplate from 'component/common/FormTemplate/FormTemplate';
 import { UpdateButton } from 'component/common/UpdateButton/UpdateButton';
 import { ADMIN } from 'component/providers/AccessProvider/permissions';

frontend/src/component/admin/projectRoles/ProjectRoleForm/ProjectRoleForm.tsx

@@ -7,7 +7,6 @@ import { Box, Button, TextField, Typography } from '@mui/material';
 import Input from 'component/common/Input/Input';
 import { PermissionAccordion } from './PermissionAccordion/PermissionAccordion';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
-import EnvironmentIcon from 'component/common/EnvironmentIcon/EnvironmentIcon';
 import {
     IPermission,
     IProjectEnvironmentPermissions,

frontend/src/component/admin/users/InviteLinkBar/InviteLinkBar.tsx

@@ -1,4 +1,4 @@
-import { useEffect, VFC } from 'react';
+import { VFC } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { Box, Button, Typography } from '@mui/material';
 import useLoading from 'hooks/useLoading';

frontend/src/component/changeRequest/ChangeRequest/ChangeRequest.tsx

@@ -1,12 +1,5 @@
 import React, { FC, VFC } from 'react';
-import {
+import { Alert, Box, Popover, styled, Typography } from '@mui/material';
-    Alert,
-    Box,
-    Popover,
-    styled,
-    Tooltip,
-    Typography,
-} from '@mui/material';
 import { ChangeRequestFeatureToggleChange } from '../ChangeRequestOverview/ChangeRequestFeatureToggleChange/ChangeRequestFeatureToggleChange';
 import { objectId } from 'utils/objectId';
 import { ToggleStatusChange } from '../ChangeRequestOverview/ChangeRequestFeatureToggleChange/ToggleStatusChange';

frontend/src/component/changeRequest/ChangeRequestConfirmDialog/ChangeRequestMessages/CopyStrategiesMessage.tsx

@@ -1,7 +1,7 @@
 import { VFC } from 'react';
 import { styled, Typography } from '@mui/material';
 import { formatStrategyName } from 'utils/strategyNames';
-import { IFeatureStrategy, IFeatureStrategyPayload } from 'interfaces/strategy';
+import { IFeatureStrategyPayload } from 'interfaces/strategy';
 
 interface ICopyStrategiesMessageProps {
     payload?: IFeatureStrategyPayload[];

frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestFeatureToggleChange/ChangeRequestFeatureToggleChange.tsx

@@ -1,7 +1,6 @@
 import { FC } from 'react';
 import { Link } from 'react-router-dom';
 import { Alert, Box, Card, Typography } from '@mui/material';
-import ToggleOnIcon from '@mui/icons-material/ToggleOn';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 
 interface IChangeRequestToggleChange {

frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestOverview.tsx

@@ -1,4 +1,4 @@
-import { Alert, Button, styled, TextField, Typography } from '@mui/material';
+import { Alert, Button, styled } from '@mui/material';
 import { FC, useContext, useState } from 'react';
 import { Box } from '@mui/material';
 import { useChangeRequest } from 'hooks/api/getters/useChangeRequest/useChangeRequest';

frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestReviewers/ChangeRequestReviewer.tsx

@@ -1,4 +1,4 @@
-import { Box, Paper, styled, Typography } from '@mui/material';
+import { Box, styled, Typography } from '@mui/material';
 import React, { FC } from 'react';
 import { StyledAvatar } from '../ChangeRequestHeader/ChangeRequestHeader.styles';
 import { CheckCircle } from '@mui/icons-material';

frontend/src/component/changeRequest/ChangeRequestOverview/ReviewButton/ReviewButton.tsx

@@ -12,7 +12,6 @@ import {
     MenuItem,
     MenuList,
     ClickAwayListener,
-    Alert,
 } from '@mui/material';
 
 import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';

frontend/src/component/changeRequest/DraftBanner/DraftBanner.tsx

@@ -1,7 +1,6 @@
 import { FC, useState, VFC } from 'react';
 import { Box, Button, styled, Typography } from '@mui/material';
 import { useStyles as useAppStyles } from 'component/App.styles';
-import WarningAmberIcon from '@mui/icons-material/WarningAmber';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 import { ChangeRequestSidebar } from '../ChangeRequestSidebar/ChangeRequestSidebar';
 import { usePendingChangeRequests } from 'hooks/api/getters/usePendingChangeRequests/usePendingChangeRequests';

frontend/src/component/common/PrettifyLargeNumber/PrettifyLargeNumber.test.tsx

@@ -7,9 +7,7 @@ describe('PrettifyLargeNumber', () => {
     it('should render number with separator for value less than threshold', async () => {
         render(<PrettifyLargeNumber value={999999} threshold={1000000} />);
 
-        const prettifiedText = await screen.getByTestId(
+        const prettifiedText = screen.getByTestId(LARGE_NUMBER_PRETTIFIED);
-            LARGE_NUMBER_PRETTIFIED
-        );
 
         expect(prettifiedText.textContent).toHaveLength('999,999'.length);
     });
@@ -17,9 +15,7 @@ describe('PrettifyLargeNumber', () => {
     it('should render prettified number for value equal to the threshold', async () => {
         render(<PrettifyLargeNumber value={1000000} threshold={1000000} />);
 
-        const prettifiedText = await screen.getByTestId(
+        const prettifiedText = screen.getByTestId(LARGE_NUMBER_PRETTIFIED);
-            LARGE_NUMBER_PRETTIFIED
-        );
 
         expect(prettifiedText.textContent).toBe('1M');
     });
@@ -27,9 +23,7 @@ describe('PrettifyLargeNumber', () => {
     it('should render prettified number for value greater than threshold', async () => {
         render(<PrettifyLargeNumber value={12345678} threshold={1000000} />);
 
-        const prettifiedText = await screen.getByTestId(
+        const prettifiedText = screen.getByTestId(LARGE_NUMBER_PRETTIFIED);
-            LARGE_NUMBER_PRETTIFIED
-        );
 
         expect(prettifiedText.textContent).toBe('12.35M');
     });
@@ -37,9 +31,7 @@ describe('PrettifyLargeNumber', () => {
     it('should render prettified number with tooltip having raw value for value greater than threshold', async () => {
         render(<PrettifyLargeNumber value={12345678} threshold={1000000} />);
 
-        const prettifiedText = await screen.getByTestId(
+        const prettifiedText = screen.getByTestId(LARGE_NUMBER_PRETTIFIED);
-            LARGE_NUMBER_PRETTIFIED
-        );
 
         expect(prettifiedText.getAttribute('aria-label')).toHaveLength(
             '12,345,678'.length
@@ -55,9 +47,7 @@ describe('PrettifyLargeNumber', () => {
             />
         );
 
-        const prettifiedText = await screen.getByTestId(
+        const prettifiedText = screen.getByTestId(LARGE_NUMBER_PRETTIFIED);
-            LARGE_NUMBER_PRETTIFIED
-        );
 
         expect(prettifiedText.textContent).toBe('12.3457M');
     });

frontend/src/component/common/SidebarModal/SidebarModal.tsx

@@ -1,4 +1,4 @@
-import { ReactNode, FC } from 'react';
+import { FC } from 'react';
 import { Modal, Backdrop, styled } from '@mui/material';
 import Fade from '@mui/material/Fade';
 import { SIDEBAR_MODAL_ID } from 'utils/testIds';

frontend/src/component/feature/FeatureStrategy/FeatureStrategyCreate/FeatureStrategyCreate.tsx

@@ -18,7 +18,6 @@ import {
 } from '../FeatureStrategyEdit/FeatureStrategyEdit';
 import { CREATE_FEATURE_STRATEGY } from 'component/providers/AccessProvider/permissions';
 import { ISegment } from 'interfaces/segment';
-import { useSegmentsApi } from 'hooks/api/actions/useSegmentsApi/useSegmentsApi';
 import { formatStrategyName } from 'utils/strategyNames';
 import { useFormErrors } from 'hooks/useFormErrors';
 import { createFeatureStrategy } from 'utils/createFeatureStrategy';
@@ -43,7 +42,6 @@ export const FeatureStrategyCreate = () => {
 
     const { addStrategyToFeature, loading } = useFeatureStrategyApi();
     const { addChangeRequest } = useChangeRequestApi();
-    const { setStrategySegments } = useSegmentsApi();
     const { setToastData, setToastApiError } = useToast();
     const { uiConfig } = useUiConfig();
     const { unleashUrl } = uiConfig;
@@ -85,7 +83,7 @@ export const FeatureStrategyCreate = () => {
     }, [featureId, strategyDefinition]);
 
     const onAddStrategy = async (payload: IFeatureStrategyPayload) => {
-        const created = await addStrategyToFeature(
+        await addStrategyToFeature(
             projectId,
             featureId,
             environmentId,

frontend/src/component/feature/FeatureStrategy/FeatureStrategyEdit/FeatureStrategyEdit.tsx

@@ -15,7 +15,6 @@ import {
 } from 'interfaces/strategy';
 import { UPDATE_FEATURE_STRATEGY } from 'component/providers/AccessProvider/permissions';
 import { ISegment } from 'interfaces/segment';
-import { useSegmentsApi } from 'hooks/api/actions/useSegmentsApi/useSegmentsApi';
 import { useSegments } from 'hooks/api/getters/useSegments/useSegments';
 import { formatStrategyName } from 'utils/strategyNames';
 import { useFormErrors } from 'hooks/useFormErrors';
@@ -38,7 +37,6 @@ export const FeatureStrategyEdit = () => {
     const [strategy, setStrategy] = useState<Partial<IFeatureStrategy>>({});
     const [segments, setSegments] = useState<ISegment[]>([]);
     const { updateStrategyOnFeature, loading } = useFeatureStrategyApi();
-    const { setStrategySegments } = useSegmentsApi();
     const { strategyDefinition } = useStrategy(strategy.name);
     const { setToastData, setToastApiError } = useToast();
     const errors = useFormErrors();

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/EnvironmentAccordionBody/StrategyDraggableItem/StrategyItem/CopyStrategyIconMenu/CopyStrategyIconMenu.tsx

@@ -8,7 +8,7 @@ import {
     Tooltip,
 } from '@mui/material';
 import { AddToPhotos as CopyIcon, Lock } from '@mui/icons-material';
-import { IFeatureStrategy, IFeatureStrategyPayload } from 'interfaces/strategy';
+import { IFeatureStrategyPayload } from 'interfaces/strategy';
 import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
 import { IFeatureEnvironment } from 'interfaces/featureToggle';
 import AccessContext from 'contexts/AccessContext';

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/EnvironmentAccordionBody/StrategyDraggableItem/StrategyItem/useStrategyChangeFromRequest.tsx

@@ -21,6 +21,7 @@ export const useStrategyChangeFromRequest = (
         ) {
             return change.payload.id === strategyId;
         }
+        return false;
     });
 
     return change;

frontend/src/component/feature/FeatureView/FeatureView.tsx

@@ -32,7 +32,6 @@ import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
 import { FeatureArchiveDialog } from '../../common/FeatureArchiveDialog/FeatureArchiveDialog';
 import { DraftBanner } from 'component/changeRequest/DraftBanner/DraftBanner';
 import { MainLayout } from 'component/layout/MainLayout/MainLayout';
-import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
 
 export const FeatureView = () => {

frontend/src/component/layout/Error/Error.tsx

@@ -1,8 +1,7 @@
 import { VFC } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { Box, Typography } from '@mui/material';
+import { Box } from '@mui/material';
 import { Dialogue } from 'component/common/Dialogue/Dialogue';
-import { GO_BACK } from 'constants/navigate';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 
 interface IErrorProps {

frontend/src/component/project/Project/Project.tsx

@@ -1,7 +1,6 @@
 import { useNavigate } from 'react-router';
 import useProject from 'hooks/api/getters/useProject/useProject';
 import useLoading from 'hooks/useLoading';
-import ApiError from 'component/common/ApiError/ApiError';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 import { useStyles } from './Project.styles';
 import { styled, Tab, Tabs } from '@mui/material';
@@ -53,7 +52,7 @@ const StyledText = styled(StyledTitle)(({ theme }) => ({
 const Project = () => {
     const projectId = useRequiredPathParam('projectId');
     const params = useQueryParams();
-    const { project, error, loading, refetch } = useProject(projectId);
+    const { project, loading } = useProject(projectId);
     const ref = useLoading(loading);
     const { setToastData } = useToast();
     const { classes: styles } = useStyles();
@@ -117,7 +116,7 @@ const Project = () => {
         const changeRequestTab = {
             title: 'Change requests',
             path: `${basePath}/change-requests`,
-            name: 'change-request' + '',
+            name: 'change-request',
         };
 
         if (isChangeRequestFlagEnabled) {

frontend/src/component/project/ProjectAccess/ProjectAccessTable/ProjectAccessTable.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useState, VFC } from 'react';
+import { useEffect, useMemo, useState, VFC } from 'react';
 import { SortingRule, useFlexLayout, useSortBy, useTable } from 'react-table';
 import { VirtualizedTable, TablePlaceholder } from 'component/common/Table';
 import { styled, useMediaQuery, useTheme } from '@mui/material';

frontend/src/component/user/common/ResetPasswordForm/ResetPasswordForm.tsx

@@ -1,14 +1,6 @@
 import { Button } from '@mui/material';
 import classnames from 'classnames';
-import React, {
+import React, { SyntheticEvent, useCallback, useEffect, useState } from 'react';
-    Dispatch,
-    SetStateAction,
-    SyntheticEvent,
-    useCallback,
-    useEffect,
-    useState,
-} from 'react';
-import { useNavigate } from 'react-router';
 import { useThemeStyles } from 'themes/themeStyles';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 import PasswordChecker from './PasswordChecker/PasswordChecker';

frontend/src/hooks/useCollaborateData.tsx

@@ -2,7 +2,6 @@ import { useState, useEffect } from 'react';
 import { SWRConfiguration } from 'swr';
 import { dequal } from 'dequal';
 import { StaleDataNotification } from 'component/common/StaleDataNotification/StaleDataNotification';
-import { IFeatureToggle } from 'interfaces/featureToggle';
 
 interface IFormatUnleashGetterOutput<Type> {
     data: Type;

frontend/src/utils/formatDate.ts

@@ -1,5 +1,3 @@
-import { formatRelative } from 'date-fns';
-
 export const formatDateYMDHMS = (
     date: number | string | Date,
     locale: string