refactor: migrate to eslint flat config and format codebase with prettier

- Remove legacy .eslintrc.cjs and .eslintignore
- Add eslint.config.js with flat config, security rules (no-eval, no-implied-eval, no-new-func, no-script-url)
- Add .prettierrc and .prettierignore
- Format entire codebase with prettier

src/components/ui/BentoCard.tsx

@@ -1,42 +1,42 @@
-import { Link } from 'react-router-dom'
-import { forwardRef } from 'react'
+import { Link } from 'react-router-dom';
+import { forwardRef } from 'react';
 
-export type BentoSize = 'sm' | 'md' | 'lg' | 'xl'
+export type BentoSize = 'sm' | 'md' | 'lg' | 'xl';
 
 interface BentoCardBaseProps {
-  size?: BentoSize
-  children: React.ReactNode
-  className?: string
-  hover?: boolean
-  glow?: boolean
+  size?: BentoSize;
+  children: React.ReactNode;
+  className?: string;
+  hover?: boolean;
+  glow?: boolean;
 }
 
 interface BentoCardDivProps extends BentoCardBaseProps {
-  as?: 'div'
-  onClick?: () => void
+  as?: 'div';
+  onClick?: () => void;
 }
 
 interface BentoCardLinkProps extends BentoCardBaseProps {
-  as: 'link'
-  to: string
-  state?: unknown
+  as: 'link';
+  to: string;
+  state?: unknown;
 }
 
 interface BentoCardButtonProps extends BentoCardBaseProps {
-  as: 'button'
-  onClick?: () => void
-  disabled?: boolean
-  type?: 'button' | 'submit'
+  as: 'button';
+  onClick?: () => void;
+  disabled?: boolean;
+  type?: 'button' | 'submit';
 }
 
-export type BentoCardProps = BentoCardDivProps | BentoCardLinkProps | BentoCardButtonProps
+export type BentoCardProps = BentoCardDivProps | BentoCardLinkProps | BentoCardButtonProps;
 
 const sizeClasses: Record<BentoSize, string> = {
   sm: '',
   md: 'col-span-2',
   lg: 'row-span-2',
   xl: 'col-span-2 row-span-2',
-}
+};
 
 const baseClasses = `
   bento-card
@@ -45,7 +45,7 @@ const baseClasses = `
   bg-dark-900/70
   border border-dark-700/40
   transition-all duration-300 ease-smooth
-`
+`;
 
 const hoverClasses = `
   cursor-pointer
@@ -54,21 +54,15 @@ const hoverClasses = `
   hover:shadow-lg
   hover:scale-[1.01]
   active:scale-[0.99]
-`
+`;
 
 const glowClasses = `
   hover:shadow-glow
   hover:border-accent-500/30
-`
+`;
 
 export const BentoCard = forwardRef<HTMLDivElement, BentoCardProps>((props, ref) => {
-  const { 
-    size = 'sm', 
-    children, 
-    className = '', 
-    hover = false,
-    glow = false,
-  } = props
+  const { size = 'sm', children, className = '', hover = false, glow = false } = props;
 
   const classes = [
     baseClasses,
@@ -76,19 +70,21 @@ export const BentoCard = forwardRef<HTMLDivElement, BentoCardProps>((props, ref)
     hover && hoverClasses,
     glow && glowClasses,
     className,
-  ].filter(Boolean).join(' ')
+  ]
+    .filter(Boolean)
+    .join(' ');
 
   if (props.as === 'link') {
-    const { to, state } = props as BentoCardLinkProps
+    const { to, state } = props as BentoCardLinkProps;
     return (
       <Link to={to} state={state} className={classes}>
         {children}
       </Link>
-    )
+    );
   }
 
   if (props.as === 'button') {
-    const { onClick, disabled, type = 'button' } = props as BentoCardButtonProps
+    const { onClick, disabled, type = 'button' } = props as BentoCardButtonProps;
     return (
       <button
         ref={ref as React.Ref<HTMLButtonElement>}
@@ -99,17 +95,17 @@ export const BentoCard = forwardRef<HTMLDivElement, BentoCardProps>((props, ref)
       >
         {children}
       </button>
-    )
+    );
   }
 
-  const { onClick } = props as BentoCardDivProps
+  const { onClick } = props as BentoCardDivProps;
   return (
     <div ref={ref} onClick={onClick} className={classes}>
       {children}
     </div>
-  )
-})
+  );
+});
 
-BentoCard.displayName = 'BentoCard'
+BentoCard.displayName = 'BentoCard';
 
-export default BentoCard
+export default BentoCard;

src/components/ui/BentoSkeleton.tsx

@@ -1,28 +1,20 @@
 interface BentoSkeletonProps {
-  className?: string
-  count?: number
+  className?: string;
+  count?: number;
 }
 
 export default function BentoSkeleton({ className = '', count = 1 }: BentoSkeletonProps) {
-  const baseClasses = `animate-pulse bg-dark-800/50 border border-dark-700/30 rounded-[var(--bento-radius,24px)] min-h-[160px] w-full ${className}`
+  const baseClasses = `animate-pulse bg-dark-800/50 border border-dark-700/30 rounded-[var(--bento-radius,24px)] min-h-[160px] w-full ${className}`;
 
   if (count > 1) {
     return (
       <>
         {Array.from({ length: count }).map((_, i) => (
-          <div
-            key={i}
-            className={baseClasses}
-            style={{ '--stagger': i } as React.CSSProperties}
-          />
+          <div key={i} className={baseClasses} style={{ '--stagger': i } as React.CSSProperties} />
         ))}
       </>
-    )
+    );
   }
 
-  return (
-    <div
-      className={baseClasses}
-    />
-  )
+  return <div className={baseClasses} />;
 }