Files
livedash-node/components/magicui/scroll-progress.tsx
Kaj Kowalski 93fbb44eec feat: comprehensive Biome linting fixes and code quality improvements
Major code quality overhaul addressing 58% of all linting issues:

• Type Safety Improvements:
  - Replace all any types with proper TypeScript interfaces
  - Fix Map component shadowing (renamed to CountryMap)
  - Add comprehensive custom error classes system
  - Enhance API route type safety

• Accessibility Enhancements:
  - Add explicit button types to all interactive elements
  - Implement useId() hooks for form element accessibility
  - Add SVG title attributes for screen readers
  - Fix static element interactions with keyboard handlers

• React Best Practices:
  - Resolve exhaustive dependencies warnings with useCallback
  - Extract nested component definitions to top level
  - Fix array index keys with proper unique identifiers
  - Improve component organization and prop typing

• Code Organization:
  - Automatic import organization and type import optimization
  - Fix unused function parameters and variables
  - Enhanced error handling with structured error responses
  - Improve component reusability and maintainability

Results: 248 → 104 total issues (58% reduction)
- Fixed all critical type safety and security issues
- Enhanced accessibility compliance significantly
- Improved code maintainability and performance
2025-06-29 07:35:45 +02:00

34 lines
784 B
TypeScript

"use client";
import { type MotionProps, motion, useScroll } from "motion/react";
import React from "react";
import { cn } from "@/lib/utils";
interface ScrollProgressProps
extends Omit<React.HTMLAttributes<HTMLElement>, keyof MotionProps> {
className?: string;
}
export const ScrollProgress = React.forwardRef<
HTMLDivElement,
ScrollProgressProps
>(({ className, ...props }, ref) => {
const { scrollYProgress } = useScroll();
return (
<motion.div
ref={ref}
className={cn(
"fixed inset-x-0 top-0 z-50 h-px origin-left bg-gradient-to-r from-[#A97CF8] via-[#F38CB8] to-[#FDCC92]",
className
)}
style={{
scaleX: scrollYProgress,
}}
{...props}
/>
);
});
ScrollProgress.displayName = "ScrollProgress";