How can I shorten the code for similar constructs?

I need to reduce the complexity of this "algorithm". Now, I need to run sequentially through all the cases, and then also over the array elements, and it is clear that this is the most suboptimal path.

However, I don’t know how to do this.
How can you shorten the code for similar constructs? I am sure this is possible. Tell me please 🙂

const types = {
  pictures: ["jpeg", "png", "apng", "avif", "gif", "jpg", ".webp"],
  videos: ["mp4", "webm", "avchd", "flv", "mov", "wmv", "mkv", "avi"],
  audio: ["mp3", "flac", "wav", "ogg"],
  disk: ["iso"],
  doc: ["doc", "docx"],
  pp: ["ppt", "pptx", "pps", "ppsx", "pot", "potx"],
  zip: ["zip", "rar", "tar", "arj", "cab", "lzh"],
  css: ["css", "scss", "sass"],
};

export function setTypeIcon(type) {
  const t = type.toLowerCase();

  switch (t) {
    case "dir":
      return dir;

    case "txt":
      return txt;

    case types.zip.find((el) => el === t):
      return zip;

    case types.pictures.find((el) => el === t):
      return img;

    case types.videos.find((el) => el === t):
      return vid;

    case types.audio.find((el) => el === t):
      return aud;

    case types.doc.find((el) => el === t):
      return doc;

    case types.pp.find((el) => el === t):
      return powerpoint;

    case types.disk.find((el) => el === t):
      return iso;

    case "xls":
      return excel;

    case "pdf":
      return pdf;

    case "otf":
      return font;

    case "js":
      return js;

    case types.css.find((el) => el === t):
      return css;

    case "psd":
      return psd;

    case "svg":
      return svg;

    default:
      return def;
  }
}

>Solution :

Consider putting your directory names with the list of possible file types. This would make it easier to maintain over time. you also wouldn’t have to manage individual variables for each directly name.

Here is a solution using a Map object. I’ve store the type lists as a comma separated string to make searching easier. I’ve made the value the directory name.

Then, all you have to do is a simple iteration to find and return the directory.

Note: Technically, you shouldn’t really return out of a loop. So technically you would create a variable outside the loop to hold the value and return that variable – rather than returning from within the loop.

const dirs = new Map();
dirs.set("jpeg, png, apng, avif, gif, jpg, webp", '../assets/images/filetypes/image.png');
dirs.set("doc, docx", '../assets/images/filetypes/docment.png');
dirs.set("css, scss, sass", '../assets/images/filetypes/css.png');

function setTypeIcon(type){
  for(let [key, value] of dirs.entries()){
    if(!key.includes(type)) continue;
    return value;
  }
}
console.log(setTypeIcon("apng"));
console.log(setTypeIcon("scss"));