diff --git a/src/pages/playlist/index.jsx b/src/pages/playlist/index.jsx
index 59b3e1c..a628ef9 100644
--- a/src/pages/playlist/index.jsx
+++ b/src/pages/playlist/index.jsx
@@ -20,7 +20,7 @@ const Playlist = (item) => {
 
     const form = useForm({
         initialValues: {
-            files: [{ id: 0, name: 'stuff', seconds: 60 }],
+            files: [],
         },
     });
 
@@ -39,11 +39,13 @@ const Playlist = (item) => {
             API.getPlaylist(id)
                 .then((res) => {
                     if (res.status === 200) {
+                        console.log(res.data)
                         setPlaylist(res.data);
+                        form.setFieldValue('files', res.data.files);
                     }
                 })
                 .catch((err) => {
-                    setNotification(true, err.response.data.error);
+                    setNotification(true, err.message);
                 });
 
             API.getFiles()
@@ -53,7 +55,7 @@ const Playlist = (item) => {
                     }
                 })
                 .catch((err) => {
-                    setNotification(true, err.response.data.error);
+                    setNotification(true, err.message);
                 });
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -76,8 +78,9 @@ const Playlist = (item) => {
                 </Button>
             </Group>
             <Paper p="xs" radius="sm" shadow="sm" withBorder my="md">
-                <Content form={form} />
+                <Content form={form} playlistId={id}/>
             </Paper>
+            <Button>Save</Button>
             <ModalUpdate open={update} handler={toggleUpdate} id={playlist?.id} />
         </>
     );
diff --git a/src/pages/playlists/index.jsx b/src/pages/playlists/index.jsx
index 86b1c58..359f44e 100644
--- a/src/pages/playlists/index.jsx
+++ b/src/pages/playlists/index.jsx
@@ -25,7 +25,7 @@ const Playlists = () => {
                 }
             })
             .catch((err) => {
-                setNotification(true, err.response.data.error);
+                setNotification(true, err.message);
             });
 
         return () => {};
diff --git a/src/services/api.js b/src/services/api.js
index 8108dc6..f46abfc 100644
--- a/src/services/api.js
+++ b/src/services/api.js
@@ -22,6 +22,13 @@ const API = {
     getFiles() {
         return caller().get('/file');
     },
+    addFileToPlaylist(playlistId, file) {
+        return caller().post(`/playlist/${playlistId}`, file);
+    },
+    playlistChangeOrder(playlistId, data) {
+        return caller().post(`/playlist/${playlistId}/order`, data);
+
+    }
 };
 
 export default API;