1

src/components/puzzle-gallery/PuzzleGalleryDetailView.tsx

@@ -6,6 +6,10 @@ import { buildPublicWorkStagePath } from '../../routing/appPageRoutes';
 import { copyTextToClipboard } from '../../services/clipboard';
 import { buildPuzzlePublicWorkCode } from '../../services/publicWorkCode';
 import { ResolvedAssetImage } from '../ResolvedAssetImage';
+import {
+  formatPlatformWorkDisplayName,
+  formatPlatformWorkDisplayTags,
+} from '../rpg-entry/rpgEntryWorldPresentation';
 
 type PuzzleGalleryDetailViewProps = {
   item: PuzzleWorkSummary;
@@ -35,6 +39,8 @@ export function PuzzleGalleryDetailView({
   const [shareState, setShareState] = useState<'idle' | 'copied' | 'failed'>(
     'idle',
   );
+  const displayName = formatPlatformWorkDisplayName(item.levelName);
+  const displayTags = formatPlatformWorkDisplayTags(item.themeTags);
   const copyPublicWorkCode = () => {
     void copyTextToClipboard(publicWorkCode).then((copied) => {
       setCopyState(copied ? 'copied' : 'failed');
@@ -109,7 +115,7 @@ export function PuzzleGalleryDetailView({
 
         <div className="mt-6">
           <div className="text-2xl font-black leading-tight sm:text-3xl">
-            {item.levelName}
+            {displayName}
           </div>
           <div className="mt-3 flex flex-wrap items-center gap-3 text-sm text-amber-50/82">
             <span className="inline-flex items-center gap-2">
@@ -166,7 +172,7 @@ export function PuzzleGalleryDetailView({
               题材标签
             </div>
             <div className="mt-3 flex flex-wrap gap-2">
-              {item.themeTags.map((tag) => (
+              {displayTags.map((tag) => (
                 <span
                   key={tag}
                   className="rounded-full border border-amber-300/35 bg-amber-100/68 px-3 py-1 text-xs font-semibold text-amber-700"