update

client/src/components/LeaderboardSection.jsx

@@ -1,5 +1,15 @@
 import React, { useState, useMemo } from "react";
-import { Typography, Grid, Box, Button, Collapse, Stack } from "@mui/material";
+import {
+  Typography,
+  Grid,
+  Box,
+  Button,
+  Collapse,
+  Stack,
+  Accordion,
+  AccordionSummary,
+  AccordionDetails,
+} from "@mui/material";
 import { alpha } from "@mui/material/styles";
 import LeaderboardCard from "./LeaderboardCard";
 import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
@@ -168,86 +178,115 @@ const LeaderboardSection = ({
       </Box>
 
       {languages && selectedCategory === "language" && (
-        <>
-          <Typography
-            variant="body2"
-            color="text.secondary"
-            sx={{ mb: 2, fontWeight: 500 }}
-          >
-            Languages represented in this category
-          </Typography>
-          <Box
+        <Accordion
+          defaultExpanded={false}
+          elevation={0}
+          sx={{
+            mb: filteredLeaderboards.length > 0 ? 4 : 2,
+            "&:before": {
+              display: "none",
+            },
+            backgroundColor: "transparent",
+          }}
+        >
+          <AccordionSummary
+            expandIcon={<ExpandMoreIcon sx={{ fontSize: 20 }} />}
             sx={{
-              display: "flex",
-              flexWrap: "wrap",
-              gap: 1,
-              mb: filteredLeaderboards.length > 0 ? 4 : 2,
-              mx: -0.5,
+              padding: 0,
+              "& .MuiAccordionSummary-content": {
+                margin: 0,
+              },
+              "& .MuiAccordionSummary-expandIconWrapper": {
+                position: "relative",
+                right: "unset",
+                marginLeft: 1,
+                transform: "none",
+              },
             }}
           >
-            {languages.map((lang) => {
-              const isActive = selectedLanguage === lang;
-              const count = languageStats?.get(lang) || 0;
+            <Box sx={{ display: "flex", alignItems: "center" }}>
+              <Typography
+                variant="body2"
+                color="text.secondary"
+                sx={{ fontWeight: 500 }}
+              >
+                Languages represented in this category
+              </Typography>
+            </Box>
+          </AccordionSummary>
+          <AccordionDetails sx={{ padding: 0 }}>
+            <Box
+              sx={{
+                display: "flex",
+                flexWrap: "wrap",
+                gap: 1,
+                mx: -0.5,
+              }}
+            >
+              {languages.map((lang) => {
+                const isActive = selectedLanguage === lang;
+                const count = languageStats?.get(lang) || 0;
 
-              return (
-                <Button
-                  key={lang}
-                  onClick={() => setSelectedLanguage(isActive ? null : lang)}
-                  variant={isActive ? "contained" : "outlined"}
-                  size="small"
-                  sx={{
-                    textTransform: "none",
-                    m: 0.125,
-                    backgroundColor: (theme) =>
-                      isActive
-                        ? undefined
-                        : theme.palette.mode === "dark"
-                        ? "background.paper"
-                        : "white",
-                    "&:hover": {
+                return (
+                  <Button
+                    key={lang}
+                    onClick={() => setSelectedLanguage(isActive ? null : lang)}
+                    variant={isActive ? "contained" : "outlined"}
+                    size="small"
+                    sx={{
+                      textTransform: "none",
+                      m: 0.125,
                       backgroundColor: (theme) =>
                         isActive
                           ? undefined
                           : theme.palette.mode === "dark"
                           ? "background.paper"
                           : "white",
-                    },
-                    "& .MuiTouchRipple-root": {
+                      "&:hover": {
+                        backgroundColor: (theme) =>
+                          isActive
+                            ? undefined
+                            : theme.palette.mode === "dark"
+                            ? "background.paper"
+                            : "white",
+                      },
+                      "& .MuiTouchRipple-root": {
+                        transition: "none",
+                      },
                       transition: "none",
-                    },
-                    transition: "none",
-                  }}
-                >
-                  {lang}
-                  <Box
-                    component="span"
-                    sx={{
-                      display: "inline-flex",
-                      alignItems: "center",
-                      gap: 0.75,
-                      color: isActive ? "inherit" : "text.secondary",
-                      ml: 0.75,
                     }}
                   >
+                    {lang}
                     <Box
                       component="span"
-                      sx={(theme) => ({
-                        width: "4px",
-                        height: "4px",
-                        borderRadius: "100%",
-                        backgroundColor: alpha(
-                          theme.palette.text.primary,
-                          theme.palette.mode === "dark" ? 0.2 : 0.15
-                        ),
-                      })}
-                    />
-                    {count}
-                  </Box>
-                </Button>
-              );
-            })}
-          </Box>
-        </>
+                      sx={{
+                        display: "inline-flex",
+                        alignItems: "center",
+                        gap: 0.75,
+                        color: isActive ? "inherit" : "text.secondary",
+                        ml: 0.75,
+                      }}
+                    >
+                      <Box
+                        component="span"
+                        sx={(theme) => ({
+                          width: "4px",
+                          height: "4px",
+                          borderRadius: "100%",
+                          backgroundColor: alpha(
+                            theme.palette.text.primary,
+                            theme.palette.mode === "dark" ? 0.2 : 0.15
+                          ),
+                        })}
+                      />
+                      {count}
+                    </Box>
+                  </Button>
+                );
+              })}
+            </Box>
+          </AccordionDetails>
+        </Accordion>
       )}
 
       {filteredLeaderboards.length === 0 ? (

client/src/components/Navigation/Navigation.jsx

@@ -123,8 +123,8 @@ const Navigation = ({ onToggleTheme, mode }) => {
                 How to submit
               </Box>
             </Link>
-            <Separator />
-            <MuiLink
+            {/*<Separator />
+             <MuiLink
               href="https://huggingface.co/docs/leaderboards/open_llm_leaderboard/about"
               target="_blank"
               rel="noopener noreferrer"
@@ -143,7 +143,7 @@ const Navigation = ({ onToggleTheme, mode }) => {
             >
               About
               <OpenInNewIcon />
-            </MuiLink>
+            </MuiLink> */}
           </Box>
           <Separator />
           <Tooltip

server/server.py

@@ -1,6 +1,7 @@
 from fastapi import FastAPI, HTTPException, Request
 from fastapi.middleware.cors import CORSMiddleware
 from fastapi.staticfiles import StaticFiles
+from fastapi.responses import FileResponse
 from apscheduler.schedulers.background import BackgroundScheduler
 from datetime import datetime
 import os
@@ -88,9 +89,6 @@ def fetch_leaderboards():
 # Initial fetch
 fetch_leaderboards()
 
-# Mount static files
-app.mount("/static", StaticFiles(directory="static", html=True), name="static")
-
 @app.get("/api/leaderboards")
 async def get_leaderboards():
     """Get leaderboards data from cache"""
@@ -144,6 +142,9 @@ async def handle_webhook(request: Request):
         logging.error(f"Error processing webhook: {str(e)}", exc_info=True)
         raise HTTPException(status_code=500, detail=f"Failed to process webhook: {str(e)}")
 
+# Mount static files for the React client
+app.mount("/", StaticFiles(directory="static", html=True), name="static")
+
 if __name__ == "__main__":
     import uvicorn
     uvicorn.run("server:app", host=API_HOST, port=API_PORT, reload=True)