Started to work on media upload and organization

frontend/app/(auth)/dashboard/media/old.tsx

@@ -0,0 +1,30 @@
+"use client";
+import useFileUpload from "@/hooks/use-file-upload";
+import { ChangeEvent } from "react";
+
+const MyComponent = () => {
+	const { progress, isUploading, error, uploadFile, cancelUpload } =
+		useFileUpload();
+
+	const handleFileUpload = (event: ChangeEvent<HTMLInputElement>) => {
+		const file = event.target.files?.[0];
+		if (file) {
+			uploadFile(file, "/media/upload", (response) => {
+				console.log("Upload success:", response);
+			});
+		}
+	};
+
+	return (
+		<div>
+			<input type="file" onChange={handleFileUpload} />
+			{isUploading && <p>Uploading... {progress}%</p>}
+			{error && <p>Error: {error}</p>}
+			<button onClick={cancelUpload} disabled={!isUploading}>
+				Cancel Upload
+			</button>
+		</div>
+	);
+};
+
+export default MyComponent;