Transfer NFTs

app/[user]/_lib/userTabPageFactory.tsx

@@ -1,3 +1,4 @@
+import { TransferProvider } from "@/components/nft-transfer/TransferState";
 import { getAppMetadata } from "@/components/providers/metadata";
 import UserPageLayout from "@/components/user/layout/UserPageLayout";
 import type { ApiIdentity } from "@/generated/models/ObjectSerializer";
@@ -16,9 +17,15 @@ type FactoryArgs = {
   subroute: string;
   metaLabel: string;
   Tab: (props: TabProps) => React.JSX.Element;
+  enableTransfer?: boolean;
 };
 
-export function createUserTabPage({ subroute, metaLabel, Tab }: FactoryArgs) {
+export function createUserTabPage({
+  subroute,
+  metaLabel,
+  Tab,
+  enableTransfer,
+}: FactoryArgs) {
   async function Page({
     params,
     searchParams,
@@ -50,11 +57,15 @@ export function createUserTabPage({ subroute, metaLabel, Tab }: FactoryArgs) {
       redirect(needsRedirect.redirect.destination);
     }
 
-    return (
-      <UserPageLayout profile={profile}>
+    const TabComponent = enableTransfer ? (
+      <TransferProvider>
         <Tab profile={profile} />
-      </UserPageLayout>
+      </TransferProvider>
+    ) : (
+      <Tab profile={profile} />
     );
+
+    return <UserPageLayout profile={profile}>{TabComponent}</UserPageLayout>;
   }
 
   async function generateMetadata({

app/[user]/collected/page.tsx

@@ -5,6 +5,7 @@ const { Page, generateMetadata } = createUserTabPage({
   subroute: "collected",
   metaLabel: "Collected",
   Tab: UserPageCollected,
+  enableTransfer: true,
 });
 
 export default Page;