Fix Firebase User import and add Apartment component documentation

frontend/src/components/Apartment/AptInfo.tsx

@@ -14,6 +14,21 @@ type Props = {
   readonly longitude?: number;
 };
 
+/**
+ * AptInfo – Displays landlord information and other properties owned by the landlord.
+ *
+ * @remarks
+ * This component combines landlord contact information with a list of other properties
+ * they own. It is used on the apartment page to provide context about the landlord.
+ *
+ * @param {string | null} props.landlordId – The unique identifier for the landlord.
+ * @param {string} props.landlord – The name of the landlord or renting company.
+ * @param {string | null} props.contact – Contact URL for the landlord.
+ * @param {string | null} props.address – The address of the apartment.
+ * @param {CardData[]} props.buildings – List of other properties owned by the landlord.
+ *
+ * @return {ReactElement} – The rendered AptInfo component.
+ */
 export default function AptInfo({
   landlordId,
   landlord,

frontend/src/components/Apartment/Info.tsx

@@ -25,12 +25,33 @@ type Props = {
   readonly address: string | null;
 };
 
+/**
+ * InfoItem – Renders a single list item displaying text information.
+ *
+ * @param {string} props.text – The text content to display.
+ *
+ * @return {JSX.Element} – A ListItem component with the text.
+ */
 const InfoItem = ({ text }: { text: string }) => (
   <ListItem disableGutters>
     <ListItemText primary={text} />
   </ListItem>
 );
 
+/**
+ * Info – Displays landlord contact information with links to their page and contact.
+ *
+ * @remarks
+ * This component shows the landlord name and address, with buttons to visit
+ * the landlord's page or contact them directly.
+ *
+ * @param {string | null} props.landlordId – The unique identifier for the landlord.
+ * @param {string | null} props.landlord – The name of the landlord or renting company.
+ * @param {string | null} props.contact – Contact URL for the landlord.
+ * @param {string | null} props.address – The address of the apartment.
+ *
+ * @return {ReactElement} – The rendered Info component.
+ */
 export default function Info({ landlordId, landlord, contact, address }: Props): ReactElement {
   const { title } = useStyles();
 

frontend/src/components/Apartment/MapInfo.tsx

@@ -31,6 +31,14 @@
   walkDistance: number | undefined;
 };
 
+/**
+ * WalkDistanceInfo – Displays walking distance to a campus location.
+ *
+ * @param {string} props.location – The name of the campus location.
+ * @param {number | undefined} props.walkDistance – Walking time in minutes.
+ *
+ * @return {JSX.Element} – A row showing the location and walk time.
+ */
 const WalkDistanceInfo = ({ location, walkDistance }: distanceProps) => {
   return (
     <div>
@@ -171,7 +179,7 @@
       mapRef.current.setZoom(defaultZoom);
       setMarkerSize(defaultMarkerSize);
     }
   }, [mapToggle, latitude, longitude]);
 
   const handleZoom = (zoomChange: number) => {
     if (mapRef.current) {

frontend/src/pages/ApartmentPage.tsx

@@ -45,6 +45,8 @@ import savedIcon from '../assets/saved-icon-filled.svg';
 import unsavedIcon from '../assets/saved-icon-unfilled.svg';
 import MapModal from '../components/Apartment/MapModal';
 import DropDownWithLabel from '../components/utils/DropDownWithLabel';
+import firebase from 'firebase/app';
+import 'firebase/auth';
 
 type Props = {
   user: firebase.User | null;