Material-UI-Dropzone Typescript Example

Intro

This NPM plugin: https://www.npmjs.com/package/material-ui-dropzone
is very popular, however the examples are in JavaScript. Here’s a typescript equivalent of their posted example:

import React, { useState } from "react";
import { DropzoneAreaBase } from "material-ui-dropzone";
import "./styles.css";
const Home = () => {
  const [files, setFiles] = useState([]);
const handleAdd = (newFiles: any) => {
    setFiles([...files]);
  };
const handleDelete = (deleted: any) => {
    setFiles(files.filter((f) => f !== deleted));
  };
return (
    <DropzoneAreaBase
      fileObjects={files}
      onAdd={handleAdd}
      onDelete={handleDelete}
    />
  );
}
export default Home;

Produces: