fix: nig-773

src/components/NumberInput.tsx

@@ -3,6 +3,7 @@ import { TextField } from '@mui/material';
 import { debounce } from 'lodash';
 
 const pattern = /^(0|[1-9][0-9]*)(\.[0-9]{0,1})?$/;
+const integerPattern = /^[1-9][0-9]*$/;
 
 export type NumberInputRef = {
   reset(): void;
@@ -15,6 +16,7 @@ type NumberInputProps = {
   label?: string;
   max?: number;
   min?: number;
+  integerOnly?: boolean;
   size?: 'small' | 'medium';
   onChange(value: number | null): void;
 };
@@ -23,6 +25,7 @@ export default forwardRef<NumberInputRef, NumberInputProps>(function NumberInput
     max = Number.MAX_SAFE_INTEGER,
     min = Number.MIN_SAFE_INTEGER,
     onChange,
+    integerOnly = false,
     ...restProps
   }: NumberInputProps,
   ref
@@ -38,7 +41,7 @@ export default forwardRef<NumberInputRef, NumberInputProps>(function NumberInput
       }
       return;
     }
-    if (pattern.test(nextValue)) {
+    if (integerOnly ? integerPattern.test(nextValue) : pattern.test(nextValue)) {
       const n = +nextValue;
       if (n <= max && n >= min) {
         setValue(nextValue);

src/service/contract/shares.ts

@@ -93,3 +93,9 @@ export async function transfer(address: string, amount: string) {
     address,
   });
 }
+
+export async function getSupply(address: string) {
+  return await http.get<string>('/xfans/api/shares/supply', {
+    address,
+  });
+}

src/welcome/Wallet/BuyModal.tsx

@@ -15,6 +15,7 @@ import {
   getBuyPrice,
   getBuyPriceAfterFee,
   getFloorPrice,
+  getSupply,
 } from '../../service/contract/shares';
 import { getBalance } from '../../service/contract/user';
 import useProfileModal from '../../store/useProfileModal';
@@ -70,15 +71,27 @@ const BuyModal = ({ onClose }: BuyModalProps) => {
   const [balance, setBalance] = useState('0');
   const [isBuying, setIsBuying] = useState(false);
   const [floorPrice, setFloorPrice] = useState('0');
+  const [supply, setSupply] = useState(0);
   const numberInputRef = useRef<NumberInputRef>(null);
 
   const [loadingFloorPrice, setLoadingFloorPrice] = useState<boolean>(true);
   const [loadingPrice, setLoadingPrice] = useState<boolean>(false);
   const [loadingPirceAfterFee, setLoadingPirceAfterFee] = useState<boolean>(false);
   const [loadingBalance, setLoadingBalance] = useState<boolean>(true);
+  const [loadingSupply, setLoadingSupply] = useState<boolean>(true);
 
   const ethPrice = useETHPrice();
 
+  useEffect(() => {
+    setLoadingSupply(true);
+    if (currentInfo?.walletAddress != null) {
+      getSupply(currentInfo?.walletAddress).then((data) => {
+        setLoadingSupply(false);
+        setSupply(+data);
+      });
+    }
+  }, [currentInfo]);
+
   useEffect(() => {
     if (amount === 0) {
       setGasFee('0');
@@ -181,6 +194,11 @@ const BuyModal = ({ onClose }: BuyModalProps) => {
       });
   }
 
+  const unit = useMemo(() => {
+    if (supply <= 5) return 1;
+    return 0.1;
+  }, [supply]);
+
   return (
     <Modal open onClose={onClose} width={553} closebuttonstyle={{ marginTop: '5px' }}>
       <div className="relative flex flex-col items-center">
@@ -200,15 +218,18 @@ const BuyModal = ({ onClose }: BuyModalProps) => {
           className="!mt-6"
           fullWidth
           label="Amount"
-          disabled={isBuying}
+          integerOnly={unit === 1}
+          disabled={isBuying || loadingSupply}
           onChange={(v) => {
             setAmount(v ?? 0);
           }}
         />
 
         <div className="mt-4 flex items-center space-x-1 self-end text-black">
           <span className="text-sm">Minimum unit: </span>
-          <span className="text-sm font-medium">0.1 </span>
+          <span className="text-sm font-medium">
+            {loadingSupply ? <CircularProgress size={8} /> : unit}
+          </span>
         </div>
 
         <Divider