In my project, I have a burger menu component that will receive two props: 1) isOpen, and 2) a file object
{ name, type, size, modifiedAt, downloadUrl }I'm attempting to implement the following code snippet, but I am encountering issues with Typescript
const FileManagerSlide = () => {
const [burger, setBurger] = useState({
isOpen: false,
file: {
name: null,
modifiedAt: null,
size: null,
type: null,
downloadUrl: null
}
});
...
<Tr
onClick={() =>
setBurger({
isOpen: true,
file: {
name: "HR STUFF",
modifiedAt: "01/03/2019",
size: 40,
type: "folder",
downloadUrl: "www.google.com"
}
})
}
>
The error message I'm receiving is as follows:
ERROR in [at-loader] ./src/components/file-manager/file-manager-slide.tsx:287:31
TS2345: Argument of type '{ isOpen: true; file: { name: string; modifiedAt: string; size: number; type: string; downloadUrl...' is not assignable to parameter of type 'SetStateAction<{ isOpen: boolean; file: { name: null; modifiedAt: null; size: null; type: null; d...'.
Type '{ isOpen: true; file: { name: string; modifiedAt: string; size: number; type: string; downloadUrl...' is not assignable to type '(prevState: { isOpen: boolean; file: { name: null; modifiedAt: null; size: null; type: null; down...'.
Type '{ isOpen: true; file: { name: string; modifiedAt: string; size: number; type: string; downloadUrl...' provides no match for the signature '(prevState: { isOpen: boolean; file: { name: null; modifiedAt: null; size: null; type: null; downloadUrl: null; }; }): { isOpen: boolean; file: { name: null; modifiedAt: null; size: null; type: null; downloadUrl: null; }; }'.
I am considering defining a File type and casting the file attribute of the burger state as that type. Do you think that would resolve the issue?
interface File {
name: string;
modifiedAt: string;
size: number;
type: string;
downloadUrl: string;
}
However, I am unsure about how to go about doing that