function EmptyBookmark(props) {
  const classes = useStyles()

  return (
    <div className={classes.emptyBookmarkContainer}>
      <CollectionsBookmarkRoundedIcon
        fontSize='large'
        className={classes.bookmarkIcon}
      />
      <Typography variant='h5'>Add bookmarks now</Typography>
      <Typography color='textSecondary'>
        There are no available bookmarks to display.
      </Typography>
    </div>
  )
}
/** This is a component that will be displayed when there are no available bookmarks. */
This is a component that will be displayed when there are no available bookmarks.
This is a component that will be displayed when there are no available bookmarks .
function EmptyBookmark(props) {
  const classes = useStyles()
  return (
    <div className={classes.emptyBookmarkContainer}>
      <CollectionsBookmarkRoundedIcon
        fontSize='large'
        className={classes.bookmarkIcon}
      />
      <Typography variant='h5'>Add bookmarks now</Typography>
      <Typography color='textSecondary'>
        There are no available bookmarks to display.
      </Typography>
    </div>
  )
}
function EmptyBookmark ( props ) { const classes = useStyles ( ) return ( < div className = { classes . emptyBookmarkContainer } > < CollectionsBookmarkRoundedIcon fontSize = 'large' className = { classes . bookmarkIcon } / > < Typography variant = 'h5' > Add bookmarks now < / Typography > < Typography color = 'textSecondary' > 
        There are no available bookmarks to display.
       < / Typography > < / div > ) }
This is a component that will be displayed when there are no available bookmarks.
This is a component that will be displayed when there are no available bookmarks .