V1 Release

README.md

@@ -65,6 +65,7 @@ Whether you prefer the **CLI**, **Web Frontend**, or **Flutter Mobile App**, CCS
 <img src="./assets/02_home.png">
 <img src="./assets/03_home.png">
 <img src="./assets/04_home.png">
+<img src="./assets/01_backend_docs.png">
 <p align="center">
   <table align="center">
     <tr>

frontend/src/components/HomeComponents/BottomBar/BottomBar.tsx

@@ -54,9 +54,8 @@ const BottomBar: React.FC<BottomBarProps> = ({
         {/* Filters */}
         <Popover>
           <PopoverTrigger asChild>
-            <Button variant="ghost" className="w-auto px-3">
+            <Button variant="ghost" className="w-auto px-3" aria-label="Filter">
               <Icons.Filter className="h-4 w-4 mr-2" />
-              Filter
             </Button>
           </PopoverTrigger>
           <PopoverContent className="w-auto p-4 flex flex-col gap-4 bg-background border shadow-lg rounded-lg">

frontend/src/components/HomeComponents/Footer/Footer.tsx

@@ -90,7 +90,7 @@ export const Footer = () => {
 
       <section className="container pb-14 text-center">
         <h3>
-          &copy; 2024{' '}
+          &copy; 2025{' '}
           <a
             rel="noreferrer noopener"
             target="_blank"

frontend/src/components/HomeComponents/Navbar/NavbarMobile.tsx

@@ -110,7 +110,7 @@ export const NavbarMobile = (
                     variant: 'secondary',
                   })}`}
                 >
-                  <FileDown className="mr-2 w-5 h-5" />
+                  <FileDown />
                   Export Tasks
                 </div>
               </DialogTrigger>

frontend/src/components/HomeComponents/Tasks/Tasks.tsx

@@ -305,13 +305,20 @@ export const Tasks = (
   const handleIdSort = () => {
     const newOrder = idSortOrder === 'asc' ? 'desc' : 'asc';
     setIdSortOrder(newOrder);
-    setTasks(sortTasksById([...tasks], newOrder));
+    const sorted = sortTasksById([...tasks], newOrder);
+    setTasks(sorted);
+    setTempTasks(sorted);
+    setCurrentPage(1);
   };
 
   const handleSort = () => {
     const newOrder = sortOrder === 'asc' ? 'desc' : 'asc';
     setSortOrder(newOrder);
-    setTasks(sortTasks([...tasks], newOrder));
+    const sorted = sortTasks([...tasks], newOrder);
+    // Keep both states in sync so the table (which renders from tempTasks) reflects the new order
+    setTasks(sorted);
+    setTempTasks(sorted);
+    setCurrentPage(1);
   };
 
   const handleEditClick = (description: string) => {
@@ -450,6 +457,23 @@ export const Tasks = (
         <Button variant="outline" onClick={() => setShowReports(!showReports)}>
           {showReports ? 'Show Tasks' : 'Show Reports'}
         </Button>
+        {/* Mobile-only Sync button (desktop already shows a Sync button with filters) */}
+        <Button
+          className="sm:hidden ml-2"
+          variant="outline"
+          onClick={async () => {
+            props.setIsLoading(true);
+            await syncTasksWithTwAndDb();
+            props.setIsLoading(false);
+          }}
+          disabled={props.isLoading}
+        >
+          {props.isLoading ? (
+            <Loader2 className="mx-1 size-5 animate-spin" />
+          ) : (
+            'Sync'
+          )}
+        </Button>
       </div>
       {showReports ? (
         <ReportsView tasks={tasks} />
@@ -686,13 +710,12 @@ export const Tasks = (
                       <Button variant="outline" onClick={syncTasksWithTwAndDb}>
                         Sync
                       </Button>
-                      <span className="text-xs text-muted-foreground">
-                        {getTimeSinceLastSync(lastSyncTime)}
-                      </span>
                     </div>
                   </div>
                 </div>
-
+                <span className="text-xs text-muted-foreground ml-4">
+                  {getTimeSinceLastSync(lastSyncTime)}
+                </span>
                 <div className="overflow-x-auto">
                   <Table className="w-full text-white">
                     <TableHeader>
@@ -1280,12 +1303,12 @@ export const Tasks = (
                           'Sync'
                         )}
                       </Button>
-                      <span className="text-xs text-muted-foreground">
-                        {getTimeSinceLastSync(lastSyncTime)}
-                      </span>
                     </div>
                   </div>
                 </div>
+                <span className="text-xs text-muted-foreground ml-4">
+                  {getTimeSinceLastSync(lastSyncTime)}
+                </span>
                 <div className="text-l ml-5 text-muted-foreground mt-5 mb-5">
                   Add a new task or sync tasks from taskwarrior to view tasks.
                 </div>

frontend/src/components/LandingComponents/Footer/Footer.tsx

@@ -88,7 +88,7 @@ export const Footer = () => {
 
       <section className="container pb-14 text-center">
         <h3>
-          &copy; 2024{' '}
+          &copy; 2025{' '}
           <a
             rel="noreferrer noopener"
             target="_blank"

frontend/tsconfig.json

@@ -21,7 +21,7 @@
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
-
+    "ignoreDeprecations": "6.0",
     "baseUrl": ".",
     "paths": {
       "@/*": ["./src/*"]