return <div ref = { shellRef } data-type = 'cellshell' data-scrollerid = {scrollerID} data-index = {index} data-instanceid = {instanceID} style = {styles}>
 { ((cellStatus == 'render') || (cellStatus == 'renderplaceholder')) && <OutPortal node = {reverseportal} /> }
 { (cellStatus == 'render1') && <OutPortal node = {reverseportal} /> }
 </div>

const GenericItem = (props) => {
 const [genericstate, setGenericState] = useState('setup')
 useEffect(()=>{
 if (genericstate == 'setup') {
 setGenericState('final')
 } 
 },[genericstate])
 console.log('rendering generic item index, genericstate',props.index,genericstate)
 return <div style = {{position:'relative',height:'100%', width:'100%',backgroundColor:'white'}}>
 <div style = {genericstyle}>
 {props.index + 1}{false && <img style= {{height:'100%'}} src={props.image}/>}
 </div>
 </div>
}