From 6585319eee894e14e0d2f7ab59f544dbc0a61c8b Mon Sep 17 00:00:00 2001
From: Doric Ivan <ivan.doric@burza.hr>
Date: Sat, 12 Sep 2020 13:35:33 +0200
Subject: [PATCH] Next.js + Strapi - Add Data To Strapi From Next.js

---
 pages/add-movie.js | 63 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 63 insertions(+)
 create mode 100644 pages/add-movie.js

diff --git a/pages/add-movie.js b/pages/add-movie.js
new file mode 100644
index 0000000..eb8b300
--- /dev/null
+++ b/pages/add-movie.js
@@ -0,0 +1,63 @@
+import { Box } from 'reflexbox'
+import styled from '@emotion/styled'
+import getConfig from 'next/config'
+import { useState } from 'react'
+import { parseCookies  } from 'nookies'
+
+const { publicRuntimeConfig } = getConfig();
+
+function AddMovie() {
+    const [movieTitle, setMovieTitle] = useState('')
+    const [movieSlug, setMovieSlug] = useState('')
+
+    async function addMovie() {
+        const jwt = parseCookies().jwt
+
+        const movieInfo = {
+            movie_title: movieTitle,
+            slug: movieSlug
+        }
+
+        const add = await fetch(`${publicRuntimeConfig.API_URL}/movies`, {
+            method: "POST",
+            headers: {
+                'Authorization': `Bearer ${jwt}`,
+                'Accept': 'application/json',
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(movieInfo)
+        })
+
+        const addResponse = await add.json()
+
+        console.log(addResponse)
+        
+    }
+
+    return (
+        <AddMovieStyled>
+            <Box variant="container">
+                <Box as="h2" my={40}>
+                    Add movie 
+                </Box>
+
+                <form>
+                    <input type="text" onChange={e => setMovieTitle(e.target.value) } value={movieTitle}  placeholder="Movie title" /><br />
+                    <input type="text" onChange={e => setMovieSlug(e.target.value) } value={movieSlug} placeholder="Movie slug" /><br />
+                    <button type="button" onClick={() => addMovie() }>Add Movie</button>
+                </form>
+            </Box>
+         </AddMovieStyled>
+    )
+}
+
+const AddMovieStyled=styled.div`
+    input {
+        padding: 10px;
+        margin-bottom: 20px;
+        border: 1px solid #cccccc;
+        border-radius: 4px;
+    }
+`
+
+export default AddMovie
\ No newline at end of file