diff --git a/frontend/src/app/album/page.tsx b/frontend/src/app/album/page.tsx
index c4aa98f..c32a533 100644
--- a/frontend/src/app/album/page.tsx
+++ b/frontend/src/app/album/page.tsx
@@ -12,7 +12,9 @@ export default function Page() {
   const [show, setShow] = useState(false);
   const handleClose = () => setShow(false);
   const handleShow = () => setShow(true);
-  let [formAlbumTitle, formAlbumArtist, formAlbumGenre] = '';
+  const [formAlbumTitle, setFormAlbumTitle] = useState("");
+  const [formAlbumArtist, setFormAlbumArtist] = useState("");
+  const [formAlbumGenre, setFormAlbumGenre] = useState("");
 
   useEffect(() => {
     async function fetchAlbums() {
@@ -38,9 +40,9 @@ export default function Page() {
   }
 
   const handleEdit = async () => {
-    formAlbumTitle = "Monkey";
-    formAlbumArtist = "Donkey";
-    formAlbumGenre = "Pop";
+    setFormAlbumTitle("Monkey");
+    setFormAlbumArtist("Donkey");
+    setFormAlbumGenre("Pop");
     handleShow();
   }