style(dropdownComponent): add dark mode support to dropdown button background color

src/frontend/src/components/dropdownComponent/index.tsx

@@ -4,18 +4,27 @@ import { Fragment, useState } from "react";
 import { DropDownComponentType } from "../../types/components";
 import { classNames } from "../../utils";
 
-export default function Dropdown({value, options, onSelect}:DropDownComponentType) {
+export default function Dropdown({
-  let [internalValue,setInternalValue] = useState(value===""||!value?"Choose an option":value)
+  value,
+  options,
+  onSelect,
+}: DropDownComponentType) {
+  let [internalValue, setInternalValue] = useState(
+    value === "" || !value ? "Choose an option" : value
+  );
   return (
     <>
-      <Listbox value={internalValue} onChange={(value)=>{
+      <Listbox
-        setInternalValue(value)
+        value={internalValue}
-        onSelect(value)
+        onChange={(value) => {
-      }}>
+          setInternalValue(value);
+          onSelect(value);
+        }}
+      >
         {({ open }) => (
           <>
             <div className="relative mt-1">
-              <Listbox.Button className="relative w-full cursor-default rounded-md border border-gray-300 bg-white py-2 pl-3 pr-10 text-left shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500 sm:text-sm">
+              <Listbox.Button className="relative w-full cursor-default rounded-md border border-gray-300 bg-white dark:bg-gray-900 py-2 pl-3 pr-10 text-left shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500 sm:text-sm">
                 <span className="block w-max truncate">{internalValue}</span>
                 <span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
                   <ChevronUpDownIcon