Enhance theme switching and add organization creation

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9111ef36-26c8-4085-84ca-a35dc1fec1b5
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/7083d608-d6d3-4a6a-9a27-6286c5109627/582dd4fe-d503-4ab1-81ab-a04bba654cf7.jpg

client/src/context/organization-context.tsx

@@ -1,19 +1,23 @@
 import { createContext, useContext, useState, useEffect, ReactNode } from "react";
-import { useQuery } from "@tanstack/react-query";
-import { Organization } from "@shared/schema";
+import { useQuery, useMutation, UseMutationResult } from "@tanstack/react-query";
+import { Organization, InsertOrganization } from "@shared/schema";
 import { useAuth } from "@/hooks/use-auth";
+import { apiRequest, queryClient } from "@/lib/queryClient";
+import { useToast } from "@/hooks/use-toast";
 
 type OrganizationContextType = {
   organizations: Organization[];
   currentOrganization: Organization | null;
   setCurrentOrganization: (organization: Organization) => void;
   isLoading: boolean;
+  createOrganizationMutation: UseMutationResult<Organization, Error, InsertOrganization>;
 };
 
 const OrganizationContext = createContext<OrganizationContextType | undefined>(undefined);
 
 export function OrganizationProvider({ children }: { children: ReactNode }) {
   const { user } = useAuth();
+  const { toast } = useToast();
   const [currentOrganization, setCurrentOrganization] = useState<Organization | null>(null);
 
   const { data: organizations = [], isLoading } = useQuery<Organization[]>({
@@ -21,6 +25,28 @@ export function OrganizationProvider({ children }: { children: ReactNode }) {
     // Only fetch if user is logged in
     enabled: !!user,
   });
+  
+  const createOrganizationMutation = useMutation({
+    mutationFn: async (orgData: InsertOrganization) => {
+      const res = await apiRequest("POST", "/api/organizations", orgData);
+      return await res.json();
+    },
+    onSuccess: (newOrg: Organization) => {
+      queryClient.invalidateQueries({ queryKey: ["/api/organizations"] });
+      toast({
+        title: "Organization created",
+        description: `Organization '${newOrg.name}' has been created successfully.`,
+      });
+      setCurrentOrganization(newOrg);
+    },
+    onError: (error: Error) => {
+      toast({
+        title: "Failed to create organization",
+        description: error.message,
+        variant: "destructive",
+      });
+    },
+  });
 
   // Set default organization when organizations are loaded
   useEffect(() => {
@@ -41,7 +67,13 @@ export function OrganizationProvider({ children }: { children: ReactNode }) {
 
   return (
     <OrganizationContext.Provider
-      value={{ organizations, currentOrganization, setCurrentOrganization, isLoading }}
+      value={{ 
+        organizations, 
+        currentOrganization, 
+        setCurrentOrganization, 
+        isLoading,
+        createOrganizationMutation 
+      }}
     >
       {children}
     </OrganizationContext.Provider>