refactor(chat): update to react-markdown@9 with dependencies

[YYYasin19]

Hi,

Thanks for the great Chat UI!

Apparently, react-markdown has been updated recently, fixing some problems in rendering tables.
However, this required not using the inline prop anymore.

This PR should fix it (I am using it this way currently and will report back if I find something breaking) but I would appreciate some feedback, as this is my first JS/TS project.

Thanks!

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
ui-www	❌ Failed (Inspect)			Jan 24, 2024 10:13pm

[marcusschiesser]

Hi @YYYasin19, thanks for your PR! Some checks are failing, especially the deployment of apps/www (that app is running on https://ui.marcusschiesser.de/) - can you have a look at this? Then I'll happy to merge your changes

[YYYasin19]

I think I've fixed formatting and the typing issues but it still doesn't seem to deploy correctly.
I can't see more details, though, since I'm not configured on the Vercel project :/

[marcusschiesser]

@YYYasin19 this is the error log, does it help?

[15:56:47.653] Running build in Washington, D.C., USA (East) – iad1
[15:56:50.128] Cloning github.com/marcusschiesser/ui (Branch: update-markdown, Commit: 59f1a9a)
[15:56:50.832] Previous build caches not available
[15:56:50.856] Cloning completed: 727.637ms
[15:56:51.256] Running "vercel build"
[15:56:51.754] Vercel CLI 33.2.0
[15:56:51.898] > Detected Turbo. Adjusting default settings...
[15:56:52.272] Detected `pnpm-lock.yaml` version 6 generated by pnpm 8
[15:56:52.278] Running "install" command: `pnpm install`...
[15:56:53.023] Scope: all 3 workspace projects
[15:56:53.330] ../..                                    | Progress: resolved 1, reused 0, downloaded 0, added 0
[15:56:53.641] ../..                                    |    +1361 ++++++++++++++++++++++++++++
[15:56:54.331] ../..                                    | Progress: resolved 1361, reused 0, downloaded 15, added 0
[15:56:55.332] ../..                                    | Progress: resolved 1361, reused 0, downloaded 31, added 15
[15:56:56.333] ../..                                    | Progress: resolved 1361, reused 0, downloaded 102, added 91
[15:56:57.332] ../..                                    | Progress: resolved 1361, reused 0, downloaded 127, added 118
[15:56:58.333] ../..                                    | Progress: resolved 1361, reused 0, downloaded 136, added 123
[15:56:59.335] ../..                                    | Progress: resolved 1361, reused 0, downloaded 143, added 127
[15:57:00.336] ../..                                    | Progress: resolved 1361, reused 0, downloaded 150, added 134
[15:57:01.336] ../..                                    | Progress: resolved 1361, reused 0, downloaded 274, added 266
[15:57:02.354] ../..                                    | Progress: resolved 1361, reused 0, downloaded 383, added 372
[15:57:03.353] ../..                                    | Progress: resolved 1361, reused 0, downloaded 399, added 384
[15:57:04.354] ../..                                    | Progress: resolved 1361, reused 0, downloaded 428, added 416
[15:57:05.353] ../..                                    | Progress: resolved 1361, reused 0, downloaded 444, added 429
[15:57:06.353] ../..                                    | Progress: resolved 1361, reused 0, downloaded 471, added 460
[15:57:07.358] ../..                                    | Progress: resolved 1361, reused 0, downloaded 492, added 481
[15:57:08.359] ../..                                    | Progress: resolved 1361, reused 0, downloaded 496, added 484
[15:57:09.360] ../..                                    | Progress: resolved 1361, reused 0, downloaded 515, added 503
[15:57:10.361] ../..                                    | Progress: resolved 1361, reused 0, downloaded 558, added 543
[15:57:11.362] ../..                                    | Progress: resolved 1361, reused 0, downloaded 696, added 685
[15:57:12.362] ../..                                    | Progress: resolved 1361, reused 0, downloaded 858, added 850
[15:57:13.368] ../..                                    | Progress: resolved 1361, reused 0, downloaded 1015, added 1002
[15:57:14.367] ../..                                    | Progress: resolved 1361, reused 0, downloaded 1148, added 1137
[15:57:15.367] ../..                                    | Progress: resolved 1361, reused 0, downloaded 1207, added 1195
[15:57:16.372] ../..                                    | Progress: resolved 1361, reused 0, downloaded 1267, added 1254
[15:57:17.080] ../..                                    | Progress: resolved 1361, reused 0, downloaded 1360, added 1361, done
[15:57:17.630] .../node_modules/protobufjs postinstall$ node scripts/postinstall
[15:57:17.655] .../sharp@0.31.3/node_modules/sharp install$ (node install/libvips && node install/dll-copy && prebuild-install) || (node install/can-compile && node-gyp rebuild && node install/dll-copy)
[15:57:17.715] .../node_modules/protobufjs postinstall: Done
[15:57:17.843] .../sharp@0.31.3/node_modules/sharp install: sharp: Downloading https://github.com/lovell/sharp-libvips/releases/download/v8.13.3/libvips-8.13.3-linux-x64.tar.br
[15:57:18.326] .../sharp@0.31.3/node_modules/sharp install: sharp: Integrity check passed for linux-x64
[15:57:18.614] .../sharp@0.31.3/node_modules/sharp install: Done
[15:57:18.674] .../esbuild@0.17.19/node_modules/esbuild postinstall$ node install.js
[15:57:18.692] .../.pnpm/turbo@1.9.9/node_modules/turbo postinstall$ node install.js
[15:57:18.798] .../esbuild@0.17.19/node_modules/esbuild postinstall: Done
[15:57:18.802] .../.pnpm/turbo@1.9.9/node_modules/turbo postinstall: Done
[15:57:19.001] .../node_modules/contentlayer postinstall$ node ./bin/cli.cjs postinstall || echo 'No Contentlayer build found.'
[15:57:20.519] .../node_modules/contentlayer postinstall: Done
[15:57:21.169] 
[15:57:21.169] dependencies:
[15:57:21.169] + @faker-js/faker 7.6.0
[15:57:21.169] + @hookform/resolvers 3.1.0
[15:57:21.169] + @radix-ui/react-accessible-icon 1.0.3
[15:57:21.170] + @radix-ui/react-accordion 1.1.2
[15:57:21.170] + @radix-ui/react-alert-dialog 1.0.4
[15:57:21.170] + @radix-ui/react-aspect-ratio 1.0.3
[15:57:21.170] + @radix-ui/react-avatar 1.0.3
[15:57:21.170] + @radix-ui/react-checkbox 1.0.4
[15:57:21.170] + @radix-ui/react-collapsible 1.0.3
[15:57:21.170] + @radix-ui/react-context-menu 2.1.4
[15:57:21.170] + @radix-ui/react-dialog 1.0.4
[15:57:21.170] + @radix-ui/react-dropdown-menu 2.0.5
[15:57:21.170] + @radix-ui/react-hover-card 1.0.6
[15:57:21.170] + @radix-ui/react-icons 1.3.0
[15:57:21.170] + @radix-ui/react-label 2.0.2
[15:57:21.170] + @radix-ui/react-menubar 1.0.3
[15:57:21.170] + @radix-ui/react-navigation-menu 1.1.3
[15:57:21.170] + @radix-ui/react-popover 1.0.6
[15:57:21.171] + @radix-ui/react-progress 1.0.3
[15:57:21.171] + @radix-ui/react-radio-group 1.1.3
[15:57:21.171] + @radix-ui/react-scroll-area 1.0.4
[15:57:21.171] + @radix-ui/react-select 1.2.2
[15:57:21.171] + @radix-ui/react-separator 1.0.3
[15:57:21.171] + @radix-ui/react-slider 1.1.2
[15:57:21.171] + @radix-ui/react-slot 1.0.2
[15:57:21.171] + @radix-ui/react-switch 1.0.3
[15:57:21.171] + @radix-ui/react-tabs 1.0.4
[15:57:21.171] + @radix-ui/react-toast 1.1.4
[15:57:21.171] + @radix-ui/react-toggle 1.0.3
[15:57:21.171] + @radix-ui/react-toggle-group 1.0.4
[15:57:21.171] + @radix-ui/react-tooltip 1.0.6
[15:57:21.171] + @tanstack/react-table 8.9.1
[15:57:21.171] + @vercel/analytics 1.0.1
[15:57:21.172] + @vercel/og 0.0.21
[15:57:21.172] + class-variance-authority 0.4.0
[15:57:21.172] + clsx 1.2.1
[15:57:21.172] + cmdk 0.2.0
[15:57:21.172] + contentlayer 0.3.4
[15:57:21.172] + date-fns 2.30.0
[15:57:21.172] + jotai 2.1.0
[15:57:21.172] + lodash.template 4.5.0
[15:57:21.172] + lucide-react 0.214.0
[15:57:21.172] + markdown-wasm 1.2.0
[15:57:21.172] + mdast-util-gfm-table 2.0.0
[15:57:21.172] + next 13.4.8
[15:57:21.172] + next-contentlayer 0.3.4
[15:57:21.173] + next-themes 0.2.1
[15:57:21.173] + react 18.2.0
[15:57:21.173] + react-day-picker 8.7.1
[15:57:21.173] + react-dom 18.2.0
[15:57:21.173] + react-hook-form 7.44.2
[15:57:21.173] + react-markdown 9.0.1
[15:57:21.173] + react-syntax-highlighter 15.5.0
[15:57:21.173] + react-wrap-balancer 0.4.1
[15:57:21.173] + recharts 2.6.2
[15:57:21.173] + remark 14.0.3
[15:57:21.173] + remark-code-import 1.2.0
[15:57:21.173] + remark-gfm 4.0.0
[15:57:21.173] + remark-math 6.0.0
[15:57:21.173] + sharp 0.31.3
[15:57:21.173] + tailwind-merge 1.12.0
[15:57:21.173] + vaul 0.2.0
[15:57:21.174] + zod 3.21.4
[15:57:21.174] 
[15:57:21.174] devDependencies:
[15:57:21.174] + @types/lodash.template 4.5.1
[15:57:21.174] + @types/node 17.0.45
[15:57:21.174] + @types/react 18.2.7
[15:57:21.174] + @types/react-color 3.0.6
[15:57:21.174] + @types/react-dom 18.2.4
[15:57:21.174] + @types/react-syntax-highlighter 15.5.9
[15:57:21.174] + esbuild 0.17.19
[15:57:21.174] + eslint 8.41.0
[15:57:21.174] + mdast-util-toc 6.1.1
[15:57:21.174] + postcss 8.4.24
[15:57:21.174] + rehype 12.0.1
[15:57:21.174] + rehype-autolink-headings 6.1.1
[15:57:21.174] + rehype-pretty-code 0.6.0
[15:57:21.175] + rehype-slug 5.1.0
[15:57:21.175] + rimraf 4.1.3
[15:57:21.175] + shiki 0.12.1
[15:57:21.175] + tailwindcss 3.3.2
[15:57:21.175] + typescript 4.9.5
[15:57:21.175] + unist-builder 3.0.0
[15:57:21.175] + unist-util-visit 4.1.2
[15:57:21.175] 
[15:57:21.537] ../.. prepare$ husky install
[15:57:21.612] ../.. prepare: husky - Git hooks installed
[15:57:21.618] ../.. prepare: Done
[15:57:21.620] Done in 29.2s
[15:57:21.659] Detected Next.js version: 13.4.8
[15:57:21.659] Running "turbo run build"
[15:57:21.773] • Packages in scope: www
[15:57:21.774] • Running build in 1 packages
[15:57:21.774] • Remote caching enabled
[15:57:21.903] www:build: cache miss, executing bb5f256844e9ab2a
[15:57:22.408] www:build: 
[15:57:22.408] www:build: > www@0.0.1 build /vercel/path0/apps/www
[15:57:22.408] www:build: > contentlayer build && pnpm build:registry && next build
[15:57:22.409] www:build: 
[15:57:24.234] www:build: ✘ [ERROR] TypeError: Cannot read properties of undefined (reading 'inTable')
[15:57:24.234] www:build:     at Object.exitCodeText (file:///vercel/path0/node_modules/.pnpm/mdast-util-gfm-table@2.0.0/node_modules/mdast-util-gfm-table/lib/index.js:123:17)
[15:57:24.234] www:build:     at compile (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:353:40)
[15:57:24.234] www:build:     at fromMarkdown (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:187:29)
[15:57:24.234] www:build:     at parser (file:///vercel/path0/node_modules/.pnpm/remark-parse@10.0.2/node_modules/remark-parse/lib/index.js:18:12)
[15:57:24.234] www:build:     at Function.parse (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:273:12)
[15:57:24.234] www:build:     at executor (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:393:31)
[15:57:24.235] www:build:     at new Promise (<anonymous>)
[15:57:24.235] www:build:     at Function.process (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:380:14)
[15:57:24.235] www:build:     at process (file:///vercel/path0/node_modules/.pnpm/@mdx-js+mdx@2.3.0/node_modules/@mdx-js/mdx/lib/util/create-format-aware-processors.js:50:22)
[15:57:24.235] www:build:     at onload (file:///vercel/path0/node_modules/.pnpm/@mdx-js+esbuild@2.3.0_esbuild@0.17.19/node_modules/@mdx-js/esbuild/lib/index.js:151:22) [plugin @mdx-js/esbuild]
[15:57:24.235] www:build: 
[15:57:24.235] www:build:     _mdx_bundler_entry_point-2c16de98-7a2b-4e28-a8aa-4299bd7570f2.mdx:0:0:
[15:57:24.235] www:build:       0 │ ---
[15:57:24.236] www:build:         ╵ ^
[15:57:24.236] www:build: 
[15:57:25.302] www:build: ✘ [ERROR] TypeError: Cannot read properties of undefined (reading 'inTable')
[15:57:25.302] www:build:     at Object.exitCodeText (file:///vercel/path0/node_modules/.pnpm/mdast-util-gfm-table@2.0.0/node_modules/mdast-util-gfm-table/lib/index.js:123:17)
[15:57:25.303] www:build:     at compile (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:353:40)
[15:57:25.303] www:build:     at fromMarkdown (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:187:29)
[15:57:25.303] www:build:     at parser (file:///vercel/path0/node_modules/.pnpm/remark-parse@10.0.2/node_modules/remark-parse/lib/index.js:18:12)
[15:57:25.303] www:build:     at Function.parse (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:273:12)
[15:57:25.303] www:build:     at executor (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:393:31)
[15:57:25.303] www:build:     at new Promise (<anonymous>)
[15:57:25.304] www:build:     at Function.process (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:380:14)
[15:57:25.304] www:build:     at process (file:///vercel/path0/node_modules/.pnpm/@mdx-js+mdx@2.3.0/node_modules/@mdx-js/mdx/lib/util/create-format-aware-processors.js:50:22)
[15:57:25.304] www:build:     at onload (file:///vercel/path0/node_modules/.pnpm/@mdx-js+esbuild@2.3.0_esbuild@0.17.19/node_modules/@mdx-js/esbuild/lib/index.js:151:22) [plugin @mdx-js/esbuild]
[15:57:25.304] www:build: 
[15:57:25.304] www:build:     _mdx_bundler_entry_point-3ff9f3e4-c60d-4bec-a770-7735fc3aebd6.mdx:0:0:
[15:57:25.304] www:build:       0 │ ---
[15:57:25.304] www:build:         ╵ ^
[15:57:25.304] www:build: 
[15:57:25.327] www:build: Error: Found 2 problems in 4 documents.
[15:57:25.327] www:build: 
[15:57:25.327] www:build:  └── Encountered unexpected errors while processing of 2 documents. This is possibly a bug in Contentlayer. Please open an issue.
[15:57:25.327] www:build:      
[15:57:25.328] www:build:      • "docs/about.mdx": UnexpectedMDXError: Error: Build failed with 1 error:
[15:57:25.328] www:build:      _mdx_bundler_entry_point-2c16de98-7a2b-4e28-a8aa-4299bd7570f2.mdx:0:0: ERROR: [plugin: @mdx-js/esbuild] TypeError: Cannot read properties of undefined (reading 'inTable')
[15:57:25.328] www:build:          at Object.exitCodeText (file:///vercel/path0/node_modules/.pnpm/mdast-util-gfm-table@2.0.0/node_modules/mdast-util-gfm-table/lib/index.js:123:17)
[15:57:25.335] www:build:          at compile (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:353:40)
[15:57:25.336] www:build:          at fromMarkdown (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:187:29)
[15:57:25.336] www:build:          at parser (file:///vercel/path0/node_modules/.pnpm/remark-parse@10.0.2/node_modules/remark-parse/lib/index.js:18:12)
[15:57:25.336] www:build:          at Function.parse (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:273:12)
[15:57:25.337] www:build:          at executor (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:393:31)
[15:57:25.337] www:build:          at new Promise (<anonymous>)
[15:57:25.337] www:build:          at Function.process (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:380:14)
[15:57:25.337] www:build:          at process (file:///vercel/path0/node_modules/.pnpm/@mdx-js+mdx@2.3.0/node_modules/@mdx-js/mdx/lib/util/create-format-aware-processors.js:50:22)
[15:57:25.337] www:build:          at onload (file:///vercel/path0/node_modules/.pnpm/@mdx-js+esbuild@2.3.0_esbuild@0.17.19/node_modules/@mdx-js/esbuild/lib/index.js:151:22)
[15:57:25.337] www:build:      • "docs/installation/index.mdx": UnexpectedMDXError: Error: Build failed with 1 error:
[15:57:25.337] www:build:      _mdx_bundler_entry_point-3ff9f3e4-c60d-4bec-a770-7735fc3aebd6.mdx:0:0: ERROR: [plugin: @mdx-js/esbuild] TypeError: Cannot read properties of undefined (reading 'inTable')
[15:57:25.338] www:build:          at Object.exitCodeText (file:///vercel/path0/node_modules/.pnpm/mdast-util-gfm-table@2.0.0/node_modules/mdast-util-gfm-table/lib/index.js:123:17)
[15:57:25.338] www:build:          at compile (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:353:40)
[15:57:25.338] www:build:          at fromMarkdown (file:///vercel/path0/node_modules/.pnpm/mdast-util-from-markdown@1.3.0/node_modules/mdast-util-from-markdown/lib/index.js:187:29)
[15:57:25.338] www:build:          at parser (file:///vercel/path0/node_modules/.pnpm/remark-parse@10.0.2/node_modules/remark-parse/lib/index.js:18:12)
[15:57:25.338] www:build:          at Function.parse (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:273:12)
[15:57:25.338] www:build:          at executor (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:393:31)
[15:57:25.338] www:build:          at new Promise (<anonymous>)
[15:57:25.339] www:build:          at Function.process (file:///vercel/path0/node_modules/.pnpm/unified@10.1.2/node_modules/unified/lib/index.js:380:14)
[15:57:25.339] www:build:          at process (file:///vercel/path0/node_modules/.pnpm/@mdx-js+mdx@2.3.0/node_modules/@mdx-js/mdx/lib/util/create-format-aware-processors.js:50:22)
[15:57:25.339] www:build:          at onload (file:///vercel/path0/node_modules/.pnpm/@mdx-js+esbuild@2.3.0_esbuild@0.17.19/node_modules/@mdx-js/esbuild/lib/index.js:151:22)
[15:57:25.339] www:build:      
[15:57:25.339] www:build: 
[15:57:25.360] www:build:  ELIFECYCLE  Command failed with exit code 1.
[15:57:25.377] www:build: ERROR: command finished with error: command (/vercel/path0/apps/www) pnpm run build exited (1)
[15:57:25.378] command (/vercel/path0/apps/www) pnpm run build exited (1)
[15:57:25.379] 
[15:57:25.379]   Tasks:    0 successful, 1 total
[15:57:25.379]  Cached:    0 cached, 1 total
[15:57:25.379]    Time:    3.699s 
[15:57:25.379] Summary:    /vercel/path0/.turbo/runs/2bIsHluyeI7YnwQ5I2w5MgRkWJf.json
[15:57:25.379]  Failed:    www#build
[15:57:25.379] 
[15:57:25.380]  ERROR  run failed: command  exited (1)
[15:57:25.385] Error: Command "turbo run build" exited with 1
[15:57:29.468] 

[YYYasin19]

Alright, the problem seems to be connected to this collection of issues.
This means this PR will have to wait a little bit more until other tools are updated as well. The specific problem here seems to connected to mdast.
I don't get which dependency is still broken

[marcusschiesser]

@YYYasin19 thanks for looking into this.