add render md by default option, fix chat role type
This commit is contained in:
@@ -250,7 +250,8 @@ export default function Message(props: { messageIndex: number }) {
|
||||
|
||||
const chat = chatStore.history[messageIndex];
|
||||
const [showEdit, setShowEdit] = useState(false);
|
||||
const [renderMarkdown, setRenderWorkdown] = useState(false);
|
||||
const { defaultRenderMD } = useContext(AppContext);
|
||||
const [renderMarkdown, setRenderWorkdown] = useState(defaultRenderMD);
|
||||
const [renderColor, setRenderColor] = useState(false);
|
||||
|
||||
const { toast } = useToast();
|
||||
@@ -293,7 +294,7 @@ export default function Message(props: { messageIndex: number }) {
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
{chat.role === "assistant" || chat.role === "received" ? (
|
||||
{chat.role === "assistant" ? (
|
||||
<div className="border-b border-border dark:border-border-dark pb-4">
|
||||
{chat.reasoning_content ? (
|
||||
<Collapsible className="mb-3 w-[450px]">
|
||||
@@ -322,14 +323,12 @@ export default function Message(props: { messageIndex: number }) {
|
||||
<MessageDetail chat={chat} renderMarkdown={renderMarkdown} />
|
||||
) : chat.tool_calls ? (
|
||||
<MessageToolCall chat={chat} copyToClipboard={copyToClipboard} />
|
||||
) : chat.role === "tool" ? (
|
||||
<MessageToolResp chat={chat} copyToClipboard={copyToClipboard} />
|
||||
) : renderMarkdown ? (
|
||||
<div className="message-content max-w-full md:max-w-[75%]">
|
||||
<Markdown
|
||||
remarkPlugins={[remarkMath]}
|
||||
rehypePlugins={[rehypeKatex]}
|
||||
break={true}
|
||||
//break={true}
|
||||
components={{
|
||||
code: ({ children }) => (
|
||||
<code className="bg-muted px-1 py-0.5 rounded">
|
||||
|
||||
@@ -477,6 +477,29 @@ const Number = (props: {
|
||||
);
|
||||
};
|
||||
|
||||
const DefaultRenderMDCheckbox = () => {
|
||||
const { defaultRenderMD, setDefaultRenderMD } = useContext(AppContext);
|
||||
return (
|
||||
<div className="flex items-center space-x-2">
|
||||
<div className="flex items-center">
|
||||
<Checkbox
|
||||
id="defaultRenderMD-checkbox"
|
||||
checked={defaultRenderMD}
|
||||
onCheckedChange={(checked: boolean) => {
|
||||
setDefaultRenderMD(checked);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<label
|
||||
htmlFor="defaultRenderMD-checkbox"
|
||||
className="flex items-center gap-2 font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
|
||||
>
|
||||
Render Markdown by Default
|
||||
</label>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const Choice = (props: {
|
||||
field: "streamMode" | "develop_mode" | "json_mode" | "logprobs";
|
||||
help: string;
|
||||
@@ -909,6 +932,7 @@ export default (props: {}) => {
|
||||
help="开发者模式,开启后会显示更多选项及功能"
|
||||
{...props}
|
||||
/>
|
||||
<DefaultRenderMDCheckbox />
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
<Label>Language</Label>
|
||||
|
||||
@@ -45,6 +45,8 @@ interface AppContextType {
|
||||
setTemplateAPIsImageGen: (t: TemplateAPI[]) => void;
|
||||
templateTools: TemplateTools[];
|
||||
setTemplateTools: (t: TemplateTools[]) => void;
|
||||
defaultRenderMD: boolean;
|
||||
setDefaultRenderMD: (b: boolean) => void;
|
||||
}
|
||||
|
||||
interface AppChatStoreContextType {
|
||||
@@ -297,6 +299,14 @@ export function App() {
|
||||
);
|
||||
_setTemplateTools(templateTools);
|
||||
};
|
||||
const [defaultRenderMD, _setDefaultRenderMD] = useState(
|
||||
localStorage.getItem("defaultRenderMD") === "true"
|
||||
);
|
||||
const setDefaultRenderMD = (defaultRenderMD: boolean) => {
|
||||
localStorage.setItem("defaultRenderMD", `${defaultRenderMD}`);
|
||||
_setDefaultRenderMD(defaultRenderMD);
|
||||
};
|
||||
|
||||
console.log("[PERFORMANCE!] reading localStorage");
|
||||
|
||||
return (
|
||||
@@ -317,6 +327,8 @@ export function App() {
|
||||
setTemplateAPIsImageGen,
|
||||
templateTools,
|
||||
setTemplateTools,
|
||||
defaultRenderMD,
|
||||
setDefaultRenderMD,
|
||||
}}
|
||||
>
|
||||
<Sidebar>
|
||||
|
||||
Reference in New Issue
Block a user