moved from go to react, and added a better cssHEADmaster

1 files changed, 51 insertions, 0 deletions

diff --git a/web_page/webpage-shorlink/src/components/AddUrl.jsx b/web_page/webpage-shorlink/src/components/AddUrl.jsx
new file mode 100644
index 0000000..1112459
--- /dev/null
+++ b/web_page/webpage-shorlink/src/components/AddUrl.jsx
@@ -0,0 +1,51 @@
+import "./AddUrl.css";
+
+function AddUrl({ setShort }) {
+  return (
+    <div>
+      <h1 id="title">ENCURTADOR DE URL</h1>
+      <form
+        id="id-form"
+        method="post"
+        onSubmit={(e) => {
+          e.preventDefault();
+
+          const form = e.target;
+          const formData = new FormData(form);
+          const formJson = Object.fromEntries(formData.entries());
+          let data = formJson["url"];
+
+          fetch("https://sl.azuminha.com/add/" + encodeURIComponent(data))
+            .then((response) => {
+              if (!response.ok) {
+                throw new Error("Network response was not ok");
+              }
+              return response.text();
+            })
+            .then((result) => {
+              console.log(result);
+              setShort("sl.azuminha.com/" + result);
+              //const res = document.createElement("p");
+              //res.textContent = data + " => " + "sl.azuminha.com/" + result;
+              //document.body.appendChild(res);
+            });
+        }}
+      >
+        <label id="id-label">
+          URL:
+          <input name="url" id="inp" type="text" />
+        </label>
+        <button
+          id="btn1"
+          onClick={() => {
+            console.log("OLA");
+          }}
+        >
+          enviar
+        </button>
+      </form>
+    </div>
+  );
+}
+
+export default AddUrl;