d8dfun/claudecodeui
1
0
Fork 0
mirror of https://github.com/siteboon/claudecodeui.git synced 2026-07-06 21:52:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: render changelog as markdown in version upgrade modal

Browse Source
This commit is contained in:
Simos Mikelatos
2026-06-09 20:53:15 +00:00
parent 92de0ed613
commit 6a53c31e90
1 changed files with 15 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/version-upgrade/view/VersionUpgradeModal.tsx
View File

@@ -1,4 +1,6 @@
import { useCallback, useEffect, useState } from "react"; import { useCallback, useEffect, useState, type ReactNode } from "react";
import ReactMarkdown from "react-markdown";
import remarkGfm from "remark-gfm";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { authenticatedFetch } from "../../../utils/api"; import { authenticatedFetch } from "../../../utils/api";
import { ReleaseInfo } from "../../../types/sharedTypes"; import { ReleaseInfo } from "../../../types/sharedTypes";
@@ -154,8 +156,10 @@ export function VersionUpgradeModal({
)} )}
</div> </div>
<div className="max-h-64 overflow-y-auto rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-600 dark:bg-gray-700/50"> <div className="max-h-64 overflow-y-auto rounded-lg border border-gray-200 bg-gray-50 p-4 dark:border-gray-600 dark:bg-gray-700/50">
<div className="prose prose-sm max-w-none whitespace-pre-wrap text-sm text-gray-700 dark:prose-invert dark:text-gray-300"> <div className="prose prose-sm max-w-none text-sm text-gray-700 dark:prose-invert dark:text-gray-300">
{cleanChangelog(releaseInfo.body)} <ReactMarkdown remarkPlugins={[remarkGfm]} components={changelogComponents}>
{cleanChangelog(releaseInfo.body)}
</ReactMarkdown>
</div> </div>
</div> </div>
</div> </div>
@@ -236,6 +240,14 @@ export function VersionUpgradeModal({
); );
}; };
const changelogComponents = {
a: ({ href, children }: { href?: string; children?: ReactNode }) => (
<a href={href} target="_blank" rel="noopener noreferrer" className="text-blue-600 hover:underline dark:text-blue-400">
{children}
</a>
),
};
// Clean up changelog by removing GitHub-specific metadata // Clean up changelog by removing GitHub-specific metadata
const cleanChangelog = (body: string) => { const cleanChangelog = (body: string) => {
if (!body) return ''; if (!body) return '';