diff --git a/src/pages/Homebrew/HomebrewEditorPage/AboutSection/AboutSection.tsx b/src/pages/Homebrew/HomebrewEditorPage/AboutSection/AboutSection.tsx index ba38175e..87e174fa 100644 --- a/src/pages/Homebrew/HomebrewEditorPage/AboutSection/AboutSection.tsx +++ b/src/pages/Homebrew/HomebrewEditorPage/AboutSection/AboutSection.tsx @@ -132,12 +132,15 @@ export function AboutSection(props: AboutSectionProps) { /> </Grid> )} - <Grid item xs={12}> - <Description - expansionId={id} - description={details.description ?? ""} - /> - </Grid> + {(!!details.description || isEditor) && ( + <Grid item xs={12}> + <Description + expansionId={id} + description={details.description ?? ""} + isEditor={isEditor} + /> + </Grid> + )} {details.type === PackageTypes.Expansion && ( <Grid item xs={12}> <Typography variant="overline">Expansion For</Typography> diff --git a/src/pages/Homebrew/HomebrewEditorPage/AboutSection/Description.tsx b/src/pages/Homebrew/HomebrewEditorPage/AboutSection/Description.tsx index 17aa346d..9664887a 100644 --- a/src/pages/Homebrew/HomebrewEditorPage/AboutSection/Description.tsx +++ b/src/pages/Homebrew/HomebrewEditorPage/AboutSection/Description.tsx @@ -1,4 +1,5 @@ import { Box } from "@mui/material"; +import { MarkdownRenderer } from "components/shared/MarkdownRenderer"; import { MarkdownEditor } from "components/shared/RichTextEditor/MarkdownEditor"; import { useState } from "react"; import { useStore } from "stores/store"; @@ -6,10 +7,11 @@ import { useStore } from "stores/store"; export interface DescriptionProps { expansionId: string; description?: string; + isEditor?: boolean; } export function Description(props: DescriptionProps) { - const { expansionId, description } = props; + const { expansionId, description, isEditor } = props; const updateDetails = useStore((store) => store.homebrew.updateExpansion); const [localDescription, setLocalDescription] = useState(description ?? ""); @@ -20,12 +22,16 @@ export function Description(props: DescriptionProps) { return ( <Box maxWidth={(theme) => theme.breakpoints.values.md}> - <MarkdownEditor - label={"Description"} - content={localDescription ?? ""} - onChange={(value) => setLocalDescription(value)} - onBlur={handleSave} - /> + {isEditor ? ( + <MarkdownEditor + label={"Description"} + content={localDescription ?? ""} + onChange={(value) => setLocalDescription(value)} + onBlur={handleSave} + /> + ) : ( + <MarkdownRenderer markdown={description ?? ""} /> + )} </Box> ); }