feat: enhance live collaboration features by introducing useLive hook for real-time event handling across motivators, sessions, and year reviews; refactor existing hooks to utilize this new functionality

src/components/swot/SwotQuadrant.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { forwardRef, useState, useTransition, ReactNode } from 'react';
+import { forwardRef, useState, useTransition, useRef, ReactNode } from 'react';
 import type { SwotCategory } from '@prisma/client';
 import { createSwotItem } from '@/actions/swot';
 import { QuadrantHelpPanel } from './QuadrantHelp';
@@ -43,15 +43,17 @@ export const SwotQuadrant = forwardRef<HTMLDivElement, SwotQuadrantProps>(
     const [newContent, setNewContent] = useState('');
     const [isPending, startTransition] = useTransition();
     const [showHelp, setShowHelp] = useState(false);
+    const isSubmittingRef = useRef(false);
 
     const styles = categoryStyles[category];
 
     async function handleAdd() {
-      if (!newContent.trim()) {
+      if (isSubmittingRef.current || !newContent.trim()) {
         setIsAdding(false);
         return;
       }
 
+      isSubmittingRef.current = true;
       startTransition(async () => {
         await createSwotItem(sessionId, {
           content: newContent.trim(),
@@ -59,6 +61,7 @@ export const SwotQuadrant = forwardRef<HTMLDivElement, SwotQuadrantProps>(
         });
         setNewContent('');
         setIsAdding(false);
+        isSubmittingRef.current = false;
       });
     }
 
@@ -138,7 +141,12 @@ export const SwotQuadrant = forwardRef<HTMLDivElement, SwotQuadrantProps>(
                 value={newContent}
                 onChange={(e) => setNewContent(e.target.value)}
                 onKeyDown={handleKeyDown}
-                onBlur={handleAdd}
+                onBlur={(e) => {
+                  // Don't trigger on blur if clicking on a button
+                  if (!e.currentTarget.contains(e.relatedTarget as Node)) {
+                    handleAdd();
+                  }
+                }}
                 placeholder="Décrivez cet élément..."
                 className="w-full resize-none rounded border-0 bg-transparent p-1 text-sm text-foreground placeholder:text-muted focus:outline-none focus:ring-0"
                 rows={2}
@@ -156,6 +164,9 @@ export const SwotQuadrant = forwardRef<HTMLDivElement, SwotQuadrantProps>(
                   Annuler
                 </button>
                 <button
+                  onMouseDown={(e) => {
+                    e.preventDefault(); // Prevent blur from textarea
+                  }}
                   onClick={handleAdd}
                   disabled={isPending || !newContent.trim()}
                   className={`rounded px-2 py-1 text-xs font-medium ${styles.text} hover:bg-white/50 disabled:opacity-50`}