feat(sitekey - select added)

apps/Frontend/src/components/settings/InsuranceCredForm.tsx

@@ -2,6 +2,13 @@ import { useEffect, useState } from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { apiRequest } from "@/lib/queryClient";
 import { toast } from "@/hooks/use-toast";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
 
 type CredentialFormProps = {
   onClose: () => void;
@@ -14,7 +21,16 @@ type CredentialFormProps = {
   };
 };
 
-export function CredentialForm({ onClose, userId, defaultValues }: CredentialFormProps) {
+const SITE_KEYS = [
+  { label: "MassHealth (MH)", value: "MH" },
+  { label: "Delta Dental MA", value: "DDMA" },
+];
+
+export function CredentialForm({
+  onClose,
+  userId,
+  defaultValues,
+}: CredentialFormProps) {
   const [siteKey, setSiteKey] = useState(defaultValues?.siteKey || "");
   const [username, setUsername] = useState(defaultValues?.username || "");
   const [password, setPassword] = useState(defaultValues?.password || "");
@@ -92,13 +108,19 @@ export function CredentialForm({ onClose, userId, defaultValues }: CredentialFor
         <form onSubmit={handleSubmit} className="space-y-4">
           <div>
             <label className="block text-sm font-medium">Site Key</label>
-            <input
-              type="text"
-              value={siteKey}
-              onChange={(e) => setSiteKey(e.target.value)}
-              className="mt-1 p-2 border rounded w-full"
-              placeholder="e.g., MH, Delta MA, (keep the site key exact same)"
-            />
+            <Select value={siteKey} onValueChange={setSiteKey}>
+              <SelectTrigger className="mt-1">
+                <SelectValue placeholder="Select Site" />
+              </SelectTrigger>
+
+              <SelectContent>
+                {SITE_KEYS.map((site) => (
+                  <SelectItem key={site.value} value={site.value}>
+                    {site.label}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
           </div>
           <div>
             <label className="block text-sm font-medium">Username</label>
@@ -137,8 +159,8 @@ export function CredentialForm({ onClose, userId, defaultValues }: CredentialFor
                   ? "Updating..."
                   : "Creating..."
                 : defaultValues?.id
-                ? "Update"
-                : "Create"}
+                  ? "Update"
+                  : "Create"}
             </button>
           </div>
         </form>