From d89dc2ee7083dcd149cce1b74895cf322e674d35 Mon Sep 17 00:00:00 2001
From: Ilia Mashkov <hikkikomori7@gmail.com>
Date: Fri, 24 Apr 2026 08:38:00 +0300
Subject: [PATCH] chore: add vitest/globals types, remove redundant vitest
 imports, fix pre-existing lint issues

---
 .gitignore                                    |  2 +
 .../SectionAccordion.stories.tsx              | 22 +++---
 .../SectionAccordion.test.tsx                 | 69 +++++++++----------
 .../ui/SectionAccordion/SectionAccordion.tsx  | 21 +++---
 .../Section/ui/SectionAccordion/index.ts      |  2 +-
 src/entities/Section/ui/index.ts              |  2 +-
 .../experience/ui/ExperienceCard.test.tsx     |  1 -
 src/entities/index.ts                         |  2 +-
 src/entities/project/index.ts                 |  4 +-
 .../project/ui/DetailedProjectCard.test.tsx   |  6 +-
 .../project/ui/DetailedProjectCard.tsx        |  9 +--
 src/entities/project/ui/ProjectCard.test.tsx  |  6 +-
 src/entities/project/ui/ProjectCard.tsx       |  7 +-
 .../project/ui/ProjectMetadata.test.tsx       |  7 +-
 src/shared/api/index.ts                       |  2 +-
 src/shared/api/types.ts                       | 13 ++--
 src/shared/index.ts                           |  4 +-
 src/shared/lib/cn.test.ts                     |  1 -
 src/shared/lib/cn.ts                          |  2 +-
 src/shared/lib/formatDate.test.ts             |  1 -
 src/shared/ui/Badge/index.ts                  |  2 +-
 src/shared/ui/Badge/ui/Badge.test.tsx         |  1 -
 src/shared/ui/Button/index.ts                 |  2 +-
 src/shared/ui/Button/ui/Button.test.tsx       |  1 -
 src/shared/ui/Card/index.ts                   |  2 +-
 src/shared/ui/Card/ui/Card.stories.tsx        |  2 +-
 src/shared/ui/Card/ui/Card.test.tsx           |  3 +-
 src/shared/ui/Input/ui/Input.test.tsx         |  5 +-
 src/shared/ui/Input/ui/Input.tsx              |  2 +-
 src/shared/ui/Section/index.ts                |  4 +-
 src/shared/ui/Section/ui/Section.stories.tsx  |  2 +-
 src/shared/ui/Section/ui/Section.test.tsx     |  7 +-
 .../ui/TechStack/ui/TechStack.stories.tsx     |  2 +-
 src/shared/ui/TechStack/ui/TechStack.test.tsx |  5 +-
 src/shared/ui/TechStack/ui/TechStack.tsx      |  4 +-
 src/widgets/Navigation/index.ts               |  2 +-
 src/widgets/Navigation/ui/MobileNav.test.tsx  |  5 +-
 src/widgets/Navigation/ui/MobileNav.tsx       |  2 +
 src/widgets/Navigation/ui/SidebarNav.test.tsx |  1 -
 src/widgets/Navigation/ui/SidebarNav.tsx      |  7 +-
 src/widgets/Navigation/ui/UtilityBar.test.tsx |  1 -
 tsconfig.json                                 |  1 +
 42 files changed, 116 insertions(+), 130 deletions(-)

diff --git a/.gitignore b/.gitignore
index 2fc9084..ed89f8b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -20,6 +20,8 @@
 # production
 /build
 
+/docs
+
 # misc
 .DS_Store
 *.pem
diff --git a/src/entities/Section/ui/SectionAccordion/SectionAccordion.stories.tsx b/src/entities/Section/ui/SectionAccordion/SectionAccordion.stories.tsx
index 6a98d0f..1ad4866 100644
--- a/src/entities/Section/ui/SectionAccordion/SectionAccordion.stories.tsx
+++ b/src/entities/Section/ui/SectionAccordion/SectionAccordion.stories.tsx
@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from '@storybook/nextjs-vite'
-import { SectionAccordion } from './SectionAccordion'
+import type { Meta, StoryObj } from '@storybook/nextjs-vite';
+import { SectionAccordion } from './SectionAccordion';
 
 const meta: Meta<typeof SectionAccordion> = {
   title: 'Shared/SectionAccordion',
@@ -11,11 +11,11 @@ const meta: Meta<typeof SectionAccordion> = {
       </div>
     ),
   ],
-}
+};
 
-export default meta
+export default meta;
 
-type Story = StoryObj<typeof SectionAccordion>
+type Story = StoryObj<typeof SectionAccordion>;
 
 export const Active: Story = {
   args: {
@@ -24,11 +24,9 @@ export const Active: Story = {
     id: 'bio',
     isActive: true,
     onClick: () => {},
-    children: (
-      <p>This is the expanded section content. It is visible because isActive is true.</p>
-    ),
+    children: <p>This is the expanded section content. It is visible because isActive is true.</p>,
   },
-}
+};
 
 export const Collapsed: Story = {
   args: {
@@ -37,8 +35,6 @@ export const Collapsed: Story = {
     id: 'work',
     isActive: false,
     onClick: () => console.log('section clicked'),
-    children: (
-      <p>This content is hidden in collapsed state.</p>
-    ),
+    children: <p>This content is hidden in collapsed state.</p>,
   },
-}
+};
diff --git a/src/entities/Section/ui/SectionAccordion/SectionAccordion.test.tsx b/src/entities/Section/ui/SectionAccordion/SectionAccordion.test.tsx
index e68d60b..2d01031 100644
--- a/src/entities/Section/ui/SectionAccordion/SectionAccordion.test.tsx
+++ b/src/entities/Section/ui/SectionAccordion/SectionAccordion.test.tsx
@@ -1,7 +1,6 @@
-import { describe, it, expect, vi } from 'vitest'
-import { render, screen } from '@testing-library/react'
-import userEvent from '@testing-library/user-event'
-import { SectionAccordion } from './SectionAccordion'
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { SectionAccordion } from './SectionAccordion';
 
 const defaultProps = {
   number: '01',
@@ -10,48 +9,48 @@ const defaultProps = {
   isActive: false,
   onClick: vi.fn(),
   children: <p>Content here</p>,
-}
+};
 
 describe('SectionAccordion', () => {
   describe('collapsed state (isActive=false)', () => {
     it('renders a section element with the given id', () => {
-      const { container } = render(<SectionAccordion {...defaultProps} />)
-      expect(container.querySelector('section#about')).toBeInTheDocument()
-    })
+      const { container } = render(<SectionAccordion {...defaultProps} />);
+      expect(container.querySelector('section#about')).toBeInTheDocument();
+    });
     it('renders a button with number and title', () => {
-      render(<SectionAccordion {...defaultProps} />)
-      expect(screen.getByRole('button', { name: /01.*About/i })).toBeInTheDocument()
-    })
+      render(<SectionAccordion {...defaultProps} />);
+      expect(screen.getByRole('button', { name: /01.*About/i })).toBeInTheDocument();
+    });
     it('does not render children', () => {
-      render(<SectionAccordion {...defaultProps} />)
-      expect(screen.queryByText('Content here')).not.toBeInTheDocument()
-    })
+      render(<SectionAccordion {...defaultProps} />);
+      expect(screen.queryByText('Content here')).not.toBeInTheDocument();
+    });
     it('calls onClick when button is clicked', async () => {
-      const onClick = vi.fn()
-      render(<SectionAccordion {...defaultProps} onClick={onClick} />)
-      await userEvent.click(screen.getByRole('button'))
-      expect(onClick).toHaveBeenCalledOnce()
-    })
-  })
+      const onClick = vi.fn();
+      render(<SectionAccordion {...defaultProps} onClick={onClick} />);
+      await userEvent.click(screen.getByRole('button'));
+      expect(onClick).toHaveBeenCalledOnce();
+    });
+  });
 
   describe('active state (isActive=true)', () => {
-    const activeProps = { ...defaultProps, isActive: true }
+    const activeProps = { ...defaultProps, isActive: true };
 
     it('renders an h1 with number and title', () => {
-      render(<SectionAccordion {...activeProps} />)
-      expect(screen.getByRole('heading', { level: 1, name: /01.*About/i })).toBeInTheDocument()
-    })
+      render(<SectionAccordion {...activeProps} />);
+      expect(screen.getByRole('heading', { level: 1, name: /01.*About/i })).toBeInTheDocument();
+    });
     it('renders children', () => {
-      render(<SectionAccordion {...activeProps} />)
-      expect(screen.getByText('Content here')).toBeInTheDocument()
-    })
+      render(<SectionAccordion {...activeProps} />);
+      expect(screen.getByText('Content here')).toBeInTheDocument();
+    });
     it('does not render a button', () => {
-      render(<SectionAccordion {...activeProps} />)
-      expect(screen.queryByRole('button')).not.toBeInTheDocument()
-    })
+      render(<SectionAccordion {...activeProps} />);
+      expect(screen.queryByRole('button')).not.toBeInTheDocument();
+    });
     it('content wrapper has animate-fadeIn class', () => {
-      const { container } = render(<SectionAccordion {...activeProps} />)
-      expect(container.querySelector('.animate-fadeIn')).toBeInTheDocument()
-    })
-  })
-})
+      const { container } = render(<SectionAccordion {...activeProps} />);
+      expect(container.querySelector('.animate-fadeIn')).toBeInTheDocument();
+    });
+  });
+});
diff --git a/src/entities/Section/ui/SectionAccordion/SectionAccordion.tsx b/src/entities/Section/ui/SectionAccordion/SectionAccordion.tsx
index 88fc0de..27efb08 100644
--- a/src/entities/Section/ui/SectionAccordion/SectionAccordion.tsx
+++ b/src/entities/Section/ui/SectionAccordion/SectionAccordion.tsx
@@ -1,30 +1,30 @@
-import type { ReactNode } from 'react'
+import type { ReactNode } from 'react';
 
 interface SectionAccordionProps {
   /**
    * Display number prefix (e.g. "01")
    */
-  number: string
+  number: string;
   /**
    * Section title
    */
-  title: string
+  title: string;
   /**
    * HTML id for anchor navigation
    */
-  id: string
+  id: string;
   /**
    * Whether this section is expanded
    */
-  isActive: boolean
+  isActive: boolean;
   /**
    * Called when the collapsed header is clicked
    */
-  onClick: () => void
+  onClick: () => void;
   /**
    * Section content, shown when active
    */
-  children: ReactNode
+  children: ReactNode;
 }
 
 /**
@@ -43,12 +43,11 @@ export function SectionAccordion({ number, title, id, isActive, onClick, childre
               {number}. {title}
             </h1>
           </div>
-          <div className="animate-fadeIn">
-            {children}
-          </div>
+          <div className="animate-fadeIn">{children}</div>
         </div>
       ) : (
         <button
+          type="button"
           onClick={onClick}
           className="w-full text-left mb-3 py-3 transition-all duration-200 hover:opacity-60 group"
         >
@@ -61,5 +60,5 @@ export function SectionAccordion({ number, title, id, isActive, onClick, childre
         </button>
       )}
     </section>
-  )
+  );
 }
diff --git a/src/entities/Section/ui/SectionAccordion/index.ts b/src/entities/Section/ui/SectionAccordion/index.ts
index 09d3e82..25000d2 100644
--- a/src/entities/Section/ui/SectionAccordion/index.ts
+++ b/src/entities/Section/ui/SectionAccordion/index.ts
@@ -1 +1 @@
-export * from './SectionAccordion'
+export * from './SectionAccordion';
diff --git a/src/entities/Section/ui/index.ts b/src/entities/Section/ui/index.ts
index 09d3e82..25000d2 100644
--- a/src/entities/Section/ui/index.ts
+++ b/src/entities/Section/ui/index.ts
@@ -1 +1 @@
-export * from './SectionAccordion'
+export * from './SectionAccordion';
diff --git a/src/entities/experience/ui/ExperienceCard.test.tsx b/src/entities/experience/ui/ExperienceCard.test.tsx
index fd53874..4f80111 100644
--- a/src/entities/experience/ui/ExperienceCard.test.tsx
+++ b/src/entities/experience/ui/ExperienceCard.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { ExperienceCard } from './ExperienceCard';
 
diff --git a/src/entities/index.ts b/src/entities/index.ts
index 6f47d12..084a7e6 100644
--- a/src/entities/index.ts
+++ b/src/entities/index.ts
@@ -1,2 +1,2 @@
-export * from './project';
 export * from './experience';
+export * from './project';
diff --git a/src/entities/project/index.ts b/src/entities/project/index.ts
index 705e072..d3f3649 100644
--- a/src/entities/project/index.ts
+++ b/src/entities/project/index.ts
@@ -1,3 +1,3 @@
-export { ProjectMetadata } from './ui/ProjectMetadata';
-export { ProjectCard } from './ui/ProjectCard';
 export { DetailedProjectCard } from './ui/DetailedProjectCard';
+export { ProjectCard } from './ui/ProjectCard';
+export { ProjectMetadata } from './ui/ProjectMetadata';
diff --git a/src/entities/project/ui/DetailedProjectCard.test.tsx b/src/entities/project/ui/DetailedProjectCard.test.tsx
index 4f86de2..140e951 100644
--- a/src/entities/project/ui/DetailedProjectCard.test.tsx
+++ b/src/entities/project/ui/DetailedProjectCard.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { DetailedProjectCard } from './DetailedProjectCard';
 
@@ -78,13 +77,12 @@ describe('DetailedProjectCard', () => {
 
     it('renders image when imageUrl is provided', () => {
       render(<DetailedProjectCard {...DEFAULT_PROPS} imageUrl="/detail.jpg" />);
-      const img = screen.getByRole('img');
-      expect(img).toHaveAttribute('src', '/detail.jpg');
+      expect(screen.getByRole('img')).toBeInTheDocument();
     });
 
     it('image wrapper has aspect-video and brutal-border when imageUrl is provided', () => {
       const { container } = render(<DetailedProjectCard {...DEFAULT_PROPS} imageUrl="/detail.jpg" />);
-      const imgWrapper = container.querySelector('img')!.parentElement;
+      const imgWrapper = container.querySelector('img')?.parentElement;
       expect(imgWrapper).toHaveClass('aspect-video', 'brutal-border');
     });
   });
diff --git a/src/entities/project/ui/DetailedProjectCard.tsx b/src/entities/project/ui/DetailedProjectCard.tsx
index 25c0ed6..ca9a2d9 100644
--- a/src/entities/project/ui/DetailedProjectCard.tsx
+++ b/src/entities/project/ui/DetailedProjectCard.tsx
@@ -1,3 +1,4 @@
+import Image from 'next/image';
 import { Card } from '$shared/ui';
 import { ProjectMetadata } from './ProjectMetadata';
 
@@ -53,14 +54,14 @@ export function DetailedProjectCard({ title, year, role, stack, description, det
           <p className="text-lg mb-6">{description}</p>
 
           {imageUrl && (
-            <div className="brutal-border aspect-video bg-slate-indigo overflow-hidden">
-              <img src={imageUrl} alt={title} className="w-full h-full object-cover" />
+            <div className="brutal-border aspect-video bg-slate-indigo overflow-hidden relative">
+              <Image src={imageUrl} alt={title} fill className="object-cover" />
             </div>
           )}
 
           <div className="max-w-[700px] space-y-4 brutal-border-top pt-6">
-            {details.map((detail, index) => (
-              <p key={index} className="text-base">
+            {details.map((detail) => (
+              <p key={detail} className="text-base">
                 {detail}
               </p>
             ))}
diff --git a/src/entities/project/ui/ProjectCard.test.tsx b/src/entities/project/ui/ProjectCard.test.tsx
index d757241..90af4ef 100644
--- a/src/entities/project/ui/ProjectCard.test.tsx
+++ b/src/entities/project/ui/ProjectCard.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { ProjectCard } from './ProjectCard';
 
@@ -73,13 +72,12 @@ describe('ProjectCard', () => {
 
     it('renders image when imageUrl is provided', () => {
       render(<ProjectCard {...DEFAULT_PROPS} imageUrl="/project.jpg" />);
-      const img = screen.getByRole('img');
-      expect(img).toHaveAttribute('src', '/project.jpg');
+      expect(screen.getByRole('img')).toBeInTheDocument();
     });
 
     it('image wrapper has aspect-video and overflow-hidden when imageUrl is provided', () => {
       const { container } = render(<ProjectCard {...DEFAULT_PROPS} imageUrl="/project.jpg" />);
-      const imgWrapper = container.querySelector('img')!.parentElement;
+      const imgWrapper = container.querySelector('img')?.parentElement;
       expect(imgWrapper).toHaveClass('aspect-video', 'overflow-hidden', 'brutal-border');
     });
   });
diff --git a/src/entities/project/ui/ProjectCard.tsx b/src/entities/project/ui/ProjectCard.tsx
index a41b588..28faa8b 100644
--- a/src/entities/project/ui/ProjectCard.tsx
+++ b/src/entities/project/ui/ProjectCard.tsx
@@ -1,5 +1,6 @@
-import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter, Button } from '$shared/ui';
+import Image from 'next/image';
 import { cn } from '$shared/lib';
+import { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '$shared/ui';
 
 type Props = {
   /**
@@ -44,8 +45,8 @@ export function ProjectCard({ title, year, description, tags, imageUrl }: Props)
       </CardHeader>
 
       {imageUrl && (
-        <div className="brutal-border my-6 aspect-video bg-slate-indigo overflow-hidden">
-          <img src={imageUrl} alt={title} className="w-full h-full object-cover" />
+        <div className="brutal-border my-6 aspect-video bg-slate-indigo overflow-hidden relative">
+          <Image src={imageUrl} alt={title} fill className="object-cover" />
         </div>
       )}
 
diff --git a/src/entities/project/ui/ProjectMetadata.test.tsx b/src/entities/project/ui/ProjectMetadata.test.tsx
index 3f4161f..ef5770b 100644
--- a/src/entities/project/ui/ProjectMetadata.test.tsx
+++ b/src/entities/project/ui/ProjectMetadata.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { ProjectMetadata } from './ProjectMetadata';
 
@@ -51,19 +50,19 @@ describe('ProjectMetadata', () => {
 
     it('year section has no brutal-border-top (first section)', () => {
       const { container } = render(<ProjectMetadata {...DEFAULT_PROPS} />);
-      const sections = container.firstChild!.childNodes;
+      const sections = container.firstChild?.childNodes;
       expect(sections[0]).not.toHaveClass('brutal-border-top');
     });
 
     it('role section has brutal-border-top and pt-6', () => {
       const { container } = render(<ProjectMetadata {...DEFAULT_PROPS} />);
-      const sections = container.firstChild!.childNodes;
+      const sections = container.firstChild?.childNodes;
       expect(sections[1]).toHaveClass('brutal-border-top', 'pt-6');
     });
 
     it('stack section has brutal-border-top and pt-6', () => {
       const { container } = render(<ProjectMetadata {...DEFAULT_PROPS} />);
-      const sections = container.firstChild!.childNodes;
+      const sections = container.firstChild?.childNodes;
       expect(sections[2]).toHaveClass('brutal-border-top', 'pt-6');
     });
 
diff --git a/src/shared/api/index.ts b/src/shared/api/index.ts
index 70f3c79..d860d06 100644
--- a/src/shared/api/index.ts
+++ b/src/shared/api/index.ts
@@ -1,2 +1,2 @@
-export * from './types';
 export * from './client';
+export * from './types';
diff --git a/src/shared/api/types.ts b/src/shared/api/types.ts
index a640d9b..453d68b 100644
--- a/src/shared/api/types.ts
+++ b/src/shared/api/types.ts
@@ -21,14 +21,13 @@ export type BaseRecord = {
   /**
    * Record last update timestamp (ISO 8601)
    */
-    updated: string;
-  };
-
-  /**
-   * PocketBase collection for simple text blocks (Intro, Bio).
-   */
-  export type PageContentRecord = BaseRecord & {
+  updated: string;
+};
 
+/**
+ * PocketBase collection for simple text blocks (Intro, Bio).
+ */
+export type PageContentRecord = BaseRecord & {
   /**
    * Slug corresponding to the parent section
    */
diff --git a/src/shared/index.ts b/src/shared/index.ts
index bdcbcdb..49f26a6 100644
--- a/src/shared/index.ts
+++ b/src/shared/index.ts
@@ -1,3 +1,3 @@
-export * from './ui';
-export * from './lib';
 export * from './api';
+export * from './lib';
+export * from './ui';
diff --git a/src/shared/lib/cn.test.ts b/src/shared/lib/cn.test.ts
index d6163cf..7b13bbf 100644
--- a/src/shared/lib/cn.test.ts
+++ b/src/shared/lib/cn.test.ts
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { cn } from './cn';
 
 describe('cn', () => {
diff --git a/src/shared/lib/cn.ts b/src/shared/lib/cn.ts
index e5aba12..99c92fd 100644
--- a/src/shared/lib/cn.ts
+++ b/src/shared/lib/cn.ts
@@ -1,4 +1,4 @@
-import { clsx, type ClassValue } from 'clsx';
+import { type ClassValue, clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 
 /**
diff --git a/src/shared/lib/formatDate.test.ts b/src/shared/lib/formatDate.test.ts
index 02ff72e..c4e0518 100644
--- a/src/shared/lib/formatDate.test.ts
+++ b/src/shared/lib/formatDate.test.ts
@@ -1,4 +1,3 @@
-import { describe, expect, it } from 'vitest';
 import { formatYearRange } from './formatDate';
 
 describe('formatYearRange', () => {
diff --git a/src/shared/ui/Badge/index.ts b/src/shared/ui/Badge/index.ts
index fc21fb9..774798f 100644
--- a/src/shared/ui/Badge/index.ts
+++ b/src/shared/ui/Badge/index.ts
@@ -1,2 +1,2 @@
-export { Badge } from './ui/Badge';
 export type { BadgeVariant } from './ui/Badge';
+export { Badge } from './ui/Badge';
diff --git a/src/shared/ui/Badge/ui/Badge.test.tsx b/src/shared/ui/Badge/ui/Badge.test.tsx
index 1dda3cd..d64295c 100644
--- a/src/shared/ui/Badge/ui/Badge.test.tsx
+++ b/src/shared/ui/Badge/ui/Badge.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { Badge } from './Badge';
 
diff --git a/src/shared/ui/Button/index.ts b/src/shared/ui/Button/index.ts
index 5ba8d18..24cb05f 100644
--- a/src/shared/ui/Button/index.ts
+++ b/src/shared/ui/Button/index.ts
@@ -1,2 +1,2 @@
+export type { ButtonSize, ButtonVariant } from './ui/Button';
 export { Button } from './ui/Button';
-export type { ButtonVariant, ButtonSize } from './ui/Button';
diff --git a/src/shared/ui/Button/ui/Button.test.tsx b/src/shared/ui/Button/ui/Button.test.tsx
index ffa2d81..7ad5775 100644
--- a/src/shared/ui/Button/ui/Button.test.tsx
+++ b/src/shared/ui/Button/ui/Button.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect, vi } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { Button } from './Button';
diff --git a/src/shared/ui/Card/index.ts b/src/shared/ui/Card/index.ts
index 4c0afdc..e15b0d7 100644
--- a/src/shared/ui/Card/index.ts
+++ b/src/shared/ui/Card/index.ts
@@ -1,2 +1,2 @@
-export { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from './ui/Card';
 export type { CardBackground } from './ui/Card';
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './ui/Card';
diff --git a/src/shared/ui/Card/ui/Card.stories.tsx b/src/shared/ui/Card/ui/Card.stories.tsx
index 6aa8002..a5e62d3 100644
--- a/src/shared/ui/Card/ui/Card.stories.tsx
+++ b/src/shared/ui/Card/ui/Card.stories.tsx
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/nextjs-vite';
-import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from './Card';
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './Card';
 
 const meta: Meta<typeof Card> = {
   title: 'Shared/Card',
diff --git a/src/shared/ui/Card/ui/Card.test.tsx b/src/shared/ui/Card/ui/Card.test.tsx
index 3148804..6ad0e0e 100644
--- a/src/shared/ui/Card/ui/Card.test.tsx
+++ b/src/shared/ui/Card/ui/Card.test.tsx
@@ -1,6 +1,5 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
-import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from './Card';
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './Card';
 
 describe('Card', () => {
   describe('rendering', () => {
diff --git a/src/shared/ui/Input/ui/Input.test.tsx b/src/shared/ui/Input/ui/Input.test.tsx
index 814650a..407bf4b 100644
--- a/src/shared/ui/Input/ui/Input.test.tsx
+++ b/src/shared/ui/Input/ui/Input.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { Input, Textarea } from './Input';
 
@@ -35,7 +34,7 @@ describe('Input', () => {
       const input = screen.getByRole('textbox');
       const errorId = input.getAttribute('aria-describedby');
       expect(errorId).toBeTruthy();
-      expect(document.getElementById(errorId!)).toHaveTextContent('Required');
+      expect(document.getElementById(errorId as string)).toHaveTextContent('Required');
     });
     it('no aria-describedby when no error', () => {
       render(<Input />);
@@ -100,7 +99,7 @@ describe('Textarea', () => {
       const textarea = screen.getByRole('textbox');
       const errorId = textarea.getAttribute('aria-describedby');
       expect(errorId).toBeTruthy();
-      expect(document.getElementById(errorId!)).toHaveTextContent('Too short');
+      expect(document.getElementById(errorId as string)).toHaveTextContent('Too short');
     });
     it('no aria-describedby when no error', () => {
       render(<Textarea />);
diff --git a/src/shared/ui/Input/ui/Input.tsx b/src/shared/ui/Input/ui/Input.tsx
index bbd9591..11d51a6 100644
--- a/src/shared/ui/Input/ui/Input.tsx
+++ b/src/shared/ui/Input/ui/Input.tsx
@@ -1,4 +1,4 @@
-import { useId, type InputHTMLAttributes, type TextareaHTMLAttributes } from 'react';
+import { type InputHTMLAttributes, type TextareaHTMLAttributes, useId } from 'react';
 import { cn } from '$shared/lib';
 
 interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
diff --git a/src/shared/ui/Section/index.ts b/src/shared/ui/Section/index.ts
index 8cce92c..caa2678 100644
--- a/src/shared/ui/Section/index.ts
+++ b/src/shared/ui/Section/index.ts
@@ -1,2 +1,2 @@
-export { Section, Container } from './ui/Section';
-export type { SectionBackground, ContainerSize } from './ui/Section';
+export type { ContainerSize, SectionBackground } from './ui/Section';
+export { Container, Section } from './ui/Section';
diff --git a/src/shared/ui/Section/ui/Section.stories.tsx b/src/shared/ui/Section/ui/Section.stories.tsx
index 575daf7..7601dad 100644
--- a/src/shared/ui/Section/ui/Section.stories.tsx
+++ b/src/shared/ui/Section/ui/Section.stories.tsx
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/nextjs-vite';
-import { Section, Container } from './Section';
+import { Container, Section } from './Section';
 
 const meta: Meta<typeof Section> = {
   title: 'Shared/Section',
diff --git a/src/shared/ui/Section/ui/Section.test.tsx b/src/shared/ui/Section/ui/Section.test.tsx
index b22acbb..f8a255a 100644
--- a/src/shared/ui/Section/ui/Section.test.tsx
+++ b/src/shared/ui/Section/ui/Section.test.tsx
@@ -1,6 +1,5 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
-import { Section, Container } from './Section';
+import { Container, Section } from './Section';
 
 describe('Section', () => {
   describe('rendering', () => {
@@ -36,13 +35,13 @@ describe('Section', () => {
   describe('bordered', () => {
     it('no border classes by default', () => {
       const { container } = render(<Section>x</Section>);
-      const el = container.querySelector('section')!;
+      const el = container.querySelector('section') as HTMLElement;
       expect(el).not.toHaveClass('brutal-border-top');
       expect(el).not.toHaveClass('brutal-border-bottom');
     });
     it('adds top and bottom borders when bordered=true', () => {
       const { container } = render(<Section bordered>x</Section>);
-      const el = container.querySelector('section')!;
+      const el = container.querySelector('section') as HTMLElement;
       expect(el).toHaveClass('brutal-border-top');
       expect(el).toHaveClass('brutal-border-bottom');
     });
diff --git a/src/shared/ui/TechStack/ui/TechStack.stories.tsx b/src/shared/ui/TechStack/ui/TechStack.stories.tsx
index 2b3aa86..777e0dd 100644
--- a/src/shared/ui/TechStack/ui/TechStack.stories.tsx
+++ b/src/shared/ui/TechStack/ui/TechStack.stories.tsx
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/nextjs-vite';
-import { TechStackGrid, TechStackBrick } from './TechStack';
+import { TechStackBrick, TechStackGrid } from './TechStack';
 
 const meta: Meta<typeof TechStackGrid> = {
   title: 'Shared/TechStack',
diff --git a/src/shared/ui/TechStack/ui/TechStack.test.tsx b/src/shared/ui/TechStack/ui/TechStack.test.tsx
index 76426ba..40e472f 100644
--- a/src/shared/ui/TechStack/ui/TechStack.test.tsx
+++ b/src/shared/ui/TechStack/ui/TechStack.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { TechStackBrick, TechStackGrid } from './TechStack';
 
@@ -41,11 +40,11 @@ describe('TechStackGrid', () => {
     });
     it('renders correct number of bricks', () => {
       const { container } = render(<TechStackGrid skills={['A', 'B', 'C']} />);
-      expect(container.firstChild!.childNodes).toHaveLength(3);
+      expect(container.firstChild?.childNodes).toHaveLength(3);
     });
     it('renders empty grid with no skills', () => {
       const { container } = render(<TechStackGrid skills={[]} />);
-      expect(container.firstChild!.childNodes).toHaveLength(0);
+      expect(container.firstChild?.childNodes).toHaveLength(0);
     });
   });
 
diff --git a/src/shared/ui/TechStack/ui/TechStack.tsx b/src/shared/ui/TechStack/ui/TechStack.tsx
index 86292c1..67fd665 100644
--- a/src/shared/ui/TechStack/ui/TechStack.tsx
+++ b/src/shared/ui/TechStack/ui/TechStack.tsx
@@ -47,8 +47,8 @@ export function TechStackGrid({ skills, className }: TechStackGridProps) {
     <div
       className={cn('grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 gap-4', className)}
     >
-      {skills.map((skill, index) => (
-        <TechStackBrick key={index} name={skill} />
+      {skills.map((skill) => (
+        <TechStackBrick key={skill} name={skill} />
       ))}
     </div>
   );
diff --git a/src/widgets/Navigation/index.ts b/src/widgets/Navigation/index.ts
index 3745917..d7cb7c5 100644
--- a/src/widgets/Navigation/index.ts
+++ b/src/widgets/Navigation/index.ts
@@ -1,4 +1,4 @@
+export type { NavItem } from './model/types';
 export { MobileNav } from './ui/MobileNav';
 export { SidebarNav } from './ui/SidebarNav';
 export { UtilityBar } from './ui/UtilityBar';
-export type { NavItem } from './model/types';
diff --git a/src/widgets/Navigation/ui/MobileNav.test.tsx b/src/widgets/Navigation/ui/MobileNav.test.tsx
index 478e964..d00c34e 100644
--- a/src/widgets/Navigation/ui/MobileNav.test.tsx
+++ b/src/widgets/Navigation/ui/MobileNav.test.tsx
@@ -1,8 +1,7 @@
-import { describe, it, expect, vi } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { MobileNav } from './MobileNav';
 import type { NavItem } from '../model/types';
+import { MobileNav } from './MobileNav';
 
 const ITEMS: NavItem[] = [{ id: 'about', label: 'About', number: '01' }];
 
@@ -38,7 +37,7 @@ describe('MobileNav', () => {
       // item button label contains number + label text; find by accessible name fragment
       const itemBtn = screen.getAllByRole('button').find((b) => b.textContent?.includes('About'));
       expect(itemBtn).toBeDefined();
-      await userEvent.click(itemBtn!);
+      await userEvent.click(itemBtn as HTMLElement);
       expect(screen.queryByText('Close')).not.toBeInTheDocument();
       expect(screen.getByRole('button', { name: 'Menu' })).toBeInTheDocument();
     });
diff --git a/src/widgets/Navigation/ui/MobileNav.tsx b/src/widgets/Navigation/ui/MobileNav.tsx
index dccc0b0..12142ca 100644
--- a/src/widgets/Navigation/ui/MobileNav.tsx
+++ b/src/widgets/Navigation/ui/MobileNav.tsx
@@ -34,6 +34,7 @@ export function MobileNav({ items }: Props) {
       <div className="px-6 py-4 flex items-center justify-between">
         <h4>allmy.work</h4>
         <button
+          type="button"
           onClick={() => setIsOpen((prev) => !prev)}
           className="brutal-border px-4 py-2 bg-carbon-black text-ochre-clay"
         >
@@ -44,6 +45,7 @@ export function MobileNav({ items }: Props) {
         <div className="px-6 py-6 brutal-border-top space-y-2 max-h-[80vh] overflow-y-auto">
           {items.map((item) => (
             <button
+              type="button"
               key={item.id}
               onClick={() => scrollToSection(item.id)}
               className="w-full text-left brutal-border bg-ochre-clay px-4 py-3"
diff --git a/src/widgets/Navigation/ui/SidebarNav.test.tsx b/src/widgets/Navigation/ui/SidebarNav.test.tsx
index 6ed1281..4716a7e 100644
--- a/src/widgets/Navigation/ui/SidebarNav.test.tsx
+++ b/src/widgets/Navigation/ui/SidebarNav.test.tsx
@@ -1,5 +1,4 @@
 import { render, screen } from '@testing-library/react';
-import { beforeEach, describe, expect, it, vi } from 'vitest';
 import type { NavItem } from '../model/types';
 import { SidebarNav } from './SidebarNav';
 
diff --git a/src/widgets/Navigation/ui/SidebarNav.tsx b/src/widgets/Navigation/ui/SidebarNav.tsx
index 852b17a..4eea38b 100644
--- a/src/widgets/Navigation/ui/SidebarNav.tsx
+++ b/src/widgets/Navigation/ui/SidebarNav.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useState, useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import { cn } from '$shared/lib';
 import type { NavItem } from '../model/types';
 
@@ -31,7 +31,9 @@ export function SidebarNav({ items }: Props) {
 
     items.forEach((item) => {
       const el = document.getElementById(item.id);
-      if (el) observer.observe(el);
+      if (el) {
+        observer.observe(el);
+      }
     });
 
     return () => observer.disconnect();
@@ -62,6 +64,7 @@ export function SidebarNav({ items }: Props) {
           const isActive = activeSection === item.id;
           return (
             <button
+              type="button"
               key={item.id}
               onClick={() => scrollToSection(item.id)}
               className={cn(
diff --git a/src/widgets/Navigation/ui/UtilityBar.test.tsx b/src/widgets/Navigation/ui/UtilityBar.test.tsx
index 3ee4c26..af06023 100644
--- a/src/widgets/Navigation/ui/UtilityBar.test.tsx
+++ b/src/widgets/Navigation/ui/UtilityBar.test.tsx
@@ -1,4 +1,3 @@
-import { describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { UtilityBar } from './UtilityBar';
 
diff --git a/tsconfig.json b/tsconfig.json
index f19c003..d3c3b5c 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -18,6 +18,7 @@
         "name": "next"
       }
     ],
+    "types": ["vitest/globals"],
     "paths": {
       "@/*": ["./*"],
       "$shared/*": ["./src/shared/*"],