✨ [docs] Add Giscus comments to Docs

docs/package.json

@@ -16,6 +16,7 @@
   "dependencies": {
     "@docusaurus/core": "^3.4.0",
     "@docusaurus/preset-classic": "^3.4.0",
+    "@giscus/react": "^3.0.0",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
     "prism-react-renderer": "^2.3.1",
@@ -24,6 +25,7 @@
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "^3.4.0",
+    "@docusaurus/tsconfig": "^3.4.0",
     "@docusaurus/types": "^3.4.0"
   },
   "browserslist": {

docs/src/theme/DocItem/Footer.tsx

@@ -0,0 +1,30 @@
+import { useColorMode } from '@docusaurus/theme-common'
+import type { WrapperProps } from '@docusaurus/types'
+import Giscus from '@giscus/react'
+import Footer from '@theme-original/DocItem/Footer'
+import type FooterType from '@theme/DocItem/Footer'
+
+export default function FooterWrapper(props: WrapperProps<typeof FooterType>) {
+  let { colorMode } = useColorMode()
+
+  return (
+    <>
+      <Footer {...props} />
+
+      <div style={{ height: '56px' }} />
+      <Giscus
+        theme={colorMode}
+        id="giscus"
+        repo="evan-liu/karabiner.ts"
+        repoId="R_kgDOJZ587w"
+        category="giscus"
+        categoryId="DIC_kwDOJZ58784CgPKB"
+        mapping="pathname"
+        reactionsEnabled="1"
+        inputPosition="bottom"
+        lang="en"
+        loading="lazy"
+      />
+    </>
+  )
+}

docs/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "@docusaurus/tsconfig",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "strict": true,
+    "importsNotUsedAsValues": "error"
+  }
+}