upd

client/src/components/Select3.tsx

@@ -5,12 +5,13 @@ import { useClickAway } from "@uidotdev/usehooks";
 import CheckIcon from "./icons/CheckIcon";
 
 interface Props {
+  required?: boolean;
   defaultOption?: string;
   options: string[];
   onSelect: (option: string) => void;
 }
 
-function Select3({ defaultOption, options, onSelect }: Props) {
+function Select3({ required, defaultOption, options, onSelect }: Props) {
   const [showOptions, setShowOptions] = useState<boolean>(false);
   const [selectedOption, setSelectedOption] = useState<string>();
 
@@ -37,9 +38,10 @@ function Select3({ defaultOption, options, onSelect }: Props) {
         onClick={() => setShowOptions((prev) => !prev)}
       >
         <input
+          required={required}
           type="text"
           readOnly
-          value={defaultOption || selectedOption}
+          value={selectedOption || defaultOption}
           className="text-sm px-3 py-2.5 h-10 ring-1 ring-inset ring-[#DAE0E5] rounded-lg w-full outline-none pr-8 cursor-pointer"
         />
         <div className="absolute pr-2 cursor-pointer">