Nebula: Add Move funds page

Author: MananTank

apps/dashboard/src/@/components/ui/decimal-input.tsx

@@ -5,6 +5,7 @@ export function DecimalInput(props: {
   maxValue?: number;
   id?: string;
   className?: string;
+  placeholder?: string;
 }) {
   return (
     <Input
@@ -13,6 +14,7 @@ export function DecimalInput(props: {
       value={props.value}
       className={props.className}
       inputMode="decimal"
+      placeholder={props.placeholder}
       onChange={(e) => {
         const number = Number(e.target.value);
         // ignore if string becomes invalid number

apps/dashboard/src/app/nebula-app/(app)/components/ChatPageLayout.tsx

@@ -1,5 +1,8 @@
 import { cn } from "@/lib/utils";
+import { TWAutoConnect } from "../../../(app)/components/autoconnect";
+import { nebulaAAOptions } from "../../login/account-abstraction";
 import type { TruncatedSessionInfo } from "../api/types";
+import { nebulaAppThirdwebClient } from "../utils/nebulaThirdwebClient";
 import { ChatSidebar } from "./ChatSidebar";
 import { MobileNav } from "./NebulaMobileNav";
 
@@ -27,6 +30,11 @@ export function ChatPageLayout(props: {
 
       <MobileNav sessions={props.sessions} authToken={props.authToken} />
 
+      <TWAutoConnect
+        accountAbstraction={nebulaAAOptions}
+        client={nebulaAppThirdwebClient}
+      />
+
       {props.children}
     </div>
   );

apps/dashboard/src/app/nebula-app/move-funds/connect-button.tsx

@@ -0,0 +1,52 @@
+"use client";
+
+import { useTheme } from "next-themes";
+import { ConnectButton } from "thirdweb/react";
+import { inAppWallet } from "thirdweb/wallets";
+import { getSDKTheme } from "../../(app)/components/sdk-component-theme";
+import { getClientThirdwebClient } from "../../../@/constants/thirdweb-client.client";
+import { nebulaAAOptions } from "../login/account-abstraction";
+
+// use dashboard client to allow users to connect to their original wallet and move funds to a different wallet
+const dashboardClient = getClientThirdwebClient();
+
+// since only the inApp and smart wallets were affected, only show in-app option
+const loginOptions = [
+  inAppWallet({
+    auth: {
+      options: [
+        "google",
+        "apple",
+        "facebook",
+        "github",
+        "email",
+        "phone",
+        "passkey",
+      ],
+    },
+  }),
+];
+
+// Note: This component has autoConnect enabled
+export function MoveFundsConnectButton(props: {
+  btnClassName?: string;
+  connectLabel?: string;
+}) {
+  const { theme } = useTheme();
+
+  return (
+    <ConnectButton
+      wallets={loginOptions}
+      client={dashboardClient}
+      theme={getSDKTheme(theme === "light" ? "light" : "dark")}
+      accountAbstraction={nebulaAAOptions}
+      connectButton={{
+        className: props.btnClassName,
+        label: props.connectLabel,
+      }}
+      detailsButton={{
+        className: props.btnClassName,
+      }}
+    />
+  );
+}