Housekeeping (#116)

* formatting (python) * formatting (frontend)
thearyadev · Jan 20, 2024 · 4ca4d42 · 4ca4d42
1 parent c67588d
commit 4ca4d42
Show file tree

Hide file tree

Showing 22 changed files with 512 additions and 442 deletions.
diff --git a/frontend/app/components/card/card.module.scss b/frontend/app/components/card/card.module.scss
@@ -1,22 +1,22 @@
 .card {
-    @apply border-2;
-    @apply p-3;
-    @apply rounded;
-    @apply mb-3
+  @apply border-2;
+  @apply p-3;
+  @apply rounded;
+  @apply mb-3;
 }
 
 .heading-container {
 }
 
-.title{
-    @apply text-lg;
-    @apply font-bold
+.title {
+  @apply text-lg;
+  @apply font-bold;
 }
 
-.subtitle{
-    @apply font-extralight text-center
+.subtitle {
+  @apply font-extralight text-center;
 }
 
 .cardBodyWrap {
-    @apply grid grid-cols-1 md:grid-cols-3 gap-4;
-}
+  @apply grid grid-cols-1 md:grid-cols-3 gap-4;
+}
diff --git a/frontend/app/components/card/card.tsx b/frontend/app/components/card/card.tsx
@@ -1,18 +1,25 @@
-import styles from "./card.module.scss"
+import styles from "./card.module.scss";
 
+const Card = ({
+  children,
+  title,
+  subtitle,
+  nowrap,
+}: {
+  children: React.ReactNode;
+  title: string;
+  subtitle?: string;
+  nowrap?: boolean;
+}) => {
+  return (
+    <div className={styles.card}>
+      <div className={styles.headingContainer}>
+        <h3 className={styles.title}>{title}</h3>
+        {subtitle ? <h4 className={styles.subtitle}>{subtitle}</h4> : null}
+      </div>
+      <div className={nowrap ? undefined : styles.cardBodyWrap}>{children}</div>
+    </div>
+  );
+};
 
-const Card = ({children, title, subtitle, nowrap}: { children: React.ReactNode, title: string, subtitle?: string, nowrap?:boolean }) => {
-    return (
-        <div className={styles.card}>
-            <div className={styles.headingContainer}>
-                <h3 className={styles.title}>{title}</h3>
-                {subtitle ? <h4 className={styles.subtitle}>{subtitle}</h4> : null}
-            </div>
-            <div className={ nowrap ? undefined : styles.cardBodyWrap}>
-                {children}
-            </div>
-        </div>
-    )
-}
-
-export default Card;
+export default Card;
diff --git a/frontend/app/components/charts/barChart.module.scss b/frontend/app/components/charts/barChart.module.scss
@@ -1,6 +1,5 @@
 .chartContainer {
-   .highcharts-title{
+  .highcharts-title {
     display: none;
-
   }
-}
+}
diff --git a/frontend/app/components/charts/barChart.tsx b/frontend/app/components/charts/barChart.tsx
@@ -1,73 +1,70 @@
 "use client";
 
-
-import * as Highcharts from 'highcharts';
+import * as Highcharts from "highcharts";
 import HighchartsReact from "highcharts-react-official";
-import {useRef} from "react";
-import styles from "./barChart.module.scss"
-import {HeroColors} from "@/app/components/charts/heroColors";
+import { useRef } from "react";
+import styles from "./barChart.module.scss";
+import { HeroColors } from "@/app/components/charts/heroColors";
 
 interface GraphData {
-    labels: string[]
-    values: number[]
+  labels: string[];
+  values: number[];
 }
 
 interface BarChartProps extends HighchartsReact.Props {
-    title: string;
-    graph: GraphData
-    maxY: number;
+  title: string;
+  graph: GraphData;
+  maxY: number;
 }
 
-
 const BarChart = (props: BarChartProps) => {
-    const {title, graph, maxY} = props;
-    const options: Highcharts.Options = {
-        title: {
-            // @ts-ignore
-            text: null,
-            margin: 0,
-        },
-        legend: {
-            enabled: false,
-        },
-        xAxis: {
-            categories: graph.labels,
-        },
-        series: [{
-            type: 'column',
-            name: "Occurrences",
-            data: graph.values.map((item, index) => {
-                return {y: item, color: HeroColors[graph.labels[index]]} // do lookup
-            })
-        }],
-        credits: {
-            enabled: false,
-        },
-        yAxis: {
-            min: 0,
-            max: maxY,
-            title: {
-                text: null,
-            },
-        }
-    };
-    const chartComponentRef = useRef<HighchartsReact.RefObject>(null)
-
-    return (
-        <div className={styles.chartContainer}>
-            <h5 className="text-center pb-2 capitalize">{title.toLowerCase()}</h5>
-            <HighchartsReact
-                id="gnomegnome"
-                highcharts={Highcharts}
-                options={options}
-                ref={chartComponentRef}
-                {...props}
-            />
+  const { title, graph, maxY } = props;
+  const options: Highcharts.Options = {
+    title: {
+      // @ts-ignore
+      text: null,
+      margin: 0,
+    },
+    legend: {
+      enabled: false,
+    },
+    xAxis: {
+      categories: graph.labels,
+    },
+    series: [
+      {
+        type: "column",
+        name: "Occurrences",
+        data: graph.values.map((item, index) => {
+          return { y: item, color: HeroColors[graph.labels[index]] }; // do lookup
+        }),
+      },
+    ],
+    credits: {
+      enabled: false,
+    },
+    yAxis: {
+      min: 0,
+      max: maxY,
+      title: {
+        text: null,
+      },
+    },
+  };
+  const chartComponentRef = useRef<HighchartsReact.RefObject>(null);
 
-        </div>
-
-    )
-
-}
+  return (
+    <div className={styles.chartContainer}>
+      <h5 className="text-center pb-2 capitalize">{title.toLowerCase()}</h5>
+      <HighchartsReact
+        id="gnomegnome"
+        highcharts={Highcharts}
+        options={options}
+        ref={chartComponentRef}
+        {...props}
+      />
+    </div>
+  );
+};
 
 export default BarChart;
diff --git a/frontend/app/components/charts/heroColors.ts b/frontend/app/components/charts/heroColors.ts
@@ -1,45 +1,45 @@
 interface HeroColor {
-        [key: string]: string;
+  [key: string]: string;
 }
 export const HeroColors: HeroColor = {
-        "Ana": "#8796B6",
-        "Ashe": "#808284",
-        "Baptiste": "#7DB8CE",
-        "Bastion": "#8c998c",
-        "Blank": "#000000",
-        "Brigitte": "#957D7E",
-        "Cassidy": "#b77e80",
-        "D.Va": "#F59CC8",
-        "Doomfist": "#947F80",
-        "Echo": "#A4CFF9",
-        "Genji": "#9FF67D",
-        "Hanzo": "#BDB894",
-        "Illari": "#B3A58A",
-        "Junker Queen": "#89B2D5",
-        "Junkrat": "#F0BE7C",
-        "Kiriko": "#D4868F",
-        "Lucio": "#91CD7D",
-        "Mei": "#81AFED",
-        "Mercy": "#F4EFBF",
-        "Moira": "#9d86e5",
-        "Orisa": "#76967B",
-        "Pharah": "#768BC8",
-        "Ramattra": "#9B89CE",
-        "Reaper": "#8D797E",
-        "Reinhardt": "#9EA8AB",
-        "Roadhog": "#BC977E",
-        "Sigma": "#9CA7AA",
-        "Sojourn": "#D88180",
-        "Soldier 76": "#838A9C",
-        "Sombra": "#887EBC",
-        "Symmetra": "#98C1D1",
-        "Torbjorn": "#C38786",
-        "Tracer": "#DE9D7D",
-        "Widowmaker": "#A583AB",
-        "Winston": "#A7AABE",
-        "Wrecking Ball": "#E09C7C",
-        "Zarya": "#F291BB",
-        "Zenyatta": "#F5EC91",
-        "LifeWeaver": "#E0B6C5",
-        "Mauga": "#E0B6C5"
-}
+  Ana: "#8796B6",
+  Ashe: "#808284",
+  Baptiste: "#7DB8CE",
+  Bastion: "#8c998c",
+  Blank: "#000000",
+  Brigitte: "#957D7E",
+  Cassidy: "#b77e80",
+  "D.Va": "#F59CC8",
+  Doomfist: "#947F80",
+  Echo: "#A4CFF9",
+  Genji: "#9FF67D",
+  Hanzo: "#BDB894",
+  Illari: "#B3A58A",
+  "Junker Queen": "#89B2D5",
+  Junkrat: "#F0BE7C",
+  Kiriko: "#D4868F",
+  Lucio: "#91CD7D",
+  Mei: "#81AFED",
+  Mercy: "#F4EFBF",
+  Moira: "#9d86e5",
+  Orisa: "#76967B",
+  Pharah: "#768BC8",
+  Ramattra: "#9B89CE",
+  Reaper: "#8D797E",
+  Reinhardt: "#9EA8AB",
+  Roadhog: "#BC977E",
+  Sigma: "#9CA7AA",
+  Sojourn: "#D88180",
+  "Soldier 76": "#838A9C",
+  Sombra: "#887EBC",
+  Symmetra: "#98C1D1",
+  Torbjorn: "#C38786",
+  Tracer: "#DE9D7D",
+  Widowmaker: "#A583AB",
+  Winston: "#A7AABE",
+  "Wrecking Ball": "#E09C7C",
+  Zarya: "#F291BB",
+  Zenyatta: "#F5EC91",
+  LifeWeaver: "#E0B6C5",
+  Mauga: "#E0B6C5",
+};