{"ast":null,"code":"var _jsxFileName = \"/Users/shoofle/Projects/the-forest/src/PageView.jsx\",\n _s = $RefreshSig$();\nimport logo from './logo.svg';\nimport { App } from './App.js';\nimport './App.css';\nimport { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';\nimport { useParams } from 'react-router-dom';\nimport { useState } from 'react';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst url = \"http://127.0.0.1:8000\";\nfunction setCurrentPage(row) {\n console.log(\"\" + row[0] + \" \" + row[1] + \" \" + row[2]);\n}\nfunction PageView() {\n _s();\n const queryClient = useQueryClient();\n const {\n pagenumber\n } = useParams();\n const [text_of_page, setBodyText] = useState(\"Not loaded yet\");\n const {\n isPending,\n error,\n data\n } = useQuery({\n // fetch the currrent values\n queryKey: ['page', pagenumber],\n queryFn: () => fetch(url, {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify({\n statements: [{\n q: 'select id, title, description from pages where id=?',\n params: [pagenumber]\n }]\n })\n }).then(res => res.json()).then(data => data[0].results.rows[0]).then(row => {\n setBodyText(row[2]);\n return row;\n })\n });\n const mutation = useMutation({\n // for changing the value when we're done with it\n mutationFn: ({\n id,\n title,\n text\n }) => {\n console.log(\"trying to mutate with values \" + id + \" \" + title + \" \" + text);\n fetch(url, {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify({\n statements: [{\n q: 'replace into pages (id, title, description) values (?, ?, ?)',\n params: [id, title, text]\n }]\n })\n }).then(res => {\n console.log(\"tried to update!\", res.json());\n });\n console.log(\"made the request\");\n },\n onSettled: async () => {\n // Invalidate and refetch\n await queryClient.invalidateQueries({\n queryKey: ['page', pagenumber]\n });\n }\n });\n function handleSubmit(e) {\n e.preventDefault();\n const data = e.target.querySelector('pre')[0].innerHTML;\n const formData = new FormData(e.target);\n mutation.mutate({\n id: pagenumber,\n title: page_title,\n text: data\n });\n }\n if (isPending) return \"Loading...\";\n if (error) return \"Uh oh!\";\n const [the_id, page_title, page_text] = data;\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"App\",\n children: /*#__PURE__*/_jsxDEV(\"form\", {\n onSubmit: handleSubmit,\n children: /*#__PURE__*/_jsxDEV(\"header\", {\n className: \"App-header\",\n children: [/*#__PURE__*/_jsxDEV(\"img\", {\n src: logo,\n className: \"App-logo\",\n alt: \"logo\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 81,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"Page-title\",\n children: /*#__PURE__*/_jsxDEV(\"h3\", {\n children: [the_id, \". \", page_title]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 83,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 82,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"Page-contents\",\n children: /*#__PURE__*/_jsxDEV(\"pre\", {\n contentEditable: \"true\",\n onChange: e => setBodyText(e.target.value),\n dangerouslySetInnerHTML: {\n __html: text_of_page\n }\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 86,\n columnNumber: 13\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 85,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"button\", {\n type: \"submit\",\n disabled: mutation.isPending,\n children: mutation.isPending ? \"Updating...\" : \"Update\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 91,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 80,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 79,\n columnNumber: 7\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 78,\n columnNumber: 5\n }, this);\n}\n_s(PageView, \"KupU9g1XDxE/1/oBXTWGPEyWlPY=\", false, function () {\n return [useQueryClient, useParams, useQuery, useMutation];\n});\n_c = PageView;\nexport default PageView;\nvar _c;\n$RefreshReg$(_c, \"PageView\");","map":{"version":3,"names":["logo","App","useQuery","useMutation","useQueryClient","useParams","useState","jsxDEV","_jsxDEV","url","setCurrentPage","row","console","log","PageView","_s","queryClient","pagenumber","text_of_page","setBodyText","isPending","error","data","queryKey","queryFn","fetch","method","headers","body","JSON","stringify","statements","q","params","then","res","json","results","rows","mutation","mutationFn","id","title","text","onSettled","invalidateQueries","handleSubmit","e","preventDefault","target","querySelector","innerHTML","formData","FormData","mutate","page_title","the_id","page_text","className","children","onSubmit","src","alt","fileName","_jsxFileName","lineNumber","columnNumber","contentEditable","onChange","value","dangerouslySetInnerHTML","__html","type","disabled","_c","$RefreshReg$"],"sources":["/Users/shoofle/Projects/the-forest/src/PageView.jsx"],"sourcesContent":["import logo from './logo.svg';\nimport { App } from './App.js';\nimport './App.css';\nimport { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';\nimport { useParams } from 'react-router-dom';\nimport { useState } from 'react';\n\nconst url = \"http://127.0.0.1:8000\"\n\nfunction setCurrentPage(row) {\n console.log(\"\" + row[0] + \" \" + row[1] + \" \" + row[2]);\n}\n\nfunction PageView() {\n const queryClient = useQueryClient();\n const { pagenumber } = useParams();\n const [ text_of_page, setBodyText ] = useState(\"Not loaded yet\");\n\n const { isPending, error, data } = useQuery({ // fetch the currrent values\n queryKey: ['page', pagenumber],\n queryFn: () =>\n fetch(url, {\n method: 'POST',\n headers: {'Content-Type': 'application/json'},\n body: JSON.stringify({\n statements: [{\n q: 'select id, title, description from pages where id=?',\n params: [pagenumber]\n }]\n })\n }).then((res) => res.json())\n .then((data) => data[0].results.rows[0])\n .then((row) => {\n setBodyText(row[2]);\n return row;\n })\n })\n\n const mutation = useMutation({ // for changing the value when we're done with it\n mutationFn: ({id, title, text}) => {\n console.log(\"trying to mutate with values \" + id + \" \" + title + \" \" + text);\n fetch(url, {\n method: 'POST',\n headers: {'Content-Type': 'application/json'},\n body: JSON.stringify({\n statements: [{\n q: 'replace into pages (id, title, description) values (?, ?, ?)',\n params: [id, title, text],\n }]\n })\n }).then((res) => { console.log(\"tried to update!\", res.json()) });\n console.log(\"made the request\");\n },\n onSettled: async () => {\n // Invalidate and refetch\n await queryClient.invalidateQueries({ queryKey: ['page', pagenumber] })\n },\n });\n\n function handleSubmit(e) {\n e.preventDefault()\n const data = e.target.querySelector('pre')[0].innerHTML\n const formData = new FormData(e.target);\n mutation.mutate({\n id: pagenumber, \n title: page_title, \n text: data,\n });\n }\n\n if (isPending) return \"Loading...\";\n\n if (error) return \"Uh oh!\";\n\n const [the_id, page_title, page_text] = data;\n\n return (\n