:feat: add c7v graph

data/coop.ts

@@ -203,3 +203,50 @@ export const c7ivData = [
     outliers: [],
   },
 ];
+
+export const c7vDataKey = ["Outstanding", "Excellent", "Very Good", "Good"];
+
+export const c7vData = [
+  {
+    category: "1",
+    Outstanding: 48.9,
+    Excellent: 33.7,
+    "Very Good": 10.9,
+    Good: 4.3,
+  },
+  {
+    category: "2",
+    Outstanding: 44.6,
+    Excellent: 48.2,
+    "Very Good": 4.8,
+    Good: 1.2,
+  },
+  {
+    category: "3",
+    Outstanding: 54.9,
+    Excellent: 35.4,
+    "Very Good": 8.5,
+    Good: 0,
+  },
+  {
+    category: "4",
+    Outstanding: 49.4,
+    Excellent: 39.2,
+    "Very Good": 3.8,
+    Good: 0,
+  },
+  {
+    category: "5",
+    Outstanding: 54.9,
+    Excellent: 35.4,
+    "Very Good": 8.5,
+    Good: 0,
+  },
+  {
+    category: "6",
+    Outstanding: 30.4,
+    Excellent: 30.4,
+    "Very Good": 10.7,
+    Good: 3.6,
+  },
+];

pages/coop.tsx

@@ -1,4 +1,3 @@
-import { BarGraphHorizontal, BarGraphVertical } from "components/BarGraph";
 import {
   c1Data,
   c2Data,
@@ -9,8 +8,11 @@ import {
   c7iiData,
   c7iiiData,
   c7ivData,
+  c7vData,
+  c7vDataKey,
 } from "data/coop";
 import React from "react";
+import { Color } from "utils/Color";
 import { useWindowDimensions } from "utils/getWindowDimensions";
 import { useIsMobile } from "utils/isMobile";
 
@@ -19,6 +21,7 @@ import { BoxPlot } from "@/components/Boxplot";
 import { ComponentWrapper } from "@/components/ComponentWrapper";
 import { LineGraph } from "@/components/LineGraph";
 import { PieChart } from "@/components/PieChart";
+import { StackedBarGraphHorizontal } from "@/components/StackedBarGraph";
 
 import { WordCloud } from "../components/WordCloud";
 
@@ -173,6 +176,31 @@ export default function CoopPage() {
         </div>
       </ComponentWrapper>
 
+      {/* c7v */}
+      <ComponentWrapper
+        heading="What was your coop evaluation rating?"
+        bodyText="Ratings were pretty positive overall!"
+        align="right"
+      >
+        <div style={{ paddingRight: "150px" }}>
+          <StackedBarGraphHorizontal
+            width={600}
+            height={400}
+            keys={c7vDataKey}
+            colorRange={[
+              Color.primaryAccent,
+              Color.secondaryAccentLight,
+              Color.primaryAccentLighter,
+            ]}
+            data={c7vData}
+            margin={{
+              top: 20,
+              left: 20,
+            }}
+          />
+        </div>
+      </ComponentWrapper>
+
       <BottomNav
         leftPageLink="/"
         leftPageName="Academics"