Fixed eslint & console errors

.gitignore

@@ -67,3 +67,6 @@ yarn-error.log
 .pnp.js
 # Yarn Integrity file
 .yarn-integrity
+
+# IDEs
+.idea/

content/pages/contact.json

@@ -15,19 +15,19 @@
         {
           "label": "Name",
           "inputType": "text",
-          "autocomplete": "name",
+          "autoComplete": "name",
           "_template": "nameInputBlock"
         },
         {
           "label": "Email",
           "inputType": "text",
-          "autocomplete": "email",
+          "autoComplete": "email",
           "_template": "emailInputBlock"
         },
         {
           "label": "Message",
           "inputType": "textarea",
-          "autocomplete": "",
+          "autoComplete": "",
           "_template": "messageInputBlock"
         }
       ],

content/pages/dummy.json

@@ -37,7 +37,7 @@
           "_template": "dummy",
           "label": "dummy",
           "inputType": "dummy",
-          "autocomplete": "dummy"
+          "autoComplete": "dummy"
         }
       ]
     }

content/pages/home.json

@@ -3,11 +3,11 @@
   "blocks": [
     {
       "_template": "ContentBlock",
-      "content": "## Umor bis\n\nAdit suo ait in olorinis portitor **undam tangentia** quibus Hectora invideatis cardine pressit fovet, _fuit_; nec barba sudantibus? Forte aliquis, ultaque et is inritamen velamina Clarium: [non](http://retiaque-in.io/). Inter pendentia eligit, sua fugam cumque. Domat ex nomina rogantum genitas delapsam: iam quae capillos facienda lanificae tectus solidorum. Seraque Medea, et exstinctique et conata **Cumarum** species ultra re cognita!\n\n## Nec qui esse indignatus rursus meo labor\n\nEt offensane vocato, vivebat Acrisioniades cinisque antiquus furit corripiens. Ab quoque, cum ponit circuitu resuscitat timor exspiravit corpore. Erat tenus et nocet, pervenit coniuge fibra feris sequentis pares membrana illa. Praelatus tumultus flores annos. Fidumque Acoetes.\n\n1. Vim remis\n2. Non haerebat teneas raptaturque marito huius\n3. Nomen carinas placato mora deprensi umbras\n4. Iole utque quoque\n5. Aedibus totumque timuere senex Argentea corpore Et tanti ficti _non_ removente lenimen _Crete vestigia_ in deus, Olenios velut. Agna fulget, gratia habitant fonti pignus. Cura modo sacra petatur non adligat placebant sic discubuere tamen caelestibus pendebat."
+      "content": "## Umor bis1\n\nAdit suo ait in olorinis portitor **undam tangentia** quibus Hectora invideatis cardine pressit fovet, _fuit_; nec barba sudantibus? Forte aliquis, ultaque et is inritamen velamina Clarium: [non](http://retiaque-in.io/). Inter pendentia eligit, sua fugam cumque. Domat ex nomina rogantum genitas delapsam: iam quae capillos facienda lanificae tectus solidorum. Seraque Medea, et exstinctique et conata **Cumarum** species ultra re cognita!\n\n## Nec qui esse indignatus rursus meo labor\n\nEt offensane vocato, vivebat Acrisioniades cinisque antiquus furit corripiens. Ab quoque, cum ponit circuitu resuscitat timor exspiravit corpore. Erat tenus et nocet, pervenit coniuge fibra feris sequentis pares membrana illa. Praelatus tumultus flores annos. Fidumque Acoetes.\n\n1. Vim remis\n2. Non haerebat teneas raptaturque marito huius\n3. Nomen carinas placato mora deprensi umbras\n4. Iole utque quoque\n5. Aedibus totumque timuere senex Argentea corpore Et tanti ficti _non_ removente lenimen _Crete vestigia_ in deus, Olenios velut. Agna fulget, gratia habitant fonti pignus. Cura modo sacra petatur non adligat placebant sic discubuere tamen caelestibus pendebat."
     }
   ],
   "hero": {
-    "headline": "Welcome to Tina Grande.",
+    "headline": "Welcome, Asim",
     "textline": "This template is filled with sample content to get you started.",
     "ctas": [
       {
@@ -27,5 +27,5 @@
     "large": true
   },
   "displayTitle": false,
-  "title": "Home"
+  "title": "Asim 123"
 }

content/settings/menu.json

@@ -16,8 +16,5 @@
       "label": "Contact",
       "link": "/contact"
     }
-  ],
-  "__gatsby_resolved": {
-    "fileRelativePath": "/content/settings/menu.json"
-  }
+  ]
 }

content/settings/site.json

@@ -2,8 +2,5 @@
   "logo": "Coffee",
   "title": "Tina Grande",
   "description": "Tina Grande is a feature rich Gatsby starter with full TinaCMS integration.",
-  "author": "TinaCMS",
-  "__gatsby_resolved": {
-    "fileRelativePath": "/content/settings/site.json"
-  }
+  "author": "TinaCMS"
 }

package.json

@@ -21,17 +21,17 @@
     "gatsby-plugin-robots-txt": "^1.5.0",
     "gatsby-plugin-sharp": "^2.2.31",
     "gatsby-plugin-styled-components": "^3.1.11",
-    "gatsby-plugin-tinacms": "^0.2.1",
-    "gatsby-plugin-transition-link": "^1.13.0",
+    "gatsby-plugin-tinacms": "^0.24.0",
+    "gatsby-plugin-transition-link": "^1.20.2",
     "gatsby-plugin-web-font-loader": "^1.0.4",
     "gatsby-remark-copy-linked-files": "^2.1.28",
     "gatsby-remark-images": "^3.1.28",
     "gatsby-remark-prismjs": "^3.3.20",
     "gatsby-remark-relative-images": "^0.3.0",
     "gatsby-source-filesystem": "^2.1.33",
-    "gatsby-tinacms-git": "^0.5.2",
-    "gatsby-tinacms-json": "^0.8.27",
-    "gatsby-tinacms-remark": "^0.8.2",
+    "gatsby-tinacms-git": "^0.27.1",
+    "gatsby-tinacms-json": "^0.27.1",
+    "gatsby-tinacms-remark": "^0.27.3",
     "gatsby-transformer-json": "^2.2.15",
     "gatsby-transformer-remark": "^2.6.30",
     "gatsby-transformer-sharp": "^2.2.23",
@@ -42,18 +42,18 @@
     "polished": "^3.4.1",
     "prismjs": "^1.17.1",
     "prop-types": "^15.7.2",
-    "react": "^16.10.2",
-    "react-dom": "^16.10.2",
-    "react-helmet": "^5.2.1",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "react-helmet": "^6.1.0",
     "react-slugify": "^2.0.1",
-    "react-textarea-autosize": "^7.1.2",
-    "react-tinacms-inline": "^0.4.6",
+    "react-textarea-autosize": "^8.2.0",
+    "react-tinacms-inline": "^0.27.3",
     "styled-components": ">=4.1",
-    "styled-icons": "^10.2.1",
-    "tinacms": "^0.21.1"
+    "styled-icons": "^10.16.0",
+    "tinacms": "^0.24.0"
   },
   "devDependencies": {
-    "prettier": "^2.0.4"
+    "prettier": "^2.0.5"
   },
   "keywords": [
     "gatsby"

src/blocks/form.js

@@ -14,8 +14,8 @@ export function Form({ form }) {
       {form.fields.map(field => {
         if (field.inputType === "textarea") {
           return (
-            <FormField wide>
-              <label for={slugify(field.label)}>{field.label}</label>
+            <FormField key={field.label} wide>
+              <label htmlFor={slugify(field.label)}>{field.label}</label>
               <textarea
                 cols="40"
                 rows="5"
@@ -26,22 +26,22 @@ export function Form({ form }) {
           )
         } else {
           return (
-            <FormField>
-              <label for={slugify(field.label)}>{field.label}</label>
+            <FormField key={field.label}>
+              <label htmlFor={slugify(field.label)}>{field.label}</label>
               <input
                 id={slugify(field.label)}
                 name={slugify(field.label)}
                 type={field.inputType}
-                autocorrect="off"
-                autocomplete={field.autocomplete | ``}
+                autoCorrect="off"
+                autoComplete={field.autoComplete | ``}
               />
             </FormField>
           )
         }
       })}
       {form.fields.length > 0 && (
-        <FormField wide>
-          <Button primary type="submit" value="Submit">
+        <FormField key="submit" wide>
+          <Button primary="true" type="submit" value="Submit">
             Submit
           </Button>
         </FormField>
@@ -57,7 +57,7 @@ const base = {
   fields: [
     { name: "label", label: "Label", component: "text" },
     { name: "inputType", label: "Input Type", component: "text" },
-    { name: "autocomplete", label: "Autocomplete", component: "text" },
+    { name: "autoComplete", label: "autoComplete", component: "text" },
   ],
 }
 
@@ -71,7 +71,7 @@ export const nameInputBlock = {
   defaultItem: {
     label: "Name",
     inputType: "text",
-    autocomplete: "name",
+    autoComplete: "name",
   },
   ...base,
 }
@@ -81,7 +81,7 @@ export const emailInputBlock = {
   defaultItem: {
     label: "Email",
     inputType: "text",
-    autocomplete: "email",
+    autoComplete: "email",
   },
   ...base,
 }
@@ -91,7 +91,7 @@ export const phoneInputBlock = {
   defaultItem: {
     label: "Phone",
     inputType: "text",
-    autocomplete: "tel",
+    autoComplete: "tel",
   },
   ...base,
 }
@@ -101,7 +101,7 @@ export const companyInputBlock = {
   defaultItem: {
     label: "Company",
     inputType: "text",
-    autocomplete: "organization",
+    autoComplete: "organization",
   },
   ...base,
 }
@@ -111,7 +111,7 @@ export const messageInputBlock = {
   defaultItem: {
     label: "Message",
     inputType: "textarea",
-    autocomplete: "",
+    autoComplete: "",
   },
   ...base,
 }

src/components/header.js

@@ -19,7 +19,7 @@ export const Header = styled(({ siteTitle, ...styleProps }) => {
                 {siteTitle}
               </SiteLink>
             </SiteTitle>
-            <Nav toggleDarkMode={toggleDarkMode} isDarkMode={isDarkMode} />
+            <Nav toggleDarkMode={toggleDarkMode} isdarkmode={isDarkMode} />
           </HeaderWrapper>
         </header>
       )}

src/components/hero.js

@@ -22,8 +22,8 @@ export const Hero = ({ hero }) => {
               <Actions>
                 {Object.keys(hero.ctas).map(key => {
                   return (
-                    <LinkButton
-                      primary={hero.ctas[key].primary}
+                    <LinkButton key={key}
+                      primary={hero.ctas[key].primary.toString()}
                       to={hero.ctas[key].link}
                     >
                       {hero.ctas[key].label}

src/components/nav.js

@@ -14,39 +14,39 @@ export const Nav = ({ toggleDarkMode, isDarkMode }) => {
     }
   `)
 
-  const [navOpen, setNavOpen] = useState(false)
-  const toggleNavOpen = () => {
-    setNavOpen(!navOpen)
+  const [navopen, setnavopen] = useState(false)
+  const togglenavopen = () => {
+    setnavopen(!navopen)
   }
 
   const menu = data.settingsJson
 
   return (
     <>
-      <StyledNavbar navOpen={navOpen} isDarkMode={isDarkMode}>
+      <StyledNavbar navopen={navopen.toString()} isdarkmode={isDarkMode}>
         {menu.menuItems.map(item => (
           <NavItem key={item.label}>
             <NavLink
-              onClick={toggleNavOpen}
+              onClick={togglenavopen}
               partiallyActive={item.link === "/" ? false : true}
               to={item.link}
             >
               {item.label}
             </NavLink>
           </NavItem>
         ))}
-        <NavItem>
+        <NavItem key="toggle-dark">
           <DarkModeToggle
             aria-label="Toggle Dark Theme"
             onClick={toggleDarkMode}
-            isDarkMode={isDarkMode}
+            isdarkmode={isDarkMode}
           />
         </NavItem>
       </StyledNavbar>
       <NavToggle
         aria-label="Toggle Nav"
-        onClick={toggleNavOpen}
-        navOpen={navOpen}
+        onClick={togglenavopen}
+        navopen={navopen.toString()}
       ></NavToggle>
     </>
   )
@@ -73,7 +73,7 @@ export const StyledNavbar = styled.ul`
     transition: all 150ms ${p => p.theme.easing};
     pointer-events: none;
     ${props =>
-      props.navOpen &&
+      props.navopen &&
       css`
         opacity: 1;
         pointer-events: all;
@@ -132,7 +132,7 @@ export const NavItem = styled.li`
 `
 
 export const NavLink = styled(({ children, ...styleProps }) => (
-  <Link activeClassName="active" {...styleProps} isCurrent>
+  <Link activeClassName="active" {...styleProps} iscurrent="true">
     <span>{children}</span>
   </Link>
 ))`
@@ -387,7 +387,7 @@ export const NavToggle = styled(({ menuOpen, ...styleProps }) => {
   }
 
   ${props =>
-    props.navOpen &&
+    props.navopen &&
     css`
       .open {
         display: block;

src/components/theme.js

@@ -82,7 +82,7 @@ export const Theme = ({ children }) => {
         {({ theme }) => (
           <ThemeProvider theme={theme}>
             <>
-              <TinaOverrideGlobalStyle primary={theme.color.primary} />
+              <TinaOverrideGlobalStyle primary={theme.color.primary.toString()} />
               <GlobalStyles />
               {children}
             </>

src/fields/authors.js

@@ -22,7 +22,7 @@ export const AuthorsField = (props) => {
       <AuthorsHeader>
         <FieldLabel>Authors</FieldLabel>
         <IconButton
-          primary
+          primary="true"
           small
           onClick={() => setVisible(!visible)}
           open={visible}
@@ -32,7 +32,7 @@ export const AuthorsField = (props) => {
         <AuthorMenu open={visible}>
           <AuthorMenuList>
             {authors.map((author) => (
-              <AuthorOption
+              <AuthorOption key={author.id}
                 onClick={() => {
                   addAuthor(author.id)
                   setVisible(false)
@@ -53,7 +53,7 @@ export const AuthorsField = (props) => {
             {authorIDs.map((authorID, index) => {
               const author = authors.find((author) => author.id === authorID)
               return (
-                <AuthorListItem
+                <AuthorListItem key={author.id}
                   author={author}
                   form={form}
                   field={field}

src/pages/404.js

@@ -0,0 +1,15 @@
+import React from "react"
+
+class NotFoundPage extends React.Component {
+  render() {
+    return (
+      <div>
+        <br /><br /><br />
+        <h1>Not Found</h1>
+        <p>You just hit a route that doesn&#39;t exist... the sadness.</p>
+      </div>
+    )
+  }
+}
+
+export default NotFoundPage

src/templates/list.js

@@ -10,15 +10,17 @@ import {
   MetaActions,
   DraftBadge,
 } from "../components/style"
-import { ListAuthors, AuthorsForm } from "../components/authors"
+import { ListAuthors } from "../components/authors"
+// import { ListAuthors, AuthorsForm } from "../components/authors" // currently unused AuthorsForm
 import { Link } from "gatsby"
 import { PageLayout } from "../components/pageLayout"
 
 export default function List({ data, pageContext }) {
   const [page] = useLocalJsonForm(data.page, ListForm)
-  const [authors] = useLocalJsonForm(data.authors, AuthorsForm)
+  // const [authors] = useLocalJsonForm(data.authors, AuthorsForm)  // currently unused
 
-  const { slug, limit, skip, numPages, currentPage } = pageContext
+  const { slug, numPages, currentPage } = pageContext
+  // const { slug, limit, skip, numPages, currentPage } = pageContext // some unused vars
   const isFirst = currentPage === 1
   const isLast = currentPage === numPages
   const prevPage =