feat(tasks): add tab view preference and improve task list UI.

Author: carhartlewis

apps/app/src/actions/tasks.ts

@@ -0,0 +1,26 @@
+'use server';
+
+import { addYears } from 'date-fns';
+import { createSafeActionClient } from 'next-safe-action';
+import { cookies } from 'next/headers';
+import { z } from 'zod';
+
+const schema = z.object({
+  view: z.enum(['categories', 'list']),
+  orgId: z.string(),
+});
+
+export const updateTaskViewPreference = createSafeActionClient()
+  .inputSchema(schema)
+  .action(async ({ parsedInput }) => {
+    const cookieStore = await cookies();
+
+    cookieStore.set({
+      name: `task-view-preference-${parsedInput.orgId}`,
+      value: parsedInput.view,
+      expires: addYears(new Date(), 1),
+    });
+
+    return { success: true };
+  });
+

apps/app/src/app/(app)/[orgId]/tasks/components/SearchInput.tsx

@@ -16,7 +16,7 @@ export const SearchInput = forwardRef<HTMLInputElement, SearchInputProps>(
           ref={ref}
           type="text"
           placeholder={placeholder}
-          className={`h-9 w-[280px] border border-input bg-background pl-10 pr-4 text-sm text-foreground placeholder:text-muted-foreground transition-all focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 rounded-md ${className}`}
+          className={`h-9 w-full border border-input bg-background pl-10 pr-4 text-sm text-foreground placeholder:text-muted-foreground transition-all focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 rounded-md ${className}`}
           {...props}
         />
       </div>