feat: add phone frequency controls and modularize codebase

src/apps/client/ClientBatchTasksPage.tsx

@@ -1,5 +1,6 @@
 import { Fragment, useEffect, useState } from 'react';
 import { Clock3, Eye, FileText, Search, StopCircle } from 'lucide-react';
+import { useSearchParams } from 'react-router-dom';
 import {
   Button,
   DateRangeInput,
@@ -96,12 +97,13 @@ function mapTask(task: SmsBatchTask): BatchTask {
 }
 
 export function ClientBatchTasksPage() {
+  const [searchParams] = useSearchParams();
   const [tasks, setTasks] = useState<BatchTask[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState('');
   const [total, setTotal] = useState(0);
   const [applications, setApplications] = useState<Array<{ id: string; name: string }>>([]);
-  const [keyword, setKeyword] = useState('');
+  const [keyword, setKeyword] = useState(() => searchParams.get('taskNo') ?? '');
   const [application, setApplication] = useState('all');
   const [submittedDateRange, setSubmittedDateRange] = useState<DateRangeValue>({});
   const [hoveredTaskId, setHoveredTaskId] = useState<string | null>(null);