fix: correcting the import statements for react-bootstrap to the preferred

Author: bbland1

src/api/useAuth.tsx

@@ -3,7 +3,7 @@ import { auth } from "./config.js";
 import { GoogleAuthProvider, signInWithPopup } from "firebase/auth";
 import { addUserToDatabase, User } from "./firebase";
 import toast from "react-hot-toast";
-import { Button } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
 
 /**
  * A button that signs the user in using Google OAuth. When clicked,

src/components/CreateList.tsx

@@ -2,7 +2,9 @@ import { ChangeEvent, FormEvent, useState } from "react";
 import { createList, User } from "../api";
 import { useNavigate } from "react-router-dom";
 import toast from "react-hot-toast";
-import { Button, Form, InputGroup } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
+import Form from "react-bootstrap/Form";
+import InputGroup from "react-bootstrap/InputGroup";
 
 interface Props {
 	user: User;

src/components/FilterListInput.tsx

@@ -1,5 +1,7 @@
 import { ChangeEvent, FormEvent } from "react";
-import { Button, Form, InputGroup } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
+import Form from "react-bootstrap/Form";
+import InputGroup from "react-bootstrap/InputGroup";
 
 interface FilterListProps {
 	searchTerm: string;

src/components/ListItem.tsx

@@ -3,7 +3,8 @@ import { updateItem, deleteItem, ListItem } from "../api";
 import { useState } from "react";
 import toast from "react-hot-toast";
 import { moreThan24HoursPassed, getDaysBetweenDates } from "../utils";
-import { Button, Form } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
+import Form from "react-bootstrap/Form";
 
 interface Props {
 	item: ListItem;

src/components/SingleList.tsx

@@ -1,6 +1,6 @@
 import "./SingleList.css";
 import * as api from "../api/firebase";
-import { Button } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
 
 interface Props extends Pick<api.List, "name" | "path"> {
 	setListPath: (path: string) => void;

src/components/forms/AddItemForm.tsx

@@ -2,7 +2,8 @@ import { ChangeEvent, FormEvent, useState } from "react";
 import { addItem, ListItem } from "../../api";
 import { validateItemName } from "../../utils";
 import toast from "react-hot-toast";
-import { Button, Form } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
+import Form from "react-bootstrap/Form";
 
 import { useNavigate } from "react-router-dom";
 

src/components/forms/ShareListForm.tsx

@@ -1,7 +1,9 @@
 import { ChangeEvent, FormEvent, useState } from "react";
 import { shareList } from "../../api";
 import { getUser } from "../ProtectedRoute";
-import { Button, Form, InputGroup } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
+import Form from "react-bootstrap/Form";
+import { InputGroup } from "react-bootstrap";
 
 import toast from "react-hot-toast";
 

src/views/authenticated/List.tsx

@@ -3,7 +3,7 @@ import { ListItemCheckBox } from "../../components/ListItem";
 import { FilterListInput } from "../../components/FilterListInput";
 import { ListItem, comparePurchaseUrgency } from "../../api";
 import { useNavigate } from "react-router-dom";
-import { Button } from "react-bootstrap";
+import Button from "react-bootstrap/Button";
 
 interface Props {
 	data: ListItem[];