🐛 Bug Report: Multiple Code Quality and Safety Issues Found

[alexanderop]

Bug Report: Code Quality and Safety Issues

This issue documents various bugs and code quality problems found during a comprehensive codebase analysis.

1. TypeScript Issues

Use of any type (violates project guidelines)

• /server/routes/robots.txt.ts - Multiple uses of any via @ts-nocheck
• /types/index.d.ts - Potential for stricter typing

Use of unknown type

• /composables/useModalStore.ts:4 - props?: Record<string, unknown> could be better typed

2. ESLint Violations

Use of let instead of const (violates style guide)

• /composables/useModalStore.ts:8 - let id = 0 (global mutable state issue)
• /composables/useTableOfContents.ts:101 - let selectedHeading: HTMLElement | null = null
• /server/routes/robots.txt.ts:5 - let siteUrl = 'https://example.com'
• /components/BlogPosts.vue:34 - let query = queryCollection('posts')
• /eslint-plugin-vue35/rules/query-collection-in-async-data.js:13 - for (let i = functionStack.length - 1; i >= 0; i--)

Console statements in production

• /composables/useSeo.ts:16 - console.warn() should be removed or conditionally included

3. Component Bugs

Missing Error Handling / Null Checks

• ModalController.vue - Missing null check for modalStore.modals.value.length
• TheCommandPalette.vue - Empty catch block in navigation (lines 38-44)
• BaseNavLink.vue - Potential null reference when accessing to.path on string type
• BlogPosts.vue - Catches errors but doesn't expose them to template for user feedback

Memory Leaks

• BaseModal.vue - MutationObserver not cleaned up if component unmounts before modal opens
• CommandPalette.vue - Keyboard event listeners might not be cleaned up properly
• useTableOfContents.ts - Observer not disconnected on error in createObserver

Other Issues

• TableOfContentsNode.vue:29 - Dynamic class ml-${currentDepth.value * 3} won't work with UnoCSS
• ShareLinks.vue:25 - window.location.href access needs typeof window \!== 'undefined' check
• useSearch composable - Race condition in onMounted if component unmounts quickly

4. Server Route Issues

TypeScript Suppression

• /server/routes/rss.xml.ts:1-2 - Uses @ts-nocheck and disables ESLint rules instead of fixing types

Missing Error Handling

• /server/routes/rss.xml.ts - No try-catch around async operations or queryCollection
• /server/routes/robots.txt.ts - No validation for config values

5. Architecture Issues

Global State Management

• /composables/useModalStore.ts:8 - Global mutable let id = 0 outside function scope could cause issues in SSR

Severity Levels

• High: Memory leaks, missing error handling, global mutable state
• Medium: Type safety issues, missing null checks
• Low: Code style violations, console statements

Recommended Actions

1. Add proper TypeScript types instead of using any or @ts-nocheck
2. Replace all let declarations with const where possible
3. Add proper error handling and user feedback in components
4. Fix memory leaks by ensuring all observers/listeners are cleaned up
5. Add null checks and type guards where needed
6. Use predefined CSS classes instead of dynamic generation for UnoCSS
7. Add proper SSR guards for browser-only APIs

Impact

These issues could lead to:

• Runtime errors in production
• Memory leaks affecting performance
• Poor user experience due to silent failures
• Potential SSR hydration mismatches
• Type safety violations making the code harder to maintain