svelte code organization

astriaorg · Jan 23, 2024 · 7b75124 · 7b75124
1 parent 6bec3d8
commit 7b75124
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 23 deletions.
diff --git a/web/index.html b/web/index.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/png" href="/favicon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Svelte</title>
+    <title>RIA Faucet</title>
   </head>
   <body>
     <div id="app"></div>

diff --git a/web/src/Faucet.svelte b/web/src/Faucet.svelte
@@ -1,28 +1,27 @@
-<script lang="ts">
-  import { onMount } from 'svelte'
-  import { getAddress } from '@ethersproject/address'
-  import { CloudflareProvider } from '@ethersproject/providers'
-  import { setDefaults as setToast, toast, ToastType } from 'bulma-toast'
-  import { ClaimRequest, getResData } from './api'
+<script lang="ts" context="module">
+  import { setDefaults as setToast } from 'bulma-toast'
 
+  // config
+  document.title = `RIA Faucet`
+  setToast({
+    position: 'bottom-center',
+    dismissible: true,
+    pauseOnHover: true,
+    closeOnClick: false,
+    animate: { in: 'fadeIn', out: 'fadeOut' },
+  })
 
+  // types
   type FaucetInfo = {
     fundingAddress: string
     rollupName: string
     network: string
     payout: number
   }
 
-  let input = null
-  let faucetInfo: FaucetInfo = {
-    fundingAddress: '',
-    rollupName: '',
-    network: 'testnet',
-    payout: 1,
-  }
-
-  $: document.title = `RIA Faucet`
+  // utils
 
+  // get the rollup name from the url path, e.g. the burger in faucet.hostname.com/burger
   function getRollupNameFromPath(): string {
     let path = window.location.pathname
     if (path[0] === '/') {
@@ -37,14 +36,23 @@
     }
     return path
   }
+</script>
 
-  setToast({
-    position: 'bottom-center',
-    dismissible: true,
-    pauseOnHover: true,
-    closeOnClick: false,
-    animate: { in: 'fadeIn', out: 'fadeOut' },
-  })
+<script lang="ts">
+  import { onMount } from 'svelte'
+  import { getAddress } from '@ethersproject/address'
+  import { CloudflareProvider } from '@ethersproject/providers'
+  import { toast, ToastType } from 'bulma-toast'
+  import { ClaimRequest, getResData } from './api'
+
+
+  let input = null
+  let faucetInfo: FaucetInfo = {
+    fundingAddress: '',
+    rollupName: '',
+    network: 'testnet',
+    payout: 1,
+  }
 
   onMount(async () => {
     if (window.location.pathname === '/') {