|
| 1 | +/** |
| 2 | + * FileIcon component |
| 3 | + * |
| 4 | + * Renders file icon depend on the file type |
| 5 | + */ |
| 6 | +import React from 'react' |
| 7 | +import PT from 'prop-types' |
| 8 | + |
| 9 | +import IconDefault from '../assets/icons/default.svg' |
| 10 | +import IconAac from '../assets/icons/aac.svg' |
| 11 | +import IconAi from '../assets/icons/ai.svg' |
| 12 | +import IconAse from '../assets/icons/ase.svg' |
| 13 | +import IconAsp from '../assets/icons/asp.svg' |
| 14 | +import IconAspx from '../assets/icons/aspx.svg' |
| 15 | +import IconAvi from '../assets/icons/avi.svg' |
| 16 | +import IconBmp from '../assets/icons/bmp.svg' |
| 17 | +import IconCpp from '../assets/icons/c++.svg' |
| 18 | +import IconCad from '../assets/icons/cad.svg' |
| 19 | +import IconCfm from '../assets/icons/cfm.svg' |
| 20 | +import IconCgi from '../assets/icons/cgi.svg' |
| 21 | +import IconCsh from '../assets/icons/csh.svg' |
| 22 | +import IconCss from '../assets/icons/css.svg' |
| 23 | +import IconCsv from '../assets/icons/csv.svg' |
| 24 | +import IconDmg from '../assets/icons/dmg.svg' |
| 25 | +import IconDoc from '../assets/icons/doc.svg' |
| 26 | +import IconDocx from '../assets/icons/docx.svg' |
| 27 | +import IconEps from '../assets/icons/eps.svg' |
| 28 | +import IconEpub from '../assets/icons/epub.svg' |
| 29 | +import IconExe from '../assets/icons/exe.svg' |
| 30 | +import IconFlash from '../assets/icons/flash.svg' |
| 31 | +import IconFlv from '../assets/icons/flv.svg' |
| 32 | +import IconFont from '../assets/icons/font.svg' |
| 33 | +import IconGif from '../assets/icons/gif.svg' |
| 34 | +import IconGpx from '../assets/icons/gpx.svg' |
| 35 | +import IconGzip from '../assets/icons/gzip.svg' |
| 36 | +import IconHtml from '../assets/icons/html.svg' |
| 37 | +import IconIcs from '../assets/icons/ics.svg' |
| 38 | +import IconIso from '../assets/icons/iso.svg' |
| 39 | +import IconJar from '../assets/icons/jar.svg' |
| 40 | +import IconJava from '../assets/icons/java.svg' |
| 41 | +import IconJpg from '../assets/icons/jpg.svg' |
| 42 | +import IconJs from '../assets/icons/js.svg' |
| 43 | +import IconJsp from '../assets/icons/jsp.svg' |
| 44 | +import IconLog from '../assets/icons/log.svg' |
| 45 | +import IconMax from '../assets/icons/max.svg' |
| 46 | +import IconMd from '../assets/icons/md.svg' |
| 47 | +import IconMkv from '../assets/icons/mkv.svg' |
| 48 | +import IconMov from '../assets/icons/mov.svg' |
| 49 | +import IconMp3 from '../assets/icons/mp3.svg' |
| 50 | +import IconMp4 from '../assets/icons/mp4.svg' |
| 51 | +import IconMpg from '../assets/icons/mpg.svg' |
| 52 | +import IconObj from '../assets/icons/obj.svg' |
| 53 | +import IconOtf from '../assets/icons/otf.svg' |
| 54 | +import IconPdf from '../assets/icons/pdf.svg' |
| 55 | +import IconPhp from '../assets/icons/php.svg' |
| 56 | +import IconPng from '../assets/icons/png.svg' |
| 57 | +import IconPptx from '../assets/icons/pptx.svg' |
| 58 | +import IconPsd from '../assets/icons/psd.svg' |
| 59 | +import IconPy from '../assets/icons/py.svg' |
| 60 | +import IconRar from '../assets/icons/rar.svg' |
| 61 | +import IconRaw from '../assets/icons/raw.svg' |
| 62 | +import IconRb from '../assets/icons/rb.svg' |
| 63 | +import IconRss from '../assets/icons/rss.svg' |
| 64 | +import IconRtf from '../assets/icons/rtf.svg' |
| 65 | +import IconSketch from '../assets/icons/sketch.svg' |
| 66 | +import IconSql from '../assets/icons/sql.svg' |
| 67 | +import IconSrt from '../assets/icons/srt.svg' |
| 68 | +import IconSvg from '../assets/icons/svg.svg' |
| 69 | +import IconTif from '../assets/icons/tif.svg' |
| 70 | +import IconTiff from '../assets/icons/tiff.svg' |
| 71 | +import IconTtf from '../assets/icons/ttf.svg' |
| 72 | +import IconTxt from '../assets/icons/txt.svg' |
| 73 | +import IconWav from '../assets/icons/wav.svg' |
| 74 | +import IconXml from '../assets/icons/xml.svg' |
| 75 | +import IconZip from '../assets/icons/zip.svg' |
| 76 | +import IconLink12 from '../assets/icons/link-12.svg' |
| 77 | + |
| 78 | +const FileIcon = ({ type }) => { |
| 79 | + // if type is defined as a relative path to the icon, convert it to icon "id" |
| 80 | + const typeAsPath = type && type.match(/(?:\.\.\/)+assets\/icons\/([^.]+)\.svg/) |
| 81 | + if (typeAsPath) { |
| 82 | + type = typeAsPath[1] |
| 83 | + } |
| 84 | + |
| 85 | + switch(type){ |
| 86 | + case 'aac': |
| 87 | + return <IconAac className="icon-aac"/> |
| 88 | + case 'ai': |
| 89 | + return <IconAi className="icon-ai"/> |
| 90 | + case 'ase': |
| 91 | + return <IconAse className="icon-ase"/> |
| 92 | + case 'asp': |
| 93 | + return <IconAsp className="icon-asp"/> |
| 94 | + case 'aspx': |
| 95 | + return <IconAspx className="icon-aspx"/> |
| 96 | + case 'avi': |
| 97 | + return <IconAvi className="icon-avi"/> |
| 98 | + case 'bmp': |
| 99 | + return <IconBmp className="icon-bmp"/> |
| 100 | + case 'c++': |
| 101 | + return <IconCpp className="icon-c++"/> |
| 102 | + case 'cad': |
| 103 | + return <IconCad className="icon-cad"/> |
| 104 | + case 'cfm': |
| 105 | + return <IconCfm className="icon-cfm"/> |
| 106 | + case 'cgi': |
| 107 | + return <IconCgi className="icon-cgi"/> |
| 108 | + case 'csh': |
| 109 | + return <IconCsh className="icon-csh"/> |
| 110 | + case 'css': |
| 111 | + return <IconCss className="icon-css"/> |
| 112 | + case 'csv': |
| 113 | + return <IconCsv className="icon-csv"/> |
| 114 | + case 'dmg': |
| 115 | + return <IconDmg className="icon-dmg"/> |
| 116 | + case 'doc': |
| 117 | + return <IconDoc className="icon-doc"/> |
| 118 | + case 'docx': |
| 119 | + return <IconDocx className="icon-docx"/> |
| 120 | + case 'eps': |
| 121 | + return <IconEps className="icon-eps"/> |
| 122 | + case 'epub': |
| 123 | + return <IconEpub className="icon-epub"/> |
| 124 | + case 'exe': |
| 125 | + return <IconExe className="icon-exe"/> |
| 126 | + case 'flash': |
| 127 | + return <IconFlash className="icon-flash"/> |
| 128 | + case 'flv': |
| 129 | + return <IconFlv className="icon-flv"/> |
| 130 | + case 'font': |
| 131 | + return <IconFont className="icon-font"/> |
| 132 | + case 'gif': |
| 133 | + return <IconGif className="icon-gif"/> |
| 134 | + case 'gpx': |
| 135 | + return <IconGpx className="icon-gpx"/> |
| 136 | + case 'gzip': |
| 137 | + return <IconGzip className="icon-gzip"/> |
| 138 | + case 'html': |
| 139 | + return <IconHtml className="icon-html"/> |
| 140 | + case 'ics': |
| 141 | + return <IconIcs className="icon-ics"/> |
| 142 | + case 'iso': |
| 143 | + return <IconIso className="icon-iso"/> |
| 144 | + case 'jar': |
| 145 | + return <IconJar className="icon-jar"/> |
| 146 | + case 'java': |
| 147 | + return <IconJava className="icon-java"/> |
| 148 | + case 'jpg': |
| 149 | + return <IconJpg className="icon-jpg"/> |
| 150 | + case 'js': |
| 151 | + return <IconJs className="icon-js"/> |
| 152 | + case 'jsp': |
| 153 | + return <IconJsp className="icon-jsp"/> |
| 154 | + case 'log': |
| 155 | + return <IconLog className="icon-log"/> |
| 156 | + case 'max': |
| 157 | + return <IconMax className="icon-max"/> |
| 158 | + case 'md': |
| 159 | + return <IconMd className="icon-md"/> |
| 160 | + case 'mkv': |
| 161 | + return <IconMkv className="icon-mkv"/> |
| 162 | + case 'mov': |
| 163 | + return <IconMov className="icon-mov"/> |
| 164 | + case 'mp3': |
| 165 | + return <IconMp3 className="icon-mp3"/> |
| 166 | + case 'mp4': |
| 167 | + return <IconMp4 className="icon-mp4"/> |
| 168 | + case 'mpg': |
| 169 | + return <IconMpg className="icon-mpg"/> |
| 170 | + case 'obj': |
| 171 | + return <IconObj className="icon-obj"/> |
| 172 | + case 'otf': |
| 173 | + return <IconOtf className="icon-otf"/> |
| 174 | + case 'pdf': |
| 175 | + return <IconPdf className="icon-pdf"/> |
| 176 | + case 'php': |
| 177 | + return <IconPhp className="icon-php"/> |
| 178 | + case 'png': |
| 179 | + return <IconPng className="icon-png"/> |
| 180 | + case 'pptx': |
| 181 | + return <IconPptx className="icon-pptx"/> |
| 182 | + case 'psd': |
| 183 | + return <IconPsd className="icon-psd"/> |
| 184 | + case 'py': |
| 185 | + return <IconPy className="icon-py"/> |
| 186 | + case 'rar': |
| 187 | + return <IconRar className="icon-rar"/> |
| 188 | + case 'raw': |
| 189 | + return <IconRaw className="icon-raw"/> |
| 190 | + case 'rb': |
| 191 | + return <IconRb className="icon-rb"/> |
| 192 | + case 'rss': |
| 193 | + return <IconRss className="icon-rss"/> |
| 194 | + case 'rtf': |
| 195 | + return <IconRtf className="icon-rtf"/> |
| 196 | + case 'sketch': |
| 197 | + return <IconSketch className="icon-sketch"/> |
| 198 | + case 'sql': |
| 199 | + return <IconSql className="icon-sql"/> |
| 200 | + case 'srt': |
| 201 | + return <IconSrt className="icon-srt"/> |
| 202 | + case 'svg': |
| 203 | + return <IconSvg className="icon-svg"/> |
| 204 | + case 'tif': |
| 205 | + return <IconTif className="icon-tif"/> |
| 206 | + case 'tiff': |
| 207 | + return <IconTiff className="icon-tiff"/> |
| 208 | + case 'ttf': |
| 209 | + return <IconTtf className="icon-ttf"/> |
| 210 | + case 'txt': |
| 211 | + return <IconTxt className="icon-txt"/> |
| 212 | + case 'wav': |
| 213 | + return <IconWav className="icon-wav"/> |
| 214 | + case 'xml': |
| 215 | + return <IconXml className="icon-xml"/> |
| 216 | + case 'zip': |
| 217 | + return <IconZip className="icon-zip"/> |
| 218 | + case 'link-12': |
| 219 | + return <IconLink12 className="icon-link-12"/> |
| 220 | + default: |
| 221 | + // this will be default icon |
| 222 | + return <IconDefault className="icon-default"/> |
| 223 | + } |
| 224 | +} |
| 225 | + |
| 226 | +FileIcon.propTypes = { |
| 227 | + type: PT.string, |
| 228 | +} |
| 229 | + |
| 230 | +export default FileIcon |
0 commit comments