fix: eslint warnings (#252)

frontend/components/ProjectDialog.tsx

@@ -1,5 +1,4 @@
 'use client';
-import React from 'react';
 import { useState, useEffect } from 'react';
 import {
   Button,
@@ -63,7 +62,7 @@ export default function ProjectDialog({ isOpen, editingProject, onCancel, onSubm
 
       setIsProjectPublic(true);
     }
-  }, [editingProject]);
+  }, [editingProject, projectDetail, projectName]);
 
   const clear = () => {
     setProjectName({

frontend/components/ThemeSwitch.tsx

@@ -19,7 +19,11 @@ export const ThemeSwitch: FC<ThemeSwitchProps> = ({ className, classNames }) =>
   const isSSR = useIsSSR();
 
   const onChange = () => {
-    theme === 'light' ? setTheme('dark') : setTheme('light');
+    if (theme === 'light') {
+      setTheme('dark');
+    } else {
+      setTheme('light');
+    }
   };
 
   const { Component, slots, isSelected, getBaseProps, getInputProps, getWrapperProps } = useSwitch({

frontend/components/UserAvatar.tsx

@@ -10,7 +10,7 @@ export default function PublicityChip({ context }: Props) {
   return context.isSignedIn() ? (
     <Avatar
       size={16}
-      name={context.token!.user!.username}
+      name={context.token?.user?.username}
       variant="beam"
       colors={['#0A0310', '#49007E', '#FF005B', '#FF7D10', '#FFB238']}
     />

frontend/src/app/[locale]/DropdownAccount.tsx

@@ -78,7 +78,7 @@ export default function DropdownAccount({ messages, locale, onItemPress }: Props
           startContent={<UserAvatar context={context} />}
           endContent={<ChevronDown size={16} />}
         >
-          {context.isSignedIn() ? context.token!.user!.username : messages.signIn}
+          {context.isSignedIn() ? context.token?.user?.username : messages.signIn}
         </Button>
       </DropdownTrigger>
       {context.isSignedIn() ? (

frontend/src/app/[locale]/HeaderNavbarMenu.tsx

@@ -1,7 +1,5 @@
 'use client';
 import { useState, useContext } from 'react';
-import { TokenContext } from '@/utils/TokenProvider';
-import { Link, useRouter } from '@/src/i18n/routing';
 import { usePathname } from 'next/navigation';
 import Image from 'next/image';
 import {
@@ -12,16 +10,17 @@ import {
   NavbarBrand,
   NavbarItem,
   Link as NextUiLink,
-  Chip,
   ListboxItem,
   Listbox,
 } from '@heroui/react';
 import { ArrowRightFromLine, ArrowRightToLine, File, Globe, MoveUpRight, PenTool } from 'lucide-react';
+import DropdownAccount from './DropdownAccount';
+import DropdownLanguage from './DropdownLanguage';
 import { ThemeSwitch } from '@/components/ThemeSwitch';
 import { GithubIcon } from '@/components/icons';
 import { locales } from '@/config/selection';
-import DropdownAccount from './DropdownAccount';
-import DropdownLanguage from './DropdownLanguage';
+import { Link, useRouter } from '@/src/i18n/routing';
+import { TokenContext } from '@/utils/TokenProvider';
 import UserAvatar from '@/components/UserAvatar';
 import { LocaleCodeType } from '@/types/locale';
 import Config from '@/config/config';

frontend/src/app/[locale]/account/AccountPage.tsx

@@ -1,14 +1,15 @@
 'use client';
 import { useState, useEffect, useContext } from 'react';
-import { Link, NextUiLinkClasses } from '@/src/i18n/routing';
 import { Button, Card, CardHeader, CardFooter } from '@heroui/react';
-import { TokenContext } from '@/utils/TokenProvider';
 import Avatar from 'boring-avatars';
+import { ArrowRight } from 'lucide-react';
+import { Link, NextUiLinkClasses } from '@/src/i18n/routing';
+import { TokenContext } from '@/utils/TokenProvider';
 import { fetchMyProjects } from '@/utils/projectsControl';
 import { ProjectType } from '@/types/project';
 import PublicityChip from '@/components/PublicityChip';
 import { LocaleCodeType } from '@/types/locale';
-import { ArrowRight } from 'lucide-react';
+import { logError } from '@/utils/errorHandler';
 
 type AccountPageMessages = {
   yourProjects: string;
@@ -36,8 +37,8 @@ export default function AccountPage({ messages, locale }: Props) {
       try {
         const data = await fetchMyProjects(context.token.access_token);
         setMyProjects(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching data:', error);
       }
     }
 
@@ -53,13 +54,13 @@ export default function AccountPage({ messages, locale }: Props) {
               <CardHeader className="flex gap-6">
                 <Avatar
                   size={48}
-                  name={context.token!.user!.username}
+                  name={context.token?.user?.username}
                   variant="beam"
                   colors={['#0A0310', '#49007E', '#FF005B', '#FF7D10', '#FFB238']}
                 />
                 <div className="flex flex-col">
-                  <p className="text-xl font-bold">{context.token!.user!.username}</p>
-                  <p className="text-lg text-default-500">{context.token!.user!.email}</p>
+                  <p className="text-xl font-bold">{context.token?.user?.username}</p>
+                  <p className="text-lg text-default-500">{context.token?.user?.email}</p>
                 </div>
               </CardHeader>
             </Card>

frontend/src/app/[locale]/account/authControl.ts

@@ -1,6 +1,7 @@
 import { UserType } from '@/types/user';
 import Config from '@/config/config';
 import { roles } from '@/config/selection';
+import { logError } from '@/utils/errorHandler';
 const apiServer = Config.apiServer;
 
 async function signUp(newUser: UserType) {
@@ -21,8 +22,8 @@ async function signUp(newUser: UserType) {
     }
     const token = await response.json();
     return token;
-  } catch (error: any) {
-    console.error('Error sign up:', error);
+  } catch (error: unknown) {
+    logError('Error sign up:', error);
     throw error;
   }
 }
@@ -45,8 +46,8 @@ async function signIn(signInUser: UserType) {
     }
     const token = await response.json();
     return token;
-  } catch (error: any) {
-    console.error('Error sign in:', error);
+  } catch (error: unknown) {
+    logError('Error sign in:', error);
     throw error;
   }
 }

frontend/src/app/[locale]/account/authPage.tsx

@@ -1,13 +1,12 @@
 'use client';
-import React from 'react';
 import { useState, useContext } from 'react';
 import { Input, Button, Card, CardHeader, CardBody } from '@heroui/react';
-import { Link } from '@/src/i18n/routing';
 import { ChevronRight, Eye, EyeOff } from 'lucide-react';
-import { UserType, AuthMessages } from '@/types/user';
-import { roles } from '@/config/selection';
 import { signUp, signIn, signInAsGuest } from './authControl';
 import { isValidEmail, isValidPassword } from './validate';
+import { Link } from '@/src/i18n/routing';
+import { UserType, AuthMessages } from '@/types/user';
+import { roles } from '@/config/selection';
 import { TokenContext } from '@/utils/TokenProvider';
 import { useRouter } from '@/src/i18n/routing';
 import Config from '@/config/config';

frontend/src/app/[locale]/account/layout.tsx

@@ -1,5 +1,5 @@
-import { LocaleCodeType } from '@/types/locale';
 import { getTranslations } from 'next-intl/server';
+import { LocaleCodeType } from '@/types/locale';
 
 export async function generateMetadata({ params: { locale } }: { params: { locale: LocaleCodeType } }) {
   const t = await getTranslations({ locale, namespace: 'Auth' });

frontend/src/app/[locale]/account/signin/page.tsx

@@ -1,7 +1,7 @@
-import { PageType } from '@/types/base';
-import AuthPage from '../authPage';
 import { getTranslations } from 'next-intl/server';
 import { useTranslations } from 'next-intl';
+import AuthPage from '../authPage';
+import { PageType } from '@/types/base';
 import { LocaleCodeType } from '@/types/locale';
 
 export async function generateMetadata({ params: { locale } }: { params: { locale: LocaleCodeType } }) {

frontend/src/app/[locale]/account/signup/page.tsx

@@ -1,7 +1,7 @@
-import { PageType } from '@/types/base';
-import AuthPage from '../authPage';
 import { getTranslations } from 'next-intl/server';
 import { useTranslations } from 'next-intl';
+import AuthPage from '../authPage';
+import { PageType } from '@/types/base';
 import { LocaleCodeType } from '@/types/locale';
 
 export async function generateMetadata({ params: { locale } }: { params: { locale: LocaleCodeType } }) {

frontend/src/app/[locale]/admin/AdminPage.tsx

@@ -1,16 +1,16 @@
 'use client';
-import React from 'react';
 import { useState, useEffect, useContext } from 'react';
+import { Button, addToast } from '@heroui/react';
+import UsersTable from './UsersTable';
 import { UserType, AdminMessages } from '@/types/user';
 import { TokenContext } from '@/utils/TokenProvider';
 import { useRouter } from '@/src/i18n/routing';
-import UsersTable from './UsersTable';
 import Config from '@/config/config';
 import { LocaleCodeType } from '@/types/locale';
 import { updateUserRole } from '@/utils/usersControl';
-import { Button, addToast } from '@heroui/react';
 import { roles } from '@/config/selection';
 import DeleteConfirmDialog from '@/components/DeleteConfirmDialog';
+import { logError } from '@/utils/errorHandler';
 const apiServer = Config.apiServer;
 
 type Props = {
@@ -36,8 +36,8 @@ async function fetchUsers(jwt: string) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -66,8 +66,8 @@ export default function AdminPage({ messages, locale }: Props) {
         if (tokenContext.token.user) {
           setMyself(tokenContext.token.user);
         }
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching users:', error);
       }
     }
 

frontend/src/app/[locale]/admin/UsersTable.tsx

@@ -14,9 +14,9 @@ import {
   DropdownItem,
 } from '@heroui/react';
 import { ChevronDown } from 'lucide-react';
+import Avatar from 'boring-avatars';
 import { UserType, AdminMessages } from '@/types/user';
 import { roles } from '@/config/selection';
-import Avatar from 'boring-avatars';
 
 type Props = {
   users: UserType[];

frontend/src/app/[locale]/health/HealthPage.tsx

@@ -4,6 +4,7 @@ import { Table, TableBody, TableRow, TableHeader, TableCell, Chip, TableColumn }
 import { LocaleCodeType } from '@/types/locale';
 import { HealthMessages } from '@/types/health';
 import Config from '@/config/config';
+import { logError } from '@/utils/errorHandler';
 const apiServer = Config.apiServer;
 
 type Props = {
@@ -21,8 +22,8 @@ async function fetchHealth() {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.log('Error fetching health data:', error);
+  } catch (error: unknown) {
+    logError('Error fetching health data:', error);
   }
 }
 
@@ -38,8 +39,8 @@ export default function HealthPage({ messages, locale }: Props) {
         const data = await fetchHealth();
         setStatus(data.status);
         setIsFetching(false);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error in effect:', error);
       }
     }
 

frontend/src/app/[locale]/layout.tsx

@@ -1,12 +1,12 @@
 import '@/styles/globals.css';
-import { fontSans } from '@/config/fonts';
-import { Providers } from './providers';
-import Header from './Header';
 import clsx from 'clsx';
 import { getTranslations } from 'next-intl/server';
 import { useTranslations } from 'next-intl';
-import { LocaleCodeType } from '@/types/locale';
 import { headers } from 'next/headers';
+import Header from './Header';
+import { Providers } from './providers';
+import { LocaleCodeType } from '@/types/locale';
+import { fontSans } from '@/config/fonts';
 
 export async function generateMetadata({ params: { locale } }: { params: { locale: LocaleCodeType } }) {
   const headersList = headers();

frontend/src/app/[locale]/projects/ProjectsPage.tsx

@@ -2,12 +2,13 @@
 import { useEffect, useState, useContext } from 'react';
 import { Button } from '@heroui/react';
 import { Plus } from 'lucide-react';
+import ProjectsTable from './ProjectsTable';
 import { TokenContext } from '@/utils/TokenProvider';
 import { ProjectDialogMessages, ProjectType, ProjectsMessages } from '@/types/project';
-import ProjectsTable from './ProjectsTable';
 import ProjectDialog from '@/components/ProjectDialog';
 import { fetchProjects, createProject } from '@/utils/projectsControl';
 import { LocaleCodeType } from '@/types/locale';
+import { logError } from '@/utils/errorHandler';
 
 export type Props = {
   messages: ProjectsMessages;
@@ -27,8 +28,8 @@ export default function ProjectsPage({ messages, projectDialogMessages, locale }
       try {
         const data = await fetchProjects(context.token.access_token);
         setProjects(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching data:', error);
       }
     }
 

frontend/src/app/[locale]/projects/ProjectsTable.tsx

@@ -1,8 +1,8 @@
 import { useState, useMemo, useCallback, ReactNode } from 'react';
 import { Table, TableHeader, TableColumn, TableBody, TableRow, TableCell, SortDescriptor } from '@heroui/react';
+import dayjs from 'dayjs';
 import { Link, NextUiLinkClasses } from '@/src/i18n/routing';
 import { ProjectType, ProjectsMessages } from '@/types/project';
-import dayjs from 'dayjs';
 import PublicityChip from '@/components/PublicityChip';
 import { LocaleCodeType } from '@/types/locale';
 
@@ -39,35 +39,43 @@ export default function ProjectsTable({ projects, messages, locale }: Props) {
     return text.length > maxLength ? text.slice(0, maxLength) + '...' : text;
   };
 
-  const renderCell = useCallback((project: ProjectType, columnKey: string): ReactNode => {
-    const cellValue = project[columnKey as keyof ProjectType];
+  const renderCell = useCallback(
+    (project: ProjectType, columnKey: string): ReactNode => {
+      const cellValue = project[columnKey as keyof ProjectType];
 
-    switch (columnKey) {
-      case 'id':
-        return <span>{cellValue as number}</span>;
-      case 'isPublic':
-        return (
-          <PublicityChip isPublic={cellValue as boolean} publicText={messages.public} privateText={messages.private} />
-        );
-      case 'name':
-        const maxLength = 30;
-        const truncatedDetail = truncateText(project.detail, maxLength);
-        return (
-          <div>
-            <Link href={`/projects/${project.id}/home`} locale={locale} className={NextUiLinkClasses}>
-              {cellValue as string}
-            </Link>
-            <div className="text-xs text-default-500">
-              <div>{truncatedDetail}</div>
+      switch (columnKey) {
+        case 'id':
+          return <span>{cellValue as number}</span>;
+        case 'isPublic':
+          return (
+            <PublicityChip
+              isPublic={cellValue as boolean}
+              publicText={messages.public}
+              privateText={messages.private}
+            />
+          );
+        case 'name': {
+          const maxLength = 30;
+          const truncatedDetail = truncateText(project.detail, maxLength);
+          return (
+            <div>
+              <Link href={`/projects/${project.id}/home`} locale={locale} className={NextUiLinkClasses}>
+                {cellValue as string}
+              </Link>
+              <div className="text-xs text-default-500">
+                <div>{truncatedDetail}</div>
+              </div>
             </div>
-          </div>
-        );
-      case 'updatedAt':
-        return <span>{dayjs(cellValue as number).format('YYYY/MM/DD HH:mm')}</span>;
-      default:
-        return cellValue as string;
-    }
-  }, []);
+          );
+        }
+        case 'updatedAt':
+          return <span>{dayjs(cellValue as number).format('YYYY/MM/DD HH:mm')}</span>;
+        default:
+          return cellValue as string;
+      }
+    },
+    [locale, messages.private, messages.public]
+  );
 
   const classNames = useMemo(
     () => ({

frontend/src/app/[locale]/projects/[projectId]/folders/FolderDialog.tsx

@@ -1,5 +1,4 @@
 'use client';
-import React from 'react';
 import { useState, useEffect } from 'react';
 import { Button, Input, Textarea, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter } from '@heroui/react';
 import { FolderType, FoldersMessages } from '@/types/folder';
@@ -47,7 +46,7 @@ export default function FolderDialog({ isOpen, editingFolder, onCancel, onSubmit
         text: '',
       });
     }
-  }, [editingFolder]);
+  }, [editingFolder, folderDetail, folderName]);
 
   const clear = () => {
     setFolderName({

frontend/src/app/[locale]/projects/[projectId]/folders/FoldersPane.tsx

@@ -1,15 +1,16 @@
 'use client';
-import { FolderType, FoldersMessages } from '@/types/folder';
 import { useState, useEffect, useContext } from 'react';
 import { Button, Listbox, ListboxItem } from '@heroui/react';
 import { Folder, Plus } from 'lucide-react';
+import FolderDialog from './FolderDialog';
+import FolderEditMenu from './FolderEditMenu';
+import { fetchFolders, createFolder, updateFolder, deleteFolder } from './foldersControl';
 import { usePathname, useRouter } from '@/src/i18n/routing';
 import { TokenContext } from '@/utils/TokenProvider';
 import useGetCurrentIds from '@/utils/useGetCurrentIds';
-import FolderDialog from './FolderDialog';
-import FolderEditMenu from './FolderEditMenu';
 import DeleteConfirmDialog from '@/components/DeleteConfirmDialog';
-import { fetchFolders, createFolder, updateFolder, deleteFolder } from './foldersControl';
+import { FolderType, FoldersMessages } from '@/types/folder';
+import { logError } from '@/utils/errorHandler';
 
 type Props = {
   projectId: string;
@@ -49,13 +50,13 @@ export default function FoldersPane({ projectId, messages, locale }: Props) {
           const smallestFolderId = Math.min(...folders.map((folder) => folder.id));
           router.push(`/projects/${projectId}/folders/${smallestFolderId}/cases`, { locale: locale });
         }
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching folders:', error);
       }
     }
 
     fetchDataEffect();
-  }, [context, folderId]);
+  }, [context, folderId, locale, pathname, projectId, router]);
 
   const openDialogForCreate = () => {
     setIsFolderDialogOpen(true);

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/CaseDialog.tsx

@@ -1,6 +1,5 @@
 'use client';
-import React from 'react';
-import { useState, useEffect } from 'react';
+import { useState } from 'react';
 import { Button, Input, Textarea, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter } from '@heroui/react';
 import { CasesMessages } from '@/types/case';
 

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/CasesPane.tsx

@@ -8,6 +8,7 @@ import { CaseType, CasesMessages } from '@/types/case';
 import DeleteConfirmDialog from '@/components/DeleteConfirmDialog';
 import { PriorityMessages } from '@/types/priority';
 import { LocaleCodeType } from '@/types/locale';
+import { logError } from '@/utils/errorHandler';
 
 type Props = {
   projectId: string;
@@ -30,8 +31,8 @@ export default function CasesPane({ projectId, folderId, messages, priorityMessa
       try {
         const data = await fetchCases(context.token.access_token, Number(folderId));
         setCases(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching cases:', error);
       }
     }
 

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/TestCaseTable.tsx

@@ -15,7 +15,7 @@ import {
   SortDescriptor,
   ButtonGroup,
 } from '@heroui/react';
-import { Plus, MoreVertical, Trash, Download, FileDown, ChevronDown, FileJson, FileSpreadsheet } from 'lucide-react';
+import { Plus, MoreVertical, Trash, FileDown, ChevronDown, FileJson, FileSpreadsheet } from 'lucide-react';
 import { Link } from '@/src/i18n/routing';
 import { CaseType, CasesMessages } from '@/types/case';
 import { PriorityMessages } from '@/types/priority';
@@ -122,6 +122,7 @@ export default function TestCaseTable({
       default:
         return cellValue as string;
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   const handleDeleteCases = () => {

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/[caseId]/CaseEditor.tsx

@@ -1,19 +1,20 @@
 'use client';
 import { useState, useEffect, useContext, ChangeEvent, DragEvent } from 'react';
 import { Input, Textarea, Select, SelectItem, Button, Divider, Tooltip, addToast, Badge } from '@heroui/react';
-import { useRouter } from '@/src/i18n/routing';
 import { Save, Plus, ArrowLeft, Circle } from 'lucide-react';
-import { priorities, testTypes, templates } from '@/config/selection';
 import CaseStepsEditor from './CaseStepsEditor';
 import CaseAttachmentsEditor from './CaseAttachmentsEditor';
-import { fetchCase, updateCase } from '@/utils/caseControl';
 import { updateSteps } from './stepControl';
 import { fetchCreateAttachments, fetchDownloadAttachment, fetchDeleteAttachment } from './attachmentControl';
+import { fetchCase, updateCase } from '@/utils/caseControl';
+import { priorities, testTypes, templates } from '@/config/selection';
+import { useRouter } from '@/src/i18n/routing';
 import { TokenContext } from '@/utils/TokenProvider';
 import { useFormGuard } from '@/utils/formGuard';
 import { CaseType, AttachmentType, CaseMessages, StepType } from '@/types/case';
 import { PriorityMessages } from '@/types/priority';
 import { TestTypeMessages } from '@/types/testType';
+import { logError } from '@/utils/errorHandler';
 
 const defaultTestCase = {
   id: 0,
@@ -220,13 +221,13 @@ export default function CaseEditor({
           step.editState = 'notChanged';
         });
         setTestCase(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching case data', error);
       }
     }
 
     fetchDataEffect();
-  }, [tokenContext]);
+  }, [caseId, tokenContext]);
 
   return (
     <>

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/[caseId]/CaseStepsEditor.tsx

@@ -1,6 +1,6 @@
 import { Textarea, Button, Tooltip, Avatar } from '@heroui/react';
-import { CaseMessages, StepType } from '@/types/case';
 import { Plus, Trash } from 'lucide-react';
+import { CaseMessages, StepType } from '@/types/case';
 
 type Props = {
   isDisabled: boolean;

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/[caseId]/attachmentControl.ts

@@ -1,4 +1,5 @@
 import Config from '@/config/config';
+import { logError } from '@/utils/errorHandler';
 const apiServer = Config.apiServer;
 
 async function fetchDownloadAttachment(attachmentId: number, downloadFileName: string) {
@@ -26,8 +27,8 @@ async function fetchDownloadAttachment(attachmentId: number, downloadFileName: s
     document.body.appendChild(link);
     link.click();
     document.body.removeChild(link);
-  } catch (error: any) {
-    console.error('Error downloading file:', error);
+  } catch (error: unknown) {
+    logError('Error downloading attachment', error);
     throw error;
   }
 }
@@ -51,8 +52,8 @@ async function fetchCreateAttachments(caseId: number, files: File[]) {
 
     const responseData = await response.json();
     return responseData;
-  } catch (error: any) {
-    console.error('Error uploading files:', error);
+  } catch (error: unknown) {
+    logError('Error uploading files', error);
   }
 }
 
@@ -71,8 +72,8 @@ async function fetchDeleteAttachment(attachmentId: number) {
     if (!response.ok) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
-  } catch (error: any) {
-    console.error('Error deleting file:', error);
+  } catch (error: unknown) {
+    logError('Error deleting file:', error);
     throw error;
   }
 }

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/[caseId]/page.tsx

@@ -1,6 +1,6 @@
-import { PriorityMessages } from '@/types/priority';
-import CaseEditor from './CaseEditor';
 import { useTranslations } from 'next-intl';
+import CaseEditor from './CaseEditor';
+import { PriorityMessages } from '@/types/priority';
 import { TestTypeMessages } from '@/types/testType';
 
 export default function Page({

frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/[caseId]/stepControl.ts

@@ -1,5 +1,6 @@
 import Config from '@/config/config';
 import { StepType } from '@/types/case';
+import { logError } from '@/utils/errorHandler';
 const apiServer = Config.apiServer;
 
 async function updateSteps(jwt: string, caseId: number, steps: StepType[]) {
@@ -20,8 +21,8 @@ async function updateSteps(jwt: string, caseId: number, steps: StepType[]) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
     return await response.json();
-  } catch (error: any) {
-    console.error('Error deleting project:', error);
+  } catch (error: unknown) {
+    logError('Error updating steps', error);
     throw error;
   }
 }

frontend/src/app/[locale]/projects/[projectId]/folders/foldersControl.ts

@@ -1,4 +1,5 @@
 import Config from '@/config/config';
+import { logError } from '@/utils/errorHandler';
 const apiServer = Config.apiServer;
 
 /**
@@ -21,8 +22,8 @@ async function fetchFolders(jwt: string, projectId: number) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -60,8 +61,8 @@ async function createFolder(
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error creating new project:', error);
+  } catch (error: unknown) {
+    logError('Error creating new folder:', error);
     throw error;
   }
 }
@@ -102,8 +103,8 @@ async function updateFolder(
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error updating project:', error);
+  } catch (error: unknown) {
+    logError('Error updating folder:', error);
     throw error;
   }
 }
@@ -127,8 +128,8 @@ async function deleteFolder(jwt: string, folderId: number) {
     if (!response.ok) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
-  } catch (error: any) {
-    console.error('Error deleting project:', error);
+  } catch (error: unknown) {
+    logError('Error deleting folder:', error);
     throw error;
   }
 }

frontend/src/app/[locale]/projects/[projectId]/folders/layout.tsx

@@ -1,5 +1,5 @@
-import FoldersPane from './FoldersPane';
 import { useTranslations } from 'next-intl';
+import FoldersPane from './FoldersPane';
 
 export default function FoldersLayout({
   children,

frontend/src/app/[locale]/projects/[projectId]/home/ProjectHome.tsx

@@ -1,22 +1,23 @@
 'use client';
 import { useState, useEffect, useContext } from 'react';
-import { title, subtitle } from '@/components/primitives';
 import { Card, CardBody, Chip, Divider } from '@heroui/react';
 import { Folder, Clipboard, FlaskConical } from 'lucide-react';
-import { ProgressSeriesType } from '@/types/run';
-import { HomeMessages } from './page';
-import { TokenContext } from '@/utils/TokenProvider';
-import { aggregateBasicInfo, aggregateTestPriority, aggregateTestType, aggregateProgress } from './aggregate';
-import Config from '@/config/config';
 import { useTheme } from 'next-themes';
+import { aggregateBasicInfo, aggregateTestPriority, aggregateTestType, aggregateProgress } from './aggregate';
+import { HomeMessages } from './page';
 import TestTypesChart from './TestTypesDonutChart';
 import TestPriorityChart from './TestPriorityDonutChart';
 import TestProgressBarChart from './TestProgressColumnChart';
+import Config from '@/config/config';
+import { TokenContext } from '@/utils/TokenProvider';
+import { ProgressSeriesType } from '@/types/run';
+import { title, subtitle } from '@/components/primitives';
 import { TestRunCaseStatusMessages } from '@/types/status';
 import { TestTypeMessages } from '@/types/testType';
 import { PriorityMessages } from '@/types/priority';
 import { ProjectType } from '@/types/project';
 import { CasePriorityCountType, CaseTypeCountType } from '@/types/chart';
+import { logError } from '@/utils/errorHandler';
 
 const apiServer = Config.apiServer;
 
@@ -38,8 +39,8 @@ async function fetchProject(jwt: string, projectId: number) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -59,7 +60,7 @@ export function ProjectHome({
   priorityMessages,
 }: Props) {
   const context = useContext(TokenContext);
-  const { theme, setTheme } = useTheme();
+  const { theme } = useTheme();
   const [project, setProject] = useState<ProjectType>({
     id: 0,
     name: '',
@@ -88,13 +89,13 @@ export function ProjectHome({
       try {
         const data = await fetchProject(context.token.access_token, Number(projectId));
         setProject(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error in effect:', error);
       }
     }
 
     fetchDataEffect();
-  }, [context]);
+  }, [context, projectId]);
 
   useEffect(() => {
     async function aggregate() {
@@ -118,7 +119,7 @@ export function ProjectHome({
     }
 
     aggregate();
-  }, [project]);
+  }, [project, testRunCaseStatusMessages]);
 
   return (
     <div className="container mx-auto max-w-5xl pt-6 px-6 flex-grow">

frontend/src/app/[locale]/projects/[projectId]/home/TestPriorityDonutChart.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { useState, useEffect } from 'react';
 import dynamic from 'next/dynamic';
 import { priorities } from '@/config/selection';
@@ -34,7 +33,7 @@ export default function TestPriorityDonutChart({ priorityCounts, priorityMessage
         const colors = priorities.map((entry) => entry.chartColor);
         const legend = {
           labels: {
-            colors: priorities.map((entry) => {
+            colors: priorities.map(() => {
               if (theme === 'light') {
                 return 'black';
               } else {
@@ -52,7 +51,7 @@ export default function TestPriorityDonutChart({ priorityCounts, priorityMessage
     };
 
     updateChartDate();
-  }, [priorityCounts, theme]);
+  }, [priorityCounts, priorityMessages, theme]);
 
   return <Chart options={chartData.options} series={chartData.series} type="donut" width={'100%'} height={'100%'} />;
 }

frontend/src/app/[locale]/projects/[projectId]/home/TestProgressColumnChart.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { useState, useEffect } from 'react';
 import dynamic from 'next/dynamic';
 import { ProgressSeriesType } from '@/types/run';
@@ -24,7 +23,7 @@ export default function TestProgressBarChart({ progressSeries, progressCategorie
   useEffect(() => {
     const updateChartDate = () => {
       if (progressSeries) {
-        const legendsLabelColors = testRunCaseStatus.map((itr) => {
+        const legendsLabelColors = testRunCaseStatus.map(() => {
           if (theme === 'light') {
             return 'black';
           } else {

frontend/src/app/[locale]/projects/[projectId]/home/TestTypesDonutChart.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { useState, useEffect } from 'react';
 import dynamic from 'next/dynamic';
 import { testTypes } from '@/config/selection';
@@ -33,7 +32,7 @@ export default function TestTypesDonutChart({ typesCounts, testTypeMessages, the
         const colors = testTypes.map((entry) => entry.chartColor);
         const legend = {
           labels: {
-            colors: testTypes.map((entry) => {
+            colors: testTypes.map(() => {
               if (theme === 'light') {
                 return 'black';
               } else {
@@ -51,7 +50,7 @@ export default function TestTypesDonutChart({ typesCounts, testTypeMessages, the
     };
 
     updateChartDate();
-  }, [typesCounts, theme]);
+  }, [typesCounts, theme, testTypeMessages]);
 
   return <Chart options={chartData.options} series={chartData.series} type="donut" width={'100%'} height={'100%'} />;
 }

frontend/src/app/[locale]/projects/[projectId]/home/aggregate.ts

@@ -18,7 +18,7 @@ function aggregateBasicInfo(project: ProjectType) {
 
 function aggregateTestType(project: ProjectType): CaseTypeCountType[] {
   // count how many test cases are for each type
-  const typesCounts: number[] = testTypes.map((entry) => {
+  const typesCounts: number[] = testTypes.map(() => {
     return 0;
   });
   project.Folders.forEach((folder) => {
@@ -38,7 +38,7 @@ function aggregateTestType(project: ProjectType): CaseTypeCountType[] {
 
 function aggregateTestPriority(project: ProjectType) {
   // count how many test cases are for each priority
-  const priorityCounts: number[] = priorities.map((entry) => {
+  const priorityCounts: number[] = priorities.map(() => {
     return 0;
   });
   project.Folders.forEach((folder) => {
@@ -58,10 +58,10 @@ function aggregateTestPriority(project: ProjectType) {
 
 function aggregateProgress(project: ProjectType, testRunCaseStatusMessages: TestRunCaseStatusMessages) {
   type ChartSeries = { name: string; data: number[] };
-  let series: ChartSeries[] = testRunCaseStatus.map((status) => {
+  const series: ChartSeries[] = testRunCaseStatus.map((status) => {
     return { name: testRunCaseStatusMessages[status.uid], data: [] };
   });
-  let categories: string[] = [];
+  const categories: string[] = [];
 
   project.Runs.forEach((run) => {
     if (!run.RunCases) {

frontend/src/app/[locale]/projects/[projectId]/home/page.tsx

@@ -1,7 +1,7 @@
-import { LocaleCodeType } from '@/types/locale';
-import { ProjectHome } from './ProjectHome';
 import { getTranslations } from 'next-intl/server';
 import { useTranslations } from 'next-intl';
+import { ProjectHome } from './ProjectHome';
+import { LocaleCodeType } from '@/types/locale';
 import { PriorityMessages } from '@/types/priority';
 import { TestTypeMessages } from '@/types/testType';
 import { TestRunCaseStatusMessages } from '@/types/status';

frontend/src/app/[locale]/projects/[projectId]/layout.tsx

@@ -1,6 +1,6 @@
-import { ProjectMessages } from '@/types/project';
-import Sidebar from './Sidebar';
 import { useTranslations } from 'next-intl';
+import Sidebar from './Sidebar';
+import { ProjectMessages } from '@/types/project';
 
 export default function SidebarLayout({
   children,

frontend/src/app/[locale]/projects/[projectId]/members/AddMemberDialog.tsx

@@ -1,12 +1,12 @@
 'use client';
-import React from 'react';
 import { useState, useEffect, useContext } from 'react';
 import { Button, Input, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter } from '@heroui/react';
+import CandidatesTable from './CandidatesTable';
 import { TokenContext } from '@/utils/TokenProvider';
 import { UserType } from '@/types/user';
 import { searchUsers } from '@/utils/usersControl';
-import CandidatesTable from './CandidatesTable';
 import { MembersMessages } from '@/types/member';
+import { logError } from '@/utils/errorHandler';
 
 type Props = {
   isOpen: boolean;
@@ -34,13 +34,13 @@ export default function AddMemberDialog({ isOpen, projectId, onCancel, onAddMemb
       try {
         const data = await searchUsers(context.token.access_token, Number(projectId), searchText);
         setCandidates(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching data:', error);
       }
     }
 
     fetchDataEffect();
-  }, [searchText]);
+  }, [context, projectId, searchText]);
 
   const handleExit = () => {
     setSearchText('');

frontend/src/app/[locale]/projects/[projectId]/members/CandidatesTable.tsx

@@ -1,7 +1,7 @@
 import { useMemo, useCallback } from 'react';
 import { Button, Table, TableHeader, TableColumn, TableBody, TableRow, TableCell } from '@heroui/react';
-import { UserType } from '@/types/user';
 import Avatar from 'boring-avatars';
+import { UserType } from '@/types/user';
 import { MembersMessages } from '@/types/member';
 
 type Props = {
@@ -18,33 +18,36 @@ export default function MembersTable({ candidates, onAddPress, messages }: Props
     { name: messages.add, uid: 'add', sortable: false },
   ];
 
-  const renderCell = useCallback((candidate: UserType, columnKey: string) => {
-    const cellValue = candidate[columnKey as keyof UserType];
+  const renderCell = useCallback(
+    (candidate: UserType, columnKey: string) => {
+      const cellValue = candidate[columnKey as keyof UserType];
 
-    switch (columnKey) {
-      case 'avatar':
-        return (
-          <Avatar
-            size={16}
-            name={candidate.username}
-            variant="beam"
-            colors={['#0A0310', '#49007E', '#FF005B', '#FF7D10', '#FFB238']}
-          />
-        );
-      case 'email':
-        return cellValue;
-      case 'username':
-        return cellValue;
-      case 'add':
-        return (
-          <Button color="primary" variant="faded" size="sm" onPress={() => onAddPress(candidate)}>
-            {messages.add}
-          </Button>
-        );
-      default:
-        return cellValue;
-    }
-  }, []);
+      switch (columnKey) {
+        case 'avatar':
+          return (
+            <Avatar
+              size={16}
+              name={candidate.username}
+              variant="beam"
+              colors={['#0A0310', '#49007E', '#FF005B', '#FF7D10', '#FFB238']}
+            />
+          );
+        case 'email':
+          return cellValue;
+        case 'username':
+          return cellValue;
+        case 'add':
+          return (
+            <Button color="primary" variant="faded" size="sm" onPress={() => onAddPress(candidate)}>
+              {messages.add}
+            </Button>
+          );
+        default:
+          return cellValue;
+      }
+    },
+    [messages.add, onAddPress]
+  );
 
   const classNames = useMemo(
     () => ({

frontend/src/app/[locale]/projects/[projectId]/members/MembersPage.tsx

@@ -1,23 +1,22 @@
 'use client';
-import React from 'react';
 import { useState, useEffect, useContext } from 'react';
 import { Button } from '@heroui/react';
 import { Plus } from 'lucide-react';
-import { MemberType, UserType } from '@/types/user';
-import { MembersMessages } from '@/types/member';
-import { TokenContext } from '@/utils/TokenProvider';
 import MembersTable from './MembersTable';
 import AddMemberDialog from './AddMemberDialog';
 import { fetchProjectMembers, addMember, deleteMember, updateMember } from './membersControl';
+import { MemberType, UserType } from '@/types/user';
+import { MembersMessages } from '@/types/member';
+import { TokenContext } from '@/utils/TokenProvider';
 import DeleteConfirmDialog from '@/components/DeleteConfirmDialog';
+import { logError } from '@/utils/errorHandler';
 
 type Props = {
   projectId: string;
   messages: MembersMessages;
-  locale: string;
 };
 
-export default function MembersPage({ projectId, messages, locale }: Props) {
+export default function MembersPage({ projectId, messages }: Props) {
   const context = useContext(TokenContext);
   const [members, setMembers] = useState<MemberType[]>([]);
   const [isDialogOpen, setIsDialogOpen] = useState(false);
@@ -31,13 +30,13 @@ export default function MembersPage({ projectId, messages, locale }: Props) {
       try {
         const data = await fetchProjectMembers(context.token.access_token, projectId);
         setMembers(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching members:', error);
       }
     }
 
     fetchDataEffect();
-  }, [context]);
+  }, [context, projectId]);
 
   const handleAddMember = async (userAdded: UserType) => {
     if (userAdded.id) {

frontend/src/app/[locale]/projects/[projectId]/members/MembersTable.tsx

@@ -14,9 +14,9 @@ import {
   DropdownItem,
 } from '@heroui/react';
 import { ChevronDown } from 'lucide-react';
+import Avatar from 'boring-avatars';
 import { MemberType, UserType } from '@/types/user';
 import { memberRoles } from '@/config/selection';
-import Avatar from 'boring-avatars';
 import { MembersMessages } from '@/types/member';
 
 type Props = {

frontend/src/app/[locale]/projects/[projectId]/members/membersControl.ts

@@ -1,3 +1,4 @@
+import { logError } from '@/utils/errorHandler';
 import Config from '@/config/config';
 const apiServer = Config.apiServer;
 
@@ -19,8 +20,8 @@ async function fetchProjectMembers(jwt: string, projectId: string) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -42,8 +43,8 @@ async function addMember(jwt: string, userId: number, projectId: number) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -63,8 +64,8 @@ async function deleteMember(jwt: string, userId: number, projectId: number) {
     if (!response.ok) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -86,8 +87,8 @@ async function updateMember(jwt: string, userId: number, projectId: number, role
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 

frontend/src/app/[locale]/projects/[projectId]/members/page.tsx

@@ -1,7 +1,7 @@
-import { LocaleCodeType } from '@/types/locale';
-import MembersPage from './MembersPage';
 import { getTranslations } from 'next-intl/server';
 import { useTranslations } from 'next-intl';
+import MembersPage from './MembersPage';
+import { LocaleCodeType } from '@/types/locale';
 
 export async function generateMetadata({ params: { locale } }: { params: { locale: LocaleCodeType } }) {
   const t = await getTranslations({ locale, namespace: 'Members' });
@@ -34,7 +34,7 @@ export default function Page({ params }: { params: { projectId: string; locale:
 
   return (
     <>
-      <MembersPage projectId={params.projectId} messages={messages} locale={params.locale} />
+      <MembersPage projectId={params.projectId} messages={messages} />
     </>
   );
 }

frontend/src/app/[locale]/projects/[projectId]/runs/RunDialog.tsx

@@ -1,5 +1,4 @@
 'use client';
-import React from 'react';
 import { useState, useEffect } from 'react';
 import { Button, Input, Textarea, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter } from '@heroui/react';
 import { RunType, RunsMessages } from '@/types/run';
@@ -47,7 +46,7 @@ export default function RunDialog({ isOpen, editingRun, onCancel, onSubmit, mess
         text: '',
       });
     }
-  }, [editingRun]);
+  }, [editingRun, runDescription, runName]);
 
   const clear = () => {
     setRunName({

frontend/src/app/[locale]/projects/[projectId]/runs/RunsPage.tsx

@@ -9,6 +9,7 @@ import { RunType, RunsMessages } from '@/types/run';
 import DeleteConfirmDialog from '@/components/DeleteConfirmDialog';
 import { TokenContext } from '@/utils/TokenProvider';
 import { LocaleCodeType } from '@/types/locale';
+import { logError } from '@/utils/errorHandler';
 
 type Props = {
   projectId: string;
@@ -61,13 +62,13 @@ export default function RunsPage({ projectId, locale, messages }: Props) {
       try {
         const data = await fetchRuns(context.token.access_token, Number(projectId));
         setRuns(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching runs', error);
       }
     }
 
     fetchDataEffect();
-  }, [context]);
+  }, [context, projectId]);
 
   const onSubmit = async (name: string, description: string) => {
     if (editingRun && editingRun.createdAt) {

frontend/src/app/[locale]/projects/[projectId]/runs/RunsTable.tsx

@@ -13,10 +13,10 @@ import {
   DropdownItem,
   SortDescriptor,
 } from '@heroui/react';
-import { Link, NextUiLinkClasses } from '@/src/i18n/routing';
 import { MoreVertical } from 'lucide-react';
-import { RunsMessages, RunType } from '@/types/run';
 import dayjs from 'dayjs';
+import { Link, NextUiLinkClasses } from '@/src/i18n/routing';
+import { RunsMessages, RunType } from '@/types/run';
 import { LocaleCodeType } from '@/types/locale';
 
 type Props = {
@@ -70,7 +70,7 @@ export default function RunsTable({ projectId, isDisabled, runs, onDeleteRun, me
     switch (columnKey) {
       case 'id':
         return <span>{cellValue as number}</span>;
-      case 'name':
+      case 'name': {
         const maxLength = 30;
         const truncatedDescription = truncateText(run.description, maxLength);
         return (
@@ -83,6 +83,7 @@ export default function RunsTable({ projectId, isDisabled, runs, onDeleteRun, me
             </div>
           </div>
         );
+      }
       case 'updatedAt':
         return <span>{dayjs(cellValue as string).format('YYYY/MM/DD HH:mm')}</span>;
       case 'actions':

frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/RunEditor.tsx

@@ -55,6 +55,7 @@ import { useFormGuard } from '@/utils/formGuard';
 import { PriorityMessages } from '@/types/priority';
 import { RunStatusMessages, TestRunCaseStatusMessages } from '@/types/status';
 import { TestTypeMessages } from '@/types/testType';
+import { logError } from '@/utils/errorHandler';
 
 const defaultTestRun = {
   id: 0,
@@ -132,12 +133,13 @@ export default function RunEditor({
         setFolders(foldersData);
         setSelectedFolder(foldersData[0]);
         initTestCases();
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching run data', error);
       }
     }
 
     fetchDataEffect();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [tokenContext]);
 
   useEffect(() => {
@@ -146,8 +148,8 @@ export default function RunEditor({
         try {
           const filteredData = testCases.filter((testCase) => testCase.folderId === selectedFolder.id);
           setFilteredTestCases(filteredData);
-        } catch (error: any) {
-          console.error('Error fetching cases data:', error.message);
+        } catch (error: unknown) {
+          logError('Error filtering test cases', error);
         }
       }
     }

frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/RunPregressDonutChart.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { useState, useEffect } from 'react';
 import dynamic from 'next/dynamic';
 import { testRunCaseStatus } from '@/config/selection';
@@ -34,7 +33,7 @@ export default function RunProgressDounut({ statusCounts, testRunCaseStatusMessa
         const colors = testRunCaseStatus.map((entry) => entry.chartColor);
         const legend = {
           labels: {
-            colors: testRunCaseStatus.map((entry) => {
+            colors: testRunCaseStatus.map(() => {
               if (theme === 'light') {
                 return 'black';
               } else {
@@ -52,7 +51,7 @@ export default function RunProgressDounut({ statusCounts, testRunCaseStatusMessa
     };
 
     updateChartDate();
-  }, [statusCounts, theme]);
+  }, [statusCounts, testRunCaseStatusMessages, theme]);
 
   return <Chart options={chartData.options} series={chartData.series} type="donut" width={'100%'} height={'100%'} />;
 }

frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/TestCaseDetailDialog.tsx

@@ -8,12 +8,12 @@ import TestCasePriority from '@/components/TestCasePriority';
 import { TokenContext } from '@/utils/TokenProvider';
 import { fetchCase } from '@/utils/caseControl';
 import { TestTypeMessages } from '@/types/testType';
+import { logError } from '@/utils/errorHandler';
 
 type Props = {
   isOpen: boolean;
   caseId: number;
   onCancel: () => void;
-  onChangeStatus: (changeCaseId: number, status: number) => {};
   messages: RunMessages;
   testTypeMessages: TestTypeMessages;
   priorityMessages: PriorityMessages;
@@ -37,7 +37,6 @@ export default function TestCaseDetailDialog({
   isOpen,
   caseId,
   onCancel,
-  onChangeStatus,
   messages,
   testTypeMessages,
   priorityMessages,
@@ -66,8 +65,8 @@ export default function TestCaseDetailDialog({
         }
 
         setTestCase(data);
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching case data', error);
       }
     }
 

frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/TestCaseSelector.tsx

@@ -26,10 +26,10 @@ import {
   CircleX,
   CircleSlash2,
 } from 'lucide-react';
+import TestCaseDetailDialog from './TestCaseDetailDialog';
 import { testRunCaseStatus } from '@/config/selection';
 import { CaseType } from '@/types/case';
 import { RunMessages } from '@/types/run';
-import TestCaseDetailDialog from './TestCaseDetailDialog';
 import { PriorityMessages } from '@/types/priority';
 import TestCasePriority from '@/components/TestCasePriority';
 import { TestTypeMessages } from '@/types/testType';
@@ -40,9 +40,9 @@ type Props = {
   isDisabled: boolean;
   selectedKeys: Selection;
   onSelectionChange: React.Dispatch<React.SetStateAction<Selection>>;
-  onChangeStatus: (changeCaseId: number, status: number) => {};
-  onIncludeCase: (includeCaseId: number) => {};
-  onExcludeCase: (excludeCaseId: number) => {};
+  onChangeStatus: (changeCaseId: number, status: number) => void;
+  onIncludeCase: (includeCaseId: number) => void;
+  onExcludeCase: (excludeCaseId: number) => void;
   messages: RunMessages;
   testRunCaseStatusMessages: TestRunCaseStatusMessages;
   priorityMessages: PriorityMessages;
@@ -296,7 +296,6 @@ export default function TestCaseSelector({
         isOpen={isTestCaseDetailDialogOpen}
         caseId={showingTestCaseId}
         onCancel={hideTestCaseDetailDialog}
-        onChangeStatus={(showingCaseId, newStatus) => onChangeStatus(showingCaseId, newStatus)}
         messages={messages}
         priorityMessages={priorityMessages}
         testTypeMessages={testTypeMessages}

frontend/src/app/[locale]/projects/[projectId]/runs/[runId]/page.tsx

@@ -1,5 +1,5 @@
-import RunEditor from './RunEditor';
 import { useTranslations } from 'next-intl';
+import RunEditor from './RunEditor';
 import { RunMessages } from '@/types/run';
 import { PriorityMessages } from '@/types/priority';
 import { RunStatusMessages, TestRunCaseStatusMessages } from '@/types/status';

frontend/src/app/[locale]/projects/[projectId]/runs/runsControl.ts

@@ -1,3 +1,4 @@
+import { logError } from '@/utils/errorHandler';
 import { CaseType } from '@/types/case';
 import { RunType, RunCaseType } from '@/types/run';
 import Config from '@/config/config';
@@ -22,8 +23,8 @@ async function fetchRun(jwt: string, runId: number) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -45,8 +46,8 @@ async function fetchRuns(jwt: string, projectId: number) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -76,8 +77,8 @@ async function createRun(jwt: string, projectId: number, name: string, descripti
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error creating new test run:', error);
+  } catch (error: unknown) {
+    logError('Error creating new test run:', error);
     throw error;
   }
 }
@@ -101,8 +102,8 @@ async function updateRun(jwt: string, updateTestRun: RunType) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error updating run:', error);
+  } catch (error: unknown) {
+    logError('Error updating run:', error);
     throw error;
   }
 }
@@ -123,8 +124,8 @@ async function deleteRun(jwt: string, runId: number) {
     if (!response.ok) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
-  } catch (error: any) {
-    console.error('Error deleting run:', error);
+  } catch (error: unknown) {
+    logError('Error deleting run:', error);
     throw error;
   }
 }
@@ -157,8 +158,8 @@ async function exportRun(jwt: string, runId: number, type: string) {
     a.click();
     a.remove();
     window.URL.revokeObjectURL(objectUrl);
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -180,8 +181,8 @@ async function fetchRunCases(jwt: string, runId: number) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -308,8 +309,8 @@ async function updateRunCases(jwt: string, runId: number, testCases: CaseType[])
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
     return await response.json();
-  } catch (error: any) {
-    console.error('Error deleting project:', error);
+  } catch (error: unknown) {
+    logError('Error updating run cases:', error);
     throw error;
   }
 }
@@ -332,8 +333,8 @@ async function fetchProjectCases(jwt: string, projectId: number) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 

frontend/src/app/[locale]/projects/[projectId]/settings/SettingsPage.tsx

@@ -1,5 +1,4 @@
 'use client';
-import React from 'react';
 import { useState, useEffect, useContext } from 'react';
 import { Button, Table, TableHeader, TableColumn, TableBody, TableRow, TableCell } from '@heroui/react';
 import Avatar from 'boring-avatars';
@@ -13,6 +12,7 @@ import { useRouter } from '@/src/i18n/routing';
 import ProjectDialog from '@/components/ProjectDialog';
 import { UserType } from '@/types/user';
 import { findUser } from '@/utils/usersControl';
+import { logError } from '@/utils/errorHandler';
 
 type Props = {
   projectId: string;
@@ -60,13 +60,13 @@ export default function SettingsPage({ projectId, messages, projectDialogMessage
         } else {
           console.error('failed to get project owner id');
         }
-      } catch (error: any) {
-        console.error('Error in effect:', error.message);
+      } catch (error: unknown) {
+        logError('Error fetching project data:', error);
       }
     }
 
     fetchDataEffect();
-  }, [context]);
+  }, [context, projectId]);
 
   // project dialog
   const [isProjectDialogOpen, setIsProjectDialogOpen] = useState(false);

frontend/src/app/[locale]/projects/[projectId]/settings/page.tsx

@@ -1,8 +1,8 @@
-import { LocaleCodeType } from '@/types/locale';
-import { ProjectDialogMessages } from '@/types/project';
-import SettingsPage from './SettingsPage';
 import { getTranslations } from 'next-intl/server';
 import { useTranslations } from 'next-intl';
+import SettingsPage from './SettingsPage';
+import { LocaleCodeType } from '@/types/locale';
+import { ProjectDialogMessages } from '@/types/project';
 import { SettingsMessages } from '@/types/settings';
 
 export async function generateMetadata({ params: { locale } }: { params: { locale: LocaleCodeType } }) {

frontend/src/app/[locale]/projects/layout.tsx

@@ -1,5 +1,5 @@
-import { LocaleCodeType } from '@/types/locale';
 import { getTranslations } from 'next-intl/server';
+import { LocaleCodeType } from '@/types/locale';
 
 export async function generateMetadata({ params: { locale } }: { params: { locale: LocaleCodeType } }) {
   const t = await getTranslations({ locale, namespace: 'Projects' });

frontend/src/app/[locale]/projects/page.tsx

@@ -1,6 +1,6 @@
-import { PageType } from '@/types/base';
-import ProjectsPage from './ProjectsPage';
 import { useTranslations } from 'next-intl';
+import ProjectsPage from './ProjectsPage';
+import { PageType } from '@/types/base';
 import { LocaleCodeType } from '@/types/locale';
 import { ProjectDialogMessages, ProjectsMessages } from '@/types/project';
 

frontend/src/app/[locale]/projects/projectsControl.ts

@@ -1,123 +0,0 @@
-import Config from '@/config/config';
-const apiServer = Config.apiServer;
-
-/**
- * fetch project records
- */
-async function fetchProjects(jwt: string) {
-  const url = `${apiServer}/projects`;
-
-  try {
-    const response = await fetch(url, {
-      method: 'GET',
-      headers: {
-        'Content-Type': 'application/json',
-        Authorization: `Bearer ${jwt}`,
-      },
-    });
-
-    if (!response.ok) {
-      throw new Error(`HTTP error! Status: ${response.status}`);
-    }
-
-    const data = await response.json();
-    return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
-  }
-}
-
-/**
- * Create project
- */
-async function createProject(jwt: string, name: string, detail: string, isPublic: boolean) {
-  const newProjectData = {
-    name,
-    detail,
-    isPublic,
-  };
-
-  const fetchOptions = {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${jwt}`,
-    },
-    body: JSON.stringify(newProjectData),
-  };
-
-  const url = `${apiServer}/projects`;
-
-  try {
-    const response = await fetch(url, fetchOptions);
-    if (!response.ok) {
-      throw new Error(`HTTP error! Status: ${response.status}`);
-    }
-    const data = await response.json();
-    return data;
-  } catch (error: any) {
-    console.error('Error creating new project:', error);
-    throw error;
-  }
-}
-
-/**
- * Update project
- */
-async function updateProject(jwt: string, projectId: number, name: string, detail: string, isPublic: boolean) {
-  const updatedProjectData = {
-    name,
-    detail,
-    isPublic,
-  };
-
-  const fetchOptions = {
-    method: 'PUT',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${jwt}`,
-    },
-    body: JSON.stringify(updatedProjectData),
-  };
-
-  const url = `${apiServer}/projects/${projectId}`;
-
-  try {
-    const response = await fetch(url, fetchOptions);
-    if (!response.ok) {
-      throw new Error(`HTTP error! Status: ${response.status}`);
-    }
-    const data = await response.json();
-    return data;
-  } catch (error: any) {
-    console.error('Error updating project:', error);
-    throw error;
-  }
-}
-
-/**
- * Delete project
- */
-async function deleteProject(jwt: string, projectId: number) {
-  const fetchOptions = {
-    method: 'DELETE',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${jwt}`,
-    },
-  };
-
-  const url = `${apiServer}/projects/${projectId}`;
-
-  try {
-    const response = await fetch(url, fetchOptions);
-    if (!response.ok) {
-      throw new Error(`HTTP error! Status: ${response.status}`);
-    }
-  } catch (error: any) {
-    console.error('Error deleting project:', error);
-    throw error;
-  }
-}
-
-export { fetchProjects, createProject, updateProject, deleteProject };

frontend/src/i18n/request.ts

@@ -4,7 +4,7 @@ import { routing } from './routing';
 export default getRequestConfig(async ({ requestLocale }) => {
   let locale = await requestLocale;
 
-  if (!locale || !routing.locales.includes(locale as any)) {
+  if (!locale || !routing.locales.includes(locale as (typeof routing.locales)[number])) {
     locale = routing.defaultLocale;
   }
 

frontend/utils/TokenProvider.tsx

@@ -1,8 +1,6 @@
 'use client';
-import { createContext, useState, useEffect, useContext } from 'react';
-import { ProjectRoleType, TokenContextType, TokenType } from '@/types/user';
-import { TokenProps } from '@/types/user';
-import { useRouter, usePathname } from '@/src/i18n/routing';
+import { createContext, useState, useEffect } from 'react';
+import { addToast } from '@heroui/react';
 import {
   isSignedIn as tokenIsSinedIn,
   isAdmin as tokenIsAdmin,
@@ -13,7 +11,10 @@ import {
   checkSignInPage as tokenCheckSignInPage,
   fetchMyRoles,
 } from './token';
-import { addToast } from '@heroui/react';
+import { logError } from './errorHandler';
+import { ProjectRoleType, TokenContextType, TokenType } from '@/types/user';
+import { TokenProps } from '@/types/user';
+import { useRouter, usePathname } from '@/src/i18n/routing';
 const LOCAL_STORAGE_KEY = 'unittcms-auth-token';
 
 function storeTokenToLocalStorage(token: TokenType) {
@@ -31,20 +32,20 @@ const defaultContext = {
   },
   isSignedIn: () => false,
   isAdmin: () => false,
-  isProjectOwner: (projectId: number) => {
+  isProjectOwner: () => {
     return false;
   },
-  isProjectManager: (projectId: number) => {
+  isProjectManager: () => {
     return false;
   },
-  isProjectDeveloper: (projectId: number) => {
+  isProjectDeveloper: () => {
     return false;
   },
-  isProjectReporter: (projectId: number) => {
+  isProjectReporter: () => {
     return false;
   },
   refreshProjectRoles: () => {},
-  setToken: (token: TokenType) => {},
+  setToken: () => {},
   storeTokenToLocalStorage,
   removeTokenFromLocalStorage,
 };
@@ -94,8 +95,8 @@ const TokenProvider = ({ toastMessages, locale, children }: TokenProps) => {
     try {
       const data = await fetchMyRoles(token.access_token);
       setProjectRoles(data);
-    } catch (error: any) {
-      console.error('Error in effect:', error.message);
+    } catch (error: unknown) {
+      logError('Error fetching project roles', error);
     }
   }
 
@@ -154,10 +155,12 @@ const TokenProvider = ({ toastMessages, locale, children }: TokenProps) => {
 
       router.push(ret.redirectPath, { locale: locale });
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [pathname, hasRestoreFinished]);
 
   useEffect(() => {
     refreshProjectRoles();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [hasRestoreFinished, token]);
 
   return <TokenContext.Provider value={tokenContext}>{children}</TokenContext.Provider>;

frontend/utils/caseControl.ts

@@ -1,3 +1,4 @@
+import { logError } from '@/utils/errorHandler';
 import Config from '@/config/config';
 const apiServer = Config.apiServer;
 import { CaseType } from '@/types/case';
@@ -20,8 +21,8 @@ async function fetchCase(jwt: string, caseId: number) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data', error);
   }
 }
 
@@ -43,8 +44,8 @@ async function fetchCases(jwt: string, folderId: number) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data', error);
   }
 }
 
@@ -79,9 +80,8 @@ async function createCase(jwt: string, folderId: string, title: string, descript
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error creating case:', error);
-    throw error;
+  } catch (error: unknown) {
+    logError('Error creating case', error);
   }
 }
 
@@ -103,9 +103,8 @@ async function updateCase(jwt: string, updateCaseData: CaseType) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error updating project:', error);
-    throw error;
+  } catch (error: unknown) {
+    logError('Error updating project', error);
   }
 }
 
@@ -126,9 +125,8 @@ async function deleteCases(jwt: string, deleteCaseIds: number[], projectId: numb
     if (!response.ok) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
-  } catch (error: any) {
-    console.error('Error deleting cases:', error);
-    throw error;
+  } catch (error: unknown) {
+    logError('Error deleting cases', error);
   }
 }
 
@@ -160,8 +158,8 @@ async function exportCases(jwt: string, folderId: number, type: string) {
     a.click();
     a.remove();
     window.URL.revokeObjectURL(objectUrl);
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data', error);
   }
 }
 

frontend/utils/errorHandler.ts

@@ -0,0 +1,10 @@
+/**
+ * Error handler utility for logging errors
+ */
+export const logError = (context: string, error: unknown) => {
+  if (error instanceof Error) {
+    console.error(`${context}:`, error.message);
+  } else {
+    console.error(`${context}:`, error);
+  }
+};

frontend/utils/formGuard.ts

@@ -25,5 +25,5 @@ export const useFormGuard = (isDirty: boolean, confirmText: string) => {
       window.removeEventListener('beforeunload', handleBeforeUnload);
       window.removeEventListener('click', handleClick, true);
     };
-  }, [isDirty]);
+  }, [confirmText, isDirty]);
 };

frontend/utils/projectsControl.ts

@@ -1,32 +1,7 @@
+import { logError } from '@/utils/errorHandler';
 import Config from '@/config/config';
 const apiServer = Config.apiServer;
 
-/**
- * fetch project
- */
-async function fetchProject(jwt: string, projectId: number) {
-  const url = `${apiServer}/projects/${projectId}`;
-
-  try {
-    const response = await fetch(url, {
-      method: 'GET',
-      headers: {
-        'Content-Type': 'application/json',
-        Authorization: `Bearer ${jwt}`,
-      },
-    });
-
-    if (!response.ok) {
-      throw new Error(`HTTP error! Status: ${response.status}`);
-    }
-
-    const data = await response.json();
-    return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
-  }
-}
-
 /**
  * fetch projects (public and user own projects)
  */
@@ -48,8 +23,34 @@ async function fetchProjects(jwt: string) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
+  }
+}
+
+/**
+ * fetch project
+ */
+async function fetchProject(jwt: string, projectId: number) {
+  const url = `${apiServer}/projects/${projectId}`;
+
+  try {
+    const response = await fetch(url, {
+      method: 'GET',
+      headers: {
+        'Content-Type': 'application/json',
+        Authorization: `Bearer ${jwt}`,
+      },
+    });
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! Status: ${response.status}`);
+    }
+
+    const data = await response.json();
+    return data;
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -74,8 +75,8 @@ async function fetchMyProjects(jwt: string) {
 
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -107,8 +108,8 @@ async function createProject(jwt: string, name: string, detail: string, isPublic
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error creating new project:', error);
+  } catch (error: unknown) {
+    logError('Error creating new project:', error);
     throw error;
   }
 }
@@ -141,8 +142,8 @@ async function updateProject(jwt: string, projectId: number, name: string, detai
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error updating project:', error);
+  } catch (error: unknown) {
+    logError('Error updating project:', error);
     throw error;
   }
 }
@@ -166,8 +167,8 @@ async function deleteProject(jwt: string, projectId: number) {
     if (!response.ok) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
-  } catch (error: any) {
-    console.error('Error deleting project:', error);
+  } catch (error: unknown) {
+    logError('Error deleting project:', error);
     throw error;
   }
 }

frontend/utils/token.ts

@@ -1,3 +1,4 @@
+import { logError } from '@/utils/errorHandler';
 import { ProjectRoleType, TokenType } from '@/types/user';
 import { roles, memberRoles } from '@/config/selection';
 import Config from '@/config/config';
@@ -56,8 +57,8 @@ async function fetchMyRoles(jwt: string) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -165,7 +166,7 @@ const isPrivatePath = (pathname: string) => {
 };
 
 function checkSignInPage(token: TokenType, pathname: string) {
-  let ret = {
+  const ret = {
     ok: true,
     reason: '',
     redirectPath: '',

frontend/utils/usersControl.ts

@@ -1,3 +1,4 @@
+import { logError } from '@/utils/errorHandler';
 import Config from '@/config/config';
 const apiServer = Config.apiServer;
 
@@ -19,8 +20,8 @@ async function findUser(jwt: string, userId: number) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -42,8 +43,8 @@ async function searchUsers(jwt: string, projectId: number, searchText: string) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }
 
@@ -70,8 +71,8 @@ async function updateUserRole(jwt: string, userId: number, newRole: number) {
     }
     const data = await response.json();
     return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
+  } catch (error: unknown) {
+    logError('Error fetching data:', error);
   }
 }