feat: Add ticket permission UI and fix assignee dropdown

Assignee Dropdown:
- Fix useUsers hook to fetch from /api/staff/ endpoint
- Add useStaffForAssignment hook for formatted dropdown data
- Update TicketModal to use new hook for assignee selection

Staff Permissions UI:
- Add "Can access support tickets" permission to invite modal for both managers and staff
- Add permission to edit modal for both managers and staff
- Managers default to having ticket access enabled
- Staff default to having ticket access disabled (must be explicitly granted)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

frontend/src/hooks/useUsers.ts

@@ -1,17 +1,68 @@
-import { useQuery } from '@tanstack/react-query';
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
 import apiClient from '../api/client';
 import { User } from '../types';
 
+interface StaffUser {
+  id: number | string;
+  email: string;
+  first_name: string;
+  last_name: string;
+  full_name: string;
+  role: string;
+  role_display: string;
+  is_active: boolean;
+  permissions: Record<string, boolean>;
+  has_resource: boolean;
+  resource_id?: string;
+  resource_name?: string;
+}
+
 /**
- * Hook to fetch all users (staff, owners, customers) for the current business.
- * This can be filtered/refined later based on specific needs (e.g., only staff).
+ * Hook to fetch all staff members (owners, managers, staff) for the current business.
+ * Used for assignee dropdowns in tickets and other features.
  */
 export const useUsers = () => {
-  return useQuery<User[]>({
-    queryKey: ['businessUsers'],
+  return useQuery<StaffUser[]>({
+    queryKey: ['staff'],
     queryFn: async () => {
-      const response = await apiClient.get('/api/business/users/');
+      const response = await apiClient.get('/api/staff/');
       return response.data;
     },
   });
 };
+
+/**
+ * Hook to fetch staff members for assignee selection.
+ * Returns users formatted for dropdown use.
+ */
+export const useStaffForAssignment = () => {
+  return useQuery<{ id: string; name: string; email: string; role: string }[]>({
+    queryKey: ['staffForAssignment'],
+    queryFn: async () => {
+      const response = await apiClient.get('/api/staff/');
+      return response.data.map((user: StaffUser) => ({
+        id: String(user.id),
+        name: user.full_name || `${user.first_name} ${user.last_name}`.trim() || user.email,
+        email: user.email,
+        role: user.role_display || user.role,
+      }));
+    },
+  });
+};
+
+/**
+ * Hook to update a staff member's permissions
+ */
+export const useUpdateStaffPermissions = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ userId, permissions }: { userId: string | number; permissions: Record<string, boolean> }) => {
+      const response = await apiClient.patch(`/api/staff/${userId}/`, { permissions });
+      return response.data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['staff'] });
+    },
+  });
+};