Fix remaining ESLint errors: replace img with Next.js Image, fix useEffect dependency, correct nodemailer method

eslint.config.mjs

@@ -20,6 +20,7 @@ const eslintConfig = defineConfig([
     "jest.setup.js",
     "next-i18next.config.js",
     "next.config.ts",
+    "src/dataconnect-generated/**",
   ]),
 ]);
 

src/app/api/send-scheduled-emails/route.ts

@@ -244,7 +244,7 @@ export async function GET() {
     const smtpConfig = configDoc.data();
 
     // Create transporter
-    const transporter = nodemailer.createTransporter({
+    const transporter = nodemailer.createTransport({
       host: smtpConfig.host,
       port: smtpConfig.port,
       secure: smtpConfig.secure,

src/components/Profile.tsx

@@ -1,11 +1,12 @@
 'use client';
 
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useCallback } from 'react';
 import { useAuth } from '@/context/AuthContext';
 import { storage, db } from '@/lib/firebase';
 import { ref, uploadBytes, getDownloadURL } from 'firebase/storage';
 import { doc, getDoc, updateDoc } from 'firebase/firestore';
 import { useTheme } from 'next-themes';
+import Image from 'next/image';
 
 interface UserProfile {
   avatarUrl?: string;
@@ -20,13 +21,7 @@ export default function Profile() {
   const [uploading, setUploading] = useState(false);
   const [newCategory, setNewCategory] = useState('');
 
-  useEffect(() => {
-    if (user) {
-      loadProfile();
-    }
-  }, [user]);
-
-  const loadProfile = async () => {
+  const loadProfile = useCallback(async () => {
     if (!user) return;
     try {
       const docRef = doc(db, 'users', user.uid);
@@ -37,7 +32,13 @@ export default function Profile() {
     } catch (error) {
       console.error('Error loading profile:', error);
     }
-  };
+  }, [user]);
+
+  useEffect(() => {
+    if (user) {
+      loadProfile();
+    }
+  }, [user, loadProfile]);
 
   const handleAvatarUpload = async (e: React.ChangeEvent<HTMLInputElement>) => {
     const file = e.target.files?.[0];
@@ -88,7 +89,7 @@ export default function Profile() {
       <div className="mb-6">
         <label className="block mb-2 text-lg">Avatar</label>
         {profile.avatarUrl && (
-          <img src={profile.avatarUrl} alt="Avatar" className="w-20 h-20 rounded-full mb-2" />
+          <Image src={profile.avatarUrl} alt="Avatar" width={80} height={80} className="w-20 h-20 rounded-full mb-2" />
         )}
         <input
           type="file"

src/context/AuthContext.tsx

@@ -4,7 +4,6 @@ import { createContext, useContext, useEffect, useState, ReactNode } from 'react
 import { User, signInWithEmailAndPassword, signOut, onAuthStateChanged, createUserWithEmailAndPassword } from 'firebase/auth';
 import { auth, db, app } from '@/lib/firebase';
 import { doc, setDoc } from 'firebase/firestore';
-import { getToken, onMessage } from 'firebase/messaging';
 
 interface AuthContextType {
   user: User | null;
@@ -25,7 +24,7 @@ export function AuthProvider({ children }: { children: ReactNode }) {
     // Register service worker for FCM
     if ('serviceWorker' in navigator) {
       navigator.serviceWorker.register('/firebase-messaging-sw.js')
-        .then((registration) => {
+        .then(() => {
           console.log('Service Worker registered for FCM');
         })
         .catch((error) => {

src/lib/firebase.ts

@@ -31,6 +31,7 @@ export const db = getFirestore(app);
 export const storage = getStorage(app);
 
 // Initialize Firebase Analytics and get a reference to the service
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 let analytics: any = null;
 if (typeof window !== 'undefined') {
   import('firebase/analytics').then(({ getAnalytics, isSupported }) => {