import React from 'react' ; import { Plus } from 'shared/icons' ; import { AddProjectWrapper , AddProjectLabel , ProjectWrapper , ProjectContent , ProjectTitle , TeamTitle } from './Styles' ; type AddProjectItemProps = { onAddProject : ( ) => void ; } ; export const AddProjectItem = ( { onAddProject } ) => { return ( < AddProjectWrapper onClick = { ( ) => { onAddProject ( ) ; } } > < Plus width = { 12 } height = { 12 } / > < AddProjectLabel > New Project < /AddProjectLabel> < /AddProjectWrapper>); } ; type Props = { project : Project ; } ; const ProjectsList = ( { project } ) => { const color = project . color ?? '#c2c6dc' ; return ( < ProjectWrapper color = { color } > < ProjectContent > < ProjectTitle > { project . name } < /ProjectTitle> < TeamTitle > { project . teamTitle } < /TeamTitle> < /ProjectContent> < /ProjectWrapper>); } ; export default ProjectsList ;