import React from 'react';
import { returnbar } from 'educoder';


function CoderDepotPath({treeValuePath , returnUlr , returnMain , getPathUrl , identifier}){
  return(
    <li className="listtablepath">
      <p>
        <a
          onClick={returnMain}
          className="color-blue"
        >
          {identifier}
        </a>
        {treeValuePath.map((item, key) => {
          return (
            <React.Fragment>
              {
                key === treeValuePath.length-1 ?
                  <span className="color-grey-6 subFileName" key={key}>{returnbar(item)}</span>
                  :
                  <a onClick={()=>returnUlr(`${getPathUrl(treeValuePath,key+1)}`)} className="color-blue subFileName">{returnbar(item)}</a>
              }
            </React.Fragment>
          );
        })}
      </p>
    </li>
  )
}
export default CoderDepotPath;