refactor(ux): consolidate BMAD skills, update design system, and clean up Prisma generated client

keep-notes/components/lab/canvas-error-boundary.tsx

@@ -0,0 +1,63 @@
+'use client'
+
+import React from 'react'
+import { AlertCircle, RefreshCcw } from 'lucide-react'
+import { Button } from '@/components/ui/button'
+
+interface Props {
+  children: React.ReactNode
+}
+
+interface State {
+  hasError: boolean
+  error?: Error
+}
+
+export class CanvasErrorBoundary extends React.Component<Props, State> {
+  constructor(props: Props) {
+    super(props)
+    this.state = { hasError: false }
+  }
+
+  static getDerivedStateFromError(error: Error) {
+    return { hasError: true, error }
+  }
+
+  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+    console.error('[CanvasErrorBoundary] caught error:', error, errorInfo)
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return (
+        <div className="flex-1 flex flex-col items-center justify-center p-8 bg-destructive/5 rounded-3xl border border-destructive/20 m-6 gap-4">
+          <div className="p-4 bg-destructive/10 rounded-full">
+            <AlertCircle className="h-8 w-8 text-destructive" />
+          </div>
+          <div className="text-center space-y-2">
+            <h3 className="text-xl font-bold">Oups ! Le Lab a rencontré un problème.</h3>
+            <p className="text-sm text-muted-foreground max-w-md mx-auto">
+              Une erreur inattendue est survenue lors du chargement de l'espace de dessin. 
+              Cela peut arriver à cause d'un conflit de données ou d'une extension de navigateur.
+            </p>
+          </div>
+          <Button 
+            onClick={() => window.location.reload()} 
+            variant="outline"
+            className="flex items-center gap-2"
+          >
+            <RefreshCcw className="h-4 w-4" />
+            Recharger la page
+          </Button>
+          {process.env.NODE_ENV === 'development' && (
+            <pre className="mt-4 p-4 bg-black/5 rounded-lg text-xs font-mono overflow-auto max-w-full italic text-muted-foreground">
+              {this.state.error?.message}
+            </pre>
+          )}
+        </div>
+      )
+    }
+
+    return this.props.children
+  }
+}