Security hardening, code quality, and ESLint setup

- Remove production DB dump (db_backup_*.sql) and update.log from git tracking
- Add DB backups to .gitignore
- Replace all console.log/console.error with structured logger module
- Translate Dutch error messages to English (link-discord.ts)
- Remove dead code blocks (register-form.tsx false && pattern)
- Add ESLint flat config with TypeScript, React, Next.js, jsx-a11y, and security plugins
- Add Prettier config
- Add eslint-plugin-security for security-aware linting
- Fix all 119+ ESLint warnings across the codebase:
  - Resolve security/detect-object-injection with safe access patterns
  - Resolve security/detect-non-literal-fs-filename with path traversal validation
  - Replace <img> with next/image <Image> component
  - Remove unused variables and imports
  - Replace non-null assertions with proper type guards
  - Replace <a> with <Link> for internal navigation
  - Use next/script Script component for external scripts
- Fix setState-in-useEffect anti-patterns (navbar-color-picker, logo-generator, theme-switcher)
- Add lint and format scripts to package.json

All checks: typecheck ✓, tests 58/58 ✓, lint 0 errors 0 warnings ✓

src/components/home/user-view.tsx

@@ -1,5 +1,6 @@
 import { getTranslations } from "next-intl/server";
 import Link from "next/link";
+import Image from "next/image";
 import { avatarImageUrl, excerpt } from "@/lib/format";
 import { prisma } from "@/lib/prisma";
 import { siteSettings } from "@/lib/services/site-settings";
@@ -72,11 +73,14 @@ export default async function UserView({ userId, username, look }: UserViewProps
           />
           <div className="relative z-10 flex w-full items-end justify-between px-6 pb-2">
             <Link href={`/u/${username}`} className="transition-transform duration-300 hover:scale-105 -mb-8">
-              <img
+              <Image
                 src={avatarImageUrl(imager, look, { size: "l", direction: 2 })}
                 alt={username}
+                width={64}
+                height={110}
                 className="drop-shadow-2xl"
                 style={{ imageRendering: "pixelated" }}
+                unoptimized
               />
             </Link>
             <div className="flex items-center mb-4">
@@ -134,12 +138,14 @@ export default async function UserView({ userId, username, look }: UserViewProps
                   href={`/u/${f.username}`}
                   className="transition-all duration-200 hover:scale-110"
                 >
-                  <img
+                  <Image
                     src={avatarImageUrl(imager, f.look, { headOnly: true })}
                     alt={f.username}
+                    width={40}
+                    height={40}
                     className="h-10 w-10"
-                    loading="lazy"
                     title={f.username}
+                    unoptimized
                   />
                 </Link>
               ))
@@ -168,11 +174,12 @@ export default async function UserView({ userId, username, look }: UserViewProps
             </div>
             <Link href={`/news/${latestArticle.slug}`} className="group block">
               <div className="relative aspect-[16/9] overflow-hidden">
-                <img
+                <Image
                   src={latestArticle.image}
                   alt={latestArticle.title}
-                  className="h-full w-full object-cover transition-transform duration-300 group-hover:scale-105"
-                  loading="lazy"
+                  fill
+                  className="object-cover transition-transform duration-300 group-hover:scale-105"
+                  unoptimized
                 />
               </div>
               <div className="p-3">