feat: enhance QuickAddTask component with new UI elements

- Replaced input fields with `FormField`, `PrioritySelector`, and `DateTimeInput` for improved user experience and consistency.
- Integrated `LoadingSpinner` to indicate submission state, enhancing feedback during task creation.
- Streamlined state management for form fields, ensuring better data handling.

src/components/ui/DateTimeInput.tsx

@@ -0,0 +1,38 @@
+'use client';
+
+import { formatDateForDateTimeInput, parseDateTimeInput } from '@/lib/date-utils';
+
+interface DateTimeInputProps {
+  value?: Date;
+  onChange: (date: Date | undefined) => void;
+  placeholder?: string;
+  disabled?: boolean;
+  className?: string;
+  onFocus?: () => void;
+}
+
+export function DateTimeInput({ 
+  value, 
+  onChange, 
+  placeholder,
+  disabled = false, 
+  className = '',
+  onFocus
+}: DateTimeInputProps) {
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const newValue = e.target.value ? parseDateTimeInput(e.target.value) : undefined;
+    onChange(newValue);
+  };
+
+  return (
+    <input
+      type="datetime-local"
+      value={value ? formatDateForDateTimeInput(value) : ''}
+      onChange={handleChange}
+      onFocus={onFocus}
+      disabled={disabled}
+      placeholder={placeholder}
+      className={`bg-transparent border-none outline-none text-[var(--muted-foreground)] font-mono text-xs flex-shrink min-w-0 ${className}`}
+    />
+  );
+}