fix prod mdx issue and lint

uchicago-dsi · Aug 8, 2024 · b9fcac1 · b9fcac1
1 parent c2e9207
commit b9fcac1
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 15 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,11 +1,11 @@
+import { Analytics } from "@vercel/analytics/react"
 import { Antonio, Libre_Baskerville, Open_Sans } from "next/font/google"
 import "styles/tailwind.css"
 import "styles/global.css"
 
 import Footer from "components/Footer"
 import Nav from "components/Nav"
 import { ReportLoadingShade } from "components/ReportLoadingShade/ReportLoadingShade"
-import { Analytics } from "@vercel/analytics/react"
 // import { WipTag } from "components/WipTag"
 
 // import Transitions, { Animate } from "components/Transition"

diff --git a/components/EnhancedMarkdown/AcpTable.tsx b/components/EnhancedMarkdown/AcpTable.tsx
@@ -1,11 +1,8 @@
 "use client"
-import * as ToggleGroup from "@radix-ui/react-toggle-group"
 import { createColumnHelper } from "@tanstack/react-table"
 import Papa from "papaparse"
 import React, { useEffect, useState } from "react"
-// import { SortableTableProps } from "components/SortableTable/SortableTable"
 import SortableTable from "components/SortableTable"
-import Tooltip from "components/Tooltip"
 import { percentFormatter } from "utils/display/formatValue"
 
 type AcpData = {
@@ -36,9 +33,6 @@ const cols = [
   "Avg Neighborhood Disadvantage Percentile",
 ]
 
-const toggleGroupItemClasses =
-  "min-w-48 hover:bg-violet3 color-mauve11 data-[state=on]:bg-violet6 data-[state=on]:text-violet12 flex h-[35px] w-[35px] items-center justify-center bg-white text-base leading-4 first:rounded-l last:rounded-r focus:z-10 focus:shadow-[0_0_0_2px] focus:shadow-black focus:outline-none"
-
 const columnHelper = createColumnHelper<AcpData>()
 
 const getColumns = () => {

diff --git a/components/EnhancedMarkdown/Cr4ScenarioData.tsx b/components/EnhancedMarkdown/Cr4ScenarioData.tsx
@@ -1,5 +1,4 @@
 "use client"
-import * as ToggleGroup from "@radix-ui/react-toggle-group"
 import { createColumnHelper } from "@tanstack/react-table"
 import Papa from "papaparse"
 import React, { useEffect, useState } from "react"
@@ -31,9 +30,6 @@ const cols = [
   "Merged CR4 with Divestment, 50% Survival",
 ]
 
-const toggleGroupItemClasses =
-  "min-w-48 hover:bg-violet3 color-mauve11 data-[state=on]:bg-violet6 data-[state=on]:text-violet12 flex h-[35px] w-[35px] items-center justify-center bg-white text-base leading-4 first:rounded-l last:rounded-r focus:z-10 focus:shadow-[0_0_0_2px] focus:shadow-black focus:outline-none"
-
 const columnHelper = createColumnHelper<CR4Data>()
 
 const getColumns = () => {
@@ -70,7 +66,7 @@ export const Cr4ScenarioTable: React.FC = () => {
     const getData = async () => {
       const [divestData] = await Promise.all([fetch("/data/divest-scenarios.csv").then((res) => res.text())])
       const [divestParsed] = [Papa.parse<CR4Data>(divestData, { header: true, dynamicTyping: true })]
-      console.log("data", divestParsed)
+
       setData({
         ready: true,
         divest: divestParsed.data,

diff --git a/components/PostWidgets/index.tsx b/components/PostWidgets/index.tsx
@@ -27,12 +27,12 @@ const PostWidget: React.FC<{ widget: string; props?: string }> = ({ widget, prop
       )
     case "Map":
       let extraProps: any = {}
+
       try {
         // parse html codes in props eg  &#x22; -> "
         if (typeof props === "string") {
           const parsed = props?.replace(/&#x([0-9a-fA-F]+);/g, (_, g) => String.fromCharCode(parseInt(g, 16)))
           extraProps = JSON.parse(parsed)
-          console.log("Parsed props", extraProps)
         }
       } catch (e) {
         console.error("Error parsing props", e, props)

diff --git a/hooks/useClientMdxContent.ts b/hooks/useClientMdxContent.ts
@@ -18,7 +18,7 @@ export const useClientMdxContent = <T extends any>(
   const getData = async () => {
     if (!ready) return
     try {
-      if (false) {
+      if (IS_DEV) {
         const r = await client.queries[contentType]({ relativePath })
         // @ts-ignore
         setData(r?.data?.tooltips?.body)

diff --git a/hooks/useMdxContent.ts b/hooks/useMdxContent.ts
@@ -17,10 +17,12 @@ export const getMdxContent = async <T extends any>(contentType: keyof typeof cli
     } else {
       getContentDirs()
       const filepath = path.join(process.cwd(), "public", "content", contentType, relativePath)
-      if (!parseCache[filepath]) {
+      if (true) {
+        //(!parseCache[filepath]) {
         // @ts-ignore
         const schema = collections[contentType]
         const mdxContent = fs.readFileSync(filepath, "utf-8")
+
         const frontMatter = matter(mdxContent)
         const fmData = frontMatter.data
         parseCache[filepath] = {
@@ -31,6 +33,9 @@ export const getMdxContent = async <T extends any>(contentType: keyof typeof cli
             ...fmData,
           },
         }
+        // if (contentType === 'post') {
+        //   console.log(parseCache[filepath][contentType])
+        // }
         // @ts-ignore
         parseRichRecursive(parseCache[filepath][contentType], schema)
       }

diff --git a/utils/mdx/parseRich.ts b/utils/mdx/parseRich.ts
@@ -7,6 +7,8 @@ const cleanHtmlJsx = (elementName: string, htmlChild: any) => {
     children: htmlChild.children,
     props: {},
   }
+  // replace \n with space
+  htmlChild.value = htmlChild.value.replace(/\n/g, " ")
 
   const propsRegex = /(\w+)=({[^}]+}|".*?")/g
   let match