..

src/entities/transaction/ui/filter/billing-filter.tsx

@@ -10,7 +10,7 @@ import {
   BillingSearchType
 } from '../../model/types';
 import { FilterDateOptions } from '@/entities/common/model/types';
-import { FilterCalendar } from '@/shared/ui/calendar/filter-calendar';
+import { FilterCalendar } from '@/shared/ui/filter/filter-calendar';
 
 export const BillingFilter = ({
   filterOn,

src/shared/ui/filter/filter-calendar.tsx

@@ -2,9 +2,11 @@ import moment from 'moment';
 import { ChangeEvent, useState } from 'react';
 import { FilterDateOptions } from '@/entities/common/model/types';
 import { IMAGE_ROOT } from '@/shared/constants/common';
-import NiceCalendar from './nice-calendar';
+import NiceCalendar from '../calendar/nice-calendar';
+import { useEffect } from 'react';
 
 interface FilterCalendarProps {
+  title?: string;
   startDate: string;
   endDate: string;
   setStartDate: (startDate: string) => void;
@@ -12,11 +14,13 @@ interface FilterCalendarProps {
 };
 
 export const FilterCalendar = ({
+  title,
   startDate,
   endDate,
   setStartDate,
   setEndDate
 }: FilterCalendarProps) => {
+  const [filterTitle, setFilterTitle] = useState<string>(title || '조회기간');
   const [dateReadOnly, setDateReadyOnly] = useState<boolean>(true);
   const [filterDateOptionsBtn, setFilterDateOptionsBtn] = useState<FilterDateOptions>(FilterDateOptions.Input);
   const [filterStartDate, setFilterStartDate] = useState<string>(startDate);
@@ -57,10 +61,13 @@ export const FilterCalendar = ({
     }
   };
 
+  useEffect(() => {
+    
+  }, []);
   return (
     <>
       <div className="opt-field">
-        <div className="opt-label">조회기간</div>
+        <div className="opt-label">{ filterTitle }</div>
         <div className="opt-controls col below h36">
           <div className="chip-row">
             <span