From b61330cf98f822d25e3afc5f1984b9685c252cc3 Mon Sep 17 00:00:00 2001
From: alij <ali.josheghani2005@gmail.com>
Date: Thu, 29 Aug 2024 00:20:38 +0330
Subject: [PATCH] (feat) add description field web services in learn components

---
 .../tutorial/section/components/Leran.tsx     | 43 ++++++++++++++-----
 1 file changed, 33 insertions(+), 10 deletions(-)

diff --git a/src/pages/tutorial/section/components/Leran.tsx b/src/pages/tutorial/section/components/Leran.tsx
index dd2070f..1636ac9 100644
--- a/src/pages/tutorial/section/components/Leran.tsx
+++ b/src/pages/tutorial/section/components/Leran.tsx
@@ -5,6 +5,7 @@ import Alert from "../../../../components/alert/Alert";
 import { MdErrorOutline } from "react-icons/md";
 import Button from "../../../../components/button";
 import { saveAs } from "file-saver";
+import { Fragment } from "react/jsx-runtime";
 
 const getMediaType = (url: string) => {
   const extension = url.split(".").pop()?.toLowerCase();
@@ -73,16 +74,38 @@ const Learn = ({ activeTutorial }: LearnProps) => {
             data?.data?.result?.files.length > 0 && (
               <div className="w-full h-full p-3 mb-3 flex flex-col justify-center items-center gap-2 bg-gray-900 rounded-md shadow-xl">
                 {data.data.result.files.map(
-                  (file: { id: number; title: string; file: string }) => (
-                    <div
-                      className="w-full h-full flex justify-between gap-4 items-center"
-                      key={file.id}
-                    >
-                      <p className="text-xs md:text-sm">{file.title}</p>
-                      <Button extra="!py-1" onClick={() => saveAs(file.file)}>
-                        دانلود
-                      </Button>
-                    </div>
+                  (file: {
+                    id: number;
+                    title: string;
+                    file: string;
+                    description: string;
+                  }) => (
+                    <Fragment key={file.id}>
+                      {file?.description ? (
+                        <div className="w-full h-full flex flex-col gap-1 justify-center items-center p-3 border-2 border-secondTheme rounded-md">
+                          <div className="w-full h-full flex justify-between gap-4 items-center">
+                            <p className="text-xs md:text-sm">{file.title}</p>
+                            <Button
+                              extra="!py-1"
+                              onClick={() => saveAs(file.file)}
+                            >
+                              دانلود
+                            </Button>
+                          </div>
+                          <p className="w-full h-full text-xs md:text-sm text-gray-300"> <span className="w-auto h-auto px-1 bg-secondTheme text-gray-800 rounded-md">توضیحات</span> : {file?.description}</p>
+                        </div>
+                      ) : (
+                        <div className="w-full h-full flex justify-between gap-4 items-center">
+                          <p className="text-xs md:text-sm">{file.title}</p>
+                          <Button
+                            extra="!py-1"
+                            onClick={() => saveAs(file.file)}
+                          >
+                            دانلود
+                          </Button>
+                        </div>
+                      )}
+                    </Fragment>
                   )
                 )}
               </div>