Support rendering partial markdown and improve performance

[CNSeniorious000]

Use solid-markdown to parse and render markdown without frequently updating DOM

• Closes Improve performance by rendering markdown partially #68

Sourcery 的总结

用 solid-markdown 替换现有的 markdown 渲染方法，以支持部分 markdown 渲染，并通过最小化 DOM 更新来提高性能。重构代码以使用带有 remark 和 rehype 插件的 unified，并更新 API 模型版本。

新功能：

• 引入使用 solid-markdown 库渲染部分 markdown 的支持，增强 markdown 渲染的灵活性。

增强：

• 通过使用 solid-markdown 进行 markdown 解析和渲染，减少频繁的 DOM 更新以提高性能。
• 重构 markdown 渲染逻辑以使用带有 remark 和 rehype 插件的 unified，以提高可扩展性和可维护性。

杂务：

• 将 API 请求中使用的模型从 'llama3-70b-8192' 更新为 'llama-3.2-90b-text-preview'。

Original summary in English

Summary by Sourcery

Replace the existing markdown rendering approach with solid-markdown to support partial markdown rendering and improve performance by minimizing DOM updates. Refactor the code to use unified with remark and rehype plugins, and update the API model version.

New Features:

• Introduce support for rendering partial markdown using the solid-markdown library, enhancing the flexibility of markdown rendering.

Enhancements:

• Improve performance by reducing frequent DOM updates through the use of solid-markdown for markdown parsing and rendering.
• Refactor the markdown rendering logic to use unified with remark and rehype plugins for better extensibility and maintainability.

Chores:

• Update the model used in API requests from 'llama3-70b-8192' to 'llama-3.2-90b-text-preview'.

[vercel]

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

Name	Status	Preview	Comments	Updated (UTC)
endless-chat	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 12, 2024 6:41am
free-chat	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 12, 2024 6:41am

[sourcery-ai]

审核指南 by Sourcery

此拉取请求实现了重大更改，以改进 Markdown 渲染和代码块功能。主要更改包括从 markdown-it 切换到 solid-markdown 进行渲染，增强代码块样式和复制功能，并更新依赖项。

时序图

sequenceDiagram
    participant C as Component
    participant SM as SolidMarkdown
    participant RP as RemarkPlugins
    participant RH as RehypePlugins
    participant CB as CodeBlock
    C->>SM: Render markdown
    SM->>RP: Process with remark plugins
    SM->>RH: Process with rehype plugins
    SM->>CB: Render code blocks
    CB-->>SM: Return rendered code
    SM-->>C: Return rendered markdown

Loading

文件级更改

更改	详情	文件
用 solid-markdown 替换 markdown-it 进行渲染	移除 markdown-it 和相关插件 添加 solid-markdown 和相关插件（remark-gfm, remark-breaks, remark-math, rehype-highlight, rehype-katex） 更新 MessageItem 组件以使用 SolidMarkdown 而不是 markdown-it 实现一个新的 CodeBlock 组件以更好地渲染代码和复制功能	pnpm-lock.yaml src/components/MessageItem.tsx src/components/CodeBlock.tsx
改进代码块样式和功能	创建一个带有集成复制功能的新 CodeBlock 组件 更新 message.css 中代码块的 CSS 修改 uno.config.ts 以调整复制按钮样式	src/components/CodeBlock.tsx src/message.css uno.config.ts
更新 API 模型和依赖项	将 API 模型从 'llama3-70b-8192' 更改为 'llama-3.2-90b-text-preview' 更新 pnpm-lock.yaml 中的各种依赖项	src/utils/misc.ts pnpm-lock.yaml

---

提示和命令

与 Sourcery 互动

• 触发新审核： 在拉取请求中评论 @sourcery-ai review。
• 继续讨论： 直接回复 Sourcery 的审核评论。
• 从审核评论生成 GitHub 问题： 通过回复审核评论请求 Sourcery 创建一个问题。

自定义您的体验

访问您的仪表板以：

• 启用或禁用审核功能，如 Sourcery 生成的拉取请求摘要、审核指南等。
• 更改审核语言。
• 添加、删除或编辑自定义审核说明。
• 调整其他审核设置。

获取帮助

• 联系我们的支持团队以获取问题或反馈。
• 访问我们的文档以获取详细指南和信息。
• 通过关注我们在 X/Twitter、LinkedIn 或 GitHub 上的 Sourcery 团队保持联系。

Original review guide in English

Reviewer's Guide by Sourcery

This pull request implements significant changes to improve markdown rendering and code block functionality. The main changes include switching from markdown-it to solid-markdown for rendering, enhancing code block styling and copy functionality, and updating dependencies.

Sequence Diagram

sequenceDiagram
    participant C as Component
    participant SM as SolidMarkdown
    participant RP as RemarkPlugins
    participant RH as RehypePlugins
    participant CB as CodeBlock
    C->>SM: Render markdown
    SM->>RP: Process with remark plugins
    SM->>RH: Process with rehype plugins
    SM->>CB: Render code blocks
    CB-->>SM: Return rendered code
    SM-->>C: Return rendered markdown

Loading

File-Level Changes

Change	Details	Files
Replaced markdown-it with solid-markdown for rendering	Removed markdown-it and related plugins Added solid-markdown and related plugins (remark-gfm, remark-breaks, remark-math, rehype-highlight, rehype-katex) Updated MessageItem component to use SolidMarkdown instead of markdown-it Implemented a new CodeBlock component for better code rendering and copy functionality	pnpm-lock.yaml src/components/MessageItem.tsx src/components/CodeBlock.tsx
Improved code block styling and functionality	Created a new CodeBlock component with integrated copy functionality Updated CSS for code blocks in message.css Modified uno.config.ts to adjust copy button styling	src/components/CodeBlock.tsx src/message.css uno.config.ts
Updated API model and dependencies	Changed the API model from 'llama3-70b-8192' to 'llama-3.2-90b-text-preview' Updated various dependencies in pnpm-lock.yaml	src/utils/misc.ts pnpm-lock.yaml

---

Tips and commands

Interacting with Sourcery

• Trigger a new review: Comment @sourcery-ai review on the pull request.
• Continue discussions: Reply directly to Sourcery's review comments.
• Generate a GitHub issue from a review comment: Ask Sourcery to create an
  issue from a review comment by replying to it.

Customizing Your Experience

Access your dashboard to:

• Enable or disable review features such as the Sourcery-generated pull request
  summary, the reviewer's guide, and others.
• Change the review language.
• Add, remove or edit custom review instructions.
• Adjust other review settings.

Getting Help

• Contact our support team for questions or feedback.
• Visit our documentation for detailed guides and information.
• Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

[netlify]

✅ Deploy Preview for promplate-demo ready!

Name	Link
🔨 Latest commit
🔍 Latest deploy log	https://app.netlify.com/sites/promplate-demo/deploys/670be3a15c531f920a288d3e
😎 Deploy Preview	https://deploy-preview-73--promplate-demo.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[sourcery-ai]

嘿 @CNSeniorious000 - 我已经审查了你的更改，看起来很棒！

这是我在审查期间查看的内容

• 🟡 一般问题：发现1个问题
• 🟢 安全性：一切看起来都很好
• 🟢 测试：一切看起来都很好
• 🟢 复杂性：一切看起来都很好
• 🟢 文档：一切看起来都很好

---

Sourcery对开源项目免费 - 如果你喜欢我们的审查，请考虑分享它们 ✨

• X
• Mastodon
• LinkedIn
• Facebook

_{帮助我变得更有用！请在每条评论上点击 👍 或 👎，我将使用反馈来改进你的审查。}

Original comment in English

Hey @CNSeniorious000 - I've reviewed your changes and they look great!

Here's what I looked at during the review

• 🟡 General issues: 1 issue found
• 🟢 Security: all looks good
• 🟢 Testing: all looks good
• 🟢 Complexity: all looks good
• 🟢 Documentation: all looks good

---

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

• X
• Mastodon
• LinkedIn
• Facebook

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

[CNSeniorious000]

Still,

Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'inTable')

• TypeError: Cannot read properties of undefined (reading 'inTable') in v4.0.0 remarkjs/remark-gfm#57

[CNSeniorious000]

Created a PR to the upstream: andi23rosca/solid-markdown#36