adds eslint

packages/client/src/components/connect/ConnectComponent.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import {
   Alert,
   AlertIcon,
@@ -9,40 +8,41 @@ import {
   Link,
   List,
   ListItem,
-} from "@chakra-ui/react";
-import { MarkdownEditor } from "./MarkdownEditor";
-import { Fragment, useState } from "react";
+} from '@chakra-ui/react';
+import React, { Fragment, useState } from 'react';
+
+import { MarkdownEditor } from './MarkdownEditor';
 
 function ConnectComponent() {
   const [formData, setFormData] = useState({
-    markdown: "",
-    email: "",
-    firstname: "",
-    lastname: "",
+    markdown: '',
+    email: '',
+    firstname: '',
+    lastname: '',
   });
   const [isSubmitted, setIsSubmitted] = useState(false);
   const [isError, setIsError] = useState(false);
-  const [validationError, setValidationError] = useState("");
+  const [validationError, setValidationError] = useState('');
 
   const handleChange = (field: string) => (value: string) => {
-    setFormData((prev) => ({ ...prev, [field]: value }));
+    setFormData(prev => ({ ...prev, [field]: value }));
     setIsSubmitted(false);
-    setValidationError("");
+    setValidationError('');
   };
 
   const handleSubmitButton = async () => {
-    setValidationError("");
+    setValidationError('');
 
     if (!formData.email || !formData.firstname || !formData.markdown) {
-      setValidationError("Please fill in all required fields.");
+      setValidationError('Please fill in all required fields.');
       return;
     }
 
     try {
-      const response = await fetch("/api/contact", {
-        method: "POST",
+      const response = await fetch('/api/contact', {
+        method: 'POST',
         headers: {
-          "Content-Type": "application/json",
+          'Content-Type': 'application/json',
         },
         body: JSON.stringify(formData),
       });
@@ -51,10 +51,10 @@ function ConnectComponent() {
         setIsSubmitted(true);
         setIsError(false);
         setFormData({
-          markdown: "",
-          email: "",
-          firstname: "",
-          lastname: "",
+          markdown: '',
+          email: '',
+          firstname: '',
+          lastname: '',
         });
       } else {
         setIsError(true);
@@ -68,7 +68,7 @@ function ConnectComponent() {
     <Fragment>
       <List color="text.primary" mb={4}>
         <ListItem>
-          Email:{" "}
+          Email:{' '}
           <Link href="mailto:geoff@seemueller.io" color="teal.500">
             geoff@seemueller.io
           </Link>
@@ -79,14 +79,14 @@ function ConnectComponent() {
           <Input
             placeholder="First name *"
             value={formData.firstname}
-            onChange={(e) => handleChange("firstname")(e.target.value)}
+            onChange={e => handleChange('firstname')(e.target.value)}
             color="text.primary"
             borderColor="text.primary"
           />
           <Input
             placeholder="Last name *"
             value={formData.lastname}
-            onChange={(e) => handleChange("lastname")(e.target.value)}
+            onChange={e => handleChange('lastname')(e.target.value)}
             color="text.primary"
             borderColor="text.primary"
             // bg="text.primary"
@@ -95,13 +95,13 @@ function ConnectComponent() {
         <Input
           placeholder="Email *"
           value={formData.email}
-          onChange={(e) => handleChange("email")(e.target.value)}
+          onChange={e => handleChange('email')(e.target.value)}
           mb={4}
           borderColor="text.primary"
           color="text.primary"
         />
         <MarkdownEditor
-          onChange={handleChange("markdown")}
+          onChange={handleChange('markdown')}
           markdown={formData.markdown}
           placeholder="Your Message..."
         />
@@ -116,47 +116,32 @@ function ConnectComponent() {
         mb={4}
         float="right"
         _hover={{
-          bg: "",
-          transform: "scale(1.05)",
+          bg: '',
+          transform: 'scale(1.05)',
         }}
         _active={{
-          bg: "gray.800",
-          transform: "scale(1)",
+          bg: 'gray.800',
+          transform: 'scale(1)',
         }}
       >
         SEND
       </Button>
       <Box mt={12}>
         {isSubmitted && (
-          <Alert
-            status="success"
-            borderRadius="md"
-            color="text.primary"
-            bg="green.500"
-          >
+          <Alert status="success" borderRadius="md" color="text.primary" bg="green.500">
             <AlertIcon />
             Message sent successfully!
           </Alert>
         )}
 
         {isError && (
-          <Alert
-            status="error"
-            borderRadius="md"
-            color="text.primary"
-            bg="red.500"
-          >
+          <Alert status="error" borderRadius="md" color="text.primary" bg="red.500">
             <AlertIcon />
             There was an error sending your message. Please try again.
           </Alert>
         )}
         {validationError && (
-          <Alert
-            status="warning"
-            borderRadius="md"
-            color="background.primary"
-            bg="yellow.500"
-          >
+          <Alert status="warning" borderRadius="md" color="background.primary" bg="yellow.500">
             <AlertIcon />
             {validationError}
           </Alert>

packages/client/src/components/connect/MarkdownEditor.tsx

@@ -1,5 +1,5 @@
-import React from "react";
-import { Box, Textarea } from "@chakra-ui/react";
+import { Box, Textarea } from '@chakra-ui/react';
+import React from 'react';
 
 export const MarkdownEditor = (props: {
   placeholder: string;
@@ -11,7 +11,7 @@ export const MarkdownEditor = (props: {
       <Textarea
         value={props.markdown}
         placeholder={props.placeholder}
-        onChange={(e) => props.onChange(e.target.value)}
+        onChange={e => props.onChange(e.target.value)}
         width="100%"
         minHeight="150px"
         height="100%"