Cleanup import sorting (#68)

src/index.tsx

@@ -1,13 +1,14 @@
-import React from "react";
-import ReactDOM from "react-dom";
 import "bootstrap/dist/css/bootstrap.min.css";
 import "bootstrap/js/dist/collapse";
 import "bootstrap/js/dist/dropdown";
-
 import "./index.css";
+
+import React from "react";
+import ReactDOM from "react-dom";
+import { Provider } from "react-redux";
+
 import App from "./App";
 import { store } from "./redux/store";
-import { Provider } from "react-redux";
 import * as serviceWorker from "./serviceWorker";
 
 ReactDOM.render(

src/pages/Approvals/AddNewApproval.tsx

@@ -1,13 +1,13 @@
 import { useState } from "react";
+import { Link } from "react-router-dom";
 
-import { APIErrorType } from "apiClient/types";
-import { useSetPageTitle } from "hooks";
 import { createNewApproval, CreateNewApprovalArgs } from "apiClient/approvals";
 import { APIError as APIErrorClass } from "apiClient/client";
+import { APIErrorType } from "apiClient/types";
+import { useSetPageTitle } from "hooks";
 import { gearDbApi } from "redux/api";
 
 import { AddNewApprovalForm } from "./AddNewApprovalForm";
-import { Link } from "react-router-dom";
 
 export function AddNewApproval() {
   useSetPageTitle("Approve restricted gear rental");

src/pages/Approvals/AddNewApprovalForm.tsx

@@ -1,18 +1,18 @@
-import { useForm } from "react-hook-form";
 import DatePicker from "react-datepicker";
+import { useForm } from "react-hook-form";
 import { useHistory } from "react-router-dom";
 
-import { makeLabeledInput } from "components/Inputs/LabeledInput";
-import { Form } from "components/Inputs/Form";
-import { PersonSelect } from "components/PersonSelect";
-
-import { ApprovalItemsPicker, defaultItem } from "./ApprovalItemsPicker";
-import { FormValues } from "./types";
 import {
   ApprovalItemToCreate,
   ApprovalItemType,
   CreateNewApprovalArgs,
 } from "apiClient/approvals";
+import { Form } from "components/Inputs/Form";
+import { makeLabeledInput } from "components/Inputs/LabeledInput";
+import { PersonSelect } from "components/PersonSelect";
+
+import { ApprovalItemsPicker, defaultItem } from "./ApprovalItemsPicker";
+import { FormValues } from "./types";
 
 type Props = {
   onSubmit: (args: CreateNewApprovalArgs) => void;

src/pages/Approvals/ApprovalItemsPicker.tsx

@@ -1,13 +1,13 @@
-import { useFieldArray, Controller, useFormContext } from "react-hook-form";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faClose } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Controller, useFieldArray, useFormContext } from "react-hook-form";
 import styled from "styled-components";
 
-import { makeLabeledInput } from "components/Inputs/LabeledInput";
 import { ApprovalItemType, PartialApprovalItem } from "apiClient/approvals";
-import { Select } from "components/Select";
-import { GearTypeSelect } from "components/GearTypeSelect";
 import { GearItemSelect } from "components/GearItemSelect";
+import { GearTypeSelect } from "components/GearTypeSelect";
+import { makeLabeledInput } from "components/Inputs/LabeledInput";
+import { Select } from "components/Select";
 
 import { FormValues } from "./types";
 

src/pages/Approvals/ApprovalsPage.tsx

@@ -1,10 +1,9 @@
 import { useState } from "react";
-
-import { TablePagination } from "components/TablePagination";
-import { useSetPageTitle } from "hooks";
 import { Link } from "react-router-dom";
 
 import { Checkbox } from "components/Inputs/Checkbox";
+import { TablePagination } from "components/TablePagination";
+import { useSetPageTitle } from "hooks";
 import { restrictedGearDoc } from "lib/constants";
 import { useGetApprovalsQuery } from "redux/api";
 import { usePermissions } from "redux/auth";

src/pages/Approvals/ApprovalsTable.tsx

@@ -1,13 +1,13 @@
-import { useMemo } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faClose } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useMemo } from "react";
 
-import { DataGrid } from "components/DataGrid";
-import { formatDate } from "lib/fmtDate";
 import { Approval, deleteApproval } from "apiClient/approvals";
-import { PersonLink } from "components/PersonLink";
-import { GearLink } from "components/GearLink";
 import { PersonBase } from "apiClient/people";
+import { DataGrid } from "components/DataGrid";
+import { GearLink } from "components/GearLink";
+import { PersonLink } from "components/PersonLink";
+import { formatDate } from "lib/fmtDate";
 
 export function ApprovalsTable({
   approvals,

src/pages/Gear/AddNewGear/AddNewGear.tsx

@@ -1,13 +1,13 @@
 import { isEmpty } from "lodash";
 import { useState } from "react";
 
-import { createGear, CreateGearArgs, GearSummary } from "apiClient/gear";
 import { APIError as APIErrorClass } from "apiClient/client";
+import { createGear, CreateGearArgs, GearSummary } from "apiClient/gear";
 import { APIErrorType } from "apiClient/types";
 import { useSetPageTitle } from "hooks";
 
-import { AddNewGearForm } from "./AddNewGearForm";
 import { AddNewGearError } from "./AddNewGearError";
+import { AddNewGearForm } from "./AddNewGearForm";
 import { AddNewGearResults } from "./AddNewGearResults";
 
 export function AddNewGear() {

src/pages/Gear/AddNewGear/AddNewGearForm.tsx

@@ -1,12 +1,12 @@
 import { useEffect } from "react";
-import { useForm, FormProvider } from "react-hook-form";
+import { FormProvider, useForm } from "react-hook-form";
+import { Link } from "react-router-dom";
 
-import { useGetGearTypesQuery, useGetGearLocationsQuery } from "redux/api";
-import { CreateGearArgs, GearType, GearLocation } from "apiClient/gear";
+import { CreateGearArgs, GearLocation, GearType } from "apiClient/gear";
 import { makeLabeledInput } from "components/Inputs/LabeledInput";
-import { Link } from "react-router-dom";
-import { fmtAmount } from "lib/fmtNumber";
 import { Select } from "components/Select";
+import { fmtAmount } from "lib/fmtNumber";
+import { useGetGearLocationsQuery, useGetGearTypesQuery } from "redux/api";
 
 type GearTypeOption = GearType & { value: string; label: string };
 

src/pages/Gear/AddNewGear/AddNewGearResults.tsx

@@ -1,7 +1,7 @@
 import { Link } from "react-router-dom";
 
-import { GearLink } from "components/GearLink";
 import { GearSummary } from "apiClient/gear";
+import { GearLink } from "components/GearLink";
 
 export function AddNewGearResults({
   gearCreated,

src/pages/Gear/AllGearPage/AllGearPage.tsx

@@ -1,19 +1,20 @@
 import { compact, isEqual } from "lodash";
 import { useState } from "react";
-import styled from "styled-components";
 import { Link } from "react-router-dom";
+import styled from "styled-components";
 
 import { GearSummary } from "apiClient/gear";
 import { DataGrid } from "components/DataGrid";
-import { TablePagination } from "components/TablePagination";
-import { SearchTextField } from "components/Inputs/TextField";
 import { GearLink } from "components/GearLink";
-import { useGearList } from "redux/api";
+import { SearchTextField } from "components/Inputs/TextField";
+import { TablePagination } from "components/TablePagination";
 import { useSetPageTitle } from "hooks";
+import { useGearList } from "redux/api";
 
 import { GearStatus } from "../GearStatus";
+
 import { GearFilters, GearStatusFilter } from "./GearFilters";
-import { useGearFilters, gearStatusToBoolean } from "./useGearFilter";
+import { gearStatusToBoolean, useGearFilters } from "./useGearFilter";
 
 export function AllGearPage() {
   useSetPageTitle("Gear");
@@ -46,7 +47,12 @@ export function AllGearPage() {
       renderer: DescriptionCell,
     },
     { key: "status", header: "Status", renderer: StatusCell },
-    { key: "location", header: "Location", renderer: LocationCell, hideOnMobile: true },
+    {
+      key: "location",
+      header: "Location",
+      renderer: LocationCell,
+      hideOnMobile: true,
+    },
   ]);
 
   return (
@@ -157,11 +163,7 @@ function TypeCell({ item: gearItem }: { item: GearSummary }) {
 }
 
 function LocationCell({ item: gearItem }: { item: GearSummary }) {
-  return (
-    <>
-      {gearItem.location.shorthand}
-    </>
-  );
+  return <>{gearItem.location.shorthand}</>;
 }
 
 const ColoredCell = styled.div<{ color?: string }>`

src/pages/Gear/AllGearPage/GearFilters.tsx

@@ -1,7 +1,7 @@
 import { map } from "lodash";
 
-import { GearTypeMultiSelect } from "components/GearTypeSelect";
 import { GearLocationSelect } from "components/GearLocationSelect";
+import { GearTypeMultiSelect } from "components/GearTypeSelect";
 import { Select } from "components/Inputs/Select";
 
 export enum GearStatusFilter {

src/pages/Gear/GearInfoPanel.tsx

@@ -1,14 +1,14 @@
+import { newApprovalUI } from "featureFlags";
 import { useState } from "react";
+import { Link } from "react-router-dom";
 
 import type { GearSummary } from "apiClient/gear";
+import { restrictedGearDoc } from "lib/constants";
 import { fmtAmount } from "lib/fmtNumber";
 
+import { GearItemEditForm } from "./GearItemEditForm";
 import { GearStatus } from "./GearStatus";
 import { GearStatusForm, GearStatusFormType } from "./GearStatusForm";
-import { GearItemEditForm } from "./GearItemEditForm";
-import { Link } from "react-router-dom";
-import { newApprovalUI } from "featureFlags";
-import { restrictedGearDoc } from "lib/constants";
 
 type Props = { gearItem: GearSummary; refreshGear: () => void };
 

src/pages/Gear/GearItemEditForm.tsx

@@ -1,12 +1,12 @@
-import { editGearItem, GearSummary, GearLocation } from "apiClient/gear";
+import { useState } from "react";
+import Select from "react-select";
+
+import { editGearItem, GearLocation, GearSummary } from "apiClient/gear";
 import { NumberField } from "components/Inputs/NumberField";
 import { TextArea } from "components/Inputs/TextArea";
 import { TextField } from "components/Inputs/TextField";
-import { useState } from "react";
-import Select from "react-select";
 import { useGetGearLocationsQuery } from "redux/api";
 
-
 type GearLocationOption = GearLocation & { value: number; label: string };
 
 type Props = {
@@ -39,7 +39,7 @@ export function GearItemEditForm({ gearItem, closeForm, refreshGear }: Props) {
       setLocation({
         id: gearLocationOption.id,
         shorthand: gearLocationOption.shorthand,
-      })
+      });
     }
   };
 
@@ -48,11 +48,17 @@ export function GearItemEditForm({ gearItem, closeForm, refreshGear }: Props) {
     if (deposit == null) {
       return;
     }
-    editGearItem(gearItem.id, specification, description, size, deposit, location.id).then(      () => {
-        closeForm();
-        refreshGear();
-      }
-    );
+    editGearItem(
+      gearItem.id,
+      specification,
+      description,
+      size,
+      deposit,
+      location.id
+    ).then(() => {
+      closeForm();
+      refreshGear();
+    });
   };
   return (
     <form>

src/pages/Gear/GearItemPage.tsx

@@ -2,8 +2,8 @@ import { useParams } from "react-router-dom";
 
 import { addNote } from "apiClient/gear";
 import { Notes } from "components/Notes";
-import { useGetGearItemQuery } from "redux/api";
 import { useSetPageTitle } from "hooks";
+import { useGetGearItemQuery } from "redux/api";
 
 import { GearInfoPanel } from "./GearInfoPanel";
 import { GearRentalsHistory } from "./GearRentalsHistory";

src/pages/Gear/GearRentalsHistory.tsx

@@ -1,9 +1,9 @@
 import { useEffect, useState } from "react";
 
-import { formatDate } from "lib/fmtDate";
 import { GearRental, getGearRentalHistory } from "apiClient/gear";
-import { TablePagination } from "components/TablePagination";
 import { PersonLink } from "components/PersonLink";
+import { TablePagination } from "components/TablePagination";
+import { formatDate } from "lib/fmtDate";
 
 type Props = {
   gearId: string;

src/pages/Gear/GearStatus.tsx

@@ -1,6 +1,6 @@
 import { GearSummary } from "apiClient/gear";
-import { formatDate, formatDateTime } from "lib/fmtDate";
 import { PersonLink } from "components/PersonLink";
+import { formatDate, formatDateTime } from "lib/fmtDate";
 
 type Props = {
   gearItem: GearSummary;

src/pages/Gear/GearStatusForm.tsx

@@ -4,8 +4,8 @@ import {
   GearSummary,
   markBroken,
   markFixed,
-  markMissing,
   markFound,
+  markMissing,
   markRetired,
   markUnretired,
 } from "apiClient/gear";

src/pages/LogIn/LoginForm.tsx

@@ -1,10 +1,10 @@
-import { useState } from "react";
 import { isEmpty } from "lodash";
+import { useState } from "react";
+import { Link } from "react-router-dom";
 
-import { useAppDispatch } from "redux/hooks";
-import { logIn } from "redux/auth/authSlice";
 import { validateEmail } from "lib/validation";
-import { Link } from "react-router-dom";
+import { logIn } from "redux/auth/authSlice";
+import { useAppDispatch } from "redux/hooks";
 
 export function LoginForm() {
   const dispatch = useAppDispatch();

src/pages/LogIn/RequestPasswordConfirm.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from "react";
-import { Link, useLocation } from "react-router-dom";
 import { useForm } from "react-hook-form";
+import { Link, useLocation } from "react-router-dom";
 
 import { authClient } from "apiClient/auth";
 import { Form } from "components/Inputs/Form";

src/pages/LogIn/RequestPasswordReset.tsx

@@ -1,10 +1,9 @@
 import { useState } from "react";
-
-import { validateEmail } from "lib/validation";
-import { authClient } from "apiClient/auth";
 import { useLocation } from "react-router-dom";
 
+import { authClient } from "apiClient/auth";
 import { useSetPageTitle } from "hooks";
+import { validateEmail } from "lib/validation";
 
 export function RequestPasswordReset() {
   useSetPageTitle("Reset password");

src/pages/OfficeHours/ApproveDeskCreditPage.tsx

@@ -1,10 +1,11 @@
+import { isEmpty } from "lodash";
+import { FormProvider, useForm } from "react-hook-form";
+
 import { approveCredit } from "apiClient/officeHours";
 import { Signup } from "apiClient/types";
 import { LabeledInput } from "components/Inputs/LabeledInput";
 import { useSetPageTitle } from "hooks";
 import { formatDate, formatDateTime, formatDuration } from "lib/fmtDate";
-import { isEmpty } from "lodash";
-import { FormProvider, useForm } from "react-hook-form";
 import { useGetSignupsQuery } from "redux/api";
 
 export function ApproveDeskCreditPage() {

src/pages/OfficeHours/MyOfficeHoursHistory.tsx

@@ -4,6 +4,7 @@ import { TablePagination } from "components/TablePagination";
 import { useSetPageTitle } from "hooks";
 import { useGetPersonSignupsQuery } from "redux/api";
 import { useCurrentUser } from "redux/auth";
+
 import { OfficeHoursSignupsTable } from "./OfficeHoursSignupsTable";
 
 export function MyOfficeHoursHistory() {

src/pages/OfficeHours/OfficeHoursHistory.tsx

@@ -1,11 +1,11 @@
 import dayjs from "dayjs";
-
 import { useEffect, useState } from "react";
 
+import { Checkbox } from "components/Inputs/Checkbox";
 import { TablePagination } from "components/TablePagination";
 import { useSetPageTitle } from "hooks";
 import { useGetSignupsQuery } from "redux/api";
-import { Checkbox } from "components/Inputs/Checkbox";
+
 import { OfficeHoursSignupsTable } from "./OfficeHoursSignupsTable";
 
 export function OfficeHoursHistory() {