chore: add all the code from original repo

app/components/Dashboard/ItemDialog/ItemDialog.tsx

@@ -0,0 +1,53 @@
+import { Button, Dialog, DialogContent, DialogTitle } from '@mui/material';
+import { nanoid } from 'nanoid';
+import { useCallback, useEffect, useState } from 'react';
+import { Item, ItemComment } from '../../../../data/types';
+import { ItemsTableRowAction } from '../Items/ItemsTableRowAction';
+import CreateComment from './CreateComment/CreateComment';
+import ItemData from './ItemData';
+
+interface ItemDialogProps {
+  item: Item;
+  open: boolean;
+  handleClose: () => void;
+}
+
+export default function ItemDialog({
+  item,
+  open,
+  handleClose
+}: ItemDialogProps) {
+  const [comments, setComments] = useState<ItemComment[]>([]);
+  const [formKey, setFormKey] = useState(() => nanoid());
+
+  const fetchData = useCallback(async () => {
+    try {
+      const comments = await ItemsTableRowAction(item.id);
+      setComments(comments);
+    } catch (error) {
+      console.error("Couldn't fetch comments.");
+    }
+  }, [item]);
+
+  useEffect(() => {
+    fetchData();
+  }, [fetchData, formKey]);
+
+  return (
+    <Dialog open={open} onClose={handleClose}>
+      <DialogTitle sx={{ alignSelf: 'center' }}>Item: {item.name}</DialogTitle>
+      <DialogContent sx={{ width: 400 }}>
+        <ItemData item={item} comments={comments} />
+        <CreateComment key={formKey} itemId={item.id} setFormKey={setFormKey} />
+        <Button
+          variant="outlined"
+          color="primary"
+          onClick={handleClose}
+          sx={{ width: '100%' }}
+        >
+          Close
+        </Button>
+      </DialogContent>
+    </Dialog>
+  );
+}