Merge pull request #82 from kjhman21/removelogin_for_faucet

Remove private key login feature
klaytn · May 12, 2022 · c7cc1fb · c7cc1fb
2 parents e75afb1 + 3a0f2cc
commit c7cc1fb
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 12 deletions.
diff --git a/src/components/Input.js b/src/components/Input.js
@@ -68,7 +68,7 @@ class Input extends Component<Props> {
         {errorMessage !== undefined && (
           <p className={classNames('Input__error', {'show':errorMessage})}>{errorMessage || ''}</p>
         )}
-        {!errorMessage && !isInvalidData && onBlur && (
+        {!errorMessage && !isInvalidData && onBlur && value && (
           <p className={classNames('Input__error success', {'show': value.length > 0 && isSuccess !== null && !isSuccess})}>{ !isSuccess ? 'This custom address does not exist, please check again':''}</p>
         )}
 

diff --git a/src/components/KlayFaucet.js b/src/components/KlayFaucet.js
@@ -22,9 +22,10 @@ type Props = {
 class KlayFaucet extends Component<Props> {
   constructor() {
     super()
-    this.wallet = caver.klay.accounts.wallet[0]
+    this.wallet = {}
 
     this.state = {
+      wallet:'',
       balance: '0',
       isRunning: false,
       isRunningComplete: true,
@@ -33,20 +34,14 @@ class KlayFaucet extends Component<Props> {
       isShowingModal: false,
       popupShow: false,
       buttonName: 'OK',
+      isInvalidAddress: true,
       title: 'Your KLAY Fauccet request accepted.',
       message: 'You can run faucet once every 24 hours.',
       faucetMessage: 'You can run faucet once every 24 hours (last time you ran faucet was 24 hours ago).'
     }
   }
 
   componentDidMount() {
-    if (!this.wallet) {
-      browserHistory.push('/access?next=faucet')
-      return
-    }
-
-    this.getFaucetableBlock()
-    this.updateBalance()
   }
 
   getFaucetableBlock = () => {
@@ -75,6 +70,7 @@ class KlayFaucet extends Component<Props> {
         }else{
           root.setState({
             isLoadingFaucetableBlock: false,
+            isInvalidAddress:false,
             madeDate: 'Faucet is ready to run.',
           })
         }
@@ -83,6 +79,25 @@ class KlayFaucet extends Component<Props> {
     });
   }
 
+  changeWallet = (e) => {
+    if(e.target.value) {
+      this.wallet.address = e.target.value
+    }
+  }
+
+  onAddressBlur = () => {
+    if(!caver.utils.isAddress(this.wallet.address)) {
+      this.setState({
+        isLoadingFaucetableBlock: true,
+        isInvalidAddress: true,
+        madeDate: 'Invalid address',
+      })
+      return
+    }
+    this.getFaucetableBlock()
+    this.updateBalance()
+  }
+
   updateBalance = () => {
     const root = this
     fetch(`${APIEntry}/faucet/balance?address=${root.wallet.address}`, {
@@ -138,6 +153,7 @@ class KlayFaucet extends Component<Props> {
       isRunning,
       isRunningComplete,
       isLoadingFaucetableBlock,
+      isInvalidAddress,
       isShowingModal,
       madeDate,
       popupShow,
@@ -174,8 +190,9 @@ class KlayFaucet extends Component<Props> {
           </div>
 
           <Input
-            value={this.wallet && this.wallet.address}
-            readOnly
+            onChange={this.changeWallet}
+            onBlur={this.onAddressBlur}
+            placeholder="Please put your wallet address here"
             label="Account Address"
             className="KlayFaucet__input KlayFaucet__address"
           />
@@ -193,10 +210,12 @@ class KlayFaucet extends Component<Props> {
               title="Run Faucet"
               className="KlayFaucet__button"
               onClick={this.runFacuet}
-              disabled={isLoadingFaucetableBlock}
+              disabled={isLoadingFaucetableBlock || isInvalidAddress}
               loadingSet={isRunning}
             />
+            {!isInvalidAddress &&
             <span className={cx('faucet__message',{'on': isLoadingFaucetableBlock})}>{isLoadingFaucetableBlock ? faucetMessage : ''}</span>
+            }
           </div>
 
           <FaucetHowItWork leftBlock={madeDate} />