chore: fix types and add type lint command

Author: geotrev

package.json

@@ -12,7 +12,8 @@
     "prettier:check": "prettier --config .prettierrc.json --check",
     "prettier:write": "prettier --config .prettierrc.json --write",
     "eslint:check": "eslint -c .eslintrc.json",
-    "lint": "next lint"
+    "lint:types": "tsc --noEmit",
+    "lint": "npm run lint:types && next lint"
   },
   "repository": {
     "type": "git",

src/app/contribute/_components/submission-form.tsx

@@ -9,12 +9,17 @@ import {
   useCallback,
   useState,
 } from "react"
-import { TinaMarkdown } from "tinacms/dist/rich-text"
+import { Components, TinaMarkdown } from "tinacms/dist/rich-text"
 import { ContentBlocksContribute } from "@/tina/__generated__/types"
 
 const method = "POST"
 const headers = { "Content-Type": "application/json" }
 
+type MarkdownComponents =
+  | Components<object>
+  | Components<{ [x: string]: (props: object) => JSX.Element }>
+  | undefined
+
 const Field = ({
   isTextarea,
   ...fieldProps
@@ -118,9 +123,11 @@ export function SubmissionForm({ ...contentBlock }: ContentBlocksContribute) {
       <div className="my-12 rounded-md border-2 border-solid border-slate-800 p-5">
         <TinaMarkdown
           content={formSuccessMessage}
-          components={{
-            p: (props) => <p className="mb-4 text-success" {...props} />,
-          }}
+          components={
+            {
+              p: (props) => <p className="mb-4 text-success" {...props} />,
+            } as MarkdownComponents
+          }
         />
         <button className="btn btn-outline btn-sm" onClick={handleRefreshClick}>
           Submit Another Game ↻
@@ -134,16 +141,18 @@ export function SubmissionForm({ ...contentBlock }: ContentBlocksContribute) {
       <div className="rounded-md border-2 border-solid border-slate-800 p-5">
         <TinaMarkdown
           content={formHeader}
-          components={{
-            h2: (props) => (
-              <h2 className="mb-4 text-2xl font-bold" {...props} />
-            ),
-            p: (props) => <p className="mb-4" {...props} />,
-            ul: (props) => <ul className="list-disc ps-4" {...props} />,
-            hr: (props) => (
-              <div className="divider" role="separator" {...props} />
-            ),
-          }}
+          components={
+            {
+              h2: (props) => (
+                <h2 className="mb-4 text-2xl font-bold" {...props} />
+              ),
+              p: (props) => <p className="mb-4" {...props} />,
+              ul: (props) => <ul className="list-disc ps-4" {...props} />,
+              hr: (props) => (
+                <div className="divider" role="separator" {...props} />
+              ),
+            } as MarkdownComponents
+          }
         />
 
         {textFields?.map((field) => {