Add custom currencyselector label

AngelProtocolFinance · Dec 21, 2023 · ef469a0 · ef469a0
1 parent 80c6ead
commit ef469a0
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 4 deletions.
diff --git a/src/components/BankDetails/BankDetails.tsx b/src/components/BankDetails/BankDetails.tsx
@@ -82,6 +82,7 @@ function Content({
  onChange={setTargetCurrency}
  classes={{ combobox: "w-full md:w-80" }}
  disabled={isSubmitting}
+ label="Select your bank account currency:"
  />
  <ExpectedFunds
  classes={{ input: "md:w-80" }}

diff --git a/src/components/CurrencySelector.tsx b/src/components/CurrencySelector.tsx
@@ -12,9 +12,10 @@ export type Currency = {
 
 type Props = {
  classes?: { combobox?: string };
+ currencies: Currency[];
  disabled: boolean;
+ label: string;
  value: Currency;
- currencies: Currency[];
  onChange: (currency: Currency) => void;
 };
 
@@ -44,7 +45,7 @@ function CurrencySelector(props: Props) {
  return (
  <div className="field">
  <Label htmlFor={inputRef.current?.id} required aria-required>
- Select your bank account currency:
+ {props.label}
  </Label>
  <Combobox
  value={props.value}

diff --git a/src/components/donation/Steps/DonateMethods/Stripe/CurrencySelectorField.tsx b/src/components/donation/Steps/DonateMethods/Stripe/CurrencySelectorField.tsx
@@ -22,11 +22,12 @@ export default function CurrencySelectorField<T extends FieldValues>(
 
  return (
  <CurrencySelector
- value={field.value}
- onChange={field.onChange}
  classes={props.classes}
  currencies={props.currencies.map((x) => ({ code: x.toUpperCase() }))}
  disabled={!!props.disabled || formState.isSubmitting}
+ label="Select your donation currency:"
+ onChange={field.onChange}
+ value={field.value}
  />
  );
 }