From fb873fb96b87d74329f66d5a994ebb8d442dbd1f Mon Sep 17 00:00:00 2001 From: Medzik <8584366-Medzik@users.noreply.gitlab.com> Date: Wed, 4 Aug 2021 19:17:51 +0000 Subject: [PATCH] PingBot Functional --- gatsby-config.js | 3 +- package.json | 6 +- src/axios.js | 7 ++ src/components/seo.js | 66 ++++++++++++++ src/css/base.css | 51 +++++++++++ src/css/url.css | 73 +++++++++++++++ src/images/icon.png | Bin 11189 -> 0 bytes src/pages/404.js | 52 +++-------- src/pages/add.js | 81 +++++++++++++++++ src/pages/delete.js | 83 +++++++++++++++++ src/pages/index.js | 201 ++++++------------------------------------ yarn.lock | 62 ++++++++++++- 12 files changed, 463 insertions(+), 222 deletions(-) create mode 100644 src/axios.js create mode 100644 src/components/seo.js create mode 100644 src/css/base.css create mode 100644 src/css/url.css delete mode 100644 src/images/icon.png create mode 100644 src/pages/add.js create mode 100644 src/pages/delete.js diff --git a/gatsby-config.js b/gatsby-config.js index 1747b0e..23325df 100644 --- a/gatsby-config.js +++ b/gatsby-config.js @@ -2,6 +2,7 @@ module.exports = { siteMetadata: { siteUrl: "https://www.pingbot.cf", title: "Ping Bot", + description: "Ping Bot" }, plugins: [], -}; +} diff --git a/package.json b/package.json index 296c5d8..ff7dc84 100644 --- a/package.json +++ b/package.json @@ -15,8 +15,12 @@ "clean": "gatsby clean" }, "dependencies": { + "axios": "^0.21.1", "gatsby": "^3.10.2", + "prop-types": "^15.7.2", "react": "^17.0.1", - "react-dom": "^17.0.1" + "react-dom": "^17.0.1", + "react-helmet": "^6.1.0", + "react-notifications": "^1.7.2" } } diff --git a/src/axios.js b/src/axios.js new file mode 100644 index 0000000..71c0097 --- /dev/null +++ b/src/axios.js @@ -0,0 +1,7 @@ +import axios from 'axios' + +const instance = axios.create({ + baseURL: process.env.API_URL || 'https://backend.pingbot.cf/api', +}) + +export default instance diff --git a/src/components/seo.js b/src/components/seo.js new file mode 100644 index 0000000..bff1e3b --- /dev/null +++ b/src/components/seo.js @@ -0,0 +1,66 @@ +import React from "react" +import PropTypes from "prop-types" +import { Helmet } from "react-helmet" +import { useStaticQuery, graphql } from "gatsby" + +function Seo(props) { + const { site } = useStaticQuery( + graphql` + query { + site { + siteMetadata { + title + description + } + } + } + ` + ) + + const defaultDesc = props.description || site.siteMetadata.description + const defaultTitle = site.siteMetadata?.title + + return ( + + ) +} + +Seo.defaultProps = { + lang: "en", + meta: [], + embedColor: "#282c34" +} + +Seo.propTypes = { + description: PropTypes.string, + lang: PropTypes.string, + meta: PropTypes.arrayOf(PropTypes.object), + title: PropTypes.string, + embedColor: PropTypes.string +} + +export default Seo diff --git a/src/css/base.css b/src/css/base.css new file mode 100644 index 0000000..8052307 --- /dev/null +++ b/src/css/base.css @@ -0,0 +1,51 @@ +body { + color: #fff; + background-color: #111; + + margin: 0; + padding: 96px; + text-align: center; + + font-family: "-apple-system, Roboto, sans-serif, serif"; +} + +a, .link { + color: #61dafb; + cursor: pointer; + text-decoration: none; +} + +.url-link { + display: inline-block; + padding: 10px; +} + +.url-link a { + color: rgba(255, 255, 255, 0.712); +} + +button { + margin-top: 2rem; + padding: 10px 30px; + font-weight: bold; + border: 2px solid white; + color: white; + border-radius: 100px; + background: transparent; + transition: all 1000ms; +} + +.red-button { + border: 2px solid red; + color: red; +} + +.yellow-button { + border: 2px solid greenyellow; + color: greenyellow; +} + +.blue-buton { + border: 2px solid blue; + color: blue; +} diff --git a/src/css/url.css b/src/css/url.css new file mode 100644 index 0000000..40e28f3 --- /dev/null +++ b/src/css/url.css @@ -0,0 +1,73 @@ +form { + --text-color: #afafaf; +} + +.input { + outline: none; + border: none; + overflow: hidden; + margin: 0; + width: 100%; + padding: 0.25rem 0; + background: none; + color: white; + font-size: 1.2em; + font-weight: bold; + transition: border 500ms; +} + +.input:valid { + color: yellowgreen; +} + +.input:invalid { + color: orangered; +} + +/* Border animation */ +.field::after { + content: ""; + position: relative; + display: block; + height: 4px; + width: 100%; + background: #d16dff; + transform: scaleX(0); + transform-origin: 0%; + opacity: 0; + transition: all 500ms ease; + top: 2px; +} + +.field:focus-within { + border-color: transparent; +} + +.field:focus-within::after { + transform: scaleX(1); + opacity: 1; +} + +/* Label animation */ +.label { + z-index: -1; + position: absolute; + transform: translateY(-2rem); + transform-origin: 0%; + transition: transform 400ms; +} + +.field:focus-within .label, +.input:not(:placeholder-shown) + .label { + transform: scale(0.8) translateY(-5rem); + opacity: 1; +} + +button:disabled { + border-color: var(--text-color); + color: var(--text-color); +} + +button:hover { + cursor: pointer; +} diff --git a/src/images/icon.png b/src/images/icon.png deleted file mode 100644 index 38b2fb0e467e023806c846454e35ede8af67105e..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 11189 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 R^|Id+(7vmu{#Fee^?z+!bVL9E diff --git a/src/pages/404.js b/src/pages/404.js index 053ae0e..2a9d439 100644 --- a/src/pages/404.js +++ b/src/pages/404.js @@ -1,53 +1,21 @@ -import * as React from "react" +import React from "react" import { Link } from "gatsby" -// styles -const pageStyles = { - color: "#232129", - padding: "96px", - fontFamily: "-apple-system, Roboto, sans-serif, serif", -} -const headingStyles = { - marginTop: 0, - marginBottom: 64, - maxWidth: 320, -} +import "../css/base.css" -const paragraphStyles = { - marginBottom: 48, -} -const codeStyles = { - color: "#8A6534", - padding: 4, - backgroundColor: "#FFF4DB", - fontSize: "1.25rem", - borderRadius: 4, -} - -// markup const NotFoundPage = () => { return ( -
+ <> Not found -

Page not found

-

- Sorry{" "} - - 😔 - {" "} - we couldn’t find what you were looking for. +

Page not found

+

+ Sorry we couldn’t find what you were looking for.
- {process.env.NODE_ENV === "development" ? ( - <> -
- Try creating a page in src/pages/. -
- - ) : null} -
- Go home. + + +

-
+ ) } diff --git a/src/pages/add.js b/src/pages/add.js new file mode 100644 index 0000000..d2ae319 --- /dev/null +++ b/src/pages/add.js @@ -0,0 +1,81 @@ +import React from "react" +import { Link } from "gatsby" +import { NotificationManager, NotificationContainer } from 'react-notifications' +import 'react-notifications/lib/notifications.css' + +import Seo from "../components/seo" +import axios from "../axios" + +import "../css/base.css" +import "../css/url.css" + +const AddURLPage = () => { + const [url, setURL] = React.useState('') + + const changeURLHandler = event => { + const value = event.target.value + setURL(value) + } + + const addURL = async () => { + setURL('') + + if (url === '') { + return NotificationManager.error('Empty') + } + + try { + const res = await axios.post('/url', { + url: url, + }) + + const data = res.data + + NotificationManager.success(data.url, 'Added') + } catch (err) { + let e = '' + + if (err.response && err.response.data.message) { + e = err.response.data.message + } else { + e = err.toString() + } + + NotificationManager.error(e) + } + } + + return ( + <> + + + + +
+ +
+ + + +
+ + + + + + ) +} + +export default AddURLPage diff --git a/src/pages/delete.js b/src/pages/delete.js new file mode 100644 index 0000000..ad83337 --- /dev/null +++ b/src/pages/delete.js @@ -0,0 +1,83 @@ +import React from "react" +import { Link } from "gatsby" +import { NotificationManager, NotificationContainer } from 'react-notifications' +import 'react-notifications/lib/notifications.css' + +import Seo from "../components/seo" +import axios from "../axios" + +import "../css/base.css" +import "../css/url.css" + +const DeleteURLPage = () => { + const [url, setURL] = React.useState('') + + const changeURLHandler = event => { + const value = event.target.value + setURL(value) + } + + const deleteURL = async () => { + setURL('') + + if (url === '') { + return NotificationManager.error('Empty') + } + + try { + const id = btoa(url) + + console.log(`/url/${id}`) + + const res = await axios.delete(`/url/${id}`) + + const data = res.data + + NotificationManager.success(data.url, 'Deleted') + } catch (err) { + let e = '' + + if (err.response && err.response.data.message) { + e = err.response.data.message + } else { + e = err.toString() + } + + NotificationManager.error(e) + } + } + + return ( + <> + + + + +
+ +
+ + + +
+ + + + + + ) +} + +export default DeleteURLPage diff --git a/src/pages/index.js b/src/pages/index.js index dbc0fb9..f919284 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -1,184 +1,33 @@ -import * as React from "react" +import React from "react" +import { Link } from "gatsby" +import { NotificationContainer } from 'react-notifications' -// styles -const pageStyles = { - color: "#232129", - padding: 96, - fontFamily: "-apple-system, Roboto, sans-serif, serif", -} -const headingStyles = { - marginTop: 0, - marginBottom: 64, - maxWidth: 320, -} -const headingAccentStyles = { - color: "#663399", -} -const paragraphStyles = { - marginBottom: 48, -} -const codeStyles = { - color: "#8A6534", - padding: 4, - backgroundColor: "#FFF4DB", - fontSize: "1.25rem", - borderRadius: 4, -} -const listStyles = { - marginBottom: 96, - paddingLeft: 0, -} -const listItemStyles = { - fontWeight: 300, - fontSize: 24, - maxWidth: 560, - marginBottom: 30, -} +import Seo from "../components/seo" -const linkStyle = { - color: "#8954A8", - fontWeight: "bold", - fontSize: 16, - verticalAlign: "5%", -} +import "../css/base.css" -const docLinkStyle = { - ...linkStyle, - listStyleType: "none", - marginBottom: 24, -} - -const descriptionStyle = { - color: "#232129", - fontSize: 14, - marginTop: 10, - marginBottom: 0, - lineHeight: 1.25, -} - -const docLink = { - text: "Documentation", - url: "https://www.gatsbyjs.com/docs/", - color: "#8954A8", -} - -const badgeStyle = { - color: "#fff", - backgroundColor: "#088413", - border: "1px solid #088413", - fontSize: 11, - fontWeight: "bold", - letterSpacing: 1, - borderRadius: 4, - padding: "4px 6px", - display: "inline-block", - position: "relative", - top: -2, - marginLeft: 10, - lineHeight: 1, -} - -// data -const links = [ - { - text: "Tutorial", - url: "https://www.gatsbyjs.com/docs/tutorial/", - description: - "A great place to get started if you're new to web development. Designed to guide you through setting up your first Gatsby site.", - color: "#E95800", - }, - { - text: "How to Guides", - url: "https://www.gatsbyjs.com/docs/how-to/", - description: - "Practical step-by-step guides to help you achieve a specific goal. Most useful when you're trying to get something done.", - color: "#1099A8", - }, - { - text: "Reference Guides", - url: "https://www.gatsbyjs.com/docs/reference/", - description: - "Nitty-gritty technical descriptions of how Gatsby works. Most useful when you need detailed information about Gatsby's APIs.", - color: "#BC027F", - }, - { - text: "Conceptual Guides", - url: "https://www.gatsbyjs.com/docs/conceptual/", - description: - "Big-picture explanations of higher-level Gatsby concepts. Most useful for building understanding of a particular topic.", - color: "#0D96F2", - }, - { - text: "Plugin Library", - url: "https://www.gatsbyjs.com/plugins", - description: - "Add functionality and customize your Gatsby site or app with thousands of plugins built by our amazing developer community.", - color: "#8EB814", - }, - { - text: "Build and Host", - url: "https://www.gatsbyjs.com/cloud", - badge: true, - description: - "Now you’re ready to show the world! Give your Gatsby site superpowers: Build and host on Gatsby Cloud. Get started for free!", - color: "#663399", - }, -] - -// markup -const IndexPage = () => { +const LoginPage = () => { return ( -
- Home Page -

- Congratulations -
- — you just made a Gatsby site! - - 🎉🎉🎉 - -

-

- Edit src/pages/index.js to see this page - update in real-time.{" "} - - 😎 - -

- - Gatsby G Logo + -
+ + + +
+ + + +
+ +
+ + + +
+ ) } -export default IndexPage +export default LoginPage diff --git a/yarn.lock b/yarn.lock index 1d41914..8fd5672 100644 --- a/yarn.lock +++ b/yarn.lock @@ -999,7 +999,7 @@ core-js-pure "^3.16.0" regenerator-runtime "^0.13.4" -"@babel/runtime@^7.10.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.14.6", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2": +"@babel/runtime@^7.10.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.14.6", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2": version "7.14.8" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.8.tgz#7119a56f421018852694290b9f9148097391b446" integrity sha512-twj3L8Og5SaCRCErB4x4ajbvBIVV77CGeFglHpeg5WC5FF8TZzBWXtTJ4MqaD9QszLYTtr+IsaAL2rEUevb+eg== @@ -1874,6 +1874,11 @@ acorn-jsx@^5.0.0, acorn-jsx@^5.3.1: resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937" integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ== +acorn@6.4.1: + version "6.4.1" + resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.4.1.tgz#531e58ba3f51b9dacb9a6646ca4debf5b14ca474" + integrity sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA== + acorn@^7.4.0: version "7.4.1" resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa" @@ -2777,6 +2782,11 @@ class-utils@^0.3.5: isobject "^3.0.0" static-extend "^0.1.1" +classnames@^2.1.1: + version "2.3.1" + resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e" + integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA== + clean-stack@^2.0.0: version "2.2.0" resolved "https://registry.yarnpkg.com/clean-stack/-/clean-stack-2.2.0.tgz#ee8472dbb129e727b31e8a10a427dee9dfe4008b" @@ -3616,6 +3626,14 @@ dom-converter@^0.2.0: dependencies: utila "~0.4" +dom-helpers@^5.0.1: + version "5.2.1" + resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902" + integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA== + dependencies: + "@babel/runtime" "^7.8.7" + csstype "^3.0.2" + dom-serializer@^1.0.1: version "1.3.2" resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-1.3.2.tgz#6206437d32ceefaec7161803230c7a20bc1b4d91" @@ -8177,7 +8195,7 @@ prompts@^2.3.2: kleur "^3.0.3" sisteransi "^1.0.5" -prop-types@^15.6.1, prop-types@^15.7.2: +prop-types@^15.5.10, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2: version "15.7.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ== @@ -8388,6 +8406,21 @@ react-error-overlay@^6.0.9: resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.9.tgz#3c743010c9359608c375ecd6bc76f35d93995b0a" integrity sha512-nQTTcUu+ATDbrSD1BZHr5kgSD4oF8OFjxun8uAaL8RwPBacGBNPf/yAuVVdx17N8XNzRDMrZ9XcKZHCjPW+9ew== +react-fast-compare@^3.1.1: + version "3.2.0" + resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb" + integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA== + +react-helmet@^6.1.0: + version "6.1.0" + resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-6.1.0.tgz#a750d5165cb13cf213e44747502652e794468726" + integrity sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw== + dependencies: + object-assign "^4.1.1" + prop-types "^15.7.2" + react-fast-compare "^3.1.1" + react-side-effect "^2.1.0" + react-is@^16.12.0, react-is@^16.8.1: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" @@ -8398,11 +8431,36 @@ react-lifecycles-compat@^3.0.4: resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA== +react-notifications@^1.7.2: + version "1.7.2" + resolved "https://registry.yarnpkg.com/react-notifications/-/react-notifications-1.7.2.tgz#e70e2c053f86321c0a7fa81ff638922e2fdd572f" + integrity sha512-3mlMiNLDQtp64IP+EnYx3xgmbdpzrLQiSO8AP+8o4LiYQC6HcgdVB+MMdGuYZ1ttfKeLgTgol2ESFQJhmz0O3Q== + dependencies: + acorn "6.4.1" + classnames "^2.1.1" + prop-types "^15.5.10" + react-transition-group "^4.4.1" + react-refresh@^0.9.0: version "0.9.0" resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.9.0.tgz#71863337adc3e5c2f8a6bfddd12ae3bfe32aafbf" integrity sha512-Gvzk7OZpiqKSkxsQvO/mbTN1poglhmAV7gR/DdIrRrSMXraRQQlfikRJOr3Nb9GTMPC5kof948Zy6jJZIFtDvQ== +react-side-effect@^2.1.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-2.1.1.tgz#66c5701c3e7560ab4822a4ee2742dee215d72eb3" + integrity sha512-2FoTQzRNTncBVtnzxFOk2mCpcfxQpenBMbk5kSVBg5UcPqV9fRbgY2zhb7GTWWOlpFmAxhClBDlIq8Rsubz1yQ== + +react-transition-group@^4.4.1: + version "4.4.2" + resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.2.tgz#8b59a56f09ced7b55cbd53c36768b922890d5470" + integrity sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg== + dependencies: + "@babel/runtime" "^7.5.5" + dom-helpers "^5.0.1" + loose-envify "^1.4.0" + prop-types "^15.6.2" + react@^17.0.1: version "17.0.2" resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"