Add Markdown support to Manga-Description

This commit is contained in:
glax 2024-10-19 23:47:08 +02:00
parent 5aac05ae08
commit 59dff529ef
3 changed files with 2114 additions and 12 deletions

View File

@ -1,10 +1,11 @@
import IMangaConnector from "./IMangaConnector"; import IMangaConnector from "./IMangaConnector";
import KeyValuePair from "./KeyValuePair"; import KeyValuePair from "./KeyValuePair";
import {Manga} from "../Manga"; import {Manga} from "../Manga";
import React, {ChangeEventHandler, EventHandler, ReactElement} from "react"; import React, {EventHandler, ReactElement} from "react";
import {Job} from "../Job"; import {Job} from "../Job";
import Icon from '@mdi/react'; import Icon from '@mdi/react';
import { mdiTagTextOutline, mdiAccountEdit } from '@mdi/js'; import { mdiTagTextOutline, mdiAccountEdit } from '@mdi/js';
import MarkdownPreview from '@uiw/react-markdown-preview';
export default interface IManga{ export default interface IManga{
"sortName": string, "sortName": string,
@ -62,7 +63,7 @@ export function SearchResult(manga: IManga, jobsChanged: EventHandler<any>) : Re
{manga.authors.map(author => <li className="Manga-author" key={manga.internalId + "-author-" + author}> <Icon path={mdiAccountEdit} size={0.5} /> {author}</li>)} {manga.authors.map(author => <li className="Manga-author" key={manga.internalId + "-author-" + author}> <Icon path={mdiAccountEdit} size={0.5} /> {author}</li>)}
{manga.tags.map(tag => <li className="Manga-tag" key={manga.internalId + "-tag-" + tag}><Icon path={mdiTagTextOutline} size={0.5} /> {tag}</li>)} {manga.tags.map(tag => <li className="Manga-tag" key={manga.internalId + "-tag-" + tag}><Icon path={mdiTagTextOutline} size={0.5} /> {tag}</li>)}
</ul> </ul>
<p className="Manga-description">{manga.description}</p> <MarkdownPreview className="Manga-description" source={manga.description} style={{ backgroundColor: "transparent", color: "black", padding: 16 }} />
<button className="Manga-AddButton" onClick={(e) => { <button className="Manga-AddButton" onClick={(e) => {
Job.CreateJob(manga.internalId, "MonitorManga", "03:00:00").then(() => jobsChanged(manga.internalId)); Job.CreateJob(manga.internalId, "MonitorManga", "03:00:00").then(() => jobsChanged(manga.internalId));
}}>Monitor }}>Monitor

2118
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -12,5 +12,8 @@
"dev": "vite", "dev": "vite",
"build": "vite build", "build": "vite build",
"preview": "vite preview" "preview": "vite preview"
},
"dependencies": {
"@uiw/react-markdown-preview": "^5.1.3"
} }
} }