feat github middleware

src/App.vue

@@ -37,7 +37,48 @@ onMounted(() => {
     gsap.to(DOMSiteloader.value, { autoAlpha: 0, duration: 0.4 })
     store.titleToggle()
   })
+
+  verifyCode()
 })
+
+async function verifyCode() {
+  const params = new URLSearchParams(window.location.search)
+  const address = localStorage.getItem('address')
+  const code = params.get('code')
+  const value = localStorage.getItem('faucet-value')
+  const url = localStorage.getItem('faucet-url')
+  const lastUsedCode = localStorage.getItem('last-code')
+  if (!address || !code || !value || !url) return
+  if (lastUsedCode === code) return
+  localStorage.setItem('last-code', code)
+  try {
+    const response = await fetch(`${url}?code=${code}`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        to: address,
+        amount: parseInt(value!, 10) * 1000000 + 'ugnot', //TODO: need to be dynamyc if different token
+      }),
+    })
+
+    if (response.status === 200 && store.status === 'success') {
+      alert("Faucet successful")
+    } else {
+      alert(await response.text())
+    }
+
+    // Check the faucet response
+  } catch (e) {
+    alert(e)
+  }
+
+}
+
+
+
+
 </script>
 
 <template>

src/components/faucet/content/FaucetContentForm.vue

@@ -4,11 +4,12 @@
     <form class="w-full space-y-7 md:space-y-12" @submit.prevent="isAddressValid && captchaValid && requestFaucet()">
       <Input :label="'Enter your wallet address'" :placeholder="'e.g. g1juwee0ynsdvaukvxk3j5s4cl6nn24uxwlydxrl'" v-model="bindAddress" required />
       <Select v-if="store.selectedFaucet.amounts" :label="'Select faucet amount'" :options="options" @update="(option) => SelectAmount(option)" />
-      <Recaptcha :key="store.status" @validation="captchaValidation" :captchakey="store.selectedFaucet.recaptcha" />
+      <Recaptcha v-if="!store.selectedFaucet.github_oauth_client_id" :key="store.status" @validation="captchaValidation" :captchakey="store.selectedFaucet.recaptcha" />
       <div>
         <div class="flex flex-col md:flex-row gap-4">
           <Button text="Cancel" variant="outline" @click.prevent="() => closePopup()" class="w-full" />
-          <Button text="Request drip" class="w-full" type="submit" :disabled="captchaValid === false || !isAddressValid" />
+          <Button v-if="!store.selectedFaucet.github_oauth_client_id" text="Request drip" class="w-full" type="submit" :disabled="captchaValid === false || !isAddressValid" />
+          <Button v-else text="Request drip" class="w-full" @click.prevent="() => connectOauthGithub()" :disabled="!isAddressValid" />
         </div>
         <div v-if="error" class="text-center text-red-200 mt-6">{{ error }}</div>
       </div>
@@ -47,6 +48,15 @@ const captchaValidation = ({ code = 'error', secret = '' }) => {
   captchaSecret.value = secret
 }
 
+const connectOauthGithub = () => {
+  if (amount.value){
+    localStorage.setItem('faucet-value', amount.value.value.toString())
+  }
+  localStorage.setItem('address', bindAddress.value)
+  localStorage.setItem('faucet-url', store.selectedFaucet.url)
+  window.location.href = `https://github.com/login/oauth/authorize?client_id=${store.selectedFaucet.github_oauth_client_id}&redirect_uri=http://localhost:5173&scope=user:read`
+}
+
 const isAddressValid = computed(() => new RegExp(/^[a-z0-9]{40}$/).test(bindAddress.value))
 
 const SelectAmount = (option: SelectOption) => {

src/data/faucets.json

@@ -47,6 +47,15 @@
       "url": "https://faucet.dev.gnodevx.network",
       "description": "A development testnet faucet used for Gno DevX",
       "recaptcha": "6LeuHdoqAAAAAAPd4iDTKRAsywQXnPEgy0ZWVgTJ"
+    },
+    {
+      "name": "Teritori Faucet",
+      "chain_id": "test5",
+      "amounts": [1, 5, 10],
+      "url": "http://localhost:5050",
+      "description": "A development testnet faucet used for Gno Teritori",
+      "recaptcha": "",
+      "github_oauth_client_id": "Ov23limbJ7InJel7HiFH"
     }
   ]
 }

src/types/index.ts

@@ -8,4 +8,5 @@ export interface Faucet {
   description: string // faucet description - max 100chars
   recaptcha: string // the recaptcha site key, if any
   token?: string // token name: default $GNOT
+  github_oauth_client_id?: string // github oauth client id
 }