Merge pull request #51 from ATOR-Development/main

merge from main

.gitignore

@@ -22,3 +22,5 @@ logs
 .env
 .env.*
 !.env.example
+
+pnpm-lock.yaml

README.md

@@ -1,31 +1,7 @@
-# AnyOne Relay Dashboard (WIP)
+# AnyOne Relay Dashboard
 
 This repo houses the code to display the user specific information pertaining to ANON Relays.
 
-## To Do
-
-Since this is in progress, there is still work to be done.
-While this list seems long much of the boilerplate exists.
-
-- Get claimable rewards total
-- Get previously claimed to date
-- Get reward history per user and plot a graph (empty array now)
-- We need to implement signing for the functions - see below.
-- Register, Claim and Renounce functions need to be tested (need mock data)
-- We need decent mock data to test properly
-
-## Background
-
-This is actually the third iteration of this code:
-
-1. ANON built: https://github.com/ATOR-Development/ator-dashboard/
-2. Brewlabs built: https://github.com/brewlabs-code/ator/
-3. Brewlabs built stripped down: https://github.com/brewlabs-code/ator-relay-dashboard
-
-For reasons not worth getting into now ANON changed directions technically. As such the 2nd build was halted.
-Now, the underlying tech has changed somewhat and we are developing an MVP version focussing on the user account section.
-Much of the code has been migrated but also some updates where necessary.
-
 ## Tech used
 
 While there is a bunch of other packages installed some worth pointing out are:
@@ -82,26 +58,5 @@ Data is stored on chain using Arweave - this means it's permanent.
 
 Locally or in the app, the data is stored using Pinia.
 
-### Getting data
-
-For the most part data is fetched using Nuxt's `useAsyncData`.
-See https://nuxt.com/docs/getting-started/data-fetching
-
-Often, but not always, the results are stored in a Pinia state store.
-Alongside the store there are actions to retrieve the data, these actions or functions are called by `useAsyncData`, this means we can easily refresh, cache and manage the data.
-
-#### To get relay data per user we do something like this:
-
-- Using the Warp SDK we can get the contracts state.
-- Namely we want to get `verified` and `claimable` data.
-- This returns a list of relay fingerprints and associated addresses, stored in Pinia as a Getter.
-- The data is fetched here, `components\DataTableMyRelays.vue`, but stored in Pinia.
-- Since this only gives us relay fingerprints, we make an additional request to Arweave (using ARDB) `stores\useMetricsStore.ts`.
-- That gives use transaction data, namely the latest transaction ID.
-- We use that to retrieve relay meta in JSON format for ALL relays.
-- Then we need to map it to the existing fingerprints we retrieved earlier and display in the table.
-
 ## Resources
-
 - https://cookbook.g8way.io/concepts/index.html
-- http://arweave.net/bKdUd6vonjrZS4-FUGMPr5ecOeF405pR2DdO_at1D9I (example of Arweave JSON data)

components/DashboardHeader.vue

@@ -5,6 +5,7 @@ import ButtonConnect from './ui-kit/ButtonConnect.vue';
 import ButtonMobileMenu from './ui-kit/ButtonMobileMenu.vue';
 import ButtonThemeToggle from './ui-kit/ButtonThemeToggle.vue';
 import TitleAndLogo from './ui-kit/TitleAndLogo.vue';
+import ReportIssueButton from '@/components/ui-kit/ReportIssueButton.vue';
 
 const menuStore = useMenuStore();
 </script>
@@ -22,7 +23,6 @@ const menuStore = useMenuStore();
     >
       <div class="flex gap-2 items-center">
         <TitleAndLogo />
-        <h1 class="lg:hidden capitalize font-brand tracking-wider">ANyONe</h1>
       </div>
       <nav class="flex-1">
         <ul class="flex justify-center items-center space-x-4">

components/UserBalance.vue

@@ -38,16 +38,14 @@ defineProps<{
 
 <template>
   <ClientOnly>
-    <div>
+    <div class="inline-flex items-baseline gap-2">
       <span class="text-4xl font-bold" v-if="isConnected">
         {{ parseFloat(tokenBalance.formatted).toFixed(2) }}
-        <Ticker v-if="showTicker" />
       </span>
-
       <span class="text-4xl font-bold" v-if="!isConnected">
         --
-        <Ticker v-if="showTicker" />
       </span>
+      <Ticker v-if="showTicker" />
       <slot></slot>
     </div>
     <p v-if="balanceUsdError" class="ml-1 mt-1 text-sm">

components/ui-kit/TitleAndLogo.vue

@@ -1,18 +1,8 @@
 <template>
   <div>
     <router-link to="/" class="flex gap-2 items-top">
-      <img src="/images/anyone-logo.png" width="30" height="30" />
-      <img
-        src="/images/anyone-text.png"
-        width="100"
-        height="30"
-        className="hidden lg:block"
-      />
-      <h2
-        class="dark:text-white text-cyan-800 text-xl sr-only lg:not-sr-only font-brand font-bold block lg:hidden"
-      >
-        ANyONe
-      </h2>
+      <img class="object-contain h-8" src="/images/anyone-logo.png" />
+      <img class="object-contain h-8 mt-[2px]" src="/images/anyone-text.png" />
     </router-link>
   </div>
 </template>

operations/deploy-dashboard-dev.hcl

@@ -31,7 +31,7 @@ job "deploy-relay-dashboard-dev" {
             NUXT_PUBLIC_SEPOLIA_ATOR_TOKEN_CONTRACT="[[ consulKey "ator-token/sepolia/dev/address" ]]"
             NUXT_PUBLIC_WARP_GATEWAY = "https://warp-dre-node-dev.dmz.ator.dev"
             NUXT_PUBLIC_SUPPORT_WALLET_PUBLIC_KEY_BASE64 = "{{.Data.data.SUPPORT_ADDRESS_BASE64}}"
-            NUXT_PUBLIC_REGISTRATOR_CONTRACT="0x850eDF904e64a61f175a11bD16A7501496131cc7"
+            NUXT_PUBLIC_REGISTRATOR_CONTRACT="[[ consulKey "registrator/sepolia/dev/address" ]]"
             {{with secret "kv/dashboard/dev"}}
                 PERMAWEB_KEY="{{.Data.data.DASHBOARD_OWNER_KEY}}"
             {{end}}

operations/deploy-dashboard-live.hcl

@@ -29,7 +29,7 @@ job "deploy-relay-dashboard-live" {
             NUXT_PUBLIC_FACILITATOR_CONTRACT="[[ consulKey "facilitator/sepolia/live/address" ]]"
             NUXT_PUBLIC_SEPOLIA_ATOR_TOKEN_CONTRACT="[[ consulKey "ator-token/sepolia/live/address" ]]"
             NUXT_PUBLIC_WARP_GATEWAY = "https://warp-dre-node-live.dmz.ator.dev"
-            NUXT_PUBLIC_REGISTRATOR_CONTRACT="0x525C31B35065540059701eE5feC12120F581E96e"
+            NUXT_PUBLIC_REGISTRATOR_CONTRACT="[[ consulKey "registrator/sepolia/live/address" ]]"
             {{with secret "kv/dashboard/live"}}
                 PERMAWEB_KEY="{{.Data.data.DASHBOARD_OWNER_KEY}}"
                 NUXT_PUBLIC_SUPPORT_WALLET_PUBLIC_KEY_BASE64 = "{{.Data.data.SUPPORT_ADDRESS_BASE64}}"

operations/deploy-dashboard-stage.hcl

@@ -30,7 +30,7 @@ job "deploy-relay-dashboard-stage" {
             NUXT_PUBLIC_FACILITATOR_CONTRACT="[[ consulKey "facilitator/sepolia/stage/address" ]]"
             NUXT_PUBLIC_SEPOLIA_ATOR_TOKEN_CONTRACT="[[ consulKey "ator-token/sepolia/stage/address" ]]"
             NUXT_PUBLIC_WARP_GATEWAY = "https://warp-dre-node-stage.dmz.ator.dev"
-            NUXT_PUBLIC_REGISTRATOR_CONTRACT="0xe43443e3547ceE8Dc06ef389e35573f03408898F"
+            NUXT_PUBLIC_REGISTRATOR_CONTRACT="[[ consulKey "registrator/sepolia/stage/address" ]]"
             {{with secret "kv/dashboard/stage"}}
                 PERMAWEB_KEY="{{.Data.data.DASHBOARD_OWNER_KEY}}"
                 NUXT_PUBLIC_SUPPORT_WALLET_PUBLIC_KEY_BASE64 = "{{.Data.data.SUPPORT_ADDRESS_BASE64}}"

operations/fund-deployer.mjs

@@ -0,0 +1,25 @@
+import Irys from '@irys/sdk'
+
+// Requires: PERMAWEB_KEY
+// $ node operations/fund-deployer.mjs
+
+const IRYS_NODE = 'https://node2.irys.xyz/'
+const jwk = JSON.parse(
+  Buffer.from(process.env.PERMAWEB_KEY || 'NO_KEY', 'base64').toString('utf-8')
+)
+const irys = new Irys({ url: IRYS_NODE, token: 'arweave', key: jwk })
+
+async function fundDeployer() {  
+	try {
+    // const preBalance = await irys.getBalance('jp0QaS_Zai2hGaB-yRvAIMEtodmH_iHr0drpZxAZQtU')
+    const preBalance = await irys.getLoadedBalance()
+    console.log(`Irys loaded balance: ${preBalance}`)
+		// const fundTx = await irys.fund(irys.utils.toAtomic(0.1))
+		// console.log(`Successfully funded ${irys.utils.fromAtomic(fundTx.quantity)} ${irys.token}`)
+	} catch (e) {
+		console.log('Error interacting with permadata ', e)
+	}
+
+}
+
+fundDeployer().then().catch(err => console.error(err))