import React from 'react'
import { useBranch } from '../../../hooks/useServiceProject'
import { SpinnerLoader } from '../../common/Loader'
import Error from '../../common/Error'

const BranchDetails = ({branch}) => {
    const  {data,isLoading,isError,error}  = useBranch(branch)
    if(isLoading) return <div><SpinnerLoader/></div>
    if(isError) return <div><Error error={error}/></div>
  return (
    <div className='row w-auto'>
       <div className='col-12 d-flex flex-row gap-3'>
        <span className='text-secondry'>Name:</span> <span>{data.branchName}</span>
       </div>
       <div className='col-12 d-flex flex-row gap-3'>
        <span className='text-secondry'>Type:</span> <span>{data.branchType}</span>
       </div>
        <div className='col-12 d-flex flex-row gap-3'>
        <span className='text-secondry'>Address:</span> <span>{data.address}</span>
       </div>
    </div>
  )
}

export default BranchDetails