diff --git a/components/Document.js b/components/Document.js index a893528d..cc70c89e 100644 --- a/components/Document.js +++ b/components/Document.js @@ -7,13 +7,49 @@ function EditPage({ source: initialDocument }) { const [doc, setDoc] = React.useState(initialDocument); const { content, config, errors } = useMarkdocCode(doc); + const [docChanged, setDocChanged] = React.useState(false); + + const [prNumber, setPrNumber] = React.useState(null); + + const createPR = async () => { + const filename = window.CURRENT_FILENAME; + + const files = { + [filename]: doc + }; + + console.log(files); + + const body = JSON.stringify({ files }); + + const response = await fetch('/api/create-pr', { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body + }); + + const prNumber = await response.json(); + setPrNumber(prNumber); + + return prNumber; + }; + return ( <> {Markdoc.renderers.react(content.children, React, { components: config.components })} - - + + { + setDocChanged(true); + setDoc(...args); + }} + errors={errors} + /> ); diff --git a/components/EditPagePanel.js b/components/EditPagePanel.js index 3c65c6cd..4fa63bb1 100644 --- a/components/EditPagePanel.js +++ b/components/EditPagePanel.js @@ -3,7 +3,49 @@ import React from 'react'; const PATTERN = Buffer.from('NDI0Mg==', 'base64').toString(); const WIDTH = 55; -export function EditPagePanel({ children }) { +const MARKDOC_CLIENT_ID = '3a8716adbaa6294da1ec'; +function CreatePRButton({ createPR }) { + const [loading, setLoading] = React.useState(false); + + return ( +
+ + +
+ ); +} + +export function EditPagePanel({ docChanged, children, createPR }) { const [showEditor, setShowEditor] = React.useState(false); const [mouseOver, setMouseOver] = React.useState(false); const [keystrokes, setCount] = React.useState(0); @@ -71,6 +113,7 @@ export function EditPagePanel({ children }) { + {docChanged && }