From e0cff727a0e03bb981c089d0ea2c72cff2f0fce3 Mon Sep 17 00:00:00 2001
From: Shanks0465 <umashanks99@gmail.com>
Date: Wed, 28 Aug 2024 22:03:03 +0530
Subject: [PATCH] Added Next Imagge to Datasets

---
 frontend/components/Datasets.tsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/frontend/components/Datasets.tsx b/frontend/components/Datasets.tsx
index 2912d01..9a2eb91 100644
--- a/frontend/components/Datasets.tsx
+++ b/frontend/components/Datasets.tsx
@@ -21,6 +21,15 @@ import axios from "axios";
 import { useQuery } from "react-query";
 import { API_URL } from "@/app/config";
 import { imagePrefix } from "@/app/config";
+import { FaFileAudio, FaFileAlt } from "react-icons/fa";
+
+const datasetIcons: { [key: string]: React.ReactElement } = {
+  nmt: <FaFileAlt color="orange" size={25} />,
+  llm: <FaFileAlt color="orange" size={25} />,
+  asr: <FaFileAudio color="orange" size={25} />,
+  tts: <FaFileAudio color="orange" size={25} />,
+  xlit: <FaFileAlt color="orange" size={25} />,
+};
 
 interface FeatureProps {
   title: string;
@@ -58,7 +67,7 @@ const Feature = ({ title, icon }: FeatureProps) => {
         bg={"gray.100"}
         mb={1}
       >
-        <Image src={icon} alt="Icon" width={50} height={50} />
+        {datasetIcons[icon]}
       </Flex>
       <Text fontWeight={600}>{title}</Text>
     </Stack>
@@ -159,7 +168,7 @@ export default function Datasets() {
               <Card key={dataset.title} border={"solid"} borderColor={"orange"}>
                 <CardBody>
                   <Feature
-                    icon={`${imagePrefix}/assets/icons/llm.png`}
+                    icon={dataset.area.toLowerCase()}
                     title={dataset.title}
                   />
                 </CardBody>