Apply security fixes

Implement security enhancements as suggested by the security review.

src/components/ErrorBoundary.tsx

@@ -0,0 +1,76 @@
+import React, { Component, ErrorInfo, ReactNode } from 'react';
+import { AlertTriangle, RotateCcw } from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+
+interface Props {
+  children: ReactNode;
+  fallback?: ReactNode;
+}
+
+interface State {
+  hasError: boolean;
+  error?: Error;
+}
+
+class ErrorBoundary extends Component<Props, State> {
+  constructor(props: Props) {
+    super(props);
+    this.state = { hasError: false };
+  }
+
+  static getDerivedStateFromError(error: Error): State {
+    // Update state so the next render will show the fallback UI
+    return { hasError: true, error };
+  }
+
+  componentDidCatch(error: Error, errorInfo: ErrorInfo) {
+    // Log error to console in development
+    if (process.env.NODE_ENV === 'development') {
+      console.error('Error caught by boundary:', error, errorInfo);
+    }
+  }
+
+  handleReset = () => {
+    this.setState({ hasError: false, error: undefined });
+  };
+
+  render() {
+    if (this.state.hasError) {
+      if (this.props.fallback) {
+        return this.props.fallback;
+      }
+
+      return (
+        <div className="min-h-screen flex items-center justify-center p-4">
+          <Card className="w-full max-w-md">
+            <CardHeader className="text-center">
+              <div className="flex justify-center mb-4">
+                <AlertTriangle className="w-12 h-12 text-destructive" />
+              </div>
+              <CardTitle className="text-xl">Something went wrong</CardTitle>
+            </CardHeader>
+            <CardContent className="text-center space-y-4">
+              <p className="text-muted-foreground">
+                We encountered an unexpected error. Please try refreshing the page or contact support if the problem persists.
+              </p>
+              <div className="flex flex-col sm:flex-row gap-2 justify-center">
+                <Button onClick={this.handleReset} variant="outline">
+                  <RotateCcw className="w-4 h-4 mr-2" />
+                  Try Again
+                </Button>
+                <Button onClick={() => window.location.reload()}>
+                  Refresh Page
+                </Button>
+              </div>
+            </CardContent>
+          </Card>
+        </div>
+      );
+    }
+
+    return this.props.children;
+  }
+}
+
+export default ErrorBoundary;

src/components/SocialShare.tsx

@@ -5,6 +5,7 @@ import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from
 import { Share2, Copy, QrCode, Twitter, Facebook, Linkedin } from 'lucide-react';
 import { useToast } from '@/hooks/use-toast';
 import QRCode from 'qrcode';
+import { validateShareData, rateLimiter } from '@/utils/security';
 
 interface SocialShareProps {
   title: string;
@@ -21,20 +22,38 @@ const SocialShare: React.FC<SocialShareProps> = ({
   const [isOpen, setIsOpen] = useState(false);
   const { toast } = useToast();
 
+  // Validate and sanitize share data
+  const shareData = validateShareData(title, description, url);
+
   useEffect(() => {
     if (isOpen) {
-      QRCode.toDataURL(url, {
+      QRCode.toDataURL(shareData.url, {
         width: 200,
         margin: 2,
         color: {
           dark: '#000000',
           light: '#FFFFFF'
         }
-      }).then(setQrCodeDataUrl);
+      }).then(setQrCodeDataUrl).catch(() => {
+        toast({
+          title: "Error",
+          description: "Failed to generate QR code",
+          variant: "destructive",
+        });
+      });
     }
-  }, [url, isOpen]);
+  }, [shareData.url, isOpen, toast]);
 
   const copyToClipboard = async (text: string) => {
+    if (!rateLimiter.isAllowed('clipboard', 10, 60000)) {
+      toast({
+        title: "Too many attempts",
+        description: "Please wait before copying again",
+        variant: "destructive",
+      });
+      return;
+    }
+
     try {
       await navigator.clipboard.writeText(text);
       toast({
@@ -51,6 +70,15 @@ const SocialShare: React.FC<SocialShareProps> = ({
   };
 
   const copyQRCode = async () => {
+    if (!rateLimiter.isAllowed('qr-copy', 5, 60000)) {
+      toast({
+        title: "Too many attempts",
+        description: "Please wait before copying again",
+        variant: "destructive",
+      });
+      return;
+    }
+
     try {
       const response = await fetch(qrCodeDataUrl);
       const blob = await response.blob();
@@ -71,9 +99,22 @@ const SocialShare: React.FC<SocialShareProps> = ({
   };
 
   const shareLinks = {
-    twitter: `https://twitter.com/intent/tweet?text=${encodeURIComponent(title)}&url=${encodeURIComponent(url)}`,
-    facebook: `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(url)}`,
-    linkedin: `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(url)}`
+    twitter: `https://twitter.com/intent/tweet?text=${encodeURIComponent(shareData.title)}&url=${encodeURIComponent(shareData.url)}`,
+    facebook: `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(shareData.url)}`,
+    linkedin: `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(shareData.url)}`
+  };
+
+  const handleSocialShare = (platform: string, url: string) => {
+    if (!rateLimiter.isAllowed('social-share', 10, 60000)) {
+      toast({
+        title: "Too many attempts",
+        description: "Please wait before sharing again",
+        variant: "destructive",
+      });
+      return;
+    }
+    
+    window.open(url, '_blank', 'noopener,noreferrer');
   };
 
   return (
@@ -89,7 +130,7 @@ const SocialShare: React.FC<SocialShareProps> = ({
           <Button
             variant="outline"
             size="sm"
-            onClick={() => window.open(shareLinks.twitter, '_blank')}
+            onClick={() => handleSocialShare('twitter', shareLinks.twitter)}
             className="flex items-center gap-2"
           >
             <Twitter className="w-4 h-4" />
@@ -99,7 +140,7 @@ const SocialShare: React.FC<SocialShareProps> = ({
           <Button
             variant="outline"
             size="sm"
-            onClick={() => window.open(shareLinks.facebook, '_blank')}
+            onClick={() => handleSocialShare('facebook', shareLinks.facebook)}
             className="flex items-center gap-2"
           >
             <Facebook className="w-4 h-4" />
@@ -109,7 +150,7 @@ const SocialShare: React.FC<SocialShareProps> = ({
           <Button
             variant="outline"
             size="sm"
-            onClick={() => window.open(shareLinks.linkedin, '_blank')}
+            onClick={() => handleSocialShare('linkedin', shareLinks.linkedin)}
             className="flex items-center gap-2"
           >
             <Linkedin className="w-4 h-4" />
@@ -120,7 +161,7 @@ const SocialShare: React.FC<SocialShareProps> = ({
           <Button
             variant="outline"
             size="sm"
-            onClick={() => copyToClipboard(url)}
+            onClick={() => copyToClipboard(shareData.url)}
             className="flex items-center gap-2"
           >
             <Copy className="w-4 h-4" />