feat(playground): add support for C++ and TypeScript in code editor and sidebar

This commit is contained in:
ngc2207 2024-12-17 18:22:51 +08:00
parent 22225ed042
commit a9ddf03e93
2 changed files with 15 additions and 1 deletions

View File

@ -26,8 +26,10 @@ const ADDITIONAL_THEMES = [
const ADDITIONAL_LANGUAGES = [ const ADDITIONAL_LANGUAGES = [
"c", "c",
"cpp",
"java", "java",
"python", "python",
"typescript",
] as const satisfies Parameters<typeof createHighlighter>[0]["langs"]; ] as const satisfies Parameters<typeof createHighlighter>[0]["langs"];
export function CodeEditor() { export function CodeEditor() {

View File

@ -1,5 +1,12 @@
"use client"; "use client";
import {
COriginal,
CplusplusOriginal,
JavaOriginal,
PythonOriginal,
TypescriptOriginal,
} from "devicons-react";
import * as React from "react"; import * as React from "react";
import { import {
Sidebar, Sidebar,
@ -22,7 +29,6 @@ import {
import * as actions from "@/actions"; import * as actions from "@/actions";
import { useTranslations } from "next-intl"; import { useTranslations } from "next-intl";
import { useSession } from "next-auth/react"; import { useSession } from "next-auth/react";
import { COriginal, JavaOriginal, PythonOriginal } from "devicons-react";
import { useCodeEditorStore } from "@/store/codeEditorStore"; import { useCodeEditorStore } from "@/store/codeEditorStore";
import { ChevronRight, File, Folder, FolderOpen } from "lucide-react"; import { ChevronRight, File, Folder, FolderOpen } from "lucide-react";
@ -137,10 +143,14 @@ function Tree({ item }: { item: FileTree }) {
if (fileExtension === "c") { if (fileExtension === "c") {
fileIcon = <COriginal />; fileIcon = <COriginal />;
} else if (fileExtension === "cpp") {
fileIcon = <CplusplusOriginal />;
} else if (fileExtension === "java") { } else if (fileExtension === "java") {
fileIcon = <JavaOriginal />; fileIcon = <JavaOriginal />;
} else if (fileExtension === "py") { } else if (fileExtension === "py") {
fileIcon = <PythonOriginal />; fileIcon = <PythonOriginal />;
} else if (fileExtension === "ts") {
fileIcon = <TypescriptOriginal />;
} }
const [isOpen, setIsOpen] = React.useState(false); const [isOpen, setIsOpen] = React.useState(false);
@ -148,8 +158,10 @@ function Tree({ item }: { item: FileTree }) {
const langMap: { [key: string]: string } = { const langMap: { [key: string]: string } = {
c: "c", c: "c",
cpp: "cpp",
java: "java", java: "java",
py: "python", py: "python",
ts: "typescript",
}; };
const handleFileClick = async () => { const handleFileClick = async () => {