diff --git a/apps/service/src/features/filter-article/ui/FilterButton.tsx b/apps/service/src/features/filter-article/ui/FilterButton.tsx
index a75744bd..3c5481c0 100644
--- a/apps/service/src/features/filter-article/ui/FilterButton.tsx
+++ b/apps/service/src/features/filter-article/ui/FilterButton.tsx
@@ -1,21 +1,20 @@
 'use client'
 
 import React, {
-  DetailedHTMLProps,
-  InputHTMLAttributes,
-  LegacyRef,
+  type ButtonHTMLAttributes,
+  type DetailedHTMLProps,
   forwardRef,
 } from 'react'
 
 const FilterButton = forwardRef<
-  HTMLInputElement,
+  HTMLButtonElement,
   DetailedHTMLProps<
-    InputHTMLAttributes<HTMLButtonElement>,
+    ButtonHTMLAttributes<HTMLButtonElement>,
     HTMLButtonElement
   > & { active?: boolean }
 >(({ type, className, active: isActive = false, onClick, ...props }, ref) => (
   <button
-    ref={ref as LegacyRef<HTMLButtonElement> | undefined}
+    ref={ref}
     type="button"
     className={`flex h-10 items-center justify-center gap-2 rounded-lg px-3 py-2 transition-colors ${
       isActive
diff --git a/apps/service/src/features/subscribe-newsletter/ui/DefaultButton.tsx b/apps/service/src/features/subscribe-newsletter/ui/DefaultButton.tsx
index 8ccfc9e1..144bf11f 100644
--- a/apps/service/src/features/subscribe-newsletter/ui/DefaultButton.tsx
+++ b/apps/service/src/features/subscribe-newsletter/ui/DefaultButton.tsx
@@ -1,18 +1,17 @@
 'use client'
 
 import React, {
-  DetailedHTMLProps,
-  InputHTMLAttributes,
-  LegacyRef,
+  type ButtonHTMLAttributes,
+  type DetailedHTMLProps,
   forwardRef,
 } from 'react'
 
 const DefaultButton = forwardRef<
-  HTMLInputElement,
-  DetailedHTMLProps<InputHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>
+  HTMLButtonElement,
+  DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>
 >(({ children, type, className, ...props }, ref) => (
   <button
-    ref={ref as LegacyRef<HTMLButtonElement> | undefined}
+    ref={ref}
     type="button"
     className="block h-12 w-full rounded-lg bg-gray-700 p-2 text-center font-medium text-gray-50 transition-colors hover:bg-gray-800 disabled:!bg-gray-50 disabled:!text-gray-400 xs:text-lg md:h-10 md:rounded md:text-base dark:bg-gray-50 dark:text-gray-700 dark:hover:bg-gray-100 dark:disabled:!bg-gray-700 dark:disabled:!text-gray-500"
     {...props}>