diff --git a/src/app/(marketing)/profile/[username]/page.tsx b/src/app/(marketing)/profile/[username]/page.tsx
index c73bc6c504..ba9a7de4f7 100644
--- a/src/app/(marketing)/profile/[username]/page.tsx
+++ b/src/app/(marketing)/profile/[username]/page.tsx
@@ -13,6 +13,7 @@ import { ArrowRight } from "@phosphor-icons/react/dist/ssr"
import { env } from "env"
import Image from "next/image"
import { notFound, redirect } from "next/navigation"
+import { JoinProfileAction } from "../_components/JoinProfileAction"
import { Profile } from "../_components/Profile"
import { ProfileColorBanner } from "../_components/ProfileColorBanner"
import { ProfileHero } from "../_components/ProfileHero"
@@ -146,6 +147,7 @@ const Page = async ({ params: { username } }: { params: { username: string } })
+
)
}
diff --git a/src/app/(marketing)/profile/_components/JoinProfileAction.tsx b/src/app/(marketing)/profile/_components/JoinProfileAction.tsx
new file mode 100644
index 0000000000..d2f304486d
--- /dev/null
+++ b/src/app/(marketing)/profile/_components/JoinProfileAction.tsx
@@ -0,0 +1,45 @@
+"use client"
+
+import { Anchor } from "@/components/ui/Anchor"
+import { Card } from "@/components/ui/Card"
+import { REFERRER_USER_SEARCH_PARAM_KEY } from "@app/(marketing)/create-profile/(onboarding)/constants"
+import { ArrowRight, Mountains } from "@phosphor-icons/react"
+import useUser from "components/[guild]/hooks/useUser"
+import { useProfile } from "../_hooks/useProfile"
+
+export const JoinProfileAction = () => {
+ const profile = useProfile()
+ const user = useUser()
+ if (!profile.data || user.guildProfile) {
+ return
+ }
+ return (
+
+
+
+
+
+
+
+ Join{" "}
+
+ {profile.data.name || profile.data.username}
+ {" "}
+ on their adventure
+
+
+
+
+
+ )
+}