From 8a1ce0f8fa3115c5b38179f46dc4d2e66c5c91d7 Mon Sep 17 00:00:00 2001 From: mahdi Date: Tue, 31 May 2022 10:20:06 +0430 Subject: [PATCH] update src/components/Accordion/AccordionDesign1/index.js and src/components/Code/index.js --- .../Accordion/AccordionDesign1/index.js | 280 ++++++++---------- src/components/Code/index.js | 2 - 2 files changed, 131 insertions(+), 151 deletions(-) diff --git a/src/components/Accordion/AccordionDesign1/index.js b/src/components/Accordion/AccordionDesign1/index.js index b10a830..672c0dd 100644 --- a/src/components/Accordion/AccordionDesign1/index.js +++ b/src/components/Accordion/AccordionDesign1/index.js @@ -3,9 +3,9 @@ import CircleInCircle from "../../MiniComponents/CircleInCircle"; import Button from "../../ButtonDesign/Button"; import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd"; -const AccordionDesign1 = ({ courses, vod }) => { +const AccordionDesign1 = ({ items, vod }) => { const [activeAccordion, setActiveAccordion] = useState(null); - const [accordions, updateAccordion] = useState(courses); + const [accordions, updateAccordion] = useState(items); function handleOnDragEnd(result) { if (!result.destination) return; @@ -18,137 +18,135 @@ const AccordionDesign1 = ({ courses, vod }) => { } return ( - <> - - - {(provided) => ( -
- {courses.map((course, index) => ( - - {(provided) => ( + + + {(provided) => ( +
+ {items.map((item, index) => ( + + {(provided) => ( +
+ {/* parent */}
+ setActiveAccordion( + activeAccordion === item ? null : item + ) + } > - {/* parent */} -
- setActiveAccordion( - activeAccordion === course ? null : course - ) + +

{item.title}

+ {vod && ( +
+

+ دقیقه: + {item.min} +

+
+

+ ویدیو: + {item.video} +

+
+ )} + - -

{course.title}

- {vod && ( -
-

- دقیقه: - {course.min} -

-
-

- ویدیو: - {course.video} -

+ alt="" + class="w-3 ml-2" + /> +
+ {/* child */} + {activeAccordion === item && + item.subItems.map((subItem, i) => ( +
+
+ {vod === !true && ( + line + )} + + {i + 1} +
- )} - -
- {/* child */} - {activeAccordion === course && - course.lessons.map((lesson, i) => ( -
-
- {vod === !true && ( +
+

{subItem.name}

+
+ {vod ? ( + <> +
+

+ دقیقه: + {item.min} +

+
+ + ) : ( + <> line - )} - - {i + 1} - -
-
-

{lesson.name}

-
- {vod ? ( - <> -
-

- دقیقه: - {course.min} -

-
- - ) : ( - <> - delete-button - edit-button - - )} -
+ edit-button + + )}
- ))} - {provided.placeholder} -
- )} - - ))} -
- )} -
-
- + + ))} + {provided.placeholder} + + )} +
+ ))} +
+ )} +
+
); }; @@ -157,13 +155,13 @@ export default AccordionDesign1; AccordionDesign1.defaultProps = { vod: false, - courses: [ + items: [ { title: "بخش اول: فصل اول جدایی و رهایی: آیا بازگشت نزدیک است؟ دیگران چه می گونید؟", video: 4, min: 30, - lessons: [ + subItems: [ { name: "چگونه با رژیم مناسب بدن سالم تری داشته باشیم؟", }, @@ -177,10 +175,11 @@ AccordionDesign1.defaultProps = { }, { title: - "بخش اول: فصل اول جدایی و رهایی: آیا بازگشت نزدیک است؟ دیگران چه می گونید؟", + "بخش دوم: فصل اول جدایی و رهایی: آیا بازگشت نزدیک است؟ دیگران چه می گونید2؟", video: 4, min: 30, - lessons: [ + + subItems: [ { name: "چگونه با رژیم مناسب بدن سالم تری داشته باشیم؟", }, @@ -194,10 +193,10 @@ AccordionDesign1.defaultProps = { }, { title: - "بخش اول: فصل اول جدایی و رهایی: آیا بازگشت نزدیک است؟ دیگران چه می گونید؟", + "بخش سوم: فصل اول جدایی و رهایی: آیا بازگشت نزدیک است؟ دیگران چه می گونید3؟", video: 4, min: 30, - lessons: [ + subItems: [ { name: "چگونه با رژیم مناسب بدن سالم تری داشته باشیم؟", }, @@ -211,20 +210,3 @@ AccordionDesign1.defaultProps = { }, ], }; - -{ - /* monaco */ -} - -// import MonacoEditor from "react-monaco-editor";‍ - -// diff --git a/src/components/Code/index.js b/src/components/Code/index.js index 5d8394b..c700b32 100644 --- a/src/components/Code/index.js +++ b/src/components/Code/index.js @@ -1,6 +1,5 @@ import { useState } from "react"; import copyIcon from "./copy.png"; -import MonacoEditor from "react-monaco-editor"; function Code({ code }) { const [copied, setCopied] = useState(false); @@ -14,7 +13,6 @@ function Code({ code }) { /* Copy the text inside the text field */ navigator.clipboard.writeText(copyText); }; - return (