strade-stx 1.0.0 → 1.0.1

package/frontend/src/components/ConfirmDialog.tsx

@@ -1,54 +0,0 @@
-'use client';
-
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle,
-} from '@/components/ui/alert-dialog';
-
-interface ConfirmDialogProps {
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-  title: string;
-  description: string;
-  onConfirm: () => void;
-  confirmText?: string;
-  cancelText?: string;
-  destructive?: boolean;
-}
-
-export default function ConfirmDialog({
-  open,
-  onOpenChange,
-  title,
-  description,
-  onConfirm,
-  confirmText = 'Confirm',
-  cancelText = 'Cancel',
-  destructive = false,
-}: ConfirmDialogProps) {
-  return (
-    <AlertDialog open={open} onOpenChange={onOpenChange}>
-      <AlertDialogContent>
-        <AlertDialogHeader>
-          <AlertDialogTitle>{title}</AlertDialogTitle>
-          <AlertDialogDescription>{description}</AlertDialogDescription>
-        </AlertDialogHeader>
-        <AlertDialogFooter>
-          <AlertDialogCancel>{cancelText}</AlertDialogCancel>
-          <AlertDialogAction
-            onClick={onConfirm}
-            className={destructive ? 'bg-red-600 hover:bg-red-700' : ''}
-          >
-            {confirmText}
-          </AlertDialogAction>
-        </AlertDialogFooter>
-      </AlertDialogContent>
-    </AlertDialog>
-  );
-}

package/frontend/src/components/CreateListingForm.tsx

@@ -1,231 +0,0 @@
-'use client';
-
-import { useState } from 'react';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import { Textarea } from '@/components/ui/textarea';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog';
-import ImageUpload from '@/components/ImageUpload';
-import { Plus } from 'lucide-react';
-
-interface CreateListingFormProps {
-  onCreateListing?: (data: {
-    name: string;
-    description: string;
-    price: number;
-    duration: number;
-    imageUrl?: string;
-  }) => void;
-}
-
-export default function CreateListingForm({ onCreateListing }: CreateListingFormProps) {
-  const [isOpen, setIsOpen] = useState(false);
-  const [isSubmitting, setIsSubmitting] = useState(false);
-  const [errors, setErrors] = useState<Record<string, string>>({});
-  const [formData, setFormData] = useState({
-    name: '',
-    description: '',
-    price: '',
-    duration: '',
-    imageUrl: '',
-  });
-
-  const validateForm = (): boolean => {
-    const newErrors: Record<string, string> = {};
-
-    if (!formData.name.trim()) {
-      newErrors.name = 'Item name is required';
-    } else if (formData.name.length < 3) {
-      newErrors.name = 'Item name must be at least 3 characters';
-    } else if (formData.name.length > 64) {
-      newErrors.name = 'Item name must be less than 64 characters';
-    }
-
-    if (!formData.description.trim()) {
-      newErrors.description = 'Description is required';
-    } else if (formData.description.length < 10) {
-      newErrors.description = 'Description must be at least 10 characters';
-    } else if (formData.description.length > 256) {
-      newErrors.description = 'Description must be less than 256 characters';
-    }
-
-    const price = parseFloat(formData.price);
-    if (!formData.price || isNaN(price)) {
-      newErrors.price = 'Valid price is required';
-    } else if (price <= 0) {
-      newErrors.price = 'Price must be greater than 0';
-    } else if (price > 1000000) {
-      newErrors.price = 'Price is too high';
-    }
-
-    const duration = parseInt(formData.duration);
-    if (!formData.duration || isNaN(duration)) {
-      newErrors.duration = 'Valid duration is required';
-    } else if (duration < 1) {
-      newErrors.duration = 'Duration must be at least 1 day';
-    } else if (duration > 365) {
-      newErrors.duration = 'Duration cannot exceed 365 days';
-    }
-
-    setErrors(newErrors);
-    return Object.keys(newErrors).length === 0;
-  };
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-
-    if (!validateForm()) return;
-    if (!onCreateListing) return;
-
-    setIsSubmitting(true);
-    try {
-      const price = parseFloat(formData.price) * 1000000; // Convert to microSTX
-      const duration = parseInt(formData.duration) * 144; // Convert days to blocks (approx 10 min per block)
-
-      await onCreateListing({
-        name: formData.name,
-        description: formData.description,
-        price,
-        duration,
-        imageUrl: formData.imageUrl,
-      });
-
-      // Reset form and close dialog
-      setFormData({ name: '', description: '', price: '', duration: '', imageUrl: '' });
-      setErrors({});
-      setIsOpen(false);
-    } catch (error) {
-      console.error('Error creating listing:', error);
-    } finally {
-      setIsSubmitting(false);
-    }
-  };
-
-  const handleInputChange = (field: string, value: string) => {
-    setFormData(prev => ({ ...prev, [field]: value }));
-    // Clear error for this field when user starts typing
-    if (errors[field]) {
-      setErrors(prev => ({ ...prev, [field]: '' }));
-    }
-  };
-
-  return (
-    <Dialog open={isOpen} onOpenChange={setIsOpen}>
-      <DialogTrigger asChild>
-        <Button className="mb-6">
-          <Plus className="h-4 w-4 mr-2" />
-          Create Listing
-        </Button>
-      </DialogTrigger>
-
-      <DialogContent className="sm:max-w-[500px]">
-        <DialogHeader>
-          <DialogTitle>Create New Listing</DialogTitle>
-        </DialogHeader>
-
-        <form onSubmit={handleSubmit} className="space-y-4">
-          <div>
-            <Label>Item Image (Optional)</Label>
-            <ImageUpload
-              onImageSelect={(url) => handleInputChange('imageUrl', url)}
-              currentImage={formData.imageUrl}
-            />
-            <p className="text-xs text-slate-500 mt-1">
-              Add an image to make your listing more attractive
-            </p>
-          </div>
-
-          <div>
-            <Label htmlFor="name">Item Name *</Label>
-            <Input
-              id="name"
-              value={formData.name}
-              onChange={(e) => handleInputChange('name', e.target.value)}
-              placeholder="Enter item name"
-              maxLength={64}
-              className={errors.name ? 'border-red-500' : ''}
-            />
-            {errors.name && (
-              <p className="text-xs text-red-500 mt-1">{errors.name}</p>
-            )}
-          </div>
-
-          <div>
-            <Label htmlFor="description">Description *</Label>
-            <Textarea
-              id="description"
-              value={formData.description}
-              onChange={(e) => handleInputChange('description', e.target.value)}
-              placeholder="Describe your item"
-              maxLength={256}
-              rows={3}
-              className={errors.description ? 'border-red-500' : ''}
-            />
-            {errors.description && (
-              <p className="text-xs text-red-500 mt-1">{errors.description}</p>
-            )}
-            <p className="text-xs text-slate-500 mt-1">
-              {formData.description.length}/256 characters
-            </p>
-          </div>
-
-          <div className="grid grid-cols-2 gap-4">
-            <div>
-              <Label htmlFor="price">Price (STX) *</Label>
-              <Input
-                id="price"
-                type="number"
-                step="0.000001"
-                min="0"
-                value={formData.price}
-                onChange={(e) => handleInputChange('price', e.target.value)}
-                placeholder="0.00"
-                className={errors.price ? 'border-red-500' : ''}
-              />
-              {errors.price && (
-                <p className="text-xs text-red-500 mt-1">{errors.price}</p>
-              )}
-            </div>
-
-            <div>
-              <Label htmlFor="duration">Duration (days) *</Label>
-              <Input
-                id="duration"
-                type="number"
-                min="1"
-                max="365"
-                value={formData.duration}
-                onChange={(e) => handleInputChange('duration', e.target.value)}
-                placeholder="30"
-                className={errors.duration ? 'border-red-500' : ''}
-              />
-              {errors.duration && (
-                <p className="text-xs text-red-500 mt-1">{errors.duration}</p>
-              )}
-            </div>
-          </div>
-
-          <div className="flex justify-end space-x-2 pt-4">
-            <Button
-              type="button"
-              variant="outline"
-              onClick={() => setIsOpen(false)}
-              disabled={isSubmitting}
-            >
-              Cancel
-            </Button>
-            <Button type="submit" disabled={isSubmitting}>
-              {isSubmitting ? 'Creating...' : 'Create Listing'}
-            </Button>
-          </div>
-        </form>
-      </DialogContent>
-    </Dialog>
-  );
-}
-// w-full
-// flex-col
-// h-12
-// font-size: 16px
-// modal overflow

package/frontend/src/components/ErrorBoundary.tsx

@@ -1,73 +0,0 @@
-'use client';
-
-import React from 'react';
-import { Button } from '@/components/ui/button';
-import { AlertCircle } from 'lucide-react';
-
-interface ErrorBoundaryProps {
-  children: React.ReactNode;
-}
-
-interface ErrorBoundaryState {
-  hasError: boolean;
-  error?: Error;
-}
-
-export class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
-  constructor(props: ErrorBoundaryProps) {
-    super(props);
-    this.state = { hasError: false };
-  }
-
-  static getDerivedStateFromError(error: Error): ErrorBoundaryState {
-    return { hasError: true, error };
-  }
-
-  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
-    console.error('Error caught by boundary:', error, errorInfo);
-  }
-
-  render() {
-    if (this.state.hasError) {
-      return (
-        <div className="min-h-screen bg-slate-50 flex items-center justify-center p-4">
-          <div className="max-w-md w-full bg-white rounded-lg shadow-lg p-8 text-center">
-            <div className="mb-6">
-              <div className="mx-auto w-16 h-16 bg-red-100 rounded-full flex items-center justify-center">
-                <AlertCircle className="h-8 w-8 text-red-600" />
-              </div>
-            </div>
-            
-            <h1 className="text-2xl font-bold text-slate-900 mb-2">
-              Something went wrong
-            </h1>
-            
-            <p className="text-slate-600 mb-6">
-              We encountered an unexpected error. Please try refreshing the page.
-            </p>
-            
-            {this.state.error && (
-              <details className="text-left mb-6 p-4 bg-slate-50 rounded text-sm">
-                <summary className="cursor-pointer font-medium text-slate-700 mb-2">
-                  Error details
-                </summary>
-                <pre className="text-xs text-slate-600 overflow-auto">
-                  {this.state.error.toString()}
-                </pre>
-              </details>
-            )}
-            
-            <Button
-              onClick={() => window.location.reload()}
-              className="w-full"
-            >
-              Refresh Page
-            </Button>
-          </div>
-        </div>
-      );
-    }
-
-    return this.props.children;
-  }
-}

package/frontend/src/components/FilterPanel.tsx

@@ -1,10 +0,0 @@
-// FilterPanel
-// min/max price
-// status select
-// category
-// reset
-// apply
-// badge
-// collapse
-// URL params
-// reset page

package/frontend/src/components/Footer.tsx

@@ -1,100 +0,0 @@
-import Link from 'next/link';
-import { Github, ExternalLink } from 'lucide-react';
-
-export default function Footer() {
-  return (
-    <footer className="bg-gray-50 dark:bg-gray-950 border-t border-gray-200 dark:border-gray-800 mt-16">
-      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-          <div>
-            <h3 className="text-lg font-semibold text-black dark:text-white mb-4">Strade</h3>
-            <p className="text-gray-600 dark:text-gray-400 text-sm">
-              A decentralized marketplace built on Stacks blockchain.
-              Buy and sell goods securely with smart contracts.
-            </p>
-          </div>
-
-          <div>
-            <h4 className="font-semibold text-black dark:text-white mb-4">Quick Links</h4>
-            <ul className="space-y-2 text-sm text-gray-600 dark:text-gray-400">
-              <li>
-                <Link href="/marketplace" className="hover:text-black dark:hover:text-white transition-colors">
-                  Marketplace
-                </Link>
-              </li>
-              <li>
-                <Link href="/my-listings" className="hover:text-black dark:hover:text-white transition-colors">
-                  My Listings
-                </Link>
-              </li>
-              <li>
-                <Link href="/about" className="hover:text-black dark:hover:text-white transition-colors">
-                  About Us
-                </Link>
-              </li>
-              <li>
-                <Link href="/how-it-works" className="hover:text-black dark:hover:text-white transition-colors">
-                  How It Works
-                </Link>
-              </li>
-              <li>
-                <Link href="/help" className="hover:text-black dark:hover:text-white transition-colors">
-                  Help & FAQ
-                </Link>
-              </li>
-            </ul>
-          </div>
-
-          <div>
-            <h4 className="font-semibold text-black dark:text-white mb-4">Resources</h4>
-            <ul className="space-y-2 text-sm text-gray-600 dark:text-gray-400">
-              <li>
-                <a 
-                  href="https://www.stacks.co/" 
-                  target="_blank" 
-                  rel="noopener noreferrer"
-                  className="hover:text-black dark:hover:text-white transition-colors inline-flex items-center gap-1"
-                >
-                  Stacks Blockchain
-                  <ExternalLink className="h-3 w-3" />
-                </a>
-              </li>
-              <li>
-                <a 
-                  href="https://explorer.hiro.so/?chain=testnet" 
-                  target="_blank" 
-                  rel="noopener noreferrer"
-                  className="hover:text-black dark:hover:text-white transition-colors inline-flex items-center gap-1"
-                >
-                  Testnet Explorer
-                  <ExternalLink className="h-3 w-3" />
-                </a>
-              </li>
-              <li>
-                <a 
-                  href="https://github.com" 
-                  target="_blank" 
-                  rel="noopener noreferrer"
-                  className="hover:text-black dark:hover:text-white transition-colors inline-flex items-center gap-1"
-                >
-                  <Github className="h-3 w-3" />
-                  GitHub
-                </a>
-              </li>
-            </ul>
-          </div>
-        </div>
-
-        <div className="border-t border-gray-200 dark:border-gray-800 mt-8 pt-8 text-center text-sm text-gray-600 dark:text-gray-400">
-          <p>&copy; 2025 Strade. Built on Stacks blockchain. All rights reserved.</p>
-          <p className="mt-2 text-xs text-gray-500 dark:text-gray-500">
-            Testnet version - For demonstration purposes only
-          </p>
-        </div>
-      </div>
-    </footer>
-  );
-}
-// grid-cols-1 md:grid-cols-4
-// text-center md:text-left
-// py-8