Nebula: Add Move funds page (#7298)

<!--

## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"

If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):

## Notes for the reviewer

Anything important to call out? Be sure to also clarify these in your comments.

## How to test

Unit tests, playground, etc.

-->

<!-- start pr-codex -->

---

## PR-Codex overview
This PR focuses on enhancing the user experience in the `Nebula` application by adding new features, improving existing components, and ensuring better handling of user authentication and fund transfers.

### Detailed summary
- Updated redirect logic in `middleware.ts` to preserve search params and prevent redirect from certain paths.
- Added `placeholder` prop to `DecimalInput` in `decimal-input.tsx`.
- Integrated `TWAutoConnect` component in `ChatPageLayout.tsx`.
- Enhanced `TransactionButton` in `TransactionButton.tsx` to manage a new `disableNoFundsPopup` prop.
- Refactored `NebulaProviders` to remove redundant `TWAutoConnect` usage.
- Created a new `RecoverPage` component in `move-funds/page.tsx` for fund recovery.
- Introduced `MoveFundsConnectButton` for connecting wallets in `connect-button.tsx`.
- Implemented a new `MoveFundsPage` for managing fund transfers.
- Updated `MismatchButton` to handle the new `disableNoFundsPopup` prop.
- Enhanced token management and user feedback within the `MoveFundsPage`.
- Added new components and functions for improved token selection and balance rendering.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
	- Introduced a Move Funds page for transferring cryptocurrency between wallets, featuring wallet connection, chain and token selection, and transaction handling.
	- Added a customizable connect button supporting multiple authentication methods and theme adaptation.
	- Added the ability to display placeholder text in decimal input fields.
	- Enhanced button components with an option to disable the "Not Enough Funds" popup.
	- Added a dedicated page layout combining header, theme toggle, support link, and Move Funds functionality.
	- Integrated automatic wallet connection within the chat page layout for seamless user experience.

- **Bug Fixes**
	- Updated middleware to allow unauthenticated access to the Move Funds page without redirecting to the login page.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

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,
+      }}
+    />
+  );
+}