From a4aa217271c04e40a398a04b5c4918fe3d5fe1a9 Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Sun, 14 Aug 2022 11:08:21 +0300
Subject: [PATCH] Make combobox required on new plus suggestion

Closes #842
---
 app/components/Combobox.tsx         | 7 ++++++-
 app/routes/plus/suggestions/new.tsx | 2 +-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/app/components/Combobox.tsx b/app/components/Combobox.tsx
index d99a8e339..220fa6fc7 100644
--- a/app/components/Combobox.tsx
+++ b/app/components/Combobox.tsx
@@ -16,6 +16,7 @@ interface ComboboxProps<T> {
   className?: string;
   id?: string;
   isLoading?: boolean;
+  required?: boolean;
   initialValue?: ComboboxOption<T>;
   onChange?: (selectedOption?: ComboboxOption<T>) => void;
 }
@@ -26,6 +27,7 @@ export function Combobox<T extends Record<string, string | null | number>>({
   placeholder,
   initialValue,
   onChange,
+  required,
   className,
   id,
   isLoading = false,
@@ -71,6 +73,7 @@ export function Combobox<T extends Record<string, string | null | number>>({
         }
         data-cy={`${inputName}-combobox-input`}
         id={id}
+        required={required}
       />
       <HeadlessCombobox.Options
         className={clsx("combobox-options", {
@@ -109,10 +112,11 @@ export function UserCombobox({
   onChange,
   userIdsToOmit,
   className,
+  required,
   id,
 }: Pick<
   ComboboxProps<Pick<UserWithPlusTier, "discordId" | "plusTier">>,
-  "inputName" | "onChange" | "className" | "id"
+  "inputName" | "onChange" | "className" | "id" | "required"
 > & { userIdsToOmit?: Set<number>; initialUserId?: number }) {
   const { users, isLoading, isError } = useUsers();
 
@@ -154,6 +158,7 @@ export function UserCombobox({
       onChange={onChange}
       className={className}
       id={id}
+      required={required}
     />
   );
 }
diff --git a/app/routes/plus/suggestions/new.tsx b/app/routes/plus/suggestions/new.tsx
index 785653195..c4d4d060e 100644
--- a/app/routes/plus/suggestions/new.tsx
+++ b/app/routes/plus/suggestions/new.tsx
@@ -145,7 +145,7 @@ export default function PlusNewSuggestionModalPage() {
         </div>
         <div>
           <label htmlFor="user">Suggested user</label>
-          <UserCombobox inputName="user" onChange={setSelectedUser} />
+          <UserCombobox inputName="user" onChange={setSelectedUser} required />
           {selectedUserErrorMessage ? (
             <FormMessage type="error">{selectedUserErrorMessage}</FormMessage>
           ) : null}