feat: add generic interface

components/common/LabelInput.tsx

@@ -1,16 +1,23 @@
 import Input, { type Props as InputProps } from './Input';
 import styled, { css } from 'styled-components';
-import { forwardRef, useState } from 'react';
+import { forwardRef, Ref, useState } from 'react';
 import { colors } from '@/lib/colors';
 import ErrorMessage from './ErrorMessage';
+import { FieldValues, FieldPath } from 'react-hook-form';
 
-interface Props extends InputProps {
+interface Props<
+  TFieldValues extends FieldValues = FieldValues,
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+> extends InputProps {
   label: string;
   errorMessage?: string | false;
 }
 
 const LabelInput = forwardRef<HTMLInputElement, Props>(
-  ({ label, errorMessage, ...rest }: Props, ref) => {
+  <TFieldValues extends FieldValues>(
+    { label, errorMessage, defaultValue, ...rest }: Props<TFieldValues>,
+    ref: Ref<HTMLInputElement> | undefined,
+  ) => {
     const [focused, setFocused] = useState(false);
 
     const onFocus = () => {
@@ -27,7 +34,7 @@ const LabelInput = forwardRef<HTMLInputElement, Props>(
           <Label focused={focused}>{label}</Label>
           <ErrorMessage errorMessage={errorMessage} />
         </Block>
-        <Input {...rest} onFocus={onFocus} onBlur={onBlur} ref={ref} />
+        <Input defaultValue={defaultValue} {...rest} onFocus={onFocus} onBlur={onBlur} ref={ref} />
       </Wrapper>
     );
   },

lib/api/types.ts

@@ -8,7 +8,7 @@ export interface CreateAuctionResponse {
 }
 
 export interface Auctions {
-  pages: any;
+  pages: { content: AuctionContent[] }[];
   totalElements: number;
   totalPages: number;
   sort: Sort;