Merge pull request #30 from punky-lab/wyy

Wyy
punky-lab · Oct 25, 2024 · 4a2ca67 · 4a2ca67
2 parents 01ce09c + f031812
commit 4a2ca67
Show file tree

Hide file tree

Showing 6 changed files with 6,380 additions and 365 deletions.
diff --git a/assets/ui/avatar.svg b/assets/ui/avatar.svg
diff --git a/components/MainUI/Main.tsx b/components/MainUI/Main.tsx
@@ -104,7 +104,7 @@ export default function Main({
           onClick={() => switchTo("user")}
         />
       </div>
-      <div className="flex justify-between items-center mt-8">
+      <div className="flex justify-between items-center">
         {/* 左侧图标 */}
         <Image
           src={WalletIcon}

diff --git a/components/MainUI/User.tsx b/components/MainUI/User.tsx
@@ -1,6 +1,7 @@
 import PopUp from "./PopUp";
 import Image from "next/image"; // 导入 Image 组件
 import DEFAULT_AVATAR from "@/assets/ui/avatar.jpg";
+import AvatarBackground from "@/assets/ui/avatar.svg"
 
 const DEFAULT_NAME = "xiang nuan"; // 默认用户名
 const DEFAULE_ISONLINE = "online";
@@ -26,28 +27,31 @@ export default function User({
   bio = DEFAULT_BIO,
 }: UserProps) {
   return (
-    <PopUp title="Account" onClose={onClose}>
+    <PopUp title="Profile" onClose={onClose}>
       <div className="w-full rounded-lg">
-        <div className="flex items-center mb-6 px-4">
-          <Image
+        <div className="flex flex-row justify-center items-center">
+          <Image src={AvatarBackground} alt="avatar"></Image>
+        </div>
+        {/* <div className="flex items-center mb-6 px-4"> */}
+        {/* <Image
             src={userAvatar}
             alt={`${userName}'s avatar`}
             className="w-16 h-16 rounded-full border-2 border-white mr-4"
             width={64}
             height={64}
-          />
-          <div className="px-4">
+          /> */}
+        {/* <div className="px-4">
             <p className="text-xs text-white">{userName}</p>
             <p className="text-green-300 font-medium text-sm">{isOnline}</p>
           </div>
-        </div>
+        </div> */}
         <div className="text-xs leading-relaxed text-white px-4">
           <p className="font-semibold text-sm">Contact:</p>
           <p className="text-gray-200">{contact}</p>
           <p className="font-semibold text-sm mt-4">Bio:</p>
           <p className="text-gray-200">{bio}</p>
         </div>
       </div>
-    </PopUp>
+    </PopUp >
   );
 }
diff --git a/components/MainUI/Wallet.tsx b/components/MainUI/Wallet.tsx
@@ -1,5 +1,10 @@
-import { DynamicConnectButton, DynamicWidget } from "@dynamic-labs/sdk-react-core";
-import PopUp from "./PopUp";
+import { useState } from 'react';
+import { WalletTgSdk } from '@uxuycom/web3-tg-sdk';
+import { Button } from '@telegram-apps/telegram-ui'; // TelegramUI组件
+import PopUp from './PopUp'; // 假设PopUp是自定义的弹窗组件
+import { ConnectButton } from "@ant-design/web3"
+import type { Account } from '@ant-design/web3';
+import { ConfigProvider } from 'antd';
 
 
 interface WalletProps {
@@ -9,10 +14,49 @@ interface WalletProps {
 export default function Wallet({
     onClose,
 }: WalletProps) {
+    const { solana } = new WalletTgSdk({
+        injected: true,
+        metaData: {
+            hostname: 'your-app.com',
+            name: 'Your DApp Name',
+            icon: 'https://example.com/icon.png',
+        },
+    });
+
+    const [address, setAddress] = useState<Account | undefined>(undefined);
+
+    const solanaProvider = solana
+
+    // 处理钱包连接
+    const handleConnect = async () => {
+        await solanaProvider.connect({}, false);
+        const walletAddress = solanaProvider.publicKey?.toString();
+        setAddress({ "address": walletAddress }); // 设置钱包地址
+    };
+
     return (
-        <PopUp title="Wallet" onClose={onClose}>
-            <div className="flex grow items-center justify-center">
-                <DynamicWidget />
+        <PopUp onClose={onClose}>
+            <div className="flex justify-center items-center">
+                <ConfigProvider
+                    theme={{
+                        token: {
+                            colorPrimary: '#8442ff', // 主要颜色
+                            colorBgBase: '#000000',  // 背景颜色设置为黑色
+                            colorTextBase: '#ffffff', // 文字颜色设置为白色
+                            colorBorder: '#444444',  // 边框颜色设置为灰色
+                        },
+                    }}
+                >
+                    <ConnectButton
+                        type="primary"
+                        account={address}
+                        onConnectClick={handleConnect}
+                        onDisconnectClick={() => {
+                            setAddress(undefined);
+                            solanaProvider.disconnect()
+                        }}
+                    />
+                </ConfigProvider>
             </div>
         </PopUp>
     );

diff --git a/package.json b/package.json
@@ -13,16 +13,21 @@
   "dependencies": {
     "@ai-sdk/google": "^0.0.51",
     "@ai-sdk/openai": "^0.0.62",
+    "@ant-design/web3": "^1.17.2",
     "@coral-xyz/anchor": "^0.30.1",
+    "@dynamic-labs/ethereum": "^3.3.0",
     "@dynamic-labs/sdk-react-core": "^3.3.0",
     "@dynamic-labs/solana": "^3.3.0",
     "@google/generative-ai": "^0.21.0",
     "@next/font": "^14.2.13",
-    "@solana/web3.js": "^1.95.3",
+    "@solana/spl-token": "^0.4.9",
+    "@solana/web3.js": "^1.95.4",
     "@telegram-apps/react-router-integration": "^1.0.0",
     "@telegram-apps/sdk-react": "^1.0.0",
     "@telegram-apps/telegram-ui": "^2.1.5",
+    "@uxuycom/web3-tg-sdk": "^0.1.3",
     "ai": "^3.4.9",
+    "antd": "^5.21.5",
     "eruda": "^3.0.1",
     "framer-motion": "^11.5.4",
     "next": "14.2.4",
@@ -44,4 +49,4 @@
     "tailwindcss": "^3.4.1",
     "typescript": "^5"
   }
-}
+}