[V0_FILE]typescriptreact:file="app/loading.tsx" isFixed="true" isMerged="true" export default function Loading() { return null } [V0_FILE]typescriptreact:file="app/about/page.tsx" isMerged="true" export default function AboutPage() { return (

About Us

About Us content coming soon.

) } [V0_FILE]typescriptreact:file="app/contact/page.tsx" isMerged="true" export default function ContactPage() { return (

Contact

Contact information coming soon.

) } [V0_FILE]typescriptreact:file="app/terms/page.tsx" isMerged="true" export default function TermsPage() { return (

Terms of Service

) } [V0_FILE]typescriptreact:file="app/privacy/page.tsx" isMerged="true" export default function PrivacyPage() { return (

Privacy Policy

) } [V0_FILE]typescriptreact:file="app/studies/page.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" import Link from "next/link" import { BookOpen, ChevronLeft, ChevronRight, Filter, Search } from "lucide-react" import { Button } from "@/components/ui/button" import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" import { Input } from "@/components/ui/input" import { Skeleton } from "@/components/ui/skeleton" // Define the Study type interface Study { id: string title: string briefDescription: string fieldOfStudy: string } export default function StudiesPage() { const [studies, setStudies] = useState([]) const [filteredStudies, setFilteredStudies] = useState([]) const [loading, setLoading] = useState(true) const [currentPage, setCurrentPage] = useState(1) const [selectedField, setSelectedField] = useState("all") const [searchQuery, setSearchQuery] = useState("") const studiesPerPage = 6 const fields = ["All Fields", "Computer Science", "Biology", "Physics", "Engineering", "Medicine"] // Fetch studies from API useEffect(() => { const fetchStudies = async () => { try { // In a real app, this would be an API call like: // const response = await fetch('/api/studies'); // const data = await response.json(); // For MVP, we'll use mock data const mockStudies: Study[] = [ { id: "1", title: "Advancements in Quantum Computing Algorithms", briefDescription: "This study explores recent breakthroughs in quantum computing algorithms and their potential applications in solving complex computational problems.", fieldOfStudy: "Computer Science", }, { id: "2", title: "Novel Approaches to CRISPR Gene Editing", briefDescription: "An examination of innovative techniques in CRISPR gene editing technology that improve precision and reduce off-target effects.", fieldOfStudy: "Biology", }, { id: "3", title: "Dark Matter Detection Methods", briefDescription: "This paper reviews current methods for detecting dark matter and proposes new experimental approaches based on recent theoretical developments.", fieldOfStudy: "Physics", }, { id: "4", title: "Sustainable Materials in Construction", briefDescription: "An analysis of eco-friendly materials that can replace traditional construction materials while maintaining structural integrity and longevity.", fieldOfStudy: "Engineering", }, { id: "5", title: "Machine Learning Applications in Medical Diagnosis", briefDescription: "This research demonstrates how machine learning algorithms can improve the accuracy and efficiency of medical diagnoses across various specialties.", fieldOfStudy: "Medicine", }, { id: "6", title: "Neuroplasticity in Adult Learning", briefDescription: "A study on how the adult brain adapts and forms new neural connections during the learning process, with implications for education and rehabilitation.", fieldOfStudy: "Biology", }, { id: "7", title: "Renewable Energy Grid Integration", briefDescription: "This paper addresses challenges and solutions for integrating large-scale renewable energy sources into existing power grids.", fieldOfStudy: "Engineering", }, { id: "8", title: "Quantum Entanglement in Particle Physics", briefDescription: "An exploration of quantum entanglement phenomena and their implications for our understanding of fundamental particle interactions.", fieldOfStudy: "Physics", }, ] setStudies(mockStudies) setFilteredStudies(mockStudies) setLoading(false) } catch (error) { console.error("Error fetching studies:", error) setLoading(false) } } fetchStudies() }, []) // Filter studies based on field and search query useEffect(() => { let result = studies // Filter by field if (selectedField !== "all" && selectedField !== "All Fields") { result = result.filter((study) => study.fieldOfStudy === selectedField) } // Filter by search query if (searchQuery) { const query = searchQuery.toLowerCase() result = result.filter( (study) => study.title.toLowerCase().includes(query) || study.briefDescription.toLowerCase().includes(query), ) } setFilteredStudies(result) setCurrentPage(1) // Reset to first page when filters change }, [selectedField, searchQuery, studies]) // Calculate pagination const indexOfLastStudy = currentPage * studiesPerPage const indexOfFirstStudy = indexOfLastStudy - studiesPerPage const currentStudies = filteredStudies.slice(indexOfFirstStudy, indexOfLastStudy) const totalPages = Math.ceil(filteredStudies.length / studiesPerPage) // Handle page change const paginate = (pageNumber: number) => { if (pageNumber > 0 && pageNumber <= totalPages) { setCurrentPage(pageNumber) } } return (

{/* Header - Consistent with Homepage */}

TTO Tech Transfer Office

{/* Main Content */}

{/* Page Title */}

Explore Research Studies

{/* Filtering and Search Controls */}

setSearchQuery(e.target.value)} />

{/* Studies Listing */} {loading ? ( // Loading skeleton

{Array(6) .fill(0) .map((_, index) => ( ))}

) : currentStudies.length > 0 ? (

{currentStudies.map((study) => ( {study.title}

{study.briefDescription}

{study.fieldOfStudy} ))}

) : ( // No results message

No studies found

Try adjusting your search or filter criteria to find what you're looking for.

{selectedField !== "all" || searchQuery ? ( ) : null}

)} {/* Pagination Controls */} {!loading && filteredStudies.length > studiesPerPage && (

Page {currentPage} of {totalPages}

)}

{/* Footer - Consistent with Homepage */}

) } [V0_FILE]typescriptreact:file="app/studies/loading.tsx" isFixed="true" isMerged="true" export default function Loading() { return null } [V0_FILE]typescriptreact:file="app/api/studies/route.ts" isMerged="true" import { NextResponse } from "next/server" // Define the Study type interface Study { id: string title: string briefDescription: string fieldOfStudy: string } // Mock data for studies const studies: Study[] = [ { id: "1", title: "Advancements in Quantum Computing Algorithms", briefDescription: "This study explores recent breakthroughs in quantum computing algorithms and their potential applications in solving complex computational problems.", fieldOfStudy: "Computer Science", }, { id: "2", title: "Novel Approaches to CRISPR Gene Editing", briefDescription: "An examination of innovative techniques in CRISPR gene editing technology that improve precision and reduce off-target effects.", fieldOfStudy: "Biology", }, { id: "3", title: "Dark Matter Detection Methods", briefDescription: "This paper reviews current methods for detecting dark matter and proposes new experimental approaches based on recent theoretical developments.", fieldOfStudy: "Physics", }, { id: "4", title: "Sustainable Materials in Construction", briefDescription: "An analysis of eco-friendly materials that can replace traditional construction materials while maintaining structural integrity and longevity.", fieldOfStudy: "Engineering", }, { id: "5", title: "Machine Learning Applications in Medical Diagnosis", briefDescription: "This research demonstrates how machine learning algorithms can improve the accuracy and efficiency of medical diagnoses across various specialties.", fieldOfStudy: "Medicine", }, { id: "6", title: "Neuroplasticity in Adult Learning", briefDescription: "A study on how the adult brain adapts and forms new neural connections during the learning process, with implications for education and rehabilitation.", fieldOfStudy: "Biology", }, { id: "7", title: "Renewable Energy Grid Integration", briefDescription: "This paper addresses challenges and solutions for integrating large-scale renewable energy sources into existing power grids.", fieldOfStudy: "Engineering", }, { id: "8", title: "Quantum Entanglement in Particle Physics", briefDescription: "An exploration of quantum entanglement phenomena and their implications for our understanding of fundamental particle interactions.", fieldOfStudy: "Physics", }, ] export async function GET(request: Request) { // Get URL parameters const { searchParams } = new URL(request.url) const field = searchParams.get("field") const page = Number.parseInt(searchParams.get("page") || "1") const limit = Number.parseInt(searchParams.get("limit") || "10") // Filter by field if provided let filteredStudies = studies if (field && field !== "all") { filteredStudies = studies.filter((study) => study.fieldOfStudy.toLowerCase() === field.toLowerCase()) } // Calculate pagination const startIndex = (page - 1) * limit const endIndex = page * limit const paginatedStudies = filteredStudies.slice(startIndex, endIndex) // Return response with pagination metadata return NextResponse.json({ studies: paginatedStudies, pagination: { total: filteredStudies.length, page, limit, totalPages: Math.ceil(filteredStudies.length / limit), }, }) } [V0_FILE]typescriptreact:file="app/api/studies/[id]/route.ts" isMerged="true" import { NextResponse } from "next/server" // Define the detailed Study type interface DetailedStudy { id: string title: string abstract: string content: string fieldOfStudy: string publishedDate: string readingTime: string } // Mock data for detailed studies const getStudyById = (id: string): DetailedStudy | undefined => { const studies: Record = { "1": { id: "1", title: "Advancements in Quantum Computing Algorithms", abstract: "This research paper presents a comprehensive analysis of recent advancements in quantum computing algorithms. Through rigorous experimentation and data analysis, we demonstrate significant improvements over existing methods and propose novel approaches to address current limitations in quantum computing.", content: ` # Introduction Quantum computing represents a paradigm shift in computational capabilities, leveraging quantum mechanical phenomena to perform operations on data. This paper explores recent algorithmic innovations that enhance the practical applications of quantum computers. ## Background Traditional computing relies on bits as the fundamental unit of information, whereas quantum computing utilizes quantum bits or qubits. The unique properties of qubits, including superposition and entanglement, enable quantum computers to solve certain problems exponentially faster than classical computers. ## Methodology Our research methodology involved developing new quantum algorithms and testing them against established benchmarks. We utilized simulation environments and, where possible, actual quantum hardware to validate our findings. # Results The results demonstrate a 30% improvement in computational efficiency for specific problem classes, particularly in optimization and cryptographic applications. Our novel approach to quantum error correction shows particular promise in extending the coherence time of qubits. # Discussion The implications of these advancements extend beyond theoretical computer science, with potential applications in drug discovery, materials science, and financial modeling. However, challenges remain in scaling these algorithms to larger qubit systems. # Conclusion Our work contributes to the growing body of knowledge in quantum computing algorithms and provides a foundation for future research in this rapidly evolving field. `, fieldOfStudy: "Computer Science", publishedDate: "May 15, 2023", readingTime: "12 min read", }, "2": { id: "2", title: "Novel Approaches to CRISPR Gene Editing", abstract: "This study examines innovative techniques in CRISPR gene editing technology that improve precision and reduce off-target effects. Our research demonstrates significant advancements in the specificity and efficiency of genetic modifications, with implications for both research and therapeutic applications.", content: ` # Introduction CRISPR-Cas9 has revolutionized genetic engineering by providing a precise, efficient method for modifying DNA. However, concerns about off-target effects have limited its therapeutic potential. This paper presents novel approaches to enhance CRISPR specificity. ## Background The CRISPR-Cas9 system consists of a guide RNA that directs the Cas9 enzyme to specific DNA sequences for cutting. Off-target effects occur when the system modifies unintended genomic locations, potentially causing harmful mutations. ## Methodology We developed modified Cas9 variants and optimized guide RNA designs to minimize off-target activity. Our approach incorporated computational prediction models and high-throughput screening to identify the most specific configurations. # Results Our enhanced CRISPR system demonstrated a 90% reduction in off-target effects while maintaining on-target efficiency. The modifications were effective across multiple cell types and genomic targets. # Discussion These improvements address a critical barrier to the clinical application of CRISPR technology. The enhanced specificity enables more confident use in therapeutic contexts, particularly for genetic disorders requiring precise modifications. # Conclusion Our work provides a significant advancement in CRISPR technology, bringing gene editing closer to widespread clinical application while minimizing safety concerns. `, fieldOfStudy: "Biology", publishedDate: "June 3, 2023", readingTime: "15 min read", }, "3": { id: "3", title: "Dark Matter Detection Methods", abstract: "This paper reviews current methods for detecting dark matter and proposes new experimental approaches based on recent theoretical developments. We analyze the limitations of existing detection technologies and present innovative solutions that could significantly increase sensitivity to dark matter particles.", content: ` # Introduction Dark matter constitutes approximately 85% of the matter in the universe, yet its nature remains one of the greatest mysteries in physics. This paper examines detection methodologies and proposes novel approaches. ## Background Despite overwhelming gravitational evidence for dark matter, direct detection has proven challenging. Current detection methods rely on observing rare interactions between dark matter particles and ordinary matter. ## Methodology We evaluated existing detection technologies, including cryogenic detectors, noble liquid time projection chambers, and bubble chambers. Based on theoretical models, we designed new detector configurations with enhanced sensitivity. # Results Our analysis indicates that a hybrid detection system combining multiple sensing technologies could increase detection probability by an order of magnitude. Simulations suggest particular sensitivity to low-mass dark matter candidates. # Discussion The proposed detection methods address key limitations in current experiments, particularly in distinguishing dark matter signals from background noise. Implementation challenges include scaling the technology and managing increased data complexity. # Conclusion Advancing dark matter detection requires innovative approaches that leverage complementary technologies. Our proposed methods offer a promising direction for future experimental efforts. `, fieldOfStudy: "Physics", publishedDate: "April 22, 2023", readingTime: "18 min read", }, "4": { id: "4", title: "Sustainable Materials in Construction", abstract: "An analysis of eco-friendly materials that can replace traditional construction materials while maintaining structural integrity and longevity. This research evaluates performance metrics, environmental impact, and economic feasibility of various sustainable alternatives for modern construction projects.", content: ` # Introduction The construction industry accounts for approximately 40% of global carbon emissions. This research investigates sustainable materials that can reduce environmental impact while meeting structural requirements. ## Background Traditional construction relies heavily on concrete, steel, and timber, all of which have significant environmental footprints. Recent advances in material science have created opportunities for more sustainable alternatives. ## Methodology We tested multiple sustainable materials under standardized conditions to evaluate strength, durability, thermal performance, and environmental impact. Cost analysis was performed to assess economic viability. # Results Several materials showed promising results, including hemp-lime composites, mycelium-based insulation, and advanced timber products. These materials demonstrated carbon-negative potential while meeting building code requirements. # Discussion Implementation challenges include regulatory approval, supply chain development, and industry adoption. However, the environmental benefits and potential long-term cost savings present compelling arguments for transition. # Conclusion Sustainable construction materials offer viable alternatives to traditional options, with benefits extending beyond environmental impact to include improved indoor air quality and reduced lifecycle costs. `, fieldOfStudy: "Engineering", publishedDate: "March 10, 2023", readingTime: "14 min read", }, "5": { id: "5", title: "Machine Learning Applications in Medical Diagnosis", abstract: "This research demonstrates how machine learning algorithms can improve the accuracy and efficiency of medical diagnoses across various specialties. Our study compares traditional diagnostic methods with ML-enhanced approaches, showing significant improvements in early detection rates for several conditions.", content: ` # Introduction Accurate and timely medical diagnosis is critical for effective treatment. This research explores how machine learning can augment clinical decision-making and improve diagnostic outcomes. ## Background Traditional diagnosis relies on physician expertise and standardized tests, which can be subject to human error and limitations. Machine learning offers the potential to identify patterns in complex medical data that may not be apparent to human observers. ## Methodology We developed and trained multiple machine learning models using anonymized patient data from partner healthcare institutions. Models were evaluated against diagnoses made by experienced physicians. # Results ML-enhanced diagnosis showed a 22% improvement in early detection of certain cancers and a 15% reduction in false negatives for cardiovascular conditions. The greatest improvements were observed in cases with subtle or atypical presentations. # Discussion While ML shows significant promise, challenges remain in integration with clinical workflows, explainability of AI decisions, and addressing potential biases in training data. The technology appears most effective when used as a complementary tool rather than a replacement for clinical judgment. # Conclusion Machine learning represents a powerful addition to the diagnostic toolkit, with particular value in complex or ambiguous cases. Continued development and careful implementation could significantly improve patient outcomes. `, fieldOfStudy: "Medicine", publishedDate: "July 8, 2023", readingTime: "16 min read", }, "6": { id: "6", title: "Neuroplasticity in Adult Learning", abstract: "A study on how the adult brain adapts and forms new neural connections during the learning process, with implications for education and rehabilitation. This research challenges previous assumptions about limited plasticity in adult brains and presents evidence for significant adaptive capacity throughout life.", content: ` # Introduction Neuroplasticity—the brain's ability to reorganize itself by forming new neural connections—was long thought to be limited in adulthood. This research investigates the extent and mechanisms of adult neuroplasticity, particularly in learning contexts. ## Background Traditional neuroscience held that brain development was largely complete by early adulthood. Recent evidence suggests significant plasticity continues throughout life, though the nature and extent of this plasticity differs from developmental periods. ## Methodology Our study employed longitudinal neuroimaging of adults engaged in intensive learning of new skills, combined with cognitive assessments and biomarker analysis. Participants were followed over an 18-month period. # Results Significant structural and functional changes were observed in adult brains during skill acquisition. These changes correlated with performance improvements and were most pronounced in individuals who engaged in deliberate practice techniques. # Discussion The observed neuroplasticity has implications for adult education, rehabilitation after brain injury, and potential interventions for neurodegenerative conditions. The findings suggest specific approaches that may enhance learning-induced plasticity. # Conclusion Adult neuroplasticity is more robust than previously recognized and can be strategically leveraged to enhance learning outcomes and recovery from neural damage. `, fieldOfStudy: "Biology", publishedDate: "February 19, 2023", readingTime: "13 min read", }, "7": { id: "7", title: "Renewable Energy Grid Integration", abstract: "This paper addresses challenges and solutions for integrating large-scale renewable energy sources into existing power grids. We analyze technical, economic, and regulatory barriers to high renewable penetration and propose innovative approaches to overcome these limitations.", content: ` # Introduction The transition to renewable energy is essential for addressing climate change, but integrating variable renewable sources into existing grid infrastructure presents significant challenges. This research examines solutions for high renewable penetration. ## Background Traditional power grids were designed for centralized, dispatchable generation. Renewable sources like wind and solar are distributed and variable, requiring new approaches to grid management and design. ## Methodology We analyzed data from multiple grid operators with varying levels of renewable penetration, conducted simulation studies, and evaluated case studies of successful integration projects. # Results Our analysis identified several key strategies for successful integration: advanced forecasting techniques, flexible demand management, strategic storage deployment, and grid interconnection enhancement. Combined, these approaches enabled reliable operation with up to 80% renewable penetration. # Discussion Technical solutions exist for most integration challenges, but regulatory frameworks and market structures often lag behind. Economic considerations favor a phased approach with strategic investment in enabling technologies. # Conclusion High renewable penetration is technically feasible with existing technologies, but requires coordinated planning and policy support to overcome institutional and economic barriers. `, fieldOfStudy: "Engineering", publishedDate: "August 5, 2023", readingTime: "17 min read", }, "8": { id: "8", title: "Quantum Entanglement in Particle Physics", abstract: "An exploration of quantum entanglement phenomena and their implications for our understanding of fundamental particle interactions. This research investigates non-local correlations between particles and examines how entanglement challenges classical notions of locality and reality.", content: ` # Introduction Quantum entanglement represents one of the most profound aspects of quantum mechanics, with far-reaching implications for our understanding of reality. This paper explores recent experimental findings and theoretical developments in entanglement research. ## Background When particles become entangled, their quantum states become correlated such that the state of one particle cannot be described independently of the other, regardless of the distance separating them. This "spooky action at a distance," as Einstein called it, has been experimentally verified but remains theoretically challenging. ## Methodology We conducted a series of experiments using entangled photon pairs generated through parametric down-conversion, measuring correlations across varying distances and conditions. These results were analyzed in the context of Bell's inequalities and quantum field theory. # Results Our experiments demonstrated entanglement preservation over record distances and through various intervening media. The results strongly violated Bell's inequalities, confirming the non-local nature of quantum correlations. # Discussion The findings have implications for fundamental physics, suggesting that either locality or realism (or both) must be abandoned as universal principles. The research also has practical applications in quantum communication and computing. # Conclusion Quantum entanglement continues to challenge our understanding of physical reality while opening new technological possibilities. Our work extends the experimental verification of this phenomenon and strengthens its theoretical foundations. `, fieldOfStudy: "Physics", publishedDate: "September 12, 2023", readingTime: "20 min read", }, } return studies[id] } export async function GET(request: Request, { params }: { params: { id: string } }) { const id = params.id const study = getStudyById(id) if (!study) { return NextResponse.json({ error: "Study not found" }, { status: 404 }) } return NextResponse.json(study) } [V0_FILE]typescriptreact:file="app/studies/[id]/page.tsx" isFixed="true" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { useState, useEffect, useRef } from "react" import Link from "next/link" import { useParams, useRouter } from "next/navigation" import { BookOpen, ArrowLeft, MessageSquare, Download, Share2, Send, Mail } from "lucide-react" import { Button } from "@/components/ui/button" import { Card, CardContent } from "@/components/ui/card" import { Skeleton } from "@/components/ui/skeleton" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Badge } from "@/components/ui/badge" import { Textarea } from "@/components/ui/textarea" import { toast } from "@/components/ui/use-toast" // Define the Study type with more details for the study page interface Study { id: string title: string abstract: string content: string fieldOfStudy: string publishedDate: string readingTime: string } // Define the ChatMessage type interface ChatMessage { role: "user" | "assistant" content: string timestamp: Date } export default function StudyDetailPage() { const params = useParams() const router = useRouter() const { id } = params const [study, setStudy] = useState(null) const [loading, setLoading] = useState(true) const [chatMessages, setChatMessages] = useState([]) const [question, setQuestion] = useState("") const [isSending, setIsSending] = useState(false) const chatEndRef = useRef(null) // Fetch study details from API useEffect(() => { const fetchStudyDetails = async () => { try { // In a real app, this would be an API call like: // const response = await fetch(`/api/studies/${id}`); // const data = await response.json(); // For MVP, we'll use mock data // Simulate API delay await new Promise((resolve) => setTimeout(resolve, 800)) // Mock study data based on ID const mockStudy: Study = { id: id as string, title: getMockTitle(id as string), abstract: "This research paper presents a comprehensive analysis of recent advancements in the field. Through rigorous experimentation and data analysis, we demonstrate significant improvements over existing methods and propose novel approaches to address current limitations.", content: ` # Introduction Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam auctor, nisl eget ultricies tincidunt, nisl nisl aliquam nisl, eget ultricies nisl nisl eget nisl. Nullam auctor, nisl eget ultricies tincidunt, nisl nisl aliquam nisl, eget ultricies nisl nisl eget nisl. ## Background Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. ## Methodology Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. # Results Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. # Discussion Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur? # Conclusion At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. `, fieldOfStudy: getMockField(id as string), publishedDate: "May 15, 2023", readingTime: "12 min read", } setStudy(mockStudy) setLoading(false) } catch (error) { console.error("Error fetching study details:", error) setLoading(false) } } if (id) { fetchStudyDetails() } }, [id]) // Scroll to bottom of chat when new messages are added useEffect(() => { if (chatEndRef.current) { chatEndRef.current.scrollIntoView({ behavior: "smooth" }) } }, [chatMessages]) // Helper function to get mock title based on ID function getMockTitle(id: string): string { const titles = [ "Advancements in Quantum Computing Algorithms", "Novel Approaches to CRISPR Gene Editing", "Dark Matter Detection Methods", "Sustainable Materials in Construction", "Machine Learning Applications in Medical Diagnosis", "Neuroplasticity in Adult Learning", "Renewable Energy Grid Integration", "Quantum Entanglement in Particle Physics", ] const idNum = Number.parseInt(id) if (!isNaN(idNum) && idNum > 0 && idNum <= titles.length) { return titles[idNum - 1] } return "Research Study " + id } // Helper function to get mock field based on ID function getMockField(id: string): string { const fields = [ "Computer Science", "Biology", "Physics", "Engineering", "Medicine", "Biology", "Engineering", "Physics", ] const idNum = Number.parseInt(id) if (!isNaN(idNum) && idNum > 0 && idNum <= fields.length) { return fields[idNum - 1] } return "Interdisciplinary" } // Handle sending a question to the chatbot const handleSendQuestion = async () => { if (!question.trim() || !study) return // Add user message to chat const userMessage: ChatMessage = { role: "user", content: question, timestamp: new Date(), } setChatMessages((prev) => [...prev, userMessage]) setQuestion("") setIsSending(true) try { // In a real app, this would be an API call like: // const response = await fetch(`/api/studies/${id}/chat`, { // method: 'POST', // headers: { 'Content-Type': 'application/json' }, // body: JSON.stringify({ question }) // }); // const data = await response.json(); // For MVP, we'll simulate an API response await new Promise((resolve) => setTimeout(resolve, 1000)) // Generate a mock response based on the question and study const mockResponse = generateMockResponse(question, study) // Add assistant message to chat const assistantMessage: ChatMessage = { role: "assistant", content: mockResponse, timestamp: new Date(), } setChatMessages((prev) => [...prev, assistantMessage]) } catch (error) { console.error("Error sending question:", error) toast({ title: "Error", description: "Failed to get a response. Please try again.", variant: "destructive", }) } finally { setIsSending(false) } } // Generate a mock response for the chatbot const generateMockResponse = (question: string, study: Study): string => { const lowerQuestion = question.toLowerCase() // Check for common question patterns and generate appropriate responses if (lowerQuestion.includes("what") && lowerQuestion.includes("about")) { return `This study on "${study.title}" explores ${study.abstract.substring(0, 100).toLowerCase()}... You can find more details in the full paper.` } else if (lowerQuestion.includes("methodology") || lowerQuestion.includes("method")) { return "The methodology employed in this study involves rigorous experimental design, data collection from multiple sources, and statistical analysis to ensure validity and reliability of the findings." } else if (lowerQuestion.includes("conclusion") || lowerQuestion.includes("findings")) { return "The study concludes that there are significant advancements in this field that can be applied to solve real-world problems. The findings suggest that further research in specific areas could yield even more promising results." } else if (lowerQuestion.includes("application") || lowerQuestion.includes("practical")) { return "The practical applications of this research include potential improvements in technology, healthcare, or environmental sustainability, depending on the specific implementation context." } else if (lowerQuestion.includes("future") || lowerQuestion.includes("next steps")) { return "Future research directions could include expanding the sample size, exploring additional variables, or applying the findings to different contexts to test generalizability." } else { return `Based on the paper "${study.title}", I can tell you that the research focuses on innovative approaches in ${study.fieldOfStudy}. The study presents comprehensive analysis and proposes novel solutions to existing challenges in the field.` } } // Handle contact researcher const handleContactResearcher = () => { if (!study) return const subject = encodeURIComponent(`Inquiry about TTO Study ID: ${study.id}`) const body = encodeURIComponent( `I am interested in learning more about the study: "${study.title}" (ID: ${study.id}).\n\nPlease forward my inquiry to the anonymous researcher.\n\nThank you.`, ) window.location.href = `mailto:admin@tto-platform.example.com?subject=${subject}&body=${body}` } return (

{/* Header - Consistent with Homepage */}

TTO Tech Transfer Office

{/* Main Content */}

{/* Back button */}

{loading ? ( // Loading skeleton

) : study ? (

{/* Study Header */}

{study.title}

{study.fieldOfStudy} Published: {study.publishedDate} {study.readingTime}

{/* Study Content and Chatbot */}

Abstract Full Paper

Abstract

{study.abstract}

                          {study.content}

{/* Action buttons */}

{/* Chatbot Section */}

Chat with this Paper

Ask questions about this research paper and get instant answers from our AI assistant.

{/* Chat messages display */}

{chatMessages.length > 0 ? (

{chatMessages.map((msg, index) => (

{msg.content}

{msg.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" })}

))}

) : (

Ask a question about this study to start a conversation

)}

{/* Chat input */}

setQuestion(e.target.value)}
                          className="resize-none"
                          rows={3}
                          onKeyDown={(e) => {
                            if (e.key === "Enter" && !e.shiftKey) {
                              e.preventDefault()
                              handleSendQuestion()
                            }
                          }}
                        />
                        <Button
                          className="w-full"
                          onClick={handleSendQuestion}
                          disabled={!question.trim() || isSending}
                        >
                          {isSending ? (
                            <>
                              <span className="mr-2">Sending</span>
                              <svg
                                className="animate-spin h-4 w-4"
                                xmlns="http://www.w3.org/2000/svg"
                                fill="none"
                                viewBox="0 0 24 24"
                              >
                                <circle
                                  className="opacity-25"
                                  cx="12"
                                  cy="12"
                                  r="10"
                                  stroke="currentColor"
                                  strokeWidth="4"
                                ></circle>
                                <path
                                  className="opacity-75"
                                  fill="currentColor"
                                  d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
                                ></path>
                              </svg>
                            </>
                          ) : (
                            <>
                              Send <Send className="ml-2 h-4 w-4" />
                            </>
                          )}
                        </Button>
                      </div>
                    </CardContent>
                  </Card>
                </div>
              </div>
            </div>
          ) : (
            // Study not found
            <div className="text-center py-12">
              <h2 className="text-2xl font-bold mb-2">Study Not Found</h2>
              <p className="text-gray-600 mb-6">The study you're looking for doesn't exist or has been removed.</p>
              <Button onClick={() => router.push("/studies")}>Return to Studies</Button>
            </div>
          )}
        </div>
      </main>

{/* Footer - Consistent with Homepage */}
      <footer className="bg-gray-900 text-white py-12">
        <div className="container mx-auto px-4">
          <div className="grid md:grid-cols-2 gap-8">
            <div>
              <div className="flex items-center space-x-2 mb-6">
                <BookOpen className="h-6 w-6 text-blue-400" />
                <span className="font-bold text-xl">TTO Tech Transfer Office</span>
              </div>
              <p className="text-gray-400 max-w-md">
                Bridging the gap between research and the public through anonymous publishing and interactive
                exploration.
              </p>
            </div>
            <div className="grid grid-cols-2 gap-8">
              <div>
                <h3 className="font-semibold text-lg mb-4">Platform</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/about" className="text-gray-400 hover:text-white transition-colors">
                      About Us
                    </Link>
                  </li>
                  <li>
                    <Link href="/contact" className="text-gray-400 hover:text-white transition-colors">
                      Contact
                    </Link>
                  </li>
                </ul>
              </div>
              <div>
                <h3 className="font-semibold text-lg mb-4">Legal</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/terms" className="text-gray-400 hover:text-white transition-colors">
                      Terms of Service
                    </Link>
                  </li>
                  <li>
                    <Link href="/privacy" className="text-gray-400 hover:text-white transition-colors">
                      Privacy Policy
                    </Link>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <div className="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400">
            <p>© {new Date().getFullYear()} TTO Tech Transfer Office. All Rights Reserved.</p>
          </div>
        </div>
      </footer>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/api/studies/[id]/chat/route.ts" isMerged="true"
import { NextResponse } from "next/server"

// Define the ChatRequest type
interface ChatRequest {
  question: string
}

export async function POST(request: Request, { params }: { params: { id: string } }) {
  try {
    const studyId = params.id
    const body: ChatRequest = await request.json()
    const { question } = body

if (!question) {
      return NextResponse.json({ error: "Question is required" }, { status: 400 })
    }

// In a real implementation, this would:
    // 1. Retrieve the study content from a database
    // 2. Process the question using an AI model that has context of the study
    // 3. Return the AI-generated response

// For MVP, we'll generate a mock response
    const response = generateMockResponse(question, studyId)

return NextResponse.json({ answer: response })
  } catch (error) {
    console.error("Error processing chat request:", error)
    return NextResponse.json({ error: "Failed to process request" }, { status: 500 })
  }
}

// Generate a mock response based on the question and study ID
function generateMockResponse(question: string, studyId: string): string {
  const lowerQuestion = question.toLowerCase()

// Get mock study title based on ID
  const studyTitle = getMockTitle(studyId)

// Check for common question patterns and generate appropriate responses
  if (lowerQuestion.includes("what") && lowerQuestion.includes("about")) {
    return `This study on "${studyTitle}" explores recent advancements in the field and demonstrates significant improvements over existing methods.`
  } else if (lowerQuestion.includes("methodology") || lowerQuestion.includes("method")) {
    return "The methodology employed in this study involves rigorous experimental design, data collection from multiple sources, and statistical analysis to ensure validity and reliability of the findings."
  } else if (lowerQuestion.includes("conclusion") || lowerQuestion.includes("findings")) {
    return "The study concludes that there are significant advancements in this field that can be applied to solve real-world problems. The findings suggest that further research in specific areas could yield even more promising results."
  } else if (lowerQuestion.includes("application") || lowerQuestion.includes("practical")) {
    return "The practical applications of this research include potential improvements in technology, healthcare, or environmental sustainability, depending on the specific implementation context."
  } else if (lowerQuestion.includes("future") || lowerQuestion.includes("next steps")) {
    return "Future research directions could include expanding the sample size, exploring additional variables, or applying the findings to different contexts to test generalizability."
  } else {
    return `Based on the paper "${studyTitle}", I can tell you that the research focuses on innovative approaches in the field. The study presents comprehensive analysis and proposes novel solutions to existing challenges.`
  }
}

// Helper function to get mock title based on ID
function getMockTitle(id: string): string {
  const titles = [
    "Advancements in Quantum Computing Algorithms",
    "Novel Approaches to CRISPR Gene Editing",
    "Dark Matter Detection Methods",
    "Sustainable Materials in Construction",
    "Machine Learning Applications in Medical Diagnosis",
    "Neuroplasticity in Adult Learning",
    "Renewable Energy Grid Integration",
    "Quantum Entanglement in Particle Physics",
  ]

const idNum = Number.parseInt(id)
  if (!isNaN(idNum) && idNum > 0 && idNum <= titles.length) {
    return titles[idNum - 1]
  }

return "Research Study " + id
}
[V0_FILE]typescriptreact:file="components/ui/badge.tsx" isMerged="true"
import type * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"

import { cn } from "@/lib/utils"

const badgeVariants = cva(
  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
  {
    variants: {
      variant: {
        default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
        secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
        destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
        outline: "text-foreground",
      },
    },
    defaultVariants: {
      variant: "default",
    },
  },
)

export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {}

function Badge({ className, variant, ...props }: BadgeProps) {
  return <div className={cn(badgeVariants({ variant }), className)} {...props} />
}

export { Badge, badgeVariants }
[V0_FILE]typescriptreact:file="components/ui/textarea.tsx" isMerged="true"
import * as React from "react"

import { cn } from "@/lib/utils"

export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}

const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(({ className, ...props }, ref) => {
  return (
    <textarea
      className={cn(
        "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
        className,
      )}
      ref={ref}
      {...props}
    />
  )
})
Textarea.displayName = "Textarea"

export { Textarea }
[V0_FILE]typescriptreact:file="components/ui/toast.tsx" isMerged="true"
import * as React from "react"
import * as ToastPrimitives from "@radix-ui/react-toast"
import { cva, type VariantProps } from "class-variance-authority"
import { X } from "lucide-react"

import { cn } from "@/lib/utils"

const ToastProvider = ToastPrimitives.Provider

const ToastViewport = React.forwardRef<
  React.ElementRef<typeof ToastPrimitives.Viewport>,
  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
>(({ className, ...props }, ref) => (
  <ToastPrimitives.Viewport
    ref={ref}
    className={cn(
      "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
      className,
    )}
    {...props}
  />
))
ToastViewport.displayName = ToastPrimitives.Viewport.displayName

const toastVariants = cva(
  "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
  {
    variants: {
      variant: {
        default: "border bg-background text-foreground",
        destructive: "destructive group border-destructive bg-destructive text-destructive-foreground",
      },
    },
    defaultVariants: {
      variant: "default",
    },
  },
)

const Toast = React.forwardRef<
  React.ElementRef<typeof ToastPrimitives.Root>,
  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & VariantProps<typeof toastVariants>
>(({ className, variant, ...props }, ref) => {
  return <ToastPrimitives.Root ref={ref} className={cn(toastVariants({ variant }), className)} {...props} />
})
Toast.displayName = ToastPrimitives.Root.displayName

const ToastAction = React.forwardRef<
  React.ElementRef<typeof ToastPrimitives.Action>,
  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
>(({ className, ...props }, ref) => (
  <ToastPrimitives.Action
    ref={ref}
    className={cn(
      "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
      className,
    )}
    {...props}
  />
))
ToastAction.displayName = ToastPrimitives.Action.displayName

const ToastClose = React.forwardRef<
  React.ElementRef<typeof ToastPrimitives.Close>,
  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
>(({ className, ...props }, ref) => (
  <ToastPrimitives.Close
    ref={ref}
    className={cn(
      "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
      className,
    )}
    toast-close=""
    {...props}
  >
    <X className="h-4 w-4" />
  </ToastPrimitives.Close>
))
ToastClose.displayName = ToastPrimitives.Close.displayName

const ToastTitle = React.forwardRef<
  React.ElementRef<typeof ToastPrimitives.Title>,
  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
>(({ className, ...props }, ref) => (
  <ToastPrimitives.Title ref={ref} className={cn("text-sm font-semibold", className)} {...props} />
))
ToastTitle.displayName = ToastPrimitives.Title.displayName

const ToastDescription = React.forwardRef<
  React.ElementRef<typeof ToastPrimitives.Description>,
  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
>(({ className, ...props }, ref) => (
  <ToastPrimitives.Description ref={ref} className={cn("text-sm opacity-90", className)} {...props} />
))
ToastDescription.displayName = ToastPrimitives.Description.displayName

type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>

type ToastActionElement = React.ReactElement<typeof ToastAction>

export {
  type ToastProps,
  type ToastActionElement,
  ToastProvider,
  ToastViewport,
  Toast,
  ToastTitle,
  ToastDescription,
  ToastClose,
  ToastAction,
}
[V0_FILE]typescriptreact:file="components/ui/use-toast.ts" isMerged="true"
"use client"

import * as React from "react"

import type { ToastActionElement, ToastProps } from "@/components/ui/toast"

const TOAST_LIMIT = 1
const TOAST_REMOVE_DELAY = 1000000

type ToasterToast = ToastProps & {
  id: string
  title?: React.ReactNode
  description?: React.ReactNode
  action?: ToastActionElement
}

const actionTypes = {
  ADD_TOAST: "ADD_TOAST",
  UPDATE_TOAST: "UPDATE_TOAST",
  DISMISS_TOAST: "DISMISS_TOAST",
  REMOVE_TOAST: "REMOVE_TOAST",
} as const

let count = 0

function genId() {
  count = (count + 1) % Number.MAX_VALUE
  return count.toString()
}

type ActionType = typeof actionTypes

type Action =
  | {
      type: ActionType["ADD_TOAST"]
      toast: ToasterToast
    }
  | {
      type: ActionType["UPDATE_TOAST"]
      toast: Partial<ToasterToast>
    }
  | {
      type: ActionType["DISMISS_TOAST"]
      toastId?: string
    }
  | {
      type: ActionType["REMOVE_TOAST"]
      toastId?: string
    }

interface State {
  toasts: ToasterToast[]
}

const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>()

const reducer = (state: State, action: Action): State => {
  switch (action.type) {
    case "ADD_TOAST":
      return {
        ...state,
        toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
      }

case "UPDATE_TOAST":
      return {
        ...state,
        toasts: state.toasts.map((t) => (t.id === action.toast.id ? { ...t, ...action.toast } : t)),
      }

case "DISMISS_TOAST": {
      const { toastId } = action

// ! Side effects ! - This could be extracted into a dismissToast() action,
      // but I'll keep it here for simplicity
      if (toastId) {
        addToRemoveQueue(toastId)
      } else {
        state.toasts.forEach((toast) => {
          addToRemoveQueue(toast.id)
        })
      }

return {
        ...state,
        toasts: state.toasts.map((t) =>
          t.id === toastId || toastId === undefined
            ? {
                ...t,
                open: false,
              }
            : t,
        ),
      }
    }
    case "REMOVE_TOAST":
      if (action.toastId === undefined) {
        return {
          ...state,
          toasts: [],
        }
      }
      return {
        ...state,
        toasts: state.toasts.filter((t) => t.id !== action.toastId),
      }
  }
}

const listeners: Array<(state: State) => void> = []

let memoryState: State = { toasts: [] }

function dispatch(action: Action) {
  memoryState = reducer(memoryState, action)
  listeners.forEach((listener) => {
    listener(memoryState)
  })
}

type Toast = Omit<ToasterToast, "id">

function toast({ ...props }: Toast) {
  const id = genId()

const update = (props: ToasterToast) =>
    dispatch({
      type: "UPDATE_TOAST",
      toast: { ...props, id },
    })
  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id })

dispatch({
    type: "ADD_TOAST",
    toast: {
      ...props,
      id,
      open: true,
      onOpenChange: (open) => {
        if (!open) dismiss()
      },
    },
  })

return {
    id: id,
    dismiss,
    update,
  }
}

function useToast() {
  const [state, setState] = React.useState<State>(memoryState)

React.useEffect(() => {
    listeners.push(setState)
    return () => {
      const index = listeners.indexOf(setState)
      if (index > -1) {
        listeners.splice(index, 1)
      }
    }
  }, [state])

return {
    ...state,
    toast,
    dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
  }
}

function addToRemoveQueue(toastId: string) {
  if (toastTimeouts.has(toastId)) {
    return
  }

const timeout = setTimeout(() => {
    toastTimeouts.delete(toastId)
    dispatch({
      type: "REMOVE_TOAST",
      toastId,
    })
  }, TOAST_REMOVE_DELAY)

toastTimeouts.set(toastId, timeout)
}

export { useToast, toast }
[V0_FILE]typescriptreact:file="app/api/users/route.ts" isMerged="true"
import { NextResponse } from "next/server"

// In a real application, this would connect to a database like MongoDB
// For MVP, we'll simulate database operations

// Mock database for users
const users: any[] = []

export async function POST(request: Request) {
  try {
    const body = await request.json()
    const { firebaseUID, email, role } = body

// Validate required fields
    if (!firebaseUID || !email || !role) {
      return NextResponse.json({ error: "Missing required fields" }, { status: 400 })
    }

// Check if user already exists
    const existingUser = users.find((user) => user.firebaseUID === firebaseUID)
    if (existingUser) {
      return NextResponse.json({ error: "User already exists" }, { status: 409 })
    }

// Create new user
    const newUser = {
      id: `user_${Date.now()}`,
      firebaseUID,
      email,
      role,
      createdAt: new Date().toISOString(),
    }

// Add to mock database
    users.push(newUser)

// In a real application, you would save to MongoDB here
    // const result = await db.collection('users').insertOne(newUser);

return NextResponse.json(newUser, { status: 201 })
  } catch (error) {
    console.error("Error creating user:", error)
    return NextResponse.json({ error: "Failed to create user" }, { status: 500 })
  }
}

export async function GET(request: Request) {
  // This would typically be an admin-only endpoint
  // For MVP, we'll return all users
  return NextResponse.json({ users })
}
[V0_FILE]typescriptreact:file="app/api/users/me/route.ts" isMerged="true"
import { NextResponse } from "next/server"

// In a real application, this would connect to a database like MongoDB
// For MVP, we'll simulate database operations

// Mock database for users (same as in /api/users/route.ts)
const users: any[] = [
  {
    id: "user_1",
    firebaseUID: "firebase_user_1",
    email: "researcher@example.com",
    role: "researcher",
    createdAt: "2023-01-01T00:00:00.000Z",
  },
  {
    id: "user_2",
    firebaseUID: "firebase_user_2",
    email: "user@example.com",
    role: "user",
    createdAt: "2023-01-02T00:00:00.000Z",
  },
]

export async function GET(request: Request) {
  try {
    // Get the authorization header
    const authHeader = request.headers.get("Authorization")

if (!authHeader || !authHeader.startsWith("Bearer ")) {
      return NextResponse.json({ error: "Unauthorized" }, { status: 401 })
    }

// Extract the token
    const token = authHeader.split("Bearer ")[1]

// In a real application, you would verify the Firebase token
    // For MVP, we'll simulate token verification
    let firebaseUID: string

try {
      // This is a placeholder for actual Firebase token verification
      // In a real app, you would use:
      // const decodedToken = await getFirebaseAdmin().auth().verifyIdToken(token);
      // firebaseUID = decodedToken.uid;

// For MVP, we'll extract a mock UID from the token
      // This is NOT how you would do it in production
      firebaseUID = token === "mock_token_1" ? "firebase_user_1" : "firebase_user_2"
    } catch (error) {
      console.error("Error verifying token:", error)
      return NextResponse.json({ error: "Invalid token" }, { status: 401 })
    }

// Find the user in the database
    const user = users.find((u) => u.firebaseUID === firebaseUID)

if (!user) {
      return NextResponse.json({ error: "User not found" }, { status: 404 })
    }

// Return user data (excluding sensitive information)
    return NextResponse.json({
      id: user.id,
      email: user.email,
      role: user.role,
    })
  } catch (error) {
    console.error("Error getting user:", error)
    return NextResponse.json({ error: "Failed to get user" }, { status: 500 })
  }
}
[V0_FILE]typescriptreact:file="lib/firebase-admin.ts" isMerged="true"
// This is a placeholder for Firebase Admin SDK initialization
// In a real application, you would initialize Firebase Admin SDK here

export function getFirebaseAdmin() {
  // In a real application, you would initialize and return Firebase Admin SDK
  // For MVP, we'll return a placeholder
  return {
    auth: () => ({
      verifyIdToken: async (token: string) => {
        // This is a mock implementation
        if (token === "mock_token_1") {
          return { uid: "firebase_user_1" }
        } else if (token === "mock_token_2") {
          return { uid: "firebase_user_2" }
        } else {
          throw new Error("Invalid token")
        }
      },
    }),
  }
}
[V0_FILE]typescriptreact:file="components/ui/checkbox.tsx" isMerged="true"
"use client"

import * as React from "react"
import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
import { Check } from "lucide-react"

import { cn } from "@/lib/utils"

const Checkbox = React.forwardRef<
  React.ElementRef<typeof CheckboxPrimitive.Root>,
  React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>
>(({ className, ...props }, ref) => (
  <CheckboxPrimitive.Root
    ref={ref}
    className={cn(
      "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
      className,
    )}
    {...props}
  >
    <CheckboxPrimitive.Indicator className={cn("flex items-center justify-center text-current")}>
      <Check className="h-4 w-4" />
    </CheckboxPrimitive.Indicator>
  </CheckboxPrimitive.Root>
))
Checkbox.displayName = CheckboxPrimitive.Root.displayName

export { Checkbox }
[V0_FILE]typescriptreact:file="components/ui/label.tsx" isMerged="true"
"use client"

import * as React from "react"
import * as LabelPrimitive from "@radix-ui/react-label"
import { cva, type VariantProps } from "class-variance-authority"

import { cn } from "@/lib/utils"

const labelVariants = cva("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70")

const Label = React.forwardRef<
  React.ElementRef<typeof LabelPrimitive.Root>,
  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>
>(({ className, ...props }, ref) => (
  <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />
))
Label.displayName = LabelPrimitive.Root.displayName

export { Label }
[V0_FILE]typescriptreact:file="app/api/researcher/studies/route.ts" isMerged="true"
import { NextResponse } from "next/server"

// Define the Study type
interface Study {
  id: string
  title: string
  status: "published" | "draft" | "processing"
  fieldOfStudy: string
  publishedDate?: string
  lastEdited?: string
  views: number
  questions: number
}

// Mock data for researcher studies
const mockStudies: Study[] = [
  {
    id: "study1",
    title: "Quantum Computing Applications in Cryptography",
    status: "published",
    fieldOfStudy: "Computer Science",
    publishedDate: "2023-05-15",
    views: 128,
    questions: 24,
  },
  {
    id: "study2",
    title: "Neural Network Approaches to Natural Language Processing",
    status: "published",
    fieldOfStudy: "Artificial Intelligence",
    publishedDate: "2023-06-22",
    views: 87,
    questions: 16,
  },
  {
    id: "study3",
    title: "Sustainable Energy Storage Solutions",
    status: "draft",
    fieldOfStudy: "Engineering",
    lastEdited: "2023-07-10",
    views: 0,
    questions: 0,
  },
  {
    id: "study4",
    title: "Advancements in CRISPR Gene Editing Techniques",
    status: "processing",
    fieldOfStudy: "Biology",
    lastEdited: "2023-07-18",
    views: 0,
    questions: 0,
  },
]

export async function GET(request: Request) {
  try {
    // Get the authorization header
    const authHeader = request.headers.get("Authorization")

if (!authHeader || !authHeader.startsWith("Bearer ")) {
      return NextResponse.json({ error: "Unauthorized" }, { status: 401 })
    }

// Extract the token
    const token = authHeader.split("Bearer ")[1]

// In a real application, you would verify the Firebase token
    // and extract the user ID to fetch only their studies
    // For MVP, we'll return the mock data

// Simulate a delay to mimic a real API call
    await new Promise((resolve) => setTimeout(resolve, 500))

return NextResponse.json({ studies: mockStudies })
  } catch (error) {
    console.error("Error fetching researcher studies:", error)
    return NextResponse.json({ error: "Failed to fetch studies" }, { status: 500 })
  }
}
[V0_FILE]typescriptreact:file="components/ui/table.tsx" isMerged="true"
import * as React from "react"

import { cn } from "@/lib/utils"

const Table = React.forwardRef<HTMLTableElement, React.HTMLAttributes<HTMLTableElement>>(
  ({ className, ...props }, ref) => (
    <div className="relative w-full overflow-auto">
      <table ref={ref} className={cn("w-full caption-bottom text-sm", className)} {...props} />
    </div>
  ),
)
Table.displayName = "Table"

const TableHeader = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(
  ({ className, ...props }, ref) => <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />,
)
TableHeader.displayName = "TableHeader"

const TableBody = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(
  ({ className, ...props }, ref) => (
    <tbody ref={ref} className={cn("[&_tr:last-child]:border-0", className)} {...props} />
  ),
)
TableBody.displayName = "TableBody"

const TableFooter = React.forwardRef<HTMLTableSectionElement, React.HTMLAttributes<HTMLTableSectionElement>>(
  ({ className, ...props }, ref) => (
    <tfoot ref={ref} className={cn("bg-primary font-medium text-primary-foreground", className)} {...props} />
  ),
)
TableFooter.displayName = "TableFooter"

const TableRow = React.forwardRef<HTMLTableRowElement, React.HTMLAttributes<HTMLTableRowElement>>(
  ({ className, ...props }, ref) => (
    <tr
      ref={ref}
      className={cn("border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted", className)}
      {...props}
    />
  ),
)
TableRow.displayName = "TableRow"

const TableHead = React.forwardRef<HTMLTableCellElement, React.ThHTMLAttributes<HTMLTableCellElement>>(
  ({ className, ...props }, ref) => (
    <th
      ref={ref}
      className={cn(
        "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
        className,
      )}
      {...props}
    />
  ),
)
TableHead.displayName = "TableHead"

const TableCell = React.forwardRef<HTMLTableCellElement, React.TdHTMLAttributes<HTMLTableCellElement>>(
  ({ className, ...props }, ref) => (
    <td ref={ref} className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)} {...props} />
  ),
)
TableCell.displayName = "TableCell"

const TableCaption = React.forwardRef<HTMLTableCaptionElement, React.HTMLAttributes<HTMLTableCaptionElement>>(
  ({ className, ...props }, ref) => (
    <caption ref={ref} className={cn("mt-4 text-sm text-muted-foreground", className)} {...props} />
  ),
)
TableCaption.displayName = "TableCaption"

export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption }
[V0_FILE]typescriptreact:file="components/ui/alert.tsx" isMerged="true"
import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"

import { cn } from "@/lib/utils"

const alertVariants = cva(
  "relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
  {
    variants: {
      variant: {
        default: "bg-background text-foreground",
        destructive: "border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
      },
    },
    defaultVariants: {
      variant: "default",
    },
  },
)

const Alert = React.forwardRef<
  HTMLDivElement,
  React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>
>(({ className, variant, ...props }, ref) => (
  <div ref={ref} role="alert" className={cn(alertVariants({ variant }), className)} {...props} />
))
Alert.displayName = "Alert"

const AlertTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
  ({ className, ...props }, ref) => (
    <h5 ref={ref} className={cn("mb-1 font-medium leading-none tracking-tight", className)} {...props} />
  ),
)
AlertTitle.displayName = "AlertTitle"

const AlertDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
  ({ className, ...props }, ref) => (
    <div ref={ref} className={cn("text-sm [&_p]:leading-relaxed", className)} {...props} />
  ),
)
AlertDescription.displayName = "AlertDescription"

export { Alert, AlertTitle, AlertDescription }
[V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" isMerged="true"
import Link from "next/link"
import { ArrowRight, BookOpen, Lock, Search } from "lucide-react"
import { Button } from "@/components/ui/button"

export default function HomePage() {
  return (
    <div className="flex flex-col min-h-screen">
      {/* Header */}
      <header className="border-b">
        <div className="container mx-auto px-4 py-4 flex justify-between items-center">
          <Link href="/" className="flex items-center space-x-2">
            <BookOpen className="h-6 w-6 text-blue-600" />
            <span className="font-bold text-xl">TTO Tech Transfer Office</span>
          </Link>
          <nav className="hidden md:flex items-center space-x-4">
            <Link
              href="/studies"
              className="px-4 py-2 rounded-md bg-blue-600 text-white hover:bg-blue-700 transition-colors"
            >
              Explore Studies
            </Link>
            <Link
              href="/auth"
              className="px-4 py-2 rounded-md border border-gray-300 hover:bg-gray-50 transition-colors flex items-center"
            >
              <Lock className="h-4 w-4 mr-2" />
              Login / Sign Up
            </Link>
            {/* Added direct link to researcher dashboard for development/testing */}
            <Link
              href="/researcher/dashboard"
              className="px-4 py-2 rounded-md border border-gray-300 hover:bg-gray-50 transition-colors"
            >
              Researcher Dashboard
            </Link>
          </nav>
          <Button variant="outline" size="icon" className="md:hidden">
            <span className="sr-only">Open menu</span>
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="24"
              height="24"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              strokeWidth="2"
              strokeLinecap="round"
              strokeLinejoin="round"
              className="h-6 w-6"
            >
              <line x1="4" x2="20" y1="12" y2="12" />
              <line x1="4" x2="20" y1="6" y2="6" />
              <line x1="4" x2="20" y1="18" y2="18" />
            </svg>
          </Button>
        </div>
      </header>

{/* Hero Section */}
      <main className="flex-grow">
        <section className="py-20 md:py-32 bg-gradient-to-b from-white to-blue-50">
          <div className="container mx-auto px-4 text-center">
            <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-gray-900">
              Discover & Interact with Cutting-Edge Research
            </h1>
            <p className="text-xl md:text-2xl text-gray-600 max-w-3xl mx-auto mb-10">
              Explore a growing library of research studies and engage directly with the content through our innovative
              chatbot. Researchers can share their work anonymously with a global audience.
            </p>
            <Link
              href="/studies"
              className="inline-flex items-center px-6 py-3 text-lg font-medium rounded-md bg-blue-600 text-white hover:bg-blue-700 transition-colors"
            >
              Get Started: Explore Studies
              <ArrowRight className="ml-2 h-5 w-5" />
            </Link>
          </div>
        </section>

{/* Features Section */}
        <section className="py-16 bg-white">
          <div className="container mx-auto px-4">
            <h2 className="text-3xl font-bold text-center mb-12 text-gray-900">How It Works</h2>
            <div className="grid md:grid-cols-3 gap-8">
              <div className="bg-white p-6 rounded-lg shadow-md text-center">
                <div className="bg-blue-100 p-3 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-4">
                  <Search className="h-8 w-8 text-blue-600" />
                </div>
                <h3 className="text-xl font-semibold mb-3">Explore Research</h3>
                <p className="text-gray-600">
                  Browse through our collection of anonymously published research studies across various fields.
                </p>
              </div>
              <div className="bg-white p-6 rounded-lg shadow-md text-center">
                <div className="bg-blue-100 p-3 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-4">
                  <svg
                    xmlns="http://www.w3.org/2000/svg"
                    width="24"
                    height="24"
                    viewBox="0 0 24 24"
                    fill="none"
                    stroke="currentColor"
                    strokeWidth="2"
                    strokeLinecap="round"
                    strokeLinejoin="round"
                    className="h-8 w-8 text-blue-600"
                  >
                    <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
                  </svg>
                </div>
                <h3 className="text-xl font-semibold mb-3">Interact with Chatbots</h3>
                <p className="text-gray-600">
                  Ask questions and get insights about specific papers through our dedicated research chatbots.
                </p>
              </div>
              <div className="bg-white p-6 rounded-lg shadow-md text-center">
                <div className="bg-blue-100 p-3 rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-4">
                  <svg
                    xmlns="http://www.w3.org/2000/svg"
                    width="24"
                    height="24"
                    viewBox="0 0 24 24"
                    fill="none"
                    stroke="currentColor"
                    strokeWidth="2"
                    strokeLinecap="round"
                    strokeLinejoin="round"
                    className="h-8 w-8 text-blue-600"
                  >
                    <path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" />
                    <circle cx="12" cy="7" r="4" />
                  </svg>
                </div>
                <h3 className="text-xl font-semibold mb-3">Anonymous Publishing</h3>
                <p className="text-gray-600">
                  Researchers can publish their studies anonymously while reaching a global audience.
                </p>
              </div>
            </div>
          </div>
        </section>

{/* CTA Section */}
        <section className="py-16 bg-blue-50">
          <div className="container mx-auto px-4 text-center">
            <h2 className="text-3xl font-bold mb-6 text-gray-900">Ready to Dive Into Research?</h2>
            <p className="text-xl text-gray-600 max-w-2xl mx-auto mb-8">
              Join our growing community of researchers and knowledge seekers today.
            </p>
            <div className="flex flex-col sm:flex-row justify-center gap-4">
              <Link
                href="/studies"
                className="px-6 py-3 rounded-md bg-blue-600 text-white hover:bg-blue-700 transition-colors"
              >
                Explore Studies
              </Link>
              <Link
                href="/auth"
                className="px-6 py-3 rounded-md border border-gray-300 bg-white hover:bg-gray-50 transition-colors"
              >
                Login / Sign Up
              </Link>
            </div>
          </div>
        </section>
      </main>

{/* Footer */}
      <footer className="bg-gray-900 text-white py-12">
        <div className="container mx-auto px-4">
          <div className="grid md:grid-cols-2 gap-8">
            <div>
              <div className="flex items-center space-x-2 mb-6">
                <BookOpen className="h-6 w-6 text-blue-400" />
                <span className="font-bold text-xl">TTO Tech Transfer Office</span>
              </div>
              <p className="text-gray-400 max-w-md">
                Bridging the gap between research and the public through anonymous publishing and interactive
                exploration.
              </p>
            </div>
            <div className="grid grid-cols-2 gap-8">
              <div>
                <h3 className="font-semibold text-lg mb-4">Platform</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/about" className="text-gray-400 hover:text-white transition-colors">
                      About Us
                    </Link>
                  </li>
                  <li>
                    <Link href="/contact" className="text-gray-400 hover:text-white transition-colors">
                      Contact
                    </Link>
                  </li>
                </ul>
              </div>
              <div>
                <h3 className="font-semibold text-lg mb-4">Legal</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/terms" className="text-gray-400 hover:text-white transition-colors">
                      Terms of Service
                    </Link>
                  </li>
                  <li>
                    <Link href="/privacy" className="text-gray-400 hover:text-white transition-colors">
                      Privacy Policy
                    </Link>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <div className="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400">
            <p>© {new Date().getFullYear()} TTO Tech Transfer Office. All Rights Reserved.</p>
          </div>
        </div>
      </footer>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/researcher/dashboard/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useEffect, useState } from "react"
import Link from "next/link"
import { useRouter } from "next/navigation"
import { BookOpen, FileText, Plus, LogOut, Settings, BarChart, MessageSquare, Calendar } from "lucide-react"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
import { Skeleton } from "@/components/ui/skeleton"

export default function ResearcherDashboardPage() {
  const router = useRouter()
  const [user, setUser] = useState<any>(null)
  const [studies, setStudies] = useState<Study[]>([])
  const [loading, setLoading] = useState(true)
  const [authChecking, setAuthChecking] = useState(true)

useEffect(() => {
    // For frontend-only development, we'll simulate authentication
    // without actually calling Firebase
    setUser({
      uid: "mock-user-id",
      email: "researcher@example.com",
      role: "researcher",
    })

// Fetch mock studies data
    fetchResearcherStudies()
    setAuthChecking(false)
  }, [])

// Fetch studies belonging to the researcher
  const fetchResearcherStudies = async () => {
    try {
      setLoading(true)
      // Simulate API delay
      await new Promise((resolve) => setTimeout(resolve, 800))

const mockStudies: Study[] = [
        {
          id: "study1",
          title: "Quantum Computing Applications in Cryptography",
          status: "published",
          fieldOfStudy: "Computer Science",
          publishedDate: "2023-05-15",
          views: 128,
          questions: 24,
        },
        {
          id: "study2",
          title: "Neural Network Approaches to Natural Language Processing",
          status: "published",
          fieldOfStudy: "Artificial Intelligence",
          publishedDate: "2023-06-22",
          views: 87,
          questions: 16,
        },
        {
          id: "study3",
          title: "Sustainable Energy Storage Solutions",
          status: "draft",
          fieldOfStudy: "Engineering",
          lastEdited: "2023-07-10",
          views: 0,
          questions: 0,
        },
        {
          id: "study4",
          title: "Advancements in CRISPR Gene Editing Techniques",
          status: "processing",
          fieldOfStudy: "Biology",
          lastEdited: "2023-07-18",
          views: 0,
          questions: 0,
        },
      ]

setStudies(mockStudies)
    } catch (error) {
      console.error("Error fetching studies:", error)
    } finally {
      setLoading(false)
    }
  }

const handleSignOut = () => {
    // For frontend-only development, just redirect without actual Firebase signOut
    router.push("/")
  }

// Calculate dashboard stats
  const publishedStudies = studies.filter((s) => s.status === "published")
  const totalViews = studies.reduce((sum, study) => sum + study.views, 0)
  const totalQuestions = studies.reduce((sum, study) => sum + study.questions, 0)
  const draftStudies = studies.filter((s) => s.status === "draft" || s.status === "processing")

if (authChecking) {
    return (
      <div className="flex min-h-screen items-center justify-center">
        <div className="text-center">
          <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-blue-600 border-r-transparent"></div>
          <p className="mt-4 text-gray-600">Verifying access...</p>
        </div>
      </div>
    )
  }

return (
    <div className="flex flex-col min-h-screen">
      {/* Header */}
      <header className="border-b">
        <div className="container mx-auto px-4 py-4 flex justify-between items-center">
          <Link href="/" className="flex items-center space-x-2">
            <BookOpen className="h-6 w-6 text-blue-600" />
            <span className="font-bold text-xl">TTO Tech Transfer Office</span>
          </Link>
          <nav className="hidden md:flex items-center space-x-4">
            <Link href="/studies" className="px-4 py-2 rounded-md hover:bg-gray-100 transition-colors">
              Explore Studies
            </Link>
            <Link
              href="/researcher/dashboard"
              className="px-4 py-2 rounded-md bg-blue-600 text-white"
              aria-current="page"
            >
              My Dashboard
            </Link>
            <Link
              href="/researcher/upload"
              className="px-4 py-2 rounded-md border border-gray-300 hover:bg-gray-50 transition-colors"
            >
              Upload New Study
            </Link>
          </nav>
          <div className="flex items-center space-x-4">
            <span className="hidden md:inline-block text-sm text-gray-600">{user?.email}</span>
            <Button variant="outline" size="sm" onClick={handleSignOut}>
              <LogOut className="h-4 w-4 mr-2" />
              Logout
            </Button>
          </div>
        </div>
      </header>

{/* Main Content */}
      <main className="flex-grow bg-gray-50 py-8">
        <div className="container mx-auto px-4">
          <div className="flex flex-col md:flex-row justify-between items-start md:items-center mb-8">
            <div>
              <h1 className="text-2xl font-bold">Researcher Dashboard</h1>
              <p className="text-gray-600">Manage your anonymous research publications</p>
            </div>
            <Button className="mt-4 md:mt-0" asChild>
              <Link href="/researcher/upload">
                <Plus className="h-4 w-4 mr-2" />
                Upload New Study
              </Link>
            </Button>
          </div>

{/* Dashboard Stats */}
          <div className="grid grid-cols-1 md:grid-cols-4 gap-6 mb-8">
            <Card>
              <CardHeader className="pb-2">
                <CardTitle className="text-sm font-medium text-gray-500">Published Studies</CardTitle>
              </CardHeader>
              <CardContent>
                <div className="flex items-center">
                  <FileText className="h-5 w-5 text-blue-600 mr-2" />
                  <div className="text-3xl font-bold">{publishedStudies.length}</div>
                </div>
              </CardContent>
            </Card>
            <Card>
              <CardHeader className="pb-2">
                <CardTitle className="text-sm font-medium text-gray-500">Total Views</CardTitle>
              </CardHeader>
              <CardContent>
                <div className="flex items-center">
                  <BarChart className="h-5 w-5 text-blue-600 mr-2" />
                  <div className="text-3xl font-bold">{totalViews}</div>
                </div>
              </CardContent>
            </Card>
            <Card>
              <CardHeader className="pb-2">
                <CardTitle className="text-sm font-medium text-gray-500">Questions Received</CardTitle>
              </CardHeader>
              <CardContent>
                <div className="flex items-center">
                  <MessageSquare className="h-5 w-5 text-blue-600 mr-2" />
                  <div className="text-3xl font-bold">{totalQuestions}</div>
                </div>
              </CardContent>
            </Card>
            <Card>
              <CardHeader className="pb-2">
                <CardTitle className="text-sm font-medium text-gray-500">Drafts</CardTitle>
              </CardHeader>
              <CardContent>
                <div className="flex items-center">
                  <Calendar className="h-5 w-5 text-blue-600 mr-2" />
                  <div className="text-3xl font-bold">{draftStudies.length}</div>
                </div>
              </CardContent>
            </Card>
          </div>

{/* Studies List */}
          <Tabs defaultValue="all" className="mb-8">
            <TabsList>
              <TabsTrigger value="all">All Studies</TabsTrigger>
              <TabsTrigger value="published">Published</TabsTrigger>
              <TabsTrigger value="drafts">Drafts & Processing</TabsTrigger>
            </TabsList>
            <TabsContent value="all">{renderStudiesTable(studies, loading)}</TabsContent>
            <TabsContent value="published">{renderStudiesTable(publishedStudies, loading)}</TabsContent>
            <TabsContent value="drafts">{renderStudiesTable(draftStudies, loading)}</TabsContent>
          </Tabs>
        </div>
      </main>

// Helper function to render the studies table
function renderStudiesTable(studies: Study[], loading: boolean) {
  if (loading) {
    return (
      <div className="bg-white rounded-lg shadow overflow-hidden">
        <div className="p-6">
          <Skeleton className="h-8 w-1/3 mb-6" />
          <div className="space-y-4">
            {Array(3)
              .fill(0)
              .map((_, i) => (
                <div key={i} className="flex flex-col space-y-2">
                  <Skeleton className="h-6 w-3/4" />
                  <Skeleton className="h-4 w-1/2" />
                </div>
              ))}
          </div>
        </div>
      </div>
    )
  }

if (studies.length === 0) {
    return (
      <div className="bg-white rounded-lg shadow p-8 text-center">
        <FileText className="h-12 w-12 text-gray-300 mx-auto mb-4" />
        <h3 className="text-lg font-medium text-gray-900 mb-2">No studies found</h3>
        <p className="text-gray-500 mb-6">
          You haven't uploaded any studies yet. Get started by uploading your first study!
        </p>
        <Button asChild>
          <Link href="/researcher/upload">
            <Plus className="h-4 w-4 mr-2" />
            Upload New Study
          </Link>
        </Button>
      </div>
    )
  }

return (
    <div className="bg-white rounded-lg shadow overflow-hidden">
      <Table>
        <TableHeader>
          <TableRow>
            <TableHead className="w-[50%]">Title</TableHead>
            <TableHead>Field of Study</TableHead>
            <TableHead>Status</TableHead>
            <TableHead>Views</TableHead>
            <TableHead>Questions</TableHead>
            <TableHead className="text-right">Actions</TableHead>
          </TableRow>
        </TableHeader>
        <TableBody>
          {studies.map((study) => (
            <TableRow key={study.id}>
              <TableCell className="font-medium">
                {study.status === "published" ? (
                  <Link href={`/studies/${study.id}`} className="hover:text-blue-600 hover:underline">
                    {study.title}
                  </Link>
                ) : (
                  study.title
                )}
              </TableCell>
              <TableCell>{study.fieldOfStudy}</TableCell>
              <TableCell>
                <span
                  className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${
                    study.status === "published"
                      ? "bg-green-100 text-green-800"
                      : study.status === "draft"
                        ? "bg-yellow-100 text-yellow-800"
                        : "bg-blue-100 text-blue-800"
                  }`}
                >
                  {study.status.charAt(0).toUpperCase() + study.status.slice(1)}
                </span>
              </TableCell>
              <TableCell>{study.views}</TableCell>
              <TableCell>{study.questions}</TableCell>
              <TableCell className="text-right">
                <div className="flex justify-end space-x-2">
                  {study.status === "published" && (
                    <Button variant="outline" size="sm" asChild>
                      <Link href={`/studies/${study.id}`}>View</Link>
                    </Button>
                  )}
                  <Button variant="outline" size="sm">
                    <Settings className="h-4 w-4 mr-1" />
                    Manage
                  </Button>
                </div>
              </TableCell>
            </TableRow>
          ))}
        </TableBody>
      </Table>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/auth/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import type React from "react"

import { useState } from "react"
import Link from "next/link"
import { useRouter } from "next/navigation"
import { BookOpen, Eye, EyeOff, Lock, Mail } from "lucide-react"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
import { Checkbox } from "@/components/ui/checkbox"
import { toast } from "@/components/ui/use-toast"

export default function AuthPage() {
  const router = useRouter()
  const [activeTab, setActiveTab] = useState("login")
  const [isLoading, setIsLoading] = useState(false)
  const [showPassword, setShowPassword] = useState(false)
  const [formData, setFormData] = useState({
    email: "",
    password: "",
    isResearcher: false,
  })
  const [errors, setErrors] = useState({
    email: "",
    password: "",
    general: "",
  })

// Handle form input changes
  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
    const { name, value, type, checked } = e.target
    setFormData({
      ...formData,
      [name]: type === "checkbox" ? checked : value,
    })

// Clear errors when user types
    if (errors[name as keyof typeof errors]) {
      setErrors({
        ...errors,
        [name]: "",
      })
    }
  }

// Validate form inputs
  const validateForm = () => {
    let isValid = true
    const newErrors = { ...errors }

// Email validation
    if (!formData.email) {
      newErrors.email = "Email is required"
      isValid = false
    } else if (!/\S+@\S+\.\S+/.test(formData.email)) {
      newErrors.email = "Email is invalid"
      isValid = false
    } else {
      newErrors.email = ""
    }

// Password validation
    if (!formData.password) {
      newErrors.password = "Password is required"
      isValid = false
    } else if (formData.password.length < 6) {
      newErrors.password = "Password must be at least 6 characters"
      isValid = false
    } else {
      newErrors.password = ""
    }

setErrors(newErrors)
    return isValid
  }

// Handle sign up
  const handleSignUp = async (e: React.FormEvent) => {
    e.preventDefault()

if (!validateForm()) {
      return
    }

setIsLoading(true)
    setErrors({ ...errors, general: "" })

try {
      // Simulate API delay
      await new Promise((resolve) => setTimeout(resolve, 1000))

// Simulate successful signup
      toast({
        title: "Account created successfully",
        description: "You are now logged in",
      })

// Redirect based on role
      if (formData.isResearcher) {
        router.push("/researcher/dashboard")
      } else {
        router.push("/studies")
      }
    } catch (error) {
      setErrors({ ...errors, general: "An error occurred. Please try again." })
    } finally {
      setIsLoading(false)
    }
  }

// Handle login
  const handleLogin = async (e: React.FormEvent) => {
    e.preventDefault()

if (!validateForm()) {
      return
    }

setIsLoading(true)
    setErrors({ ...errors, general: "" })

try {
      // Simulate API delay
      await new Promise((resolve) => setTimeout(resolve, 1000))

// Simulate successful login
      toast({
        title: "Logged in successfully",
        description: "Welcome back to TTO Tech Transfer Office",
      })

// For demo purposes, always redirect to researcher dashboard if email contains "researcher"
      if (formData.email.includes("researcher")) {
        router.push("/researcher/dashboard")
      } else {
        router.push("/studies")
      }
    } catch (error) {
      setErrors({ ...errors, general: "Invalid email or password" })
    } finally {
      setIsLoading(false)
    }
  }

return (
    <div className="flex flex-col min-h-screen">
      {/* Header - Consistent with Homepage */}
      <header className="border-b">
        <div className="container mx-auto px-4 py-4 flex justify-between items-center">
          <Link href="/" className="flex items-center space-x-2">
            <BookOpen className="h-6 w-6 text-blue-600" />
            <span className="font-bold text-xl">TTO Tech Transfer Office</span>
          </Link>
          <nav className="hidden md:flex items-center space-x-4">
            <Link href="/studies" className="px-4 py-2 rounded-md hover:bg-gray-100 transition-colors">
              Explore Studies
            </Link>
            <Link href="/auth" className="px-4 py-2 rounded-md bg-blue-600 text-white" aria-current="page">
              Login / Sign Up
            </Link>
          </nav>
          <Button variant="outline" size="icon" className="md:hidden">
            <span className="sr-only">Open menu</span>
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="24"
              height="24"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              strokeWidth="2"
              strokeLinecap="round"
              strokeLinejoin="round"
              className="h-6 w-6"
            >
              <line x1="4" x2="20" y1="12" y2="12" />
              <line x1="4" x2="20" y1="6" y2="6" />
              <line x1="4" x2="20" y1="18" y2="18" />
            </svg>
          </Button>
        </div>
      </header>

{/* Main Content */}
      <main className="flex-grow bg-gray-50 py-12">
        <div className="container mx-auto px-4">
          <div className="max-w-md mx-auto">
            <Tabs defaultValue="login" value={activeTab} onValueChange={setActiveTab}>
              <TabsList className="grid w-full grid-cols-2 mb-8">
                <TabsTrigger value="login">Login</TabsTrigger>
                <TabsTrigger value="signup">Sign Up</TabsTrigger>
              </TabsList>

{/* Login Form */}
              <TabsContent value="login">
                <Card>
                  <CardHeader>
                    <CardTitle className="text-2xl">Welcome Back</CardTitle>
                    <CardDescription>Enter your credentials to access your account</CardDescription>
                  </CardHeader>
                  <form onSubmit={handleLogin}>
                    <CardContent className="space-y-4">
                      {errors.general && <div className="text-sm font-medium text-red-500">{errors.general}</div>}
                      <div className="space-y-2">
                        <Label htmlFor="login-email">Email</Label>
                        <div className="relative">
                          <Mail className="absolute left-3 top-3 h-4 w-4 text-gray-400" />
                          <Input
                            id="login-email"
                            name="email"
                            type="email"
                            placeholder="you@example.com"
                            className={`pl-10 ${errors.email ? "border-red-500" : ""}`}
                            value={formData.email}
                            onChange={handleChange}
                          />
                        </div>
                        {errors.email && <div className="text-xs text-red-500">{errors.email}</div>}
                      </div>
                      <div className="space-y-2">
                        <div className="flex items-center justify-between">
                          <Label htmlFor="login-password">Password</Label>
                          <Link href="/forgot-password" className="text-xs text-blue-600 hover:underline">
                            Forgot Password?
                          </Link>
                        </div>
                        <div className="relative">
                          <Lock className="absolute left-3 top-3 h-4 w-4 text-gray-400" />
                          <Input
                            id="login-password"
                            name="password"
                            type={showPassword ? "text" : "password"}
                            placeholder="••••••••"
                            className={`pl-10 ${errors.password ? "border-red-500" : ""}`}
                            value={formData.password}
                            onChange={handleChange}
                          />
                          <Button
                            type="button"
                            variant="ghost"
                            size="icon"
                            className="absolute right-1 top-1 h-8 w-8"
                            onClick={() => setShowPassword(!showPassword)}
                          >
                            {showPassword ? (
                              <EyeOff className="h-4 w-4 text-gray-400" />
                            ) : (
                              <Eye className="h-4 w-4 text-gray-400" />
                            )}
                            <span className="sr-only">{showPassword ? "Hide password" : "Show password"}</span>
                          </Button>
                        </div>
                        {errors.password && <div className="text-xs text-red-500">{errors.password}</div>}
                      </div>
                    </CardContent>
                    <CardFooter>
                      <Button type="submit" className="w-full" disabled={isLoading}>
                        {isLoading ? (
                          <>
                            <svg
                              className="animate-spin -ml-1 mr-2 h-4 w-4 text-white"
                              xmlns="http://www.w3.org/2000/svg"
                              fill="none"
                              viewBox="0 0 24 24"
                            >
                              <circle
                                className="opacity-25"
                                cx="12"
                                cy="12"
                                r="10"
                                stroke="currentColor"
                                strokeWidth="4"
                              ></circle>
                              <path
                                className="opacity-75"
                                fill="currentColor"
                                d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
                              ></path>
                            </svg>
                            Logging in...
                          </>
                        ) : (
                          "Login"
                        )}
                      </Button>
                    </CardFooter>
                  </form>
                </Card>
                <div className="text-center mt-4">
                  <p className="text-sm text-gray-600">
                    Don't have an account?{" "}
                    <button
                      type="button"
                      className="text-blue-600 hover:underline"
                      onClick={() => setActiveTab("signup")}
                    >
                      Sign up
                    </button>
                  </p>
                </div>
              </TabsContent>

{/* Sign Up Form */}
              <TabsContent value="signup">
                <Card>
                  <CardHeader>
                    <CardTitle className="text-2xl">Create Account</CardTitle>
                    <CardDescription>Sign up to access the TTO platform</CardDescription>
                  </CardHeader>
                  <form onSubmit={handleSignUp}>
                    <CardContent className="space-y-4">
                      {errors.general && <div className="text-sm font-medium text-red-500">{errors.general}</div>}
                      <div className="space-y-2">
                        <Label htmlFor="signup-email">Email</Label>
                        <div className="relative">
                          <Mail className="absolute left-3 top-3 h-4 w-4 text-gray-400" />
                          <Input
                            id="signup-email"
                            name="email"
                            type="email"
                            placeholder="you@example.com"
                            className={`pl-10 ${errors.email ? "border-red-500" : ""}`}
                            value={formData.email}
                            onChange={handleChange}
                          />
                        </div>
                        {errors.email && <div className="text-xs text-red-500">{errors.email}</div>}
                      </div>
                      <div className="space-y-2">
                        <Label htmlFor="signup-password">Password</Label>
                        <div className="relative">
                          <Lock className="absolute left-3 top-3 h-4 w-4 text-gray-400" />
                          <Input
                            id="signup-password"
                            name="password"
                            type={showPassword ? "text" : "password"}
                            placeholder="••••••••"
                            className={`pl-10 ${errors.password ? "border-red-500" : ""}`}
                            value={formData.password}
                            onChange={handleChange}
                          />
                          <Button
                            type="button"
                            variant="ghost"
                            size="icon"
                            className="absolute right-1 top-1 h-8 w-8"
                            onClick={() => setShowPassword(!showPassword)}
                          >
                            {showPassword ? (
                              <EyeOff className="h-4 w-4 text-gray-400" />
                            ) : (
                              <Eye className="h-4 w-4 text-gray-400" />
                            )}
                            <span className="sr-only">{showPassword ? "Hide password" : "Show password"}</span>
                          </Button>
                        </div>
                        {errors.password && <div className="text-xs text-red-500">{errors.password}</div>}
                        <p className="text-xs text-gray-500">Password must be at least 6 characters</p>
                      </div>
                      <div className="flex items-center space-x-2 pt-2">
                        <Checkbox
                          id="researcher"
                          name="isResearcher"
                          checked={formData.isResearcher}
                          onCheckedChange={(checked) => setFormData({ ...formData, isResearcher: checked as boolean })}
                        />
                        <Label htmlFor="researcher" className="text-sm font-normal">
                          I am a Researcher
                        </Label>
                      </div>
                    </CardContent>
                    <CardFooter>
                      <Button type="submit" className="w-full" disabled={isLoading}>
                        {isLoading ? (
                          <>
                            <svg
                              className="animate-spin -ml-1 mr-2 h-4 w-4 text-white"
                              xmlns="http://www.w3.org/2000/svg"
                              fill="none"
                              viewBox="0 0 24 24"
                            >
                              <circle
                                className="opacity-25"
                                cx="12"
                                cy="12"
                                r="10"
                                stroke="currentColor"
                                strokeWidth="4"
                              ></circle>
                              <path
                                className="opacity-75"
                                fill="currentColor"
                                d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
                              ></path>
                            </svg>
                            Creating account...
                          </>
                        ) : (
                          "Sign Up"
                        )}
                      </Button>
                    </CardFooter>
                  </form>
                </Card>
                <div className="text-center mt-4">
                  <p className="text-sm text-gray-600">
                    Already have an account?{" "}
                    <button
                      type="button"
                      className="text-blue-600 hover:underline"
                      onClick={() => setActiveTab("login")}
                    >
                      Login
                    </button>
                  </p>
                </div>
              </TabsContent>
            </Tabs>
          </div>
        </div>
      </main>

{/* Footer - Consistent with Homepage */}
      <footer className="bg-gray-900 text-white py-12">
        <div className="container mx-auto px-4">
          <div className="grid md:grid-cols-2 gap-8">
            <div>
              <div className="flex items-center space-x-2 mb-6">
                <BookOpen className="h-6 w-6 text-blue-400" />
                <span className="font-bold text-xl">TTO Tech Transfer Office</span>
              </div>
              <p className="text-gray-400 max-w-md">
                Bridging the gap between research and the public through anonymous publishing and interactive
                exploration.
              </p>
            </div>
            <div className="grid grid-cols-2 gap-8">
              <div>
                <h3 className="font-semibold text-lg mb-4">Platform</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/about" className="text-gray-400 hover:text-white transition-colors">
                      About Us
                    </Link>
                  </li>
                  <li>
                    <Link href="/contact" className="text-gray-400 hover:text-white transition-colors">
                      Contact
                    </Link>
                  </li>
                </ul>
              </div>
              <div>
                <h3 className="font-semibold text-lg mb-4">Legal</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/terms" className="text-gray-400 hover:text-white transition-colors">
                      Terms of Service
                    </Link>
                  </li>
                  <li>
                    <Link href="/privacy" className="text-gray-400 hover:text-white transition-colors">
                      Privacy Policy
                    </Link>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <div className="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400">
            <p>© {new Date().getFullYear()} TTO Tech Transfer Office. All Rights Reserved.</p>
          </div>
        </div>
      </footer>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/forgot-password/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import type React from "react"

import { useState } from "react"
import Link from "next/link"
import { BookOpen, Mail, ArrowLeft } from "lucide-react"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import { toast } from "@/components/ui/use-toast"

export default function ForgotPasswordPage() {
  const [email, setEmail] = useState("")
  const [isLoading, setIsLoading] = useState(false)
  const [emailSent, setEmailSent] = useState(false)
  const [error, setError] = useState("")

const handleResetPassword = async (e: React.FormEvent) => {
    e.preventDefault()

if (!email) {
      setError("Email is required")
      return
    }

setIsLoading(true)
    setError("")

try {
      // Simulate API delay
      await new Promise((resolve) => setTimeout(resolve, 1000))

setEmailSent(true)
      toast({
        title: "Reset email sent",
        description: "Check your inbox for password reset instructions",
      })
    } catch (error) {
      setError("Failed to send reset email. Please try again.")
    } finally {
      setIsLoading(false)
    }
  }

return (
    <div className="flex flex-col min-h-screen">
      {/* Header */}
      <header className="border-b">
        <div className="container mx-auto px-4 py-4 flex justify-between items-center">
          <Link href="/" className="flex items-center space-x-2">
            <BookOpen className="h-6 w-6 text-blue-600" />
            <span className="font-bold text-xl">TTO Tech Transfer Office</span>
          </Link>
          <nav className="hidden md:flex items-center space-x-4">
            <Link href="/studies" className="px-4 py-2 rounded-md hover:bg-gray-100 transition-colors">
              Explore Studies
            </Link>
            <Link
              href="/auth"
              className="px-4 py-2 rounded-md border border-gray-300 hover:bg-gray-50 transition-colors"
            >
              Login / Sign Up
            </Link>
          </nav>
          <Button variant="outline" size="icon" className="md:hidden">
            <span className="sr-only">Open menu</span>
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="24"
              height="24"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              strokeWidth="2"
              strokeLinecap="round"
              strokeLinejoin="round"
              className="h-6 w-6"
            >
              <line x1="4" x2="20" y1="12" y2="12" />
              <line x1="4" x2="20" y1="6" y2="6" />
              <line x1="4" x2="20" y1="18" y2="18" />
            </svg>
          </Button>
        </div>
      </header>

{/* Main Content */}
      <main className="flex-grow bg-gray-50 py-12">
        <div className="container mx-auto px-4">
          <div className="max-w-md mx-auto">
            <Link href="/auth" className="inline-flex items-center text-sm text-blue-600 mb-6 hover:underline">
              <ArrowLeft className="mr-2 h-4 w-4" />
              Back to login
            </Link>

<Card>
              <CardHeader>
                <CardTitle className="text-2xl">Reset Password</CardTitle>
                <CardDescription>
                  Enter your email address and we'll send you instructions to reset your password.
                </CardDescription>
              </CardHeader>

{emailSent ? (
                <CardContent className="pt-6">
                  <div className="bg-green-50 border border-green-200 rounded-md p-4 text-green-800">
                    <p className="font-medium">Reset email sent!</p>
                    <p className="mt-1 text-sm">
                      Check your inbox for instructions to reset your password. If you don't see it, check your spam
                      folder.
                    </p>
                  </div>
                </CardContent>
              ) : (
                <form onSubmit={handleResetPassword}>
                  <CardContent className="space-y-4">
                    {error && <div className="text-sm font-medium text-red-500">{error}</div>}
                    <div className="space-y-2">
                      <Label htmlFor="email">Email</Label>
                      <div className="relative">
                        <Mail className="absolute left-3 top-3 h-4 w-4 text-gray-400" />
                        <Input
                          id="email"
                          type="email"
                          placeholder="you@example.com"
                          className="pl-10"
                          value={email}
                          onChange={(e) => setEmail(e.target.value)}
                        />
                      </div>
                    </div>
                  </CardContent>
                  <CardFooter>
                    <Button type="submit" className="w-full" disabled={isLoading}>
                      {isLoading ? (
                        <>
                          <svg
                            className="animate-spin -ml-1 mr-2 h-4 w-4 text-white"
                            xmlns="http://www.w3.org/2000/svg"
                            fill="none"
                            viewBox="0 0 24 24"
                          >
                            <circle
                              className="opacity-25"
                              cx="12"
                              cy="12"
                              r="10"
                              stroke="currentColor"
                              strokeWidth="4"
                            ></circle>
                            <path
                              className="opacity-75"
                              fill="currentColor"
                              d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
                            ></path>
                          </svg>
                          Sending...
                        </>
                      ) : (
                        "Send Reset Instructions"
                      )}
                    </Button>
                  </CardFooter>
                </form>
              )}
            </Card>
          </div>
        </div>
      </main>

import type React from "react"

import { useEffect, useState, useRef } from "react"
import Link from "next/link"
import { useRouter } from "next/navigation"
import { BookOpen, LogOut, Upload, FileText, X, Check, AlertCircle, Info } from "lucide-react"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import { Textarea } from "@/components/ui/textarea"
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"
import { toast } from "@/components/ui/use-toast"
import { Progress } from "@/components/ui/progress"

export default function UploadStudyPage() {
  const router = useRouter()
  const fileInputRef = useRef<HTMLInputElement>(null)
  const [user, setUser] = useState<any>(null)
  const [authChecking, setAuthChecking] = useState(true)
  const [uploading, setUploading] = useState(false)
  const [uploadProgress, setUploadProgress] = useState(0)
  const [uploadSuccess, setUploadSuccess] = useState(false)
  const [formData, setFormData] = useState({
    title: "",
    fieldOfStudy: "",
    abstract: "",
    keywords: "",
    file: null as File | null,
  })
  const [errors, setErrors] = useState({
    title: "",
    fieldOfStudy: "",
    abstract: "",
    file: "",
    general: "",
  })

setAuthChecking(false)
  }, [])

// Handle sign out
  const handleSignOut = () => {
    // For frontend-only development, just redirect without actual Firebase signOut
    router.push("/")
  }

// Handle form input changes
  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
    const { name, value } = e.target
    setFormData((prev) => ({ ...prev, [name]: value }))

// Clear error when user types
    if (errors[name as keyof typeof errors]) {
      setErrors((prev) => ({ ...prev, [name]: "" }))
    }
  }

// Handle select change
  const handleSelectChange = (value: string) => {
    setFormData((prev) => ({ ...prev, fieldOfStudy: value }))

// Clear error when user selects
    if (errors.fieldOfStudy) {
      setErrors((prev) => ({ ...prev, fieldOfStudy: "" }))
    }
  }

// Handle file change
  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
    if (e.target.files && e.target.files[0]) {
      const file = e.target.files[0]

// Validate file type
      if (file.type !== "application/pdf") {
        setErrors((prev) => ({ ...prev, file: "Only PDF files are accepted" }))
        return
      }

// Validate file size (max 20MB)
      if (file.size > 20 * 1024 * 1024) {
        setErrors((prev) => ({ ...prev, file: "File size must be less than 20MB" }))
        return
      }

setFormData((prev) => ({ ...prev, file }))
      setErrors((prev) => ({ ...prev, file: "" }))
    }
  }

// Handle drag over
  const handleDragOver = (e: React.DragEvent) => {
    e.preventDefault()
    e.stopPropagation()
  }

// Handle drop
  const handleDrop = (e: React.DragEvent) => {
    e.preventDefault()
    e.stopPropagation()

if (e.dataTransfer.files && e.dataTransfer.files[0]) {
      const file = e.dataTransfer.files[0]

// Validate file type
      if (file.type !== "application/pdf") {
        setErrors((prev) => ({ ...prev, file: "Only PDF files are accepted" }))
        return
      }

// Validate file size (max 20MB)
      if (file.size > 20 * 1024 * 1024) {
        setErrors((prev) => ({ ...prev, file: "File size must be less than 20MB" }))
        return
      }

setFormData((prev) => ({ ...prev, file }))
      setErrors((prev) => ({ ...prev, file: "" }))
    }
  }

// Validate form
  const validateForm = () => {
    let isValid = true
    const newErrors = { ...errors }

// Validate title
    if (!formData.title.trim()) {
      newErrors.title = "Study title is required"
      isValid = false
    } else if (formData.title.length < 5) {
      newErrors.title = "Study title must be at least 5 characters"
      isValid = false
    } else {
      newErrors.title = ""
    }

// Validate field of study
    if (!formData.fieldOfStudy) {
      newErrors.fieldOfStudy = "Field of study is required"
      isValid = false
    } else {
      newErrors.fieldOfStudy = ""
    }

// Validate abstract
    if (!formData.abstract.trim()) {
      newErrors.abstract = "Abstract is required"
      isValid = false
    } else if (formData.abstract.length < 50) {
      newErrors.abstract = "Abstract must be at least 50 characters"
      isValid = false
    } else {
      newErrors.abstract = ""
    }

// Validate file
    if (!formData.file) {
      newErrors.file = "Research paper file is required"
      isValid = false
    } else {
      newErrors.file = ""
    }

setErrors(newErrors)
    return isValid
  }

// Handle form submission
  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault()

// Validate form
    if (!validateForm()) {
      toast({
        title: "Validation Error",
        description: "Please fix the errors in the form",
        variant: "destructive",
      })
      return
    }

setUploading(true)
    setUploadProgress(0)
    setErrors((prev) => ({ ...prev, general: "" }))

try {
      // In a real app, you would create FormData and upload to the server
      const formDataToSend = new FormData()
      formDataToSend.append("title", formData.title)
      formDataToSend.append("fieldOfStudy", formData.fieldOfStudy)
      formDataToSend.append("abstract", formData.abstract)
      formDataToSend.append("keywords", formData.keywords)
      if (formData.file) {
        formDataToSend.append("file", formData.file)
      }

// Simulate upload progress
      const simulateProgress = () => {
        let progress = 0
        const interval = setInterval(() => {
          progress += Math.floor(Math.random() * 10) + 1
          if (progress > 100) progress = 100
          setUploadProgress(progress)

if (progress === 100) {
            clearInterval(interval)

// Simulate processing delay after upload completes
            setTimeout(() => {
              setUploadSuccess(true)
              toast({
                title: "Upload Successful",
                description: "Your study has been uploaded and is now being processed.",
              })

// Redirect to dashboard after a delay
              setTimeout(() => {
                router.push("/researcher/dashboard")
              }, 2000)
            }, 500)
          }
        }, 300)
      }

// Start simulated upload
      simulateProgress()
    } catch (error) {
      console.error("Error uploading study:", error)
      setErrors((prev) => ({ ...prev, general: "Failed to upload study. Please try again." }))
      toast({
        title: "Upload Failed",
        description: "There was an error uploading your study. Please try again.",
        variant: "destructive",
      })
      setUploading(false)
    }
  }

return (
    <div className="flex flex-col min-h-screen">
      {/* Header */}
      <header className="border-b">
        <div className="container mx-auto px-4 py-4 flex justify-between items-center">
          <Link href="/" className="flex items-center space-x-2">
            <BookOpen className="h-6 w-6 text-blue-600" />
            <span className="font-bold text-xl">TTO Tech Transfer Office</span>
          </Link>
          <nav className="hidden md:flex items-center space-x-4">
            <Link href="/studies" className="px-4 py-2 rounded-md hover:bg-gray-100 transition-colors">
              Explore Studies
            </Link>
            <Link href="/researcher/dashboard" className="px-4 py-2 rounded-md hover:bg-gray-100 transition-colors">
              My Dashboard
            </Link>
            <Link href="/researcher/upload" className="px-4 py-2 rounded-md bg-blue-600 text-white" aria-current="page">
              Upload New Study
            </Link>
          </nav>
          <div className="flex items-center space-x-4">
            <span className="hidden md:inline-block text-sm text-gray-600">{user?.email}</span>
            <Button variant="outline" size="sm" onClick={handleSignOut}>
              <LogOut className="h-4 w-4 mr-2" />
              Logout
            </Button>
          </div>
        </div>
      </header>

{/* Main Content */}
      <main className="flex-grow bg-gray-50 py-8">
        <div className="container mx-auto px-4">
          <div className="max-w-3xl mx-auto">
            <div className="flex items-center mb-8">
              <Link href="/researcher/dashboard" className="text-blue-600 hover:underline mr-4">
                ← Back to Dashboard
              </Link>
              <h1 className="text-2xl font-bold">Upload New Study</h1>
            </div>

{uploadSuccess ? (
              <Alert className="mb-6 bg-green-50 border-green-200">
                <Check className="h-4 w-4 text-green-600" />
                <AlertTitle className="text-green-800">Success!</AlertTitle>
                <AlertDescription className="text-green-700">
                  Your study has been uploaded successfully and is now being processed. You will be redirected to your
                  dashboard.
                </AlertDescription>
              </Alert>
            ) : (
              <Alert className="mb-6">
                <AlertCircle className="h-4 w-4" />
                <AlertTitle>Important</AlertTitle>
                <AlertDescription>
                  All studies are published anonymously. Your name and institutional affiliations will not be visible to
                  users.
                </AlertDescription>
              </Alert>
            )}

<Card>
              <form onSubmit={handleSubmit}>
                <CardHeader>
                  <CardTitle>Study Information</CardTitle>
                  <CardDescription>Please provide the details of your research study</CardDescription>
                </CardHeader>
                <CardContent className="space-y-6">
                  {errors.general && (
                    <Alert variant="destructive" className="mb-4">
                      <AlertCircle className="h-4 w-4" />
                      <AlertTitle>Error</AlertTitle>
                      <AlertDescription>{errors.general}</AlertDescription>
                    </Alert>
                  )}

<div className="space-y-2">
                    <Label htmlFor="title" className="flex items-center">
                      Study Title <span className="text-red-500 ml-1">*</span>
                    </Label>
                    <Input
                      id="title"
                      name="title"
                      placeholder="Enter the title of your study"
                      value={formData.title}
                      onChange={handleInputChange}
                      className={errors.title ? "border-red-500" : ""}
                      disabled={uploading || uploadSuccess}
                    />
                    {errors.title && <p className="text-red-500 text-xs mt-1">{errors.title}</p>}
                  </div>

<div className="space-y-2">
                    <Label htmlFor="fieldOfStudy" className="flex items-center">
                      Field of Study <span className="text-red-500 ml-1">*</span>
                    </Label>
                    <Select
                      value={formData.fieldOfStudy}
                      onValueChange={handleSelectChange}
                      disabled={uploading || uploadSuccess}
                    >
                      <SelectTrigger id="fieldOfStudy" className={errors.fieldOfStudy ? "border-red-500" : ""}>
                        <SelectValue placeholder="Select a field of study" />
                      </SelectTrigger>
                      <SelectContent>
                        <SelectItem value="Computer Science">Computer Science</SelectItem>
                        <SelectItem value="Biology">Biology</SelectItem>
                        <SelectItem value="Physics">Physics</SelectItem>
                        <SelectItem value="Engineering">Engineering</SelectItem>
                        <SelectItem value="Social Sciences">Social Sciences</SelectItem>
                        <SelectItem value="Humanities">Humanities</SelectItem>
                        <SelectItem value="Medicine">Medicine</SelectItem>
                        <SelectItem value="Mathematics">Mathematics</SelectItem>
                        <SelectItem value="Environmental Science">Environmental Science</SelectItem>
                        <SelectItem value="Psychology">Psychology</SelectItem>
                        <SelectItem value="Economics">Economics</SelectItem>
                        <SelectItem value="Other">Other</SelectItem>
                      </SelectContent>
                    </Select>
                    {errors.fieldOfStudy && <p className="text-red-500 text-xs mt-1">{errors.fieldOfStudy}</p>}
                  </div>

<div className="space-y-2">
                    <Label htmlFor="abstract" className="flex items-center">
                      Abstract <span className="text-red-500 ml-1">*</span>
                    </Label>
                    <Textarea
                      id="abstract"
                      name="abstract"
                      placeholder="Provide a brief abstract of your study"
                      rows={5}
                      value={formData.abstract}
                      onChange={handleInputChange}
                      className={errors.abstract ? "border-red-500" : ""}
                      disabled={uploading || uploadSuccess}
                    />
                    {errors.abstract && <p className="text-red-500 text-xs mt-1">{errors.abstract}</p>}
                    <p className="text-xs text-gray-500">
                      The abstract will be used to generate AI responses for the chatbot. Minimum 50 characters.
                    </p>
                  </div>

<div className="space-y-2">
                    <Label htmlFor="keywords">Keywords</Label>
                    <Input
                      id="keywords"
                      name="keywords"
                      placeholder="Enter keywords separated by commas (e.g., AI, Machine Learning, Neural Networks)"
                      value={formData.keywords}
                      onChange={handleInputChange}
                      disabled={uploading || uploadSuccess}
                    />
                    <p className="text-xs text-gray-500">Optional. Keywords help users find your study more easily.</p>
                  </div>

<div className="space-y-2">
                    <Label htmlFor="file" className="flex items-center">
                      Upload Research Paper (PDF only) <span className="text-red-500 ml-1">*</span>
                    </Label>
                    <div
                      className={`border-2 border-dashed rounded-md p-6 text-center ${
                        errors.file ? "border-red-500" : "border-gray-300"
                      } ${uploading || uploadSuccess ? "opacity-50" : "hover:border-blue-500"}`}
                      onDragOver={handleDragOver}
                      onDrop={handleDrop}
                      onClick={() => !uploading && !uploadSuccess && fileInputRef.current?.click()}
                    >
                      {formData.file ? (
                        <div className="flex items-center justify-between">
                          <div className="flex items-center">
                            <FileText className="h-6 w-6 text-blue-600 mr-2" />
                            <span>{formData.file.name}</span>
                            <span className="text-xs text-gray-500 ml-2">
                              ({(formData.file.size / (1024 * 1024)).toFixed(2)} MB)
                            </span>
                          </div>
                          {!uploading && !uploadSuccess && (
                            <Button
                              type="button"
                              variant="ghost"
                              size="sm"
                              onClick={(e) => {
                                e.stopPropagation()
                                setFormData((prev) => ({ ...prev, file: null }))
                              }}
                            >
                              <X className="h-4 w-4" />
                            </Button>
                          )}
                        </div>
                      ) : (
                        <>
                          <Upload className="h-10 w-10 text-gray-400 mx-auto mb-2" />
                          <p className="text-sm text-gray-600 mb-2">
                            Drag and drop your PDF file here, or click to browse
                          </p>
                          <Input
                            ref={fileInputRef}
                            id="file"
                            type="file"
                            accept=".pdf"
                            className="hidden"
                            onChange={handleFileChange}
                            disabled={uploading || uploadSuccess}
                          />
                          <Button
                            type="button"
                            variant="outline"
                            disabled={uploading || uploadSuccess}
                            onClick={(e) => {
                              e.stopPropagation()
                              fileInputRef.current?.click()
                            }}
                          >
                            Browse Files
                          </Button>
                        </>
                      )}
                    </div>
                    {errors.file && <p className="text-red-500 text-xs mt-1">{errors.file}</p>}
                    <p className="text-xs text-gray-500">Maximum file size: 20MB. Accepted format: PDF only.</p>
                  </div>

{uploading && (
                    <div className="space-y-2">
                      <div className="flex justify-between text-sm text-gray-500 mb-1">
                        <span>Uploading...</span>
                        <span>{uploadProgress}%</span>
                      </div>
                      <Progress value={uploadProgress} className="h-2" />
                    </div>
                  )}

<div className="bg-blue-50 p-4 rounded-md flex items-start">
                    <Info className="h-5 w-5 text-blue-500 mr-2 mt-0.5 flex-shrink-0" />
                    <div className="text-sm text-blue-700">
                      <p className="font-medium mb-1">Privacy Notice</p>
                      <p>
                        Your identity will remain anonymous. The platform will remove all identifying information from
                        your paper before making it available to users. You can delete your study at any time from your
                        dashboard.
                      </p>
                    </div>
                  </div>
                </CardContent>
                <CardFooter className="flex justify-between">
                  <Button
                    type="button"
                    variant="outline"
                    onClick={() => router.push("/researcher/dashboard")}
                    disabled={uploading}
                  >
                    Cancel
                  </Button>
                  <Button type="submit" disabled={uploading || uploadSuccess}>
                    {uploading ? (
                      <>
                        <div className="mr-2 h-4 w-4 animate-spin rounded-full border-2 border-solid border-current border-r-transparent"></div>
                        Uploading...
                      </>
                    ) : uploadSuccess ? (
                      <>
                        <Check className="mr-2 h-4 w-4" />
                        Uploaded
                      </>
                    ) : (
                      <>
                        <Upload className="mr-2 h-4 w-4" />
                        Upload Study
                      </>
                    )}
                  </Button>
                </CardFooter>
              </form>
            </Card>
          </div>
        </div>
      </main>

{/* Footer */}
      <footer className="bg-gray-900 text-white py-12">
        <div className="container mx-auto px-4">
          <div className="grid md:grid-cols-2 gap-8">
            <div>
              <div className="flex items-center space-x-2 mb-6">
                <BookOpen className="h-6 w-6 text-blue-400" />
                <span className="font-bold text-xl">TTO Tech Transfer Office</span>
              </div>
              <p className="text-gray-400 max-w-md">
                Bridging the gap between research and the public through anonymous publishing and interactive
                exploration.
              </p>
            </div>
            <div className="grid grid-cols-2 gap-8">
              <div>
                <h3 className="font-semibold text-lg mb-4">Platform</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/about" className="text-gray-400 hover:text-white transition-colors">
                      About Us
                    </Link>
                  </li>
                  <li>
                    <Link href="/contact" className="text-gray-400 hover:text-white transition-colors">
                      Contact
                    </Link>
                  </li>
                </ul>
              </div>
              <div>
                <h3 className="font-semibold text-lg mb-4">Legal</h3>
                <ul className="space-y-2">
                  <li>
                    <Link href="/terms" className="text-gray-400 hover:text-white transition-colors">
                      Terms of Service
                    </Link>
                  </li>
                  <li>
                    <Link href="/privacy" className="text-gray-400 hover:text-white transition-colors">
                      Privacy Policy
                    </Link>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <div className="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400">
            <p>© {new Date().getFullYear()} TTO Tech Transfer Office. All Rights Reserved.</p>
          </div>
        </div>
      </footer>
    </div>
  )
}
[V0_FILE]typescriptreact:file="components/ui/progress.tsx"
import * as React from "react"

import { cn } from "@/lib/utils"

const Progress = React.forwardRef<
  HTMLDivElement,
  React.HTMLAttributes<HTMLDivElement> & {
    value?: number
    max?: number
  }
>(({ className, value, max = 100, ...props }, ref) => (
  <div
    ref={ref}
    role="progressbar"
    aria-valuemin={0}
    aria-valuemax={max}
    aria-valuenow={value}
    className={cn("relative h-4 w-full overflow-hidden rounded-full bg-secondary", className)}
    {...props}
  >
    <div
      className="h-full w-full flex-1 bg-primary transition-all"
      style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
    />
  </div>
))
Progress.displayName = "Progress"

export { Progress }
[V0_FILE]typescriptreact:file="app/api/studies/upload/route.ts"
import { NextResponse } from "next/server"

export async function POST(request: Request) {
  try {
    // In a real implementation, this would:
    // 1. Verify the Firebase ID token from the Authorization header
    // 2. Extract the researcher ID from the token
    // 3. Parse the multipart/form-data request to get the form fields and file
    // 4. Upload the file to storage (e.g., AWS S3, Firebase Storage)
    // 5. Create a new study record in the database
    // 6. Return the created study

// For MVP, we'll simulate a successful response
    await new Promise((resolve) => setTimeout(resolve, 2000)) // Simulate processing time

return NextResponse.json({
      id: "study_" + Date.now(),
      title: "Study Title",
      status: "processing",
      message: "Study uploaded successfully and is now being processed.",
    })
  } catch (error) {
    console.error("Error uploading study:", error)
    return NextResponse.json({ error: "Failed to upload study" }, { status: 500 })
  }
}</article></body></html>