fix: remove multiselect for auth select

packages/ui/components/document/document-global-auth-action-select.tsx

@@ -9,12 +9,17 @@ import {
   DocumentAuth,
   NonEnterpriseDocumentActionAuth,
 } from '@documenso/lib/types/document-auth';
-import { MultiSelect, type Option } from '@documenso/ui/primitives/multiselect';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@documenso/ui/primitives/select';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
 export interface DocumentGlobalAuthActionSelectProps {
   value?: string[];
-  defaultValue?: string[];
   onValueChange?: (value: string[]) => void;
   disabled?: boolean;
   placeholder?: string;
@@ -23,7 +28,6 @@ export interface DocumentGlobalAuthActionSelectProps {
 
 export const DocumentGlobalAuthActionSelect = ({
   value,
-  defaultValue,
   onValueChange,
   disabled,
   placeholder,
@@ -37,47 +41,33 @@ export const DocumentGlobalAuthActionSelect = ({
         (auth) => auth !== DocumentAuth.EXPLICIT_NONE,
       );
 
-  // Convert auth types to MultiSelect options
+  const selectedValue = value?.[0] || '';
-  const authOptions: Option[] = [
-    {
-      value: '-1',
-      label: _(msg`No restrictions`),
-    },
-    ...authTypes.map((authType) => ({
-      value: authType,
-      label: DOCUMENT_AUTH_TYPES[authType].value,
-    })),
-  ];
 
-  // Convert string array to Option array for MultiSelect
+  const handleChange = (newValue: string) => {
-  const selectedOptions =
+    if (newValue === '-1') {
-    (value
+      onValueChange?.([]);
-      ?.map((val) => authOptions.find((option) => option.value === val))
+    } else {
-      .filter(Boolean) as Option[]) || [];
+      onValueChange?.([newValue]);
-
+    }
-  // Convert default value to Option array
-  const defaultOptions =
-    (defaultValue
-      ?.map((val) => authOptions.find((option) => option.value === val))
-      .filter(Boolean) as Option[]) || [];
-
-  const handleChange = (options: Option[]) => {
-    const values = options.map((option) => option.value);
-    onValueChange?.(values);
   };
 
   return (
-    <MultiSelect
+    <Select value={selectedValue || '-1'} onValueChange={handleChange} disabled={disabled}>
-      value={selectedOptions}
+      <SelectTrigger
-      defaultOptions={defaultOptions}
+        className="bg-background text-muted-foreground"
-      options={authOptions}
+        data-testid="documentActionSelectValue"
-      onChange={handleChange}
+      >
-      disabled={disabled}
+        <SelectValue placeholder={placeholder || _(msg`Select authentication method`)} />
-      placeholder={placeholder || _(msg`Select authentication methods`)}
+      </SelectTrigger>
-      className="bg-background text-muted-foreground"
+      <SelectContent>
-      hideClearAllButton={false}
+        <SelectItem value="-1">{_(msg`No restrictions`)}</SelectItem>
-      data-testid="documentActionSelectValue"
+        {authTypes.map((authType) => (
-    />
+          <SelectItem key={authType} value={authType}>
+            {DOCUMENT_AUTH_TYPES[authType].value}
+          </SelectItem>
+        ))}
+      </SelectContent>
+    </Select>
   );
 };
 
@@ -96,14 +86,14 @@ export const DocumentGlobalAuthActionTooltip = () => (
 
       <p>
         <Trans>
-          The authentication methods required for recipients to sign the signature field.
+          The authentication method required for recipients to sign the signature field.
         </Trans>
       </p>
 
       <p>
         <Trans>
-          These can be overriden by setting the authentication requirements directly on each
+          This can be overridden by setting the authentication requirements directly on each
-          recipient in the next step. Multiple methods can be selected.
+          recipient in the next step.
         </Trans>
       </p>