diff --git a/apps/web/src/features/dashboard/AdminDashboard.tsx b/apps/web/src/features/dashboard/AdminDashboard.tsx
index 4f61639c..7f8263bf 100644
--- a/apps/web/src/features/dashboard/AdminDashboard.tsx
+++ b/apps/web/src/features/dashboard/AdminDashboard.tsx
@@ -1,8 +1,336 @@
+import { 
+  useListShifts, 
+  useListApplications, 
+  useListInvoices, 
+  useListStaff,
+  useListStaffDocumentsByStatus
+} from '@/dataconnect-generated/react';
+import { useNavigate } from 'react-router-dom';
+import { useState } from 'react';
+import { Card, CardContent, CardHeader, CardTitle } from '@/common/components/ui/card';
+import { Button } from '@/common/components/ui/button';
+import { Alert, AlertDescription, AlertTitle } from '@/common/components/ui/alert';
+import { 
+  Clock, 
+  FileText, 
+  TrendingUp, 
+  Users, 
+  AlertTriangle, 
+  PlusCircle, 
+  UserPlus 
+} from 'lucide-react';
+import { format } from 'date-fns';
+import { DocumentStatus } from '@/dataconnect-generated';
+import CreateOrderDialog from '@/features/operations/orders/components/CreateOrderDialog';
+import { motion, type Variants } from 'framer-motion';
+
+// Animation variants
+const containerVariants: Variants = {
+  hidden: { opacity: 0 },
+  visible: {
+    opacity: 1,
+    transition: {
+      staggerChildren: 0.1,
+      delayChildren: 0.2
+    }
+  }
+};
+
+const itemVariants: Variants = {
+  hidden: { y: 20, opacity: 0 },
+  visible: {
+    y: 0,
+    opacity: 1,
+    transition: {
+      type: "spring",
+      stiffness: 100,
+      damping: 12
+    }
+  }
+};
+
+const headerVariants: Variants = {
+  hidden: { y: -20, opacity: 0 },
+  visible: {
+    y: 0,
+    opacity: 1,
+    transition: {
+      type: "spring",
+      stiffness: 120,
+      damping: 14
+    }
+  }
+};
+
+const alertVariants: Variants = {
+  hidden: { scale: 0.95, opacity: 0 },
+  visible: {
+    scale: 1,
+    opacity: 1,
+    transition: {
+      type: "spring",
+      stiffness: 100,
+      damping: 15
+    }
+  }
+};
 
 const AdminDashboard = () => {
-  return (
-    <div> Admin Dashboard</div>
-  )
-}
+  const navigate = useNavigate();
+  const [isOrderDialogOpen, setIsOrderDialogOpen] = useState(false);
 
-export default AdminDashboard
\ No newline at end of file
+  // Data fetching
+  const { data: shiftsData } = useListShifts();
+  const { data: applicationsData } = useListApplications();
+  const { data: invoicesData } = useListInvoices();
+  const { data: staffData } = useListStaff();
+  const { data: complianceData } = useListStaffDocumentsByStatus({ status: DocumentStatus.EXPIRING });
+
+  // Metrics calculation
+  const today = new Date();
+  const todayStart = new Date(today.setHours(0, 0, 0, 0));
+  const todayEnd = new Date(today.setHours(23, 59, 59, 999));
+
+  const activeShiftsToday = shiftsData?.shifts.filter(shift => {
+    if (!shift.startTime) return false;
+    const shiftDate = new Date(shift.startTime);
+    return shiftDate >= todayStart && shiftDate <= todayEnd;
+  }).length || 0;
+
+  const pendingApplications = applicationsData?.applications.filter(app => app.status === 'PENDING').length || 0;
+  // Assuming timesheets are also pending approvals if they exist in a similar way
+  const pendingApprovals = pendingApplications; // Extend if timesheet hook found
+  
+  const monthlyRevenue = invoicesData?.invoices
+    .filter(inv => {
+      if (!inv.issueDate) return false;
+      const invDate = new Date(inv.issueDate);
+      return invDate.getMonth() === new Date().getMonth() && 
+             invDate.getFullYear() === new Date().getFullYear();
+    })
+    .reduce((sum, inv) => sum + (inv.amount || 0), 0) || 0;
+
+  const totalStaff = staffData?.staffs.length || 0;
+  const staffUtilization = totalStaff > 0 ? 
+    Math.round((activeShiftsToday / totalStaff) * 100) : 0;
+
+  const unfilledPositions = shiftsData?.shifts.filter(shift => 
+    shift.status === 'OPEN' || (shift.workersNeeded || 0) > (shift.filled || 0)
+  ).length || 0;
+  const complianceIssues = complianceData?.staffDocuments.length || 0;
+
+  const metrics = [
+    {
+      title: "Today's Active Shifts",
+      value: activeShiftsToday,
+      description: "Running shifts for today",
+      icon: Clock,
+      color: "text-blue-500"
+    },
+    {
+      title: "Pending Approvals",
+      value: pendingApprovals,
+      description: "Applications & Timesheets",
+      icon: FileText,
+      color: "text-amber-500"
+    },
+    {
+      title: "Monthly Revenue",
+      value: `$${monthlyRevenue.toLocaleString()}`,
+      description: `For ${format(today, 'MMMM yyyy')}`,
+      icon: TrendingUp,
+      color: "text-green-500"
+    },
+    {
+      title: "Staff Utilization",
+      value: `${staffUtilization}%`,
+      description: null,
+      icon: Users,
+      color: "text-purple-500",
+      showProgress: true,
+      progress: staffUtilization
+    }
+  ];
+
+  return (
+    <div className="p-6 space-y-6">
+      <motion.div 
+        className="flex justify-between items-center"
+        variants={headerVariants}
+        initial="hidden"
+        animate="visible"
+      >
+        <h1 className="text-3xl font-bold">Admin Dashboard</h1>
+        <div className="flex gap-3">
+          <motion.div
+            whileHover={{ scale: 1.05 }}
+            whileTap={{ scale: 0.95 }}
+          >
+            <Button 
+              className="flex items-center gap-2"
+              onClick={() => setIsOrderDialogOpen(true)}
+            >
+              <PlusCircle size={18} />
+              Create Order
+            </Button>
+          </motion.div>
+          <motion.div
+            whileHover={{ scale: 1.05 }}
+            whileTap={{ scale: 0.95 }}
+          >
+            <Button 
+              variant="outline" 
+              className="flex items-center gap-2"
+              onClick={() => navigate('/staff/add')}
+            >
+              <UserPlus size={18} />
+              Add Staff
+            </Button>
+          </motion.div>
+        </div>
+      </motion.div>
+
+      <CreateOrderDialog 
+        open={isOrderDialogOpen} 
+        onOpenChange={setIsOrderDialogOpen} 
+      />
+
+      {/* Metrics Widgets */}
+      <motion.div 
+        className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4"
+        variants={containerVariants}
+        initial="hidden"
+        animate="visible"
+      >
+        {metrics.map((metric, index) => {
+          const Icon = metric.icon;
+          return (
+            <motion.div
+              key={metric.title}
+              variants={itemVariants}
+              whileHover={{ 
+                y: -5,
+                transition: { type: "spring", stiffness: 300, damping: 20 }
+              }}
+            >
+              <Card className="overflow-hidden relative group">
+                <motion.div
+                  className="absolute inset-0 bg-gradient-to-br from-primary/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity"
+                  initial={false}
+                />
+                <CardHeader className="flex flex-row items-center justify-between pb-2 relative z-10">
+                  <CardTitle className="text-sm font-medium">{metric.title}</CardTitle>
+                  <motion.div
+                    whileHover={{ rotate: 360 }}
+                    transition={{ duration: 0.6, ease: "easeInOut" }}
+                  >
+                    <Icon className={`h-4 w-4 ${metric.color}`} />
+                  </motion.div>
+                </CardHeader>
+                <CardContent className="relative z-10">
+                  <motion.div 
+                    className="text-2xl font-bold"
+                    initial={{ scale: 0.8, opacity: 0 }}
+                    animate={{ scale: 1, opacity: 1 }}
+                    transition={{ delay: 0.3 + index * 0.1, type: "spring" }}
+                  >
+                    {metric.value}
+                  </motion.div>
+                  {metric.description && (
+                    <p className="text-xs text-muted-foreground mt-1">
+                      {metric.description}
+                    </p>
+                  )}
+                  {metric.showProgress && (
+                    <div className="w-full bg-secondary h-2 mt-2 rounded-full overflow-hidden">
+                      <motion.div 
+                        className="bg-primary h-full"
+                        initial={{ width: 0 }}
+                        animate={{ width: `${metric.progress}%` }}
+                        transition={{ 
+                          delay: 0.5 + index * 0.1,
+                          duration: 1,
+                          ease: "easeOut"
+                        }}
+                      />
+                    </div>
+                  )}
+                </CardContent>
+              </Card>
+            </motion.div>
+          );
+        })}
+      </motion.div>
+
+      {/* Alerts Section */}
+      {(unfilledPositions > 0 || complianceIssues > 0) && (
+        <motion.div 
+          className="space-y-4"
+          initial={{ opacity: 0, y: 20 }}
+          animate={{ opacity: 1, y: 0 }}
+          transition={{ delay: 0.6, duration: 0.5 }}
+        >
+          <motion.h2 
+            className="text-xl font-semibold flex items-center gap-2"
+            initial={{ x: -20, opacity: 0 }}
+            animate={{ x: 0, opacity: 1 }}
+            transition={{ delay: 0.7 }}
+          >
+            <motion.div
+              animate={{ 
+                rotate: [0, -10, 10, -10, 0],
+              }}
+              transition={{
+                duration: 0.5,
+                delay: 0.8,
+                repeat: Infinity,
+                repeatDelay: 3
+              }}
+            >
+              <AlertTriangle className="text-destructive" />
+            </motion.div>
+            Critical Alerts
+          </motion.h2>
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+            {unfilledPositions > 0 && (
+              <motion.div
+                variants={alertVariants}
+                initial="hidden"
+                animate="visible"
+                whileHover={{ scale: 1.02 }}
+                transition={{ delay: 0.8 }}
+              >
+                <Alert variant="destructive">
+                  <AlertTriangle className="h-4 w-4" />
+                  <AlertTitle>Unfilled Positions</AlertTitle>
+                  <AlertDescription>
+                    There are {unfilledPositions} shifts that currently have no staff assigned.
+                  </AlertDescription>
+                </Alert>
+              </motion.div>
+            )}
+            {complianceIssues > 0 && (
+              <motion.div
+                variants={alertVariants}
+                initial="hidden"
+                animate="visible"
+                whileHover={{ scale: 1.02 }}
+                transition={{ delay: 0.9 }}
+              >
+                <Alert variant="destructive">
+                  <AlertTriangle className="h-4 w-4" />
+                  <AlertTitle>Compliance Issues</AlertTitle>
+                  <AlertDescription>
+                    {complianceIssues} staff members have expired or missing documentation.
+                  </AlertDescription>
+                </Alert>
+              </motion.div>
+            )}
+          </div>
+        </motion.div>
+      )}
+    </div>
+  );
+};
+
+export default AdminDashboard;
\ No newline at end of file
diff --git a/apps/web/src/features/operations/orders/components/CreateOrderDialog.tsx b/apps/web/src/features/operations/orders/components/CreateOrderDialog.tsx
new file mode 100644
index 00000000..718e6e82
--- /dev/null
+++ b/apps/web/src/features/operations/orders/components/CreateOrderDialog.tsx
@@ -0,0 +1,132 @@
+import React from "react";
+import { 
+  Dialog, 
+  DialogContent, 
+  DialogHeader, 
+  DialogTitle,
+} from "@/common/components/ui/dialog";
+import EventFormWizard from "./EventFormWizard";
+import { useCreateOrder, useListBusinesses, useListHubs } from "@/dataconnect-generated/react";
+import { OrderType, OrderStatus } from "@/dataconnect-generated";
+import { dataConnect } from "@/features/auth/firebase";
+import { useToast } from "@/common/components/ui/use-toast";
+import { useQueryClient } from "@tanstack/react-query";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/common/components/ui/select";
+import { Label } from "@/common/components/ui/label";
+
+interface CreateOrderDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}
+
+export default function CreateOrderDialog({ open, onOpenChange }: CreateOrderDialogProps) {
+  const { toast } = useToast();
+  const queryClient = useQueryClient();
+  const [selectedBusinessId, setSelectedBusinessId] = React.useState<string>("");
+  const [selectedHubId, setSelectedHubId] = React.useState<string>("");
+
+  const { data: businessesData } = useListBusinesses(dataConnect);
+  const { data: hubsData } = useListHubs(dataConnect);
+
+  const createOrderMutation = useCreateOrder(dataConnect, {
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["listOrders"] });
+      toast({
+        title: "✅ Order Created",
+        description: "Your new order has been created successfully.",
+      });
+      onOpenChange(false);
+    },
+    onError: (error) => {
+      toast({
+        title: "❌ Creation Failed",
+        description: error.message || "Could not create the order. Please try again.",
+        variant: "destructive",
+      });
+    },
+  });
+
+  const handleSubmit = (eventData: Record<string, any>) => {
+    if (!selectedBusinessId || !selectedHubId) {
+      toast({
+        title: "Missing Information",
+        description: "Please select a business and a hub.",
+        variant: "destructive",
+      });
+      return;
+    }
+
+    // Recalculate requested count from current roles
+    const totalRequested = eventData.shifts.reduce((sum: number, shift: any) => {
+      const roles = Array.isArray(shift.roles) ? shift.roles : [];
+      return sum + roles.reduce((roleSum: number, role: any) => roleSum + (parseInt(role.count) || 0), 0);
+    }, 0);
+
+    createOrderMutation.mutate({
+      eventName: eventData.event_name,
+      businessId: selectedBusinessId,
+      teamHubId: selectedHubId,
+      orderType: OrderType.RAPID, // Defaulting to RAPID as per common use in this app
+      date: eventData.date,
+      startDate: eventData.startDate || eventData.date,
+      endDate: eventData.endDate,
+      notes: eventData.notes,
+      shifts: eventData.shifts,
+      requested: totalRequested,
+      total: eventData.total,
+      poReference: eventData.po_reference,
+      status: OrderStatus.POSTED
+    });
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto">
+        <DialogHeader>
+          <DialogTitle>Create New Order</DialogTitle>
+        </DialogHeader>
+        
+        <div className="grid grid-cols-2 gap-4 mb-6">
+          <div className="space-y-2">
+            <Label>Business</Label>
+            <Select value={selectedBusinessId} onValueChange={setSelectedBusinessId}>
+              <SelectTrigger>
+                <SelectValue placeholder="Select Business" />
+              </SelectTrigger>
+              <SelectContent>
+                {businessesData?.businesses.map((b) => (
+                  <SelectItem key={b.id} value={b.id}>
+                    {b.businessName}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          </div>
+          <div className="space-y-2">
+            <Label>Team Hub</Label>
+            <Select value={selectedHubId} onValueChange={setSelectedHubId}>
+              <SelectTrigger>
+                <SelectValue placeholder="Select Hub" />
+              </SelectTrigger>
+              <SelectContent>
+                {hubsData?.hubs.map((h) => (
+                  <SelectItem key={h.id} value={h.id}>
+                    {h.name}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          </div>
+        </div>
+
+        <EventFormWizard
+          event={null}
+          onSubmit={handleSubmit}
+          isSubmitting={createOrderMutation.isPending}
+          currentUser={null}
+          onCancel={() => onOpenChange(false)}
+        />
+      </DialogContent>
+    </Dialog>
+  );
+}