From a2a17f61fdd65b9bfaa0e069e9108b66b4e57d75 Mon Sep 17 00:00:00 2001
From: Paul Cretu <paul.s.cretu@gmail.com>
Date: Tue, 30 Jan 2024 16:29:22 -0800
Subject: [PATCH] Format UI code and fix lint errors (#328)

* Fix lint warnings

* Format everything with `npm run format`
---
 ui/src/components/BottomNav.tsx               | 43 -------------------
 ui/src/components/Player/DetectionsPlayer.tsx |  2 +-
 ui/src/components/layouts/MapLayout.tsx       |  5 +--
 .../cancelCandidateNotifications.graphql      |  2 +-
 ui/src/graphql/mutations/signOut.graphql      |  2 +-
 ui/src/styles/responsive.ts                   |  2 +
 6 files changed, 6 insertions(+), 50 deletions(-)
 delete mode 100644 ui/src/components/BottomNav.tsx

diff --git a/ui/src/components/BottomNav.tsx b/ui/src/components/BottomNav.tsx
deleted file mode 100644
index 42d6a656..00000000
--- a/ui/src/components/BottomNav.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { GraphicEq, Info, Menu, Notifications } from "@mui/icons-material";
-import {
-  BottomNavigation,
-  BottomNavigationAction,
-  Box,
-  Paper,
-} from "@mui/material";
-import { styled } from "@mui/material/styles";
-
-import { displayMobileOnly } from "@/styles/responsive";
-
-export default function BottomNav() {
-  return (
-    <Box sx={displayMobileOnly}>
-      <Paper
-        sx={{
-          position: "fixed",
-          bottom: 0,
-          left: 0,
-          right: 0,
-          // Keep nav above the sliding drawer
-          zIndex: (theme) => theme.zIndex.drawer + 1,
-        }}
-      >
-        <BottomNavigation
-          showLabels
-          sx={{ height: (theme) => theme.spacing(8) }}
-        >
-          <BottomNavigationAction label="Info" icon={<Info />} />
-          <BottomNavigationAction label="Listen" icon={<GraphicEq />} />
-          <BottomNavigationAction label="Subscribe" icon={<Notifications />} />
-          <BottomNavigationAction label="More" icon={<Menu />} />
-        </BottomNavigation>
-      </Paper>
-    </Box>
-  );
-}
-
-// Utility component to help with spacing
-// Just a box that's the same height as bottom nav
-export const BottomNavSpacer = styled(Box)(({ theme }) => ({
-  height: theme.spacing(8),
-}));
diff --git a/ui/src/components/Player/DetectionsPlayer.tsx b/ui/src/components/Player/DetectionsPlayer.tsx
index 1c5c2911..b6b257e2 100644
--- a/ui/src/components/Player/DetectionsPlayer.tsx
+++ b/ui/src/components/Player/DetectionsPlayer.tsx
@@ -22,7 +22,7 @@ export function DetectionsPlayer({
   timestamp,
   startOffset,
   endOffset,
-  onAudioPlay
+  onAudioPlay,
 }: {
   feed: Pick<Feed, "nodeName">;
   marks: { label: string; value: number }[];
diff --git a/ui/src/components/layouts/MapLayout.tsx b/ui/src/components/layouts/MapLayout.tsx
index fa83cf0f..ce3abc24 100644
--- a/ui/src/components/layouts/MapLayout.tsx
+++ b/ui/src/components/layouts/MapLayout.tsx
@@ -8,10 +8,7 @@ import { ReactElement, ReactNode, useEffect, useState } from "react";
 
 import Drawer from "@/components/Drawer";
 import Header from "@/components/Header";
-import {
-  useFeedQuery,
-  useFeedsQuery,
-} from "@/graphql/generated";
+import { useFeedQuery, useFeedsQuery } from "@/graphql/generated";
 import { displayDesktopOnly, displayMobileOnly } from "@/styles/responsive";
 
 import Player, { PlayerSpacer } from "../Player";
diff --git a/ui/src/graphql/mutations/cancelCandidateNotifications.graphql b/ui/src/graphql/mutations/cancelCandidateNotifications.graphql
index b105d427..ce29e3bb 100644
--- a/ui/src/graphql/mutations/cancelCandidateNotifications.graphql
+++ b/ui/src/graphql/mutations/cancelCandidateNotifications.graphql
@@ -11,4 +11,4 @@ mutation cancelCandidateNotifications($candidateId: ID!) {
       vars
     }
   }
-}
\ No newline at end of file
+}
diff --git a/ui/src/graphql/mutations/signOut.graphql b/ui/src/graphql/mutations/signOut.graphql
index 802a3016..b7e440b8 100644
--- a/ui/src/graphql/mutations/signOut.graphql
+++ b/ui/src/graphql/mutations/signOut.graphql
@@ -1,3 +1,3 @@
 mutation signOut {
   signOut
-}
\ No newline at end of file
+}
diff --git a/ui/src/styles/responsive.ts b/ui/src/styles/responsive.ts
index 5c87a0ba..5da2a3b5 100644
--- a/ui/src/styles/responsive.ts
+++ b/ui/src/styles/responsive.ts
@@ -1,3 +1,5 @@
+// These are helpers/utility so it's okay if not used
+/* eslint-disable import/no-unused-modules */
 import { Theme } from "@mui/material";
 
 export const displayMobileOnly = { display: { xs: "block", sm: "none" } };