diff --git a/app/components/Aside/LinkElement.tsx b/app/components/Aside/LinkElement.tsx
index 68e446d..ec9d5a5 100644
--- a/app/components/Aside/LinkElement.tsx
+++ b/app/components/Aside/LinkElement.tsx
@@ -5,9 +5,19 @@ interface Props {
title: string;
link: string;
level?: number;
+ showIcons?: boolean;
+ iconSrcList?: string[];
+ onIconClickList?: (() => void)[];
}
-export const LinkElement = ({ title, link, level }: Props) => {
+export const LinkElement = ({
+ title,
+ link,
+ showIcons = true,
+ iconSrcList = [],
+ onIconClickList = [],
+ level,
+}: Props) => {
return (
@@ -15,6 +25,25 @@ export const LinkElement = ({ title, link, level }: Props) => {
{title}
+ {showIcons ? (
+
+ {iconSrcList?.map((iconSrc, idx) => (
+
{
+ e.stopPropagation();
+ onIconClickList[idx]();
+ }
+ : () => {}
+ }
+ />
+ ))}
+
+ ) : null}
);
diff --git a/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx b/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx
index bd37880..855ee68 100644
--- a/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx
+++ b/app/routes/_procted+/lectures+/$lectureId+/_layout/index.tsx
@@ -39,6 +39,7 @@ import TestCaseEditModal from "./TestCaseEditModal";
import { deleteProblem } from "~/API/problem";
import { deleteTestcase } from "~/API/testCase";
import DownloadMyCodesModal from "./DownloadMyCodesModal";
+import { LinkElement } from "~/components/Aside/LinkElement";
const LectureDetail = () => {
const [isLoading, setIsLoading] = useState(true);
const [lectures, setLectures] = useState([]);
@@ -238,6 +239,7 @@ const PracticeDetail = ({
const [isPracticeEditModalOpen, setIsPracticeEditModalOpen] = useState(false);
const [isProblemAddModalOpen, setIsProblemAddModalOpen] = useState(false);
const [isFoldableOpen, setIsFoldableOpen] = useState(false);
+ const { lectureId } = useParams();
useEffect(() => {
async function getData() {
try {
@@ -294,6 +296,11 @@ const PracticeDetail = ({
}}
iconSrcList={[plusSVG]}
/>
+
>
) : null}