Add headers to pages and streamline task creation in the task manager

Implements PageHeader component in multiple pages and refactors the task creation dialog within TasksPage.tsx.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d7e7c4e8-20cb-41c4-9d0e-79f48938fede
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/9777c70b-fc38-4831-8d6b-78dfffe041b0/a0b7e69b-cfd2-47d5-b0a2-363eb33835af.jpg

client/src/pages/ComfortHubPage.tsx

@@ -3,6 +3,7 @@ import { motion, AnimatePresence } from 'framer-motion';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import { PageHeader } from '@/components/ui/page-header';
 import { useTranslation } from 'react-i18next';
 import { 
   Heart, 

client/src/pages/ProfessionalDirectory.tsx

@@ -8,6 +8,7 @@ import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog';
+import { PageHeader } from '@/components/ui/page-header';
 import { 
   Search, 
   MapPin, 

client/src/pages/SystemMonitoringPage.tsx

@@ -10,6 +10,7 @@ import { Badge } from "@/components/ui/badge";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Progress } from "@/components/ui/progress";
+import { PageHeader } from "@/components/ui/page-header";
 import { 
   BarChart, 
   Bar, 

client/src/pages/TasksPage.tsx

@@ -306,11 +306,6 @@ export default function TasksPage() {
                   Add Task
                 </Button>
               </DialogTrigger>
-            </Dialog>
-          </PageHeader>
-
-          {/* Task Creation Dialog */}
-          <Dialog open={open} onOpenChange={setOpen}>
               <DialogContent>
                 <DialogHeader>
                   <DialogTitle>Create New Task</DialogTitle>
@@ -366,6 +361,7 @@ export default function TasksPage() {
                 </form>
               </DialogContent>
             </Dialog>
+          </PageHeader>
 
           {/* Statistics Cards */}
           <div className="grid grid-cols-2 md:grid-cols-5 gap-4 mb-6">