refactor: fix typecheck errors and add script execution to CI (#1103)

* refactor: fix typecheck errors and add script execution to CI

* ci: add `typecheck:ci` script

Author: marcalexiei

.github/workflows/ci.yml

@@ -20,7 +20,7 @@ jobs:
     strategy:
       fail-fast: true
       matrix:
-        script: [format, lint]
+        script: ["format", "lint", "typecheck:ci"]
 
     steps:
       - name: Checkout repo

package.json

@@ -66,6 +66,7 @@
     "now-build": "pnpm run build",
     "start": "next start",
     "typecheck": "tsc --noEmit",
+    "typecheck:ci": "next build --no-lint && tsc --noEmit",
     "prepare": "husky install"
   },
   "lint-staged": {

src/components/BuilderPage.tsx

@@ -4,6 +4,7 @@ import { Animate } from "react-simple-animate"
 import { useForm } from "react-hook-form"
 import SortableContainer from "./SortableContainer"
 import { useStateMachine } from "little-state-machine"
+import type { GlobalState } from "little-state-machine"
 import colors from "../styles/colors"
 import generateCode from "./logic/generateCode"
 import copyClipBoard from "./utils/copyClipBoard"
@@ -65,7 +66,7 @@ function BuilderPage({
     useForm()
   const errors = formState.errors
   const [editIndex, setEditIndex] = useState(-1)
-  const copyFormData = useRef([])
+  const copyFormData = useRef<GlobalState["formData"]>([])
   const closeButton = useRef<HTMLButtonElement>(null)
   const [showValidation, toggleValidation] = useState(false)
   const onSubmit = (data) => {
@@ -90,7 +91,7 @@ function BuilderPage({
     editFormData.minLength ||
     editFormData.required
   copyFormData.current = formData
-  const editIndexRef = useRef(null)
+  const editIndexRef = useRef<number | null>(null)
   editIndexRef.current = editIndex
   const router = useRouter()
 
@@ -440,7 +441,7 @@ function BuilderPage({
               aria-label="close builder"
               ref={closeButton}
               onClick={() => {
-                toggleBuilder(false)
+                toggleBuilder?.(false)
                 goToBuilder(false)
               }}
             >

src/components/mdx/theme.ts

@@ -1,5 +1,4 @@
-// @ts-expect-error currently not being exported https://github.com/FormidableLabs/prism-react-renderer/issues/206
-import { PrismTheme } from "prism-react-renderer"
+import type { PrismTheme } from "prism-react-renderer"
 
 export const theme: PrismTheme = {
   plain: {