test(lint): fix remaining lint warnings

These were being treated as errors in CI.

.eslintrc.js

@@ -83,6 +83,7 @@ module.exports = {
     'react/jsx-fragments': ['error', 'element'],
     'react/jsx-props-no-spreading': 'off',
     'react/require-default-props': 'off',
+    'react/prop-types': 'off',
     strict: 0,
     '@typescript-eslint/explicit-function-return-type': 'off', // Want to use it, but it requires return types for all built-in React lifecycle methods.
     '@typescript-eslint/no-non-null-assertion': 'off',

src/App.tsx

@@ -5,7 +5,7 @@ import './App.css'
 
 import AppRoot from './AppRoot'
 
-const App = () => (
+const App: React.FC = () => (
   <BrowserRouter>
     <Route path="/">
       <AppRoot />

src/AppRoot.tsx

@@ -180,6 +180,7 @@ const App: React.FC = () => {
         })
       ).json()
       if (result.status !== 'ok') {
+        // eslint-disable-next-line no-alert
         window.alert(`could not scan: ${result.status}`)
         setIsScanning(false)
       }
@@ -252,6 +253,7 @@ const App: React.FC = () => {
       setIsExportingCVRs(false)
 
       if (response.status !== 200) {
+        // eslint-disable-next-line no-console
         console.log('error downloading CVRs')
         return
       }

src/components/Button.tsx

@@ -63,11 +63,11 @@ export interface Props extends StyledButtonProps {
   onPress: MouseEventHandler
 }
 
-const Button = ({
+const Button: React.FC<Props> = ({
   component: Component = StyledButton,
   onPress,
   ...rest
-}: Props) => {
+}) => {
   const [startCoordinates, setStartCoordinates] = useState([0, 0])
 
   const onTouchStart = (event: React.TouchEvent) => {

src/components/ElectionConfiguration.tsx

@@ -13,7 +13,7 @@ export interface Props {
   acceptFiles(files: readonly File[]): void
 }
 
-const ElectionConfiguration = ({ acceptFiles }: Props) => {
+const ElectionConfiguration: React.FC<Props> = ({ acceptFiles }) => {
   const { getRootProps, getInputProps, isDragActive } = useDropzone({
     onDrop(files: readonly File[]) {
       acceptFiles(files)

src/components/MainNav.tsx

@@ -45,7 +45,7 @@ interface Props {
   isTestMode?: boolean
 }
 
-const MainNav = ({ children, isTestMode = false }: Props) => (
+const MainNav: React.FC<Props> = ({ children, isTestMode = false }) => (
   <Nav>
     <StyledNav>
       <Brand>

src/components/StatusFooter.tsx

@@ -18,7 +18,7 @@ export interface Props {
   electionHash?: string
 }
 
-const StatusFooter = ({ election, electionHash }: Props) => {
+const StatusFooter: React.FC<Props> = ({ election, electionHash }) => {
   const electionDate =
     election && localeWeedkayAndDate.format(new Date(election?.date))
 

src/components/Text.tsx

@@ -69,7 +69,7 @@ const Text = styled('p')<Props>`
   ${({ warningIcon, voteIcon }) => (warningIcon || voteIcon) && iconStyles}
 `
 
-export const TextWithLineBreaks = ({ text }: { text: string }) => (
+export const TextWithLineBreaks: React.FC<{ text: string }> = ({ text }) => (
   <React.Fragment>
     {text.split(/[\n|\r]{2}/g).map((x) => (
       <p key={x}>

src/components/USBControllerButton.tsx

@@ -8,7 +8,7 @@ import { UsbDriveStatus } from '../lib/usbstick'
 // eslint-disable-next-line @typescript-eslint/no-empty-function
 const doNothing = () => {}
 
-const USBControllerButton = () => {
+const USBControllerButton: React.FC = () => {
   const { usbDriveStatus: status, usbDriveEject } = useContext(AppContext)
 
   if (status === UsbDriveStatus.notavailable) {

src/hooks/useInterval.ts

@@ -1,7 +1,7 @@
 // TODO: Replace with library: https://github.com/votingworks/bas/issues/16
 import { useEffect } from 'react'
 
-function useInterval(callback: () => void, delay: number) {
+function useInterval(callback: () => void, delay: number): void {
   useEffect(() => {
     const id = setInterval(callback, delay)
     return () => clearInterval(id)

src/screens/AdvancedOptionsScreen.tsx

@@ -18,15 +18,15 @@ interface Props {
   toggleTestMode: () => Promise<void>
 }
 
-const AdvancedOptionsScreen = ({
+const AdvancedOptionsScreen: React.FC<Props> = ({
   unconfigureServer,
   zeroData,
   backup,
   hasBatches,
   isTestMode,
   togglingTestMode,
   toggleTestMode,
-}: Props) => {
+}) => {
   const [isConfirmingFactoryReset, setIsConfirmingFactoryReset] = useState(
     false
   )

src/screens/BallotEjectScreen.tsx

@@ -57,7 +57,10 @@ const doNothing = () => {
   console.log('disabled') // eslint-disable-line no-console
 }
 
-const BallotEjectScreen = ({ continueScanning, isTestMode }: Props) => {
+const BallotEjectScreen: React.FC<Props> = ({
+  continueScanning,
+  isTestMode,
+}) => {
   const [sheetInfo, setSheetInfo] = useState<BallotSheetInfo | undefined>()
 
   const [ballotState, setBallotState] = useState<EjectState>(undefined)

src/screens/BallotReviewScreen.tsx

@@ -71,10 +71,10 @@ export interface Props {
   adjudicationStatus: AdjudicationStatus
 }
 
-export default function BallotReviewScreen({
+const BallotReviewScreen: React.FC<Props> = ({
   isTestMode,
   adjudicationStatus,
-}: Props) {
+}) => {
   const history = useHistory()
   const { ballotId } = useParams<{
     ballotId?: string
@@ -337,3 +337,5 @@ export default function BallotReviewScreen({
     </Screen>
   )
 }
+
+export default BallotReviewScreen

src/screens/DashboardScreen.tsx

@@ -31,12 +31,12 @@ interface Props {
   deleteBatch(batchId: number): void
 }
 
-const DashboardScreen = ({
+const DashboardScreen: React.FC<Props> = ({
   adjudicationStatus,
   isScanning,
   status,
   deleteBatch,
-}: Props) => {
+}) => {
   const { batches } = status
   const batchCount = batches.length
   const ballotCount =

src/screens/LoadElectionScreen.tsx

@@ -13,7 +13,7 @@ interface Props {
   setElection: SetElection
 }
 
-const LoadElectionScreen = ({ setElection }: Props) => {
+const LoadElectionScreen: React.FC<Props> = ({ setElection }) => {
   const [
     currentUploadingBallotIndex,
     setCurrentUploadingBallotIndex,

src/serviceWorker.ts

@@ -10,7 +10,7 @@
 // To learn more about the benefits of this model and instructions on how to
 // opt-in, read https://bit.ly/CRA-PWA
 
-async function registerValidSW(swUrl: string, config?: Config) {
+async function registerValidSW(swUrl: string, config?: Config): Promise<void> {
   let registration: ServiceWorkerRegistration
 
   try {
@@ -103,7 +103,7 @@ interface Config {
   onUpdate?: (registration: ServiceWorkerRegistration) => void
 }
 
-export function register(config?: Config) {
+export function register(config?: Config): void {
   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
     // The URL constructor is available in all browsers that support SW.
     const publicUrl = new URL(
@@ -141,7 +141,7 @@ export function register(config?: Config) {
   }
 }
 
-export function unregister() {
+export function unregister(): void {
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.ready.then((registration) => {
       registration.unregister()

src/util/focusVisible.tsx

@@ -1,7 +1,7 @@
 // This is a "polyfill" for the css psudo-class :focus-visible
 // https://caniuse.com/#feat=css-focus-visible
 
-const focusVisible = () => {
+const focusVisible = (): void => {
   // Let the document know when the mouse is being used
   document.body.addEventListener('mousedown', () => {
     document.body.classList.remove('using-keyboard')