56 febeメタマスク連携 (#57)

.env.example

@@ -10,4 +10,7 @@ FIREBASE_AUTH_DOMAIN=${firebaseの認証ドメイン}
 FIREBASE_PROJECT_ID=${firebaseのプロジェクトID}
 FIREBASE_MESSAGING_SENDER_ID=${firebaseのメッセージング送信者ID}
 FIREBASE_APP_ID=${firebaseのアプリID}
-FIREBASE_MEASUREMENT_ID=${firebaseの測定ID}
+FIREBASE_MEASUREMENT_ID=${firebaseの測定ID}
+
+// Wallet Connect
+WALLET_CONNECT_PROJECT_ID=${wallet connectのプロジェクトID}

components/MyProfile.vue

@@ -48,6 +48,10 @@ const props = defineProps({
     type: String as PropType<string | null>,
     required: true,
   },
+  walletAccount: {
+    type: Object,
+    required: true,
+  },
 });
 
 // プロフィール画像が設定されていない場合のデフォルト画像
@@ -62,7 +66,13 @@ const exchangeableToken = 100;
 const missionClearCount = 25;
 const missionCreateCount = 10;
 const missionClearedByOtherCount = 120;
-const walletAddress = "testtesttest";
+const walletAddress = computed(() => {
+  console.log(props.walletAccount);
+  return (
+    props.walletAccount?.address ??
+    "接続されていません。ウォレットと接続してください"
+  );
+});
 </script>
 
 <style lang="scss" scoped>
@@ -255,7 +265,6 @@ body {
     float: none;
     margin-left: auto;
     margin-right: auto;
-    z-index: 100;
   }
 }
 

nuxt.config.ts

@@ -9,6 +9,11 @@ export default defineNuxtConfig({
       gen: 2,
     },
   },
+  runtimeConfig: {
+    public: {
+      walletConnectProjectId: process.env.WALLET_CONNECT_PROJECT_ID || "",
+    },
+  },
   vuefire: {
     auth: true, // enable Firebase Authentication
     config: {