function FileIcon ({ name, type, style = { width: 36 }, cls = '' }) {
  if (type === 'directory') {
    return <Folder className={`fill-aqua ${cls}`} style={style} />
  }

  if (type === 'unknown') {
    return <Cube className={`fill-aqua ${cls}`} style={style} />
  }

  switch (typeFromExt(name)) {
    case 'audio':
      return <DocMusic className={`fill-aqua ${cls}`} style={style} />
    case 'calc':
      return <DocCalc className={`fill-aqua ${cls}`} style={style} />
    case 'video':
      return <DocMovie className={`fill-aqua ${cls}`} style={style} />
    case 'text':
      return <DocText className={`fill-aqua ${cls}`} style={style} />
    case 'image':
      return <DocPicture className={`fill-aqua ${cls}`} style={style} />
    default:
      return <Doc className={`fill-aqua ${cls}`} style={style} />
  }
}
@param {{ name: string, type: string, style?: React.CSSProperties, cls?: string }} props
@returns {React.ReactElement}