Merge pull request #157 from codecoolture/removing-contact-form

Remove ContactForm and a few Netlify-related packages

Author: sergioalvz

layouts/Page/components/ContactForm/Field.tsx

@@ -1,4 +1,3 @@
-import { ContactForm } from "./components/ContactForm";
 import { Footer } from "./components/Footer";
 import { Header } from "./components/Header";
 import { Heading } from "./components/Heading";
@@ -16,8 +15,6 @@ export function Page({ children }: PageProps) {
 
 Page.Header = Header;
 
-Page.ContactForm = ContactForm;
-
 Page.Footer = Footer;
 
 Page.Heading = Heading;

layouts/Page/components/ContactForm/index.tsx

@@ -7,17 +7,13 @@
   "dependencies": {
     "@radix-ui/colors": "0.1.8",
     "fathom-client": "3.5.0",
-    "formik": "2.2.9",
     "next": "12.0.8",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-hot-toast": "2.3.0",
     "react-icons": "4.4.0",
-    "sharp": "0.30.7",
     "yup": "0.32.11"
   },
   "devDependencies": {
-    "@netlify/plugin-nextjs": "4.2.1",
     "@next/eslint-plugin-next": "12.0.8",
     "@testing-library/cypress": "8.0.3",
     "@types/jest": "27.5.2",

layouts/Page/components/ContactForm/style.css

@@ -1,7 +1,6 @@
 import { AppProps } from "next/app";
 import Head from "next/head";
 import React from "react";
-import { Toaster } from "react-hot-toast";
 import { useFathom } from "../hooks";
 import "../styles/index.css";
 
@@ -21,8 +20,6 @@ export default function MyApp({ Component, pageProps }: AppProps) {
       </Head>
 
       <Component {...pageProps} />
-
-      <Toaster />
     </React.Fragment>
   );
 }

layouts/Page/index.tsx

@@ -134,9 +134,11 @@ export default function Homepage() {
             product teams at different startups.
           </Page.Text>
 
+          <Page.Subheading>Contact</Page.Subheading>
+
           <Page.Text>
-            If you would like to hire this technical training, please use the form below or drop me a line at
-            hola@codecoolture.com.
+            Would you like to hire this technical training? Please drop me a line at{" "}
+            <strong>hola@codecoolture.com</strong> and tell me about your team and the projects you are working on!
           </Page.Text>
 
           <Page.Subheading>Published material</Page.Subheading>
@@ -164,33 +166,6 @@ export default function Homepage() {
               : Template to (deliberate) practice your test-driven development skills.
             </List.Item>
           </List>
-
-          <Page.Subheading>Contact</Page.Subheading>
-
-          <Page.ContactForm onSuccessMessage="Thank you! I will respond to you promptly.">
-            <Page.ContactForm.Field name="email">
-              <Page.ContactForm.Field.Label>Your email</Page.ContactForm.Field.Label>
-
-              <Page.ContactForm.Field.Hint>Use an email where you want to receive my reply</Page.ContactForm.Field.Hint>
-
-              <Page.ContactForm.Field.Input />
-
-              <Page.ContactForm.Field.Error>Please, use a valid email.</Page.ContactForm.Field.Error>
-            </Page.ContactForm.Field>
-
-            <Page.ContactForm.Field name="message">
-              <Page.ContactForm.Field.Label>Your message</Page.ContactForm.Field.Label>
-
-              <Page.ContactForm.Field.Hint>
-                This is <strong>optional</strong>. You may use it to ask for more information, tell me about your
-                project, or say hi :-)
-              </Page.ContactForm.Field.Hint>
-
-              <Page.ContactForm.Field.TextArea numberOfRows={5} />
-            </Page.ContactForm.Field>
-
-            <Page.ContactForm.Submit>Send your message</Page.ContactForm.Submit>
-          </Page.ContactForm>
         </Page.Row>
       </Page.Main>
 

package.json

@@ -140,9 +140,12 @@ export default function Homepage() {
             ingeniería del software (continuous deployment, test-driven development, trunk-based development).
           </Page.Text>
 
+          <Page.Subheading>¿Hablamos?</Page.Subheading>
+
           <Page.Text>
-            Si quieres contratar esta formación para tu empresa, escríbeme un mensaje utilizando el formulario a
-            continuación y te responderé lo antes posible. También puedes escribirme un email a hola@codecoolture.com.
+            Si quieres contratar esta formación para tu empresa, escríbeme un mensaje a{" "}
+            <strong>hola@codecoolture.com</strong> y cuéntame un poco sobre tu equipo y los proyectos en los que estáis
+            trabajando.
           </Page.Text>
 
           <Page.Subheading>Material publicado</Page.Subheading>
@@ -170,33 +173,6 @@ export default function Homepage() {
               : plantilla para practicar TDD en aplicaciones JavaScript
             </List.Item>
           </List>
-
-          <Page.Subheading>¿Hablamos?</Page.Subheading>
-
-          <Page.ContactForm onSuccessMessage="¡Gracias! Mensaje recibido.">
-            <Page.ContactForm.Field name="email">
-              <Page.ContactForm.Field.Label>Tu email</Page.ContactForm.Field.Label>
-
-              <Page.ContactForm.Field.Hint>Lo utilizaré para responderte</Page.ContactForm.Field.Hint>
-
-              <Page.ContactForm.Field.Input />
-
-              <Page.ContactForm.Field.Error>Por favor, introduce un email válido.</Page.ContactForm.Field.Error>
-            </Page.ContactForm.Field>
-
-            <Page.ContactForm.Field name="message">
-              <Page.ContactForm.Field.Label>Mensaje</Page.ContactForm.Field.Label>
-
-              <Page.ContactForm.Field.Hint>
-                Este campo es <strong>opcional</strong>, pero puedes utilizarlo para contarme algo sobre ti o,
-                simplemente, saludar :-)
-              </Page.ContactForm.Field.Hint>
-
-              <Page.ContactForm.Field.TextArea numberOfRows={5} />
-            </Page.ContactForm.Field>
-
-            <Page.ContactForm.Submit>Enviar tu mensaje</Page.ContactForm.Submit>
-          </Page.ContactForm>
         </Page.Row>
       </Page.Main>
 

pages/_app.tsx

@@ -15,7 +15,6 @@
 @import "../components/Underline/style.css";
 
 @import "../layouts/Page/style.css";
-@import "../layouts/Page/components/ContactForm/style.css";
 @import "../layouts/Page/components/Header/style.css";
 @import "../layouts/Page/components/Heading/style.css";
 @import "../layouts/Page/components/Footer/style.css";