diff --git a/.github/workflows/yarn_test.yaml b/.github/workflows/yarn_test.yaml
index b05c3a76..280ef83a 100644
--- a/.github/workflows/yarn_test.yaml
+++ b/.github/workflows/yarn_test.yaml
@@ -29,3 +29,21 @@ jobs:
       run: |
         cd apps/nowcasting-app
         yarn start & sleep 5 && yarn test --coverage --coverageDirectory=../..
+      env:
+        AUTH0_AUDIENCE: ${{ secrets.AUTH0_AUDIENCE }}
+        AUTH0_BASE_URL: ${{ secrets.AUTH0_BASE_URL }}
+        AUTH0_CLIENT_ID: ${{ secrets.AUTH0_CLIENT_ID }}
+        AUTH0_CLIENT_SECRET: ${{ secrets.AUTH0_CLIENT_SECRET }}
+        AUTH0_DOMAIN: ${{ secrets.AUTH0_DOMAIN }}
+        AUTH0_ISSUER_BASE_URL: ${{ secrets.AUTH0_ISSUER_BASE_URL }}
+        AUTH0_SCOPE: ${{ secrets.AUTH0_SCOPE }}
+        AUTH0_SECRET: ${{ secrets.AUTH0_SECRET }}
+        NEXT_PUBLIC_API_PREFIX: ${{ secrets.NEXT_PUBLIC_API_PREFIX }}
+        NEXT_PUBLIC_AUTH0_AUDIENCE: ${{ secrets.NEXT_PUBLIC_AUTH0_AUDIENCE }}
+        NEXT_PUBLIC_AUTH0_CLIENT_ID: ${{ secrets.NEXT_PUBLIC_AUTH0_CLIENT_ID }}
+        NEXT_PUBLIC_AUTH0_DOMAIN: ${{ secrets.NEXT_PUBLIC_AUTH0_DOMAIN }}
+        NEXT_PUBLIC_AUTH0_PASSWORD: ${{ secrets.NEXT_PUBLIC_AUTH0_PASSWORD }}
+        NEXT_PUBLIC_AUTH0_SCOPE: ${{ secrets.NEXT_PUBLIC_AUTH0_SCOPE }}
+        NEXT_PUBLIC_AUTH0_USERNAME: ${{ secrets.NEXT_PUBLIC_AUTH0_USERNAME }}
+
+
diff --git a/.husky/pre-commit b/.husky/pre-commit
index e2ec2352..90576a12 100755
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -1,6 +1,15 @@
 #!/bin/sh
 . "$(dirname "$0")/_/husky.sh"
 
-cd apps/nowcasting-app
+cd apps/nowcasting-app || exit
 yarn lint
-yarn test
+
+# check if the server is already running and save the boolean result
+serverRunning=$(lsof -t -i :3002)
+# if the server is running, just run the tests and don't start the server
+if [ -z "$serverRunning" ]; then
+  yarn test
+else
+  # if the server isn't running, start it, run the tests, and then kill the server after the tests are done
+  yarn dev & yarn test && lsof -t -i :3002 | xargs kill
+fi
diff --git a/apps/nowcasting-app/components/charts/delta-view/delta-view-chart.tsx b/apps/nowcasting-app/components/charts/delta-view/delta-view-chart.tsx
index 268b7779..0c34e6b9 100644
--- a/apps/nowcasting-app/components/charts/delta-view/delta-view-chart.tsx
+++ b/apps/nowcasting-app/components/charts/delta-view/delta-view-chart.tsx
@@ -374,9 +374,9 @@ const DeltaChart: FC<DeltaChartProps> = ({ className, combinedData, combinedErro
           </div>
         )}
         <div
-          className={`flex flex-col flex-grow-0 flex-shrink overflow-y-scroll ${
-            clickedGspId ? "h-[30%]" : "h-[40%]"
-          }`}
+          className={`flex flex-col flex-grow-0 flex-shrink${
+            hasGspPvInitialForSelectedTime ? " overflow-y-scroll" : ""
+          } ${clickedGspId ? "h-[30%]" : "h-[40%]"}`}
         >
           <DeltaBuckets bucketSelection={selectedBuckets} gspDeltas={gspDeltas} />
           {!hasGspPvInitialForSelectedTime && (
diff --git a/apps/nowcasting-app/components/charts/solar-site-view/solar-site-chart.tsx b/apps/nowcasting-app/components/charts/solar-site-view/solar-site-chart.tsx
index 25f40f85..573e433a 100644
--- a/apps/nowcasting-app/components/charts/solar-site-view/solar-site-chart.tsx
+++ b/apps/nowcasting-app/components/charts/solar-site-view/solar-site-chart.tsx
@@ -324,30 +324,38 @@ const SolarSiteChart: FC<{
           </div>
         )}
 
-        <div className="flex-1 flex flex-col">
+        <div className="flex-1 flex flex-col relative">
           <AggregatedDataTable
-            className={currentAggregation(AGGREGATION_LEVELS.NATIONAL) ? "" : "hidden"}
+            className={`absolute inset-0 overflow-y-scroll mb-12 ${
+              currentAggregation(AGGREGATION_LEVELS.NATIONAL) ? "z-10" : "z-0 opacity-0"
+            }`}
             title={"National"}
             tableData={Array.from(aggregatedSitesData.national.values())}
           />
           <AggregatedDataTable
-            className={currentAggregation(AGGREGATION_LEVELS.REGION) ? "" : "hidden"}
+            className={`absolute inset-0 overflow-y-scroll mb-12 ${
+              currentAggregation(AGGREGATION_LEVELS.REGION) ? "z-10" : "z-0 opacity-0"
+            }`}
             title={"Region"}
             tableData={Array.from(aggregatedSitesData.regions.values())}
           />
           <AggregatedDataTable
-            className={currentAggregation(AGGREGATION_LEVELS.GSP) ? "" : "hidden"}
+            className={`absolute inset-0 overflow-y-scroll mb-12 ${
+              currentAggregation(AGGREGATION_LEVELS.GSP) ? "z-10" : "z-0 opacity-0"
+            }`}
             title={"GSP"}
             tableData={Array.from(aggregatedSitesData.gsps.values())}
           />
           <AggregatedDataTable
-            className={currentAggregation(AGGREGATION_LEVELS.SITE) ? "" : "hidden"}
+            className={`absolute inset-0 overflow-y-scroll mb-12 ${
+              currentAggregation(AGGREGATION_LEVELS.SITE) ? "z-10" : "z-0 opacity-0"
+            }`}
             title={"Sites"}
             tableData={Array.from(aggregatedSitesData.sites.values())}
           />
         </div>
       </div>
-      <div className="absolute bottom-0 left-0 right-0 flex flex-none justify-between align-items:baseline px-4 text-xs tracking-wider text-ocf-gray-300 py-3 bg-mapbox-black-500 overflow-y-visible">
+      <div className="absolute bottom-0 left-0 right-0 z-10 flex flex-none justify-between align-items:baseline px-4 text-xs tracking-wider text-ocf-gray-300 py-3 bg-mapbox-black-500 overflow-y-visible">
         <div
           className={`flex flex-col lg:flex-row flex-initial gap-x-6 justify-around max-w-2xl overflow-x-auto`}
         >
diff --git a/apps/nowcasting-app/components/charts/solar-site-view/solar-site-tables.tsx b/apps/nowcasting-app/components/charts/solar-site-view/solar-site-tables.tsx
index 728cf77a..6cab734c 100644
--- a/apps/nowcasting-app/components/charts/solar-site-view/solar-site-tables.tsx
+++ b/apps/nowcasting-app/components/charts/solar-site-view/solar-site-tables.tsx
@@ -29,7 +29,7 @@ import { formatISODateString } from "../../helpers/utils";
 const TableHeader: React.FC<{ text: string }> = ({ text }) => {
   return (
     <div
-      className="sticky flex flex-row bg-ocf-sites-100
+      className="sticky top-0 z-10 flex flex-row bg-ocf-sites-100
             justify-between"
     >
       <div className="ml-10 w-80">
@@ -81,7 +81,7 @@ const TableData: React.FC<TableDataProps> = ({ rows }) => {
 
   return (
     <>
-      <div className="flex-1 overflow-y-scroll">
+      <div className="flex-1">
         {rows?.sort(sortFn).map((site) => {
           const mostAccurateGeneration = site.actualPV || site.expectedPV;
           return (
diff --git a/apps/nowcasting-app/components/side-layout/index.tsx b/apps/nowcasting-app/components/side-layout/index.tsx
index 55795ecf..430c3c64 100644
--- a/apps/nowcasting-app/components/side-layout/index.tsx
+++ b/apps/nowcasting-app/components/side-layout/index.tsx
@@ -44,9 +44,9 @@ const SideLayout: FC<SideLayoutProps> = ({
           "focus:outline-none h-full text-white justify-between flex flex-col bg-mapbox-black-500 z-20 "
         }
       >
-        <div className={`min-h-full max-h-full flex flex-col overflow-y-scroll`}>{children}</div>
+        <div className={`min-h-full max-h-full flex flex-col`}>{children}</div>
       </div>
-      <div className="absolute bottom-12 -right-4 h-10">
+      <div className="absolute bottom-12 -right-4 h-10 z-20">
         <ExpandButton isOpen={isOpen} onClick={() => setIsOpen((o) => !o)} />
       </div>
 
diff --git a/apps/nowcasting-app/package.json b/apps/nowcasting-app/package.json
index b1de0328..75236c59 100644
--- a/apps/nowcasting-app/package.json
+++ b/apps/nowcasting-app/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@openclimatefix/nowcasting-app",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3002",
diff --git a/apps/nowcasting-app/styles/globals.css b/apps/nowcasting-app/styles/globals.css
index 2e25745e..b8834b20 100644
--- a/apps/nowcasting-app/styles/globals.css
+++ b/apps/nowcasting-app/styles/globals.css
@@ -114,3 +114,28 @@
   overflow: hidden;
   visibility: hidden;
 }
+
+/**************/
+/* SCROLLBARS */
+/**************/
+
+/* Works on Firefox */
+* {
+  scrollbar-width: thin;
+  scrollbar-color: theme(colors.mapbox-black.700) theme(colors.mapbox-black.600);
+}
+
+/* Works on Chrome, Edge, and Safari */
+*::-webkit-scrollbar {
+  width: 12px;
+}
+
+*::-webkit-scrollbar-track {
+  background: theme(colors.mapbox-black.600);
+}
+
+*::-webkit-scrollbar-thumb {
+  background-color: theme(colors.mapbox-black.700);
+  border-radius: 20px;
+  border: 3px solid theme(colors.mapbox-black.600);
+}