feat: Add ML Commons project to Tattle's landing page (#231)

* Add ML Commons project to Tattle's landing page

* Move ML Commons project to the top of Other Projects section

* Updated safety-benchmark URL to ml-commons-safety-benchmark

* Updated styling for 'This project has concluded' section

* Updated project team section to use a 3-column grid for improved presentation

* Updated team member layout: Removed vertical spacing between names in the grid.

* Increase vertical spacing between team members' names using gap-y-2

* Feat: Add and display ml-commons-report-hero.png on the page

Author: Mahimahto

src/pages/products/index.jsx

@@ -14,6 +14,11 @@ import { getImage, getSrc } from "gatsby-plugin-image";
 // }
 
 var other_projects = [
+  {
+    heading: "Building a Safety Benchmark Dataset in Hindi",
+    description: "This project aimed to build a dataset of prompts in Hindi as part of ML Commons' safety benchmark.",
+    target: "/products/ml-commons-safety-benchmark"
+  },
   {
     heading: "Developing Standardized Metrics for Github",
     description: "This project tries to understand how data from GitHub platform usage can contribute to research in international development, public policy, and economics.",
@@ -43,8 +48,7 @@ var other_projects = [
     heading: "Khoj",
     description: "Khoj tells you if an image has appeared in a fact-checking article. Khoj indexes and searches through data scraped from IFCN certified fact checking sites.",
     target: "/products/khoj"
-  },
-
+  }
 ]
 
 const ResponsiveLayoutDatasets = ({ children }) => {

src/pages/products/ml-commons-safety-benchmark.mdx

@@ -0,0 +1,50 @@
+import DefaultLayoutNarrow from "@/components/default-layout-narrow";
+
+export default function Layout({ children }) {
+  return <DefaultLayoutNarrow>{children}</DefaultLayoutNarrow>;
+}
+
+import { Box, Text, Image } from "grommet";
+import { LatestProductBlogsUpdates } from "../../components/LatestProductBlogsUpdates";
+import mlCommonsImage from "../../images/ml-commons-report-hero.png";
+
+# Building a Safety Benchmark Dataset in Hindi
+
+<Box 
+  background="neutral-1" 
+  pad={{ horizontal: "small", vertical: "xxsmall" }} 
+  round="xsmall" 
+  align="center"
+  width="fit-content"
+>
+  <Text size="small">This project has concluded.</Text>
+</Box>
+
+<Box align="center" margin={{ top: "20px" }}>
+  <Image src={mlCommonsImage} alt="ML Commons Report" fit="cover" />
+</Box>
+
+In 2024, Tattle was selected in this pilot project to build a dataset of prompts in Hindi as part of ML Commons' safety benchmark.
+We followed Uli's participatory approach and created 2000 prompts in Hindi on two hazard categories: hate and sex-related crimes.
+These prompts were created by an expert group, consisting of individuals with expertise in journalism, social work, feminist advocacy, 
+gender studies, fact-checking, political campaigning, education, psychology, and research.
+
+## Project Team
+<div class="grid grid-cols-3 gap-x-4 gap-y-2">
+  <p class="m-0">Mansi Gupta</p>
+  <p class="m-0">Srravya C</p>
+  <p class="m-0">Vamsi Krishna Pothuru</p>
+  <p class="m-0">Saumya Gupta</p>
+  <p class="m-0">Tarunima Prabhakar</p>
+  <p class="m-0">Aatman Vaidya</p>
+  <p class="m-0">Kaustubha Kalidindi</p>
+  <p class="m-0">Denny George</p>
+  <p class="m-0">Maanas B</p>
+</div>
+
+
+## Outcomes
+Our report, outlining the process of developing this dataset, is available here:  
+[View Report](https://drive.google.com/file/d/1OKpZ7qqT6hjbzaeUC7UnBF1oCTn7c70z/view)
+
+<LatestProductBlogsUpdates projects={["ml-commons-safety-benchmark"]}/>