refactor: capitalize legend labels

electricitymaps · Nov 1, 2024 · 994d3fa · 994d3fa
1 parent e90f70f
commit 994d3fa
Showing 1 changed file with 11 additions and 6 deletions.
diff --git a/web/src/features/charts/ProductionSourceLegendList.tsx b/web/src/features/charts/ProductionSourceLegendList.tsx
@@ -12,12 +12,17 @@ export default function ProductionSourceLegendList({
 }) {
   return (
     <div className={twMerge('flex w-fit flex-row flex-wrap gap-2.5 py-1', className)}>
-      {sources.map((source, index) => (
-        <span key={source} className="flex items-center gap-1 text-sm">
-          <ProductionSourceLegend key={index} electricityType={source} />
-          <p>{source}</p>
-        </span>
-      ))}
+      {sources.map((source, index) => {
+        const capitalizedLabel = `${source.charAt(0).toUpperCase()}${source.slice(1)}`;
+        return (
+          <span key={source} className="flex items-center gap-1 text-sm">
+            <ProductionSourceLegend key={index} electricityType={source} />
+            <p className="text-xs text-neutral-600 dark:text-gray-300">
+              {capitalizedLabel}
+            </p>
+          </span>
+        );
+      })}
     </div>
   );
 }