refactor(timesheet): rename filter date range labels

src/components/timesheet/TimesheetFilterBar.tsx

@@ -259,20 +259,18 @@ export default function TimesheetFilterBar({
               type="button"
               onClick={() => setIsExpanded((current) => !current)}
               aria-label={isExpanded ? (labels?.hideFilters || "Hide filters") : (labels?.showFilters || "Filters")}
-              className={`relative inline-flex h-9 w-9 items-center justify-center rounded-md border text-sm transition-colors sm:w-auto sm:gap-2 sm:px-3 ${
+              className={`relative inline-flex h-9 w-9 items-center justify-center rounded-md border text-sm transition-colors ${
                 isExpanded || hasActiveFilters
                   ? "border-sky-200 bg-sky-50 text-sky-700 dark:border-sky-500/30 dark:bg-sky-500/15 dark:text-sky-300"
                   : "border-slate-200 bg-white text-slate-600 hover:border-slate-300 hover:text-slate-900 dark:border-slate-700 dark:bg-slate-800 dark:text-slate-200 dark:hover:border-slate-600 dark:hover:text-white"
               }`}
             >
               <SlidersHorizontal className="h-4 w-4" />
-              <span className="hidden sm:inline">{isExpanded ? (labels?.hideFilters || "Hide filters") : (labels?.showFilters || "Filters")}</span>
               {hasActiveFilters && (
-                <span className="absolute -right-1 -top-1 z-10 inline-flex h-4 min-w-4 items-center justify-center rounded-full bg-sky-600 px-1 text-[10px] font-semibold leading-none text-white dark:bg-sky-500 sm:static sm:z-auto sm:h-auto sm:min-w-5 sm:px-1.5 sm:text-[11px] sm:leading-normal">
+                <span className="absolute -right-1 -top-1 z-10 inline-flex h-4 min-w-4 items-center justify-center rounded-full bg-sky-600 px-1 text-[10px] font-semibold leading-none text-white dark:bg-sky-500">
                   {activeChips.length}
                 </span>
               )}
-              <ChevronDown className={`hidden h-4 w-4 transition-transform sm:inline ${isExpanded ? "rotate-180" : ""}`} />
             </button>
 
             <button
@@ -314,7 +312,7 @@ export default function TimesheetFilterBar({
                 />
               </MiniFilterBlock>
 
-              <MiniFilterBlock icon={<CalendarRange className="h-3.5 w-3.5" />} label={labels?.customTo || "To"}>
+              <MiniFilterBlock icon={<CalendarRange className="h-3.5 w-3.5" />} label={labels?.customTo || "To date"}>
                 <JalaliDatePicker
                   value={draftFilters.startedBefore}
                   onChange={(value) => setDraftFilters((current) => ({ ...current, startedBefore: value }))}

src/locales/en.ts

@@ -378,8 +378,8 @@ export const en = {
     billable: "Billable",
     noTagsHint: "Create tags first from the Tags page.",
     clearFilters: "Clear filters",
-    customFromLabel: "From",
+    customFromLabel: "From date",
-    customToLabel: "To",
+    customToLabel: "To date",
     allClientsLabel: "All clients",
     allProjectsLabel: "All projects",
     allTagsLabel: "All tags",

src/locales/fa.ts

@@ -375,8 +375,8 @@ export const fa = {
     billable: "قابل صورتحساب",
     noTagsHint: "ابتدا از صفحه تگ‌ها، تگ ایجاد کنید.",
     clearFilters: "پاک کردن فیلترها",
-    customFromLabel: "از",
+    customFromLabel: "از تاریخ",
-    customToLabel: "تا",
+    customToLabel: "تا تاریخ",
     allClientsLabel: "همه مشتری‌ها",
     allProjectsLabel: "همه پروژه‌ها",
     allTagsLabel: "همه تگ‌ها",

src/pages/Timesheet.tsx

@@ -2253,23 +2253,40 @@ export default function Timesheet() {
             <div className="flex shrink-0 items-center gap-2">
               {runningEntry ? (
                 <>
-                  <Button variant="destructive" onClick={() => void handleStop(runningEntry)} className="h-10 rounded-md px-4 text-xs font-semibold uppercase">
+                  <Button
-                    {t.timesheet?.stopTimer || "Stop"}
+                    variant="destructive"
-                  </Button>
+                    size="icon"
-                  <Button
+                    onClick={() => void handleStop(runningEntry)}
-                    variant="secondary"
+                    className="h-10 w-10 rounded-md"
-                    onClick={openDiscardTimerModal}
+                    title={t.timesheet?.stopTimer || "Stop"}
-                    disabled={isDiscardingTimer}
+                    aria-label={t.timesheet?.stopTimer || "Stop"}
-                    className="h-10 rounded-md px-4 text-xs font-semibold uppercase"
+                  >
-                  >
+                    <Square className="h-4 w-4 fill-current" />
-                    {isDiscardingTimer ? "..." : ((t.actions as { discard?: string } | undefined)?.discard || "Discard")}
+                  </Button>
-                  </Button>
+                  <Button
-                </>
+                    variant="secondary"
-              ) : (
+                    size="icon"
-                <Button onClick={() => void handleStartTimer()} disabled={isStartingTimer} className="h-10 rounded-md px-4 text-xs font-semibold uppercase">
+                    onClick={openDiscardTimerModal}
-                  {isStartingTimer ? "..." : (t.timesheet?.startTimer || "Start")}
+                    disabled={isDiscardingTimer}
-                </Button>
+                    className="h-10 w-10 rounded-md"
-              )}
+                    title={(t.actions as { discard?: string } | undefined)?.discard || "Discard"}
+                    aria-label={(t.actions as { discard?: string } | undefined)?.discard || "Discard"}
+                  >
+                    {isDiscardingTimer ? "..." : <Trash2 className="h-4 w-4" />}
+                  </Button>
+                </>
+              ) : (
+                <Button
+                  onClick={() => void handleStartTimer()}
+                  disabled={isStartingTimer}
+                  size="icon"
+                  className="h-10 w-10 rounded-md"
+                  title={t.timesheet?.startTimer || "Start"}
+                  aria-label={t.timesheet?.startTimer || "Start"}
+                >
+                  {isStartingTimer ? "..." : <Play className="h-4 w-4 fill-current" />}
+                </Button>
+              )}
             </div>
           </div>
         </div>