import React, { useState, useRef, useEffect } from 'react';
import {
ChevronRight,
Upload,
CheckCircle2,
AlertCircle,
FileText,
Settings,
Truck,
CreditCard,
Play,
ArrowRight,
Save,
Mail,
Phone,
Building,
MapPin,
Loader2
} from 'lucide-react';
const App = () => {
const [step, setStep] = useState(0); // 0: Landing, 1: Interface, 2: AI Analysis, 3: Quote/Review
const [isLoading, setIsLoading] = useState(false);
const [saveStatus, setSaveStatus] = useState(null);
const [formErrors, setFormErrors] = useState({});
const [aiStatus, setAiStatus] = useState('idle'); // idle, uploading, processing, error, success
const formRef = useRef(null);
const [formData, setFormData] = useState({
customerType: '',
otherCustomerType: '',
supplySteel: 'no',
customerDeliver: 'no',
customerPickup: 'no',
recoverDrops: 'no',
companyName: '',
companyAddress: '',
contactName: '',
email: '',
phone: '',
projectName: '',
projectAddress: '',
files: []
});
const handleInputChange = (e) => {
const { name, value } = e.target;
setFormData(prev => ({ ...prev, [name]: value }));
if (formErrors[name]) {
setFormErrors(prev => {
const newErrors = { ...prev };
delete newErrors[name];
return newErrors;
});
}
};
const validateForm = () => {
const errors = {};
const required = ['customerType', 'contactName', 'email', 'phone', 'projectName', 'projectAddress'];
required.forEach(field => {
if (!formData[field]) errors[field] = true;
});
if (formData.customerType === 'Other' && !formData.otherCustomerType) {
errors.otherCustomerType = true;
}
setFormErrors(errors);
if (Object.keys(errors).length > 0) {
const firstErrorField = document.querySelector('.border-red-500');
if (firstErrorField) {
firstErrorField.scrollIntoView({ behavior: 'smooth', block: 'center' });
}
return false;
}
return true;
};
const handleSaveInformation = () => {
setIsLoading(true);
// Simulate folder creation logic OWC > Customer Projects
setTimeout(() => {
setIsLoading(false);
setSaveStatus('success');
setTimeout(() => setSaveStatus(null), 3000);
}, 1500);
};
const handleSubmit = (e) => {
e.preventDefault();
if (validateForm()) {
setStep(2);
}
};
const simulateFileUpload = () => {
setAiStatus('uploading');
setTimeout(() => {
setAiStatus('processing');
// Randomly simulate success or failure for demonstration
setTimeout(() => {
const success = Math.random() > 0.3;
setAiStatus(success ? 'success' : 'error');
}, 2500);
}, 1500);
};
const LandingPage = () => (
O'Leary Welding
The next generation of structural steel ordering. Fast, precise, and entirely digital.
{/* Video Placeholder */}
Overview Video
How to Order Structural Steel Online
Precision Fab
AI-driven analysis of your drawings for exact specifications.
Direct Logistics
Real-time delivery quotes and integrated freight tracking.
Quick Pay
Seamless QuickBooks integration for fast secure payments.
);
const CustomerInterface = () => (
Project Specifications
Provide project details and upload drawings for AI analysis.
Step 1 of 3
);
const DrawingAnalysis = () => (
Technical Drawings
Upload your PDF, DXF, or NC1 files for Gemini AI analysis.
{aiStatus === 'idle' && (
Drag and drop your files here
Supported: PDF, DXF, NC1, DWG
)}
{(aiStatus === 'uploading' || aiStatus === 'processing') && (
{aiStatus === 'uploading' ? 'Uploading Drawings...' : 'Gemini AI Analyzing Steel Requirements...'}
Calculating weight, pricing, and labor estimates.
)}
{aiStatus === 'success' && (
Analysis Complete!
Gemini has successfully parsed your drawings and generated a real-time quote.
)}
{aiStatus === 'error' && (
Processing Error
The files cannot be read by our agent. Please select an option for the next step:
or
A team member will manually quote your project within 24 hours.
)}
);
const QuoteSummary = () => (
Project Quote: {formData.projectName}
Order ID: OWC-{Math.floor(Math.random() * 90000) + 10000}
Estimated Delivery
June 14, 2024
Breakdown
-
Material Cost {formData.supplySteel === 'yes' ? '(Customer Provided)' : ''}
{formData.supplySteel === 'yes' ? '$0.00' : '$4,250.00'}
-
Labor & Fabrication
$2,840.00
-
Delivery Fee {formData.customerPickup === 'yes' ? '(Waived)' : ''}
{formData.customerPickup === 'yes' ? '$0.00' : '$450.00'}
-
Total Quote
$7,540.00
Ready to Proceed?
By clicking "Pay Now", you will receive a QuickBooks payment link via email. Your order will enter the queue immediately upon payment confirmation.
);
return (
{/* Navigation Header */}
{step === 0 && }
{step === 1 && }
{step === 2 && }
{step === 3 && }
{/* Persistent Footer */}
);
};
export default App;
