diff --git a/src/app/globals.css b/src/app/globals.css
index e6d1700..c7bbd41 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -1,4 +1,5 @@
+@import url("https://fonts.googleapis.com/css2?family=Quantico:wght@400;700&display=swap");
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
-@import url('https://fonts.googleapis.com/css2?family=Quantico:wght@400;700&display=swap');
diff --git a/src/app/page.tsx b/src/app/page.tsx
index b5db5b6..9c243db 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,41 +1,46 @@
 import SubscriberTable, {
-	type SubscriberDataTableProp,
+  type SubscriberDataTableProp,
 } from "../components/SubscriberTable/SubscriberTable";
 import TitleBar from "../components/TitleBar/TitleBar";
 
 async function Home() {
-	const graphURL = process.env.NEXT_PUBLIC_GRAPH_URL;
-	const data: SubscriberDataTableProp = await getData();
-	return (
-		<>
-			<TitleBar title="PhaseTracker" backgroundColor="black" />
-			<div
-				className="sm:block hidden mt-4"
-				style={{ overflow: "hidden", height: "105vh", position: "relative" }}
-			>
-				<iframe
-					src={graphURL}
-					style={{ position: "absolute", top: 0, left: 0 }}
-					width="100%"
-					height="100%"
-				></iframe>
-			</div>
-			<SubscriberTable {...data} />
-		</>
-	);
+  const graphURL = process.env.NEXT_PUBLIC_GRAPH_URL;
+  const data: SubscriberDataTableProp = await getData();
+  return (
+    <>
+      <TitleBar title="PhaseTracker" backgroundColor="black" />
+      <div
+        className="sm:block hidden mt-4"
+        style={{ overflow: "hidden", height: "105vh", position: "relative" }}
+      >
+        <iframe
+          title="Phase Connect Subscriber Count Graph"
+          src={graphURL}
+          style={{ position: "absolute", top: 0, left: 0 }}
+          width="100%"
+          height="100%"
+        />
+      </div>
+      <SubscriberTable {...data} />
+    </>
+  );
 }
 
 async function getData() {
-	const apiUrl = process.env.NEXT_PUBLIC_API_URL_TESTING;
-	const response = await fetch(apiUrl + "/api/subscribers", {
-		headers: {
-			"Cache-Control": "no-cache",
-		},
-		cache: "no-cache",
-	});
-	if (!response.ok) {
-		console.log(response.statusText);
-	}
-	return response.json();
+  const apiUrl = process.env.NEXT_PUBLIC_API_URL_TESTING;
+  const endpoint = "/api/subscribers";
+  const headers = {
+    "Cache-Control": "no-cache",
+  };
+  const cacheOption = "no-cache";
+
+  const response = await fetch(`${apiUrl}${endpoint}`, {
+    headers: headers,
+    cache: cacheOption,
+  });
+  if (!response.ok) {
+    console.log(response.statusText);
+  }
+  return response.json();
 }
 export default Home;
diff --git a/src/components/DataChart/DataChart.tsx b/src/components/DataChart/DataChart.tsx
index 3b8304a..7d95abe 100644
--- a/src/components/DataChart/DataChart.tsx
+++ b/src/components/DataChart/DataChart.tsx
@@ -1,82 +1,81 @@
 import {
-	CategoryScale,
-	Chart as ChartJS,
-	Legend,
-	LineElement,
-	LinearScale,
-	PointElement,
-	Title,
-	Tooltip,
+  CategoryScale,
+  Chart as ChartJS,
+  Legend,
+  LineElement,
+  LinearScale,
+  PointElement,
+  Title,
+  Tooltip,
 } from "chart.js";
 import type React from "react";
 import { Line } from "react-chartjs-2";
 
 ChartJS.register(
-	CategoryScale,
-	LinearScale,
-	PointElement,
-	LineElement,
-	Title,
-	Tooltip,
-	Legend,
+  CategoryScale,
+  LinearScale,
+  PointElement,
+  LineElement,
+  Title,
+  Tooltip,
+  Legend,
 );
 
 interface DataChartProps {
-	chartData?: any;
-	graphTitle?: string;
-	fullData?: boolean;
-	overrideBorderColor?: string;
-	overrideBGColor?: string;
+  chartData?: any;
+  graphTitle?: string;
+  fullData?: boolean;
+  overrideBorderColor?: string;
+  overrideBGColor?: string;
 }
 
 const DataChart: React.FC<DataChartProps> = ({
-	chartData,
-	graphTitle,
-	fullData,
-	overrideBGColor,
-	overrideBorderColor,
+  chartData,
+  graphTitle,
+  fullData,
+  overrideBGColor,
+  overrideBorderColor,
 }) => {
-	const options = {
-		responsive: true,
-		plugins: {
-			legend: {
-				position: "top" as const,
-			},
-			title: {
-				display: true,
-				text: graphTitle || "Historical Subscriber Data",
-				font: {
-					size: 18,
-				},
-			},
-		},
-		scales: {
-			x: {
-				ticks: {
-					autoSkip: true,
-					maxTicksLimit: 10,
-				},
-			},
-		},
-	};
+  const options = {
+    responsive: true,
+    plugins: {
+      legend: {
+        position: "top" as const,
+      },
+      title: {
+        display: true,
+        text: graphTitle || "Historical Subscriber Data",
+        font: {
+          size: 18,
+        },
+      },
+    },
+    scales: {
+      x: {
+        ticks: {
+          autoSkip: true,
+          maxTicksLimit: 10,
+        },
+      },
+    },
+  };
 
-	const data = {
-		labels: chartData.labels,
-		datasets: [
-			{
-				label: "Subscriber Count",
-				data: chartData.datasets,
-				borderColor: overrideBorderColor || "rgb(255, 99, 132)",
-				backgroundColor: overrideBGColor || "rgba(255, 99, 132, 0.5)",
-			},
-		],
-	};
+  const data = {
+    labels: chartData.labels,
+    datasets: [
+      {
+        label: "Subscriber Count",
+        data: chartData.datasets,
+        borderColor: overrideBorderColor || "rgb(255, 99, 132)",
+        backgroundColor: overrideBGColor || "rgba(255, 99, 132, 0.5)",
+      },
+    ],
+  };
 
-	if (!fullData) {
-		return <Line options={options} data={data} />;
-	} else {
-		return <Line options={options} data={chartData} />;
-	}
+  if (!fullData) {
+    return <Line options={options} data={data} />;
+  }
+  return <Line options={options} data={chartData} />;
 };
 
 export default DataChart;