feat: tickets

.github/workflows/prod-deploy.yml

@@ -1,10 +1,10 @@
 name: Production Deploy
 
-# on: pull_request
-on:
-  push:
-    branches:
-      - main
+on: pull_request
+# on:
+#   push:
+#     branches:
+#       - main
 
 concurrency:
   group: ci-${{ github.ref }}

front/apps/app/components/deposit/form/Message.vue

@@ -1,14 +1,11 @@
 <script setup lang="ts">
-import { storeToRefs } from 'pinia'
-import { useExtensionStore } from '~/apps/auth/stores/extension'
-
 const { step } = useForm()
 
-const { provider } = storeToRefs(useExtensionStore())
+const { provider } = useExtensions()
 </script>
 
 <template>
-  <div class="text-white max-w-[450px]">
+  <div class="text-white max-w-[450px] text-white">
     <div>
       <button
         class="flex items-center space-x-[4px]"
@@ -42,6 +39,8 @@ const { provider } = storeToRefs(useExtensionStore())
       </div>
     </div>
 
+    {{ provider.account.address }}
+
     <div>
       <Button
         text="Click to Sign"

front/apps/app/layouts/App.vue

@@ -7,8 +7,6 @@ const wallet = useWalletStore()
 
 const { connected, truncatedAddress } = storeToRefs(wallet)
 
-// const showLoader = useAppShowLoader
-
 onBeforeMount(() => {
   if (!connected.value) {
     wallet.reconnect()

front/apps/app/pages/app.vue

@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import { useWalletStore } from '~/apps/auth/stores/wallet'
+
 definePageMeta({
   layout: 'app',
   middleware: 'auth'
@@ -7,14 +9,18 @@ definePageMeta({
 useHead({
   title: 'App'
 })
+
+const router = useRouter()
+
+const { encrypt } = useWalletStore()
 </script>
 
 <template>
   <div class="">
     <div class="max-w-[580px] pt-2">
       <div>
         <h2 class="text-white font-title text-[40px]">
-          Extensions
+          Encrypt
         </h2>
       </div>
 
@@ -28,14 +34,22 @@ useHead({
             text-[#BDBDBD]
           "
         >
-          Extensions are responsible for connecting a common
-          Wallet with your Opact Wallet and bringing your
-          tokens to a secure environment.
+          Opact Wallet uses encrypted data
         </p>
       </div>
 
-      <div>
-        <!-- <Tabs /> -->
+      <div class="flex flex-col space-y-[12px]">
+        <Button
+          text="Encrypt"
+          class="!h-[32px]"
+          @click="encrypt()"
+        />
+
+        <Button
+          text="Deposit"
+          class="!h-[32px]"
+          @click="router.push('/deposit')"
+        />
       </div>
     </div>
   </div>

front/apps/app/pages/deposit.vue

@@ -35,3 +35,15 @@ onBeforeMount(() => {
     </Transition>
   </div>
 </template>
+
+<style>
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.2s ease;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
+</style>

front/apps/auth/chains/ethereum/chain.ts

@@ -1,14 +1,11 @@
-import { adapters, getAdapters } from './providers'
+import { providers, getProvider } from './providers'
 
 export const eth = {
-  ttl: 600,
-
+  id: 'chain:ethereum',
   name: 'Ethereum',
 
-  key: 'chain:eth',
-
-  adapters,
-  getAdapters
+  providers,
+  getProvider
 }
 
 export default eth

front/apps/auth/chains/ethereum/provider/wallet-connect.ts

@@ -0,0 +1,67 @@
+import { ref } from 'vue'
+
+import {
+  getAccount,
+  signMessage,
+  disconnect
+} from '@wagmi/core'
+
+import type { Web3Modal } from '@web3modal/html'
+import { getWeb3Modal } from '../util'
+
+export const useProvider = () => {
+  const callback = ref<any>()
+
+  const account = ref<any>('')
+
+  const web3modal = ref<Web3Modal>()
+
+  const init = () => {
+    if (!web3modal.value) {
+      const modal = getWeb3Modal()
+
+      modal.subscribeEvents((event) => {
+        if (event.name === 'ACCOUNT_CONNECTED') {
+          account.value = getAccount()
+
+          callback.value()
+        }
+
+        if (event.name === 'ACCOUNT_DISCONNECTED') {
+          account.value = undefined
+        }
+      })
+
+      web3modal.value = modal
+    }
+
+    return web3modal.value
+  }
+
+  const connect = async (loginCallback = () => {}) => {
+    const modal = await init()
+
+    await modal.openModal()
+
+    callback.value = loginCallback
+  }
+
+  const sendTransaction = () => {}
+
+  return {
+    account,
+    connect,
+    signMessage,
+    sendTransaction,
+    disconnect
+  }
+}
+
+export default {
+  id: 'provider:wallet-connect',
+  name: 'Wallet Connector',
+  icon: 'walletConnect',
+  disabled: false,
+
+  provider: useProvider()
+}

front/apps/auth/chains/ethereum/providers.ts

@@ -1,8 +1,7 @@
-import { useWalletConnectAdapter } from './adapaters/wallet-connect'
+import xWallet from './provider/wallet-connect'
 
-export const adapters = {
-  'provider:eth:adapter:wallet-connect':
-    useWalletConnectAdapter()
+export const providers = {
+  [xWallet.id]: xWallet
 } as any
 
-export const getAdapters = (key: string) => adapters[key]
+export const getProvider = (key: string) => providers[key]

front/apps/auth/chains/ethereum/util.ts

@@ -0,0 +1,39 @@
+import {
+  arbitrum,
+  mainnet,
+  polygon
+} from '@wagmi/core/chains'
+
+import { configureChains, createConfig } from '@wagmi/core'
+
+import type { Chain } from '@wagmi/core/chains'
+
+import {
+  EthereumClient,
+  w3mConnectors,
+  w3mProvider
+} from '@web3modal/ethereum'
+
+import { Web3Modal } from '@web3modal/html'
+
+export const projectId = '8354195026b85d657e3692c119242c19'
+
+export const chains: Chain[] = [arbitrum, mainnet, polygon]
+
+export const { publicClient } = configureChains(chains, [
+  w3mProvider({ projectId })
+])
+
+export const wagmiClient = createConfig({
+  connectors: w3mConnectors({
+    projectId,
+    chains
+  }),
+  publicClient
+})
+
+export const ethereumClient = () =>
+  new EthereumClient(wagmiClient, chains)
+
+export const getWeb3Modal = (): Web3Modal =>
+  new Web3Modal({ projectId }, ethereumClient())