import React, { useEffect } from 'react'
import { Link } from 'react-router-dom'
import ProjectSumary from './ProjectSumary'
import Documents from './Documents'
import ContractorList from './ContractorList'
import ConsultantList from './ConsultantList'
import Gallery from './Gallery'
import TopBar from './TopBar'

const Tabs = () => {


    return (
        <div className="main-content">
            <div className="page-content">
                <div className="container-fluid">
                    <div className="row">
                        <div className="col-lg-12">
                            <div>
                                <TopBar />

                                <div className="tab-content pt-4 text-muted">
                                    <div className="tab-pane active" id="overview-tab" role="tabpanel">
                                        <div className="row">
                                            <ProjectSumary />
                                            <Documents />
                                            <ContractorList />
                                            <ConsultantList />
                                            <Gallery />
                                        </div>
                                    </div>
                                    <div className="tab-pane fade" id="documents" role="tabpanel">
                                        <Documents />
                                    </div>
                                    <div className="tab-pane fade" id="contractor" role="tabpanel">
                                        <ContractorList />
                                    </div>

                                    <div className="tab-pane fade" id="consultant" role="tabpanel">
                                        <ConsultantList />
                                    </div>
                                    <div className="tab-pane fade" id="Gallery" role="tabpanel">
                                        <Gallery />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <footer className="footer">
                <div className="container-fluid">
                    <div className="row">
                        <div className="col-sm-6">
                            2024 © DualSysco.
                        </div>
                        <div className="col-sm-6">
                            <div className="text-sm-end d-none d-sm-block">
                                Design &amp; Develop by DualSysco Research &amp; Development
                            </div>
                        </div>
                    </div>
                </div>
            </footer>
        </div>

    )
}

export default Tabs