More Bug Fixes (#121)

## Changes  - fix clear all button - fix add renter candidate button copy - enforce unique renter id on creation
TritonSE · Jul 1, 2024 · e801207 · e801207
1 parent 7f4389a
commit e801207
Show file tree

Hide file tree

Showing 6 changed files with 51 additions and 19 deletions.
diff --git a/backend/src/controllers/renter.ts b/backend/src/controllers/renter.ts
@@ -47,7 +47,7 @@ export const createRenterCandidateHandler: RequestHandler = asyncHandler(async (
   if (response !== null) {
     res.status(200).json(response);
   } else {
-    res.status(400).send("Renter Already Exists");
+    res.status(400).send("Error creating new Renter Candidate");
   }
 });
 

diff --git a/backend/src/services/renter.ts b/backend/src/services/renter.ts
@@ -1,3 +1,5 @@
+import createHttpError from "http-errors";
+
 import { ReferralModel } from "../models/referral";
 import { Renter, RenterModel } from "../models/renter";
 
@@ -29,14 +31,13 @@ export async function createRenterCandidate(
   phone?: string,
   email?: string,
 ) {
-  const query = { firstName, lastName, phone, email, uid, program, adults, children };
-  const renter = await RenterModel.findOne(query);
-  if (renter === null) {
-    const newRenter = await RenterModel.create(query);
-    return newRenter;
-  } else {
-    return null;
+  const renter = await RenterModel.findOne({ uid });
+  if (renter !== null) {
+    throw createHttpError(400, "Renter with that UID already exists");
   }
+  const newRenterQuery = { firstName, lastName, phone, email, uid, program, adults, children };
+  const newRenter = await RenterModel.create(newRenterQuery);
+  return newRenter;
 }
 
 export async function editRenterCandidate(id: string, editQuery: EditRenterCandidateBody) {

diff --git a/frontend/src/components/ListingForm/ImagesVideos.tsx b/frontend/src/components/ListingForm/ImagesVideos.tsx
@@ -78,10 +78,11 @@ const Error = styled.div`
 
 type ImagesVideosProps = {
   unit_id: string;
+  value: File[] | null;
   onChange: (newFiles: File[] | null) => void;
 };
 
-export const ImagesVideos = ({ unit_id, onChange }: ImagesVideosProps) => {
+export const ImagesVideos = ({ unit_id, value, onChange }: ImagesVideosProps) => {
   const [allImages, setAllImages] = useState<FullMetadata[]>();
   const [allVideos, setAllVideos] = useState<FullMetadata[]>();
 
@@ -91,6 +92,8 @@ export const ImagesVideos = ({ unit_id, onChange }: ImagesVideosProps) => {
   const [newImages, setNewImages] = useState<File[]>([]);
   const [newVideos, setNewVideos] = useState<File[]>([]);
 
+  const [fileInputKey, setFileInputKey] = useState<number>(Date.now()); // To reset the input field
+
   const handleGetFiles = () => {
     getFileMetadata(unit_id, "images")
       .then((data) => {
@@ -167,9 +170,19 @@ export const ImagesVideos = ({ unit_id, onChange }: ImagesVideosProps) => {
   };
 
   useEffect(() => {
-    onChange(newImages.concat(newVideos));
+    if (newImages.length > 0 || newVideos.length > 0) {
+      onChange(newImages.concat(newVideos));
+    }
   }, [newImages, newVideos]);
 
+  useEffect(() => {
+    if (value === null || value.length === 0) {
+      setFileInputKey(Date.now());
+      setNewImages([]);
+      setNewVideos([]);
+    }
+  }, [value]);
+
   return (
     <Margin32>
       <FieldHeader>Add photos and videos of your listing</FieldHeader>
@@ -242,6 +255,7 @@ export const ImagesVideos = ({ unit_id, onChange }: ImagesVideosProps) => {
           <img src="/upload.svg" alt="upload" />
           Add Files
           <input
+            key={fileInputKey}
             value={""}
             type="file"
             id="formId"

diff --git a/frontend/src/components/ListingForm/Thumbnail.tsx b/frontend/src/components/ListingForm/Thumbnail.tsx
@@ -67,13 +67,17 @@ const XButton = styled.img`
 
 type ImagesVideosProps = {
   unit_id: string;
+  value: File[] | null;
   onChange: (thumbnail: File[] | null) => void;
 };
 
-export const Thumbnail = ({ unit_id, onChange }: ImagesVideosProps) => {
+export const Thumbnail = ({
+  unit_id,
+  value: newThumbnail,
+  onChange: setNewThumbnail,
+}: ImagesVideosProps) => {
   const [thumbnail, setThumbnail] = useState<FullMetadata>();
-  const [newThumbnail, setNewThumbnail] = useState<File[] | null>(null);
-
+  const [fileInputKey, setFileInputKey] = useState<number>(Date.now()); // To reset the input field
   const [uploadingState, setUploadingState] = useState<string>();
 
   const handleGetFiles = () => {
@@ -89,7 +93,9 @@ export const Thumbnail = ({ unit_id, onChange }: ImagesVideosProps) => {
   }, []);
 
   useEffect(() => {
-    onChange(newThumbnail);
+    if (newThumbnail === null || newThumbnail.length === 0) {
+      setFileInputKey(Date.now()); // reset the file input field
+    }
   }, [newThumbnail]);
 
   const handleDelete = (file: FullMetadata) => {
@@ -141,6 +147,7 @@ export const Thumbnail = ({ unit_id, onChange }: ImagesVideosProps) => {
           <img src="/upload.svg" alt="upload" />
           Add Files
           <input
+            key={fileInputKey}
             value={""}
             type="file"
             id="thumbnailId"

diff --git a/frontend/src/components/ListingFormComponents.tsx b/frontend/src/components/ListingFormComponents.tsx
@@ -169,7 +169,7 @@ export function ListingFormComponents(props: ListingFormComponentsProps) {
   );
   const [errorMessage, setErrorMessage] = useState<string>("");
 
-  const [newFiles, setNewFiles] = useState<File[] | null>();
+  const [newFiles, setNewFiles] = useState<File[] | null>(null);
   const [thumbnail, setThumbnail] = useState<File[] | null>(null);
 
   const handleFirstName = (event: React.ChangeEvent<HTMLInputElement>) => {
@@ -423,7 +423,7 @@ export function ListingFormComponents(props: ListingFormComponentsProps) {
     setRentPerMonth("");
     setSecurityDeposit("");
     setThirdPartyPayment(undefined);
-    setHousingAuthority("LACDA");
+    setHousingAuthority(undefined);
     setHousingAuthorityOther(undefined);
     setApplicationFeeCost("");
     setDateAvailable("");
@@ -440,6 +440,8 @@ export function ListingFormComponents(props: ListingFormComponentsProps) {
     setPets([]);
     setSharingHousing("");
     setAdditionalCommentsLL("");
+    setNewFiles(null);
+    setThumbnail(null);
 
     if (props.formType === "housingLocator" || props.formType === "edit") {
       setWhereFindUnit("");
@@ -640,9 +642,17 @@ export function ListingFormComponents(props: ListingFormComponentsProps) {
           handler={handleAdditionalCommentsLL}
         />
 
-        <ImagesVideos unit_id={props.initialValues?._id ?? ""} onChange={setNewFiles} />
+        <ImagesVideos
+          unit_id={props.initialValues?._id ?? ""}
+          value={newFiles}
+          onChange={setNewFiles}
+        />
 
-        <Thumbnail unit_id={props.initialValues?._id ?? ""} onChange={setThumbnail} />
+        <Thumbnail
+          unit_id={props.initialValues?._id ?? ""}
+          value={thumbnail}
+          onChange={setThumbnail}
+        />
 
         {(props.formType === "housingLocator" || props.formType === "edit") && (
           <HousingLocatorFields

diff --git a/frontend/src/components/ReferralPopup.tsx b/frontend/src/components/ReferralPopup.tsx
@@ -380,7 +380,7 @@ export const ReferralPopup = ({ active, onClose, onSubmit, newCandidateOnly }: P
 
                       <SubmitButton
                         type="submit"
-                        value={newCandidateOnly ? "Add Client" : "Add Referral"}
+                        value={newCandidateOnly ? "Add Renter Candidate" : "Add Referral"}
                       ></SubmitButton>
                     </ButtonsWrapper>
                   </FormWrapper>