> trustlab-web@1.0.0 lint > eslint . D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\auth\callback\page.tsx 32:13 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\auth\callback\page.tsx:32:13 30 | if (errorParam) { 31 | if (errorParam === 'account_exists_please_login') { > 32 | setError("This email is already associated with an account. Please sign in with your password and link your social account in settings."); | ^^^^^^^^ Avoid calling setState() directly within an effect 33 | } else if (errorParam === 'account_not_found_please_signup') { 34 | setError("Account not found. Please Sign Up to create a new account."); 35 | } else if (errorParam === 'authentication_failed') { react-hooks/set-state-in-effect D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\auth\set-password\SetPasswordClient.tsx 137:21 warning Using `` could result in slower LCP and higher bandwidth. Consider using `` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\download\ca-certificate\page.tsx 21:7 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\download\ca-certificate\page.tsx:21:7 19 | 20 | if (!serial) { > 21 | setError(t("missing_serial")); | ^^^^^^^^ Avoid calling setState() directly within an effect 22 | setStatus(""); 23 | return; 24 | } react-hooks/set-state-in-effect D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\forgot-password\ForgotPasswordClient.tsx 92:21 warning Using `` could result in slower LCP and higher bandwidth. Consider using `` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\reset-password\ResetPasswordClient.tsx 30:5 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\reset-password\ResetPasswordClient.tsx:30:5 28 | 29 | useEffect(() => { > 30 | setFormData((prev) => ({ | ^^^^^^^^^^^ Avoid calling setState() directly within an effect 31 | ...prev, 32 | token: searchParams.get("token") || "", 33 | email: searchParams.get("email") || "", react-hooks/set-state-in-effect 120:13 warning Using `` could result in slower LCP and higher bandwidth. Consider using `` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\signin\SigninClient.tsx 261:21 warning Using `` could result in slower LCP and higher bandwidth. Consider using `` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\signup\SignupClient.tsx 232:21 warning Using `` could result in slower LCP and higher bandwidth. Consider using `` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\tools\key-generator\KeyGeneratorClient.tsx 28:9 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\(public)\tools\key-generator\KeyGeneratorClient.tsx:28:9 26 | 27 | useEffect(() => { > 28 | generate(); | ^^^^^^^^ Avoid calling setState() directly within an effect 29 | }, []); 30 | 31 | return ( react-hooks/set-state-in-effect D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\DashboardClient.tsx 80:9 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\DashboardClient.tsx:80:9 78 | // WebSocket Status 79 | if (echo.connector.pusher.connection.state === 'connected') { > 80 | setWsStatus('connected'); | ^^^^^^^^^^^ Avoid calling setState() directly within an effect 81 | } 82 | 83 | echo.connector.pusher.connection.bind('connected', () => { react-hooks/set-state-in-effect 117:5 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\DashboardClient.tsx:117:5 115 | 116 | useEffect(() => { > 117 | checkApiLatency(); | ^^^^^^^^^^^^^^^ Avoid calling setState() directly within an effect 118 | const interval = setInterval(checkApiLatency, 1000); // Check every 1s (Realtime-like) 119 | return () => clearInterval(interval); 120 | }, []); react-hooks/set-state-in-effect D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\admin\inquiries\InquiryClient.tsx 76:9 warning The 'inquiries' logical expression could make the dependencies of useMemo Hook (at line 87) change on every render. Move it inside the useMemo callback. Alternatively, wrap the initialization of 'inquiries' in its own useMemo() Hook react-hooks/exhaustive-deps 256:19 error `"` can be escaped with `"`, `“`, `"`, `”` react/no-unescaped-entities 256:45 error `"` can be escaped with `"`, `“`, `"`, `”` react/no-unescaped-entities D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\admin\legal\AdminLegalEditorClient.tsx 82:6 warning React Hook useEffect has a missing dependency: 'formData.parent_minor'. Either include it or remove the dependency array react-hooks/exhaustive-deps D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\admin\smtp-tester\page.tsx 44:6 warning React Hook useEffect has a missing dependency: 'fetchConfigs'. Either include it or remove the dependency array react-hooks/exhaustive-deps D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\admin\users\UsersManagementClient.tsx 86:9 warning The 'users' logical expression could make the dependencies of useMemo Hook (at line 97) change on every render. Move it inside the useMemo callback. Alternatively, wrap the initialization of 'users' in its own useMemo() Hook react-hooks/exhaustive-deps D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\notifications\NotificationsClient.tsx 64:6 warning React Hook useEffect has a missing dependency: 'fetchNotifications'. Either include it or remove the dependency array react-hooks/exhaustive-deps 83:6 warning React Hook useEffect has a missing dependency: 'fetchNotifications'. Either include it or remove the dependency array react-hooks/exhaustive-deps D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\app\dashboard\settings\SettingsClient.tsx 458:29 warning Using `` could result in slower LCP and higher bandwidth. Consider using `` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\Layouts\Public\Navbar.tsx 45:29 warning Using `` could result in slower LCP and higher bandwidth. Consider using `` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element @next/next/no-img-element 56:25 error Do not use an `` element to navigate to `/`. Use `` from `next/link` instead. See: https://nextjs.org/docs/messages/no-html-link-for-pages @next/next/no-html-link-for-pages 176:25 error Do not use an `` element to navigate to `/`. Use `` from `next/link` instead. See: https://nextjs.org/docs/messages/no-html-link-for-pages @next/next/no-html-link-for-pages D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\certificates\CertificateTable.tsx 50:32 error Compilation Skipped: Existing memoization could not be preserved React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\certificates\CertificateTable.tsx:50:32 48 | 49 | // Filtering logic > 50 | const filteredCertificates = useMemo(() => { | ^^^^^^^^^^^^^^^ > 51 | return certificates.filter((cert) => { | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ > 52 | const search = searchTerm.toLowerCase(); ΓǪ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ > 76 | }); | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ > 77 | }, [certificates, searchTerm, statusFilter, issuanceFilter]); | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Could not preserve existing memoization 78 | 79 | const getIntermediateName = (bits: number) => { 80 | return bits === 4096 ? "Intermediate 4096" : "Intermediate 2048"; react-hooks/preserve-manual-memoization D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\common\ConfirmationModal.tsx 93:80 error `"` can be escaped with `"`, `“`, `"`, `”` react/no-unescaped-entities 93:96 error `"` can be escaped with `"`, `“`, `"`, `”` react/no-unescaped-entities D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\common\ImageCropper.tsx 93:6 warning React Hook useCallback has a missing dependency: 'getCroppedImg'. Either include it or remove the dependency array react-hooks/exhaustive-deps D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\header\NotificationDropdown.tsx 45:5 error Error: Cannot access variable before it is declared `fetchNotifications` is accessed before it is declared, which prevents the earlier access from updating when this value changes over time. D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\header\NotificationDropdown.tsx:45:5 43 | 44 | useEffect(() => { > 45 | fetchNotifications(); | ^^^^^^^^^^^^^^^^^^ `fetchNotifications` accessed before it is declared 46 | 47 | // Fallback polling 48 | const interval = setInterval(fetchNotifications, 60000); D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\header\NotificationDropdown.tsx:74:3 72 | }, [user?.id]); 73 | > 74 | const fetchNotifications = async () => { | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ > 75 | try { | ^^^^^^^^^ > 76 | const response = await axios.get("/api/notifications"); ΓǪ | ^^^^^^^^^ > 83 | } | ^^^^^^^^^ > 84 | }; | ^^^^^ `fetchNotifications` is declared here 85 | 86 | const toggleDropdown = () => { 87 | setIsOpen(!isOpen); react-hooks/immutability D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\providers\I18nProvider.tsx 37:8 warning React Hook useEffect has a missing dependency: 'locale'. Either include it or remove the dependency array react-hooks/exhaustive-deps D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\users\UserModal.tsx 39:7 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\components\users\UserModal.tsx:39:7 37 | useEffect(() => { 38 | if (user) { > 39 | setFormData({ | ^^^^^^^^^^^ Avoid calling setState() directly within an effect 40 | first_name: user.first_name || "", 41 | last_name: user.last_name || "", 42 | email: user.email || "", react-hooks/set-state-in-effect D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\context\ThemeContext.tsx 25:5 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\context\ThemeContext.tsx:25:5 23 | const savedTheme = localStorage.getItem("theme") as Theme | null; 24 | const initialTheme = savedTheme || "system"; > 25 | setThemeState(initialTheme); | ^^^^^^^^^^^^^ Avoid calling setState() directly within an effect 26 | setIsInitialized(true); 27 | }, []); 28 | react-hooks/set-state-in-effect D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\hooks\useAuth.ts 118:8 warning React Hook useEffect has a missing dependency: 'logout'. Either include it or remove the dependency array react-hooks/exhaustive-deps D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\layout\AppSidebar.tsx 251:7 error Error: Calling setState synchronously within an effect can trigger cascading renders Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following: * Update external systems with the latest state from React. * Subscribe for updates from some external system, calling setState in a callback function when external state changes. Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect). D:\Lab\HomeLab\Github\dyzulk\trustlab\trustlab-web\src\layout\AppSidebar.tsx:251:7 249 | 250 | if (isMismatch) { > 251 | setOpenSubmenu(targetSubmenu); | ^^^^^^^^^^^^^^ Avoid calling setState() directly within an effect 252 | } 253 | }, [pathname, isActive, menuGroups, openSubmenu]); 254 | react-hooks/set-state-in-effect Γ£û 33 problems (17 errors, 16 warnings)