Move onboarding components to app router folder (#5481)

## Problem solved

Short description of the bug fixed or feature added

<!-- start pr-codex -->

---

## PR-Codex overview
This PR reorganizes the onboarding-related components and types in the `apps/dashboard/src/app/login/onboarding` directory, improving the structure and imports. It also updates several import paths and refactors components for better clarity.

### Detailed summary
- Moved onboarding-related files to `apps/dashboard/src/app/login/onboarding`.
- Updated import paths for `isOnboardingComplete` to reflect the new structure.
- Refactored `PricingCard` import in `AccountForm.tsx` and `ChoosePlan.tsx`.
- Added `FeatureItem` component in `PricingCard`.
- Updated `useSkipOnboarding` and `ConfirmEmail` for new import paths.

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

<!-- end pr-codex -->

Author: MananTank

apps/dashboard/src/components/homepage/sections/PricingCard.tsx renamed to apps/dashboard/src/@/components/blocks/pricing-card.tsx

@@ -1,13 +1,14 @@
 import type { Team } from "@/api/team";
+import { CheckoutButton } from "@/components/billing";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
+import { ToolTipLabel } from "@/components/ui/tooltip";
 import { TrackedLinkTW } from "@/components/ui/tracked-link";
 import { cn } from "@/lib/utils";
+import { CheckIcon, CircleDollarSignIcon } from "lucide-react";
 import type React from "react";
 import { TEAM_PLANS } from "utils/pricing";
-import { CheckoutButton } from "../../../@/components/billing";
 import { remainingDays } from "../../../utils/date-utils";
-import { FeatureItem } from "./FeatureItem";
 
 type ButtonProps = React.ComponentProps<typeof Button>;
 
@@ -154,3 +155,30 @@ export const PricingCard: React.FC<PricingCardProps> = ({
     </div>
   );
 };
+
+type FeatureItemProps = {
+  text: string | string[];
+};
+
+function FeatureItem({ text }: FeatureItemProps) {
+  const titleStr = Array.isArray(text) ? text[0] : text;
+
+  return (
+    <div className="flex items-center gap-2">
+      <CheckIcon className="size-4 shrink-0 text-green-500" />
+      {Array.isArray(text) ? (
+        <div className="flex items-center gap-2">
+          <p className="text-muted-foreground">
+            {titleStr}{" "}
+            <span className="text-muted-foreground md:hidden">{text[1]}</span>
+          </p>
+          <ToolTipLabel label={text[1]}>
+            <CircleDollarSignIcon className="hidden size-4 text-muted-foreground md:block" />
+          </ToolTipLabel>
+        </div>
+      ) : (
+        <p className="text-muted-foreground">{titleStr}</p>
+      )}
+    </div>
+  );
+}

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx

@@ -23,7 +23,7 @@ import { toUnits } from "thirdweb";
 import type { ChainMetadata } from "thirdweb/chains";
 import { useActiveAccount, useWalletBalance } from "thirdweb/react";
 import { z } from "zod";
-import { isOnboardingComplete } from "../../../../../../login/isOnboardingRequired";
+import { isOnboardingComplete } from "../../../../../../login/onboarding/isOnboardingRequired";
 
 function formatTime(seconds: number) {
   const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });

apps/dashboard/src/app/account/settings/getAccount.ts

@@ -1,8 +1,8 @@
 import { API_SERVER_URL } from "@/constants/env";
 import type { Account } from "@3rdweb-sdk/react/hooks/useApi";
 import { getAuthToken } from "../../api/lib/getAuthToken";
-import { isOnboardingComplete } from "../../login/isOnboardingRequired";
 import { loginRedirect } from "../../login/loginRedirect";
+import { isOnboardingComplete } from "../../login/onboarding/isOnboardingRequired";
 
 /**
  * Just get the account object without enforcing onboarding.

apps/dashboard/src/app/login/LoginPage.tsx

@@ -15,10 +15,10 @@ import { ClientOnly } from "../../components/ClientOnly/ClientOnly";
 import { ThirdwebMiniLogo } from "../components/ThirdwebMiniLogo";
 import { getSDKTheme } from "../components/sdk-component-theme";
 import { doLogin, doLogout, getLoginPayload, isLoggedIn } from "./auth-actions";
-import { isOnboardingComplete } from "./isOnboardingRequired";
+import { isOnboardingComplete } from "./onboarding/isOnboardingRequired";
 
 const LazyOnboardingUI = lazy(
-  () => import("../../components/onboarding/on-boarding-ui.client"),
+  () => import("./onboarding/on-boarding-ui.client"),
 );
 
 const wallets = [

apps/dashboard/src/components/settings/Account/AccountForm.tsx renamed to apps/dashboard/src/app/login/onboarding/AccountForm.tsx

@@ -1,6 +1,7 @@
 "use client";
+
+import { PricingCard } from "@/components/blocks/pricing-card";
 import { Button } from "@/components/ui/button";
-import { PricingCard } from "components/homepage/sections/PricingCard";
 import { ArrowRightIcon } from "lucide-react";
 import { TitleAndDescription } from "./Title";
 

apps/dashboard/src/components/onboarding/ChoosePlan.tsx renamed to apps/dashboard/src/app/login/onboarding/ChoosePlan.tsx

@@ -1,3 +1,6 @@
+"use client";
+
+import type { Team } from "@/api/team";
 import { Spinner } from "@/components/ui/Spinner/Spinner";
 import { Button } from "@/components/ui/button";
 import {
@@ -13,19 +16,18 @@ import {
 } from "@3rdweb-sdk/react/hooks/useApi";
 import { useLoggedInUser } from "@3rdweb-sdk/react/hooks/useLoggedInUser";
 import { zodResolver } from "@hookform/resolvers/zod";
-import {
-  type EmailConfirmationValidationSchema,
-  emailConfirmationValidationSchema,
-} from "components/settings/Account/validations";
 import { useTrack } from "hooks/analytics/useTrack";
 import { useTxNotifications } from "hooks/useTxNotifications";
 import { REGEXP_ONLY_DIGITS_AND_CHARS } from "input-otp";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { shortenString } from "utils/usedapp-external";
-import type { Team } from "../../@/api/team";
 import { TitleAndDescription } from "./Title";
+import {
+  type EmailConfirmationValidationSchema,
+  emailConfirmationValidationSchema,
+} from "./validations";
 
 interface OnboardingConfirmEmailProps {
   email: string;

apps/dashboard/src/components/onboarding/ConfirmEmail.tsx renamed to apps/dashboard/src/app/login/onboarding/ConfirmEmail.tsx

@@ -1,11 +1,13 @@
+"use client";
+
 import { Spinner } from "@/components/ui/Spinner/Spinner";
 import { Button } from "@/components/ui/button";
 import type { Account } from "@3rdweb-sdk/react/hooks/useApi";
 import { useMutation } from "@tanstack/react-query";
-import { AccountForm } from "components/settings/Account/AccountForm";
 import { useState } from "react";
 import { useActiveWallet, useDisconnect } from "thirdweb/react";
-import { doLogout } from "../../app/login/auth-actions";
+import { doLogout } from "../auth-actions";
+import { AccountForm } from "./AccountForm";
 import { TitleAndDescription } from "./Title";
 
 type OnboardingGeneralProps = {

apps/dashboard/src/components/onboarding/General.tsx renamed to apps/dashboard/src/app/login/onboarding/General.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { Spinner } from "@/components/ui/Spinner/Spinner";
 import { Button } from "@/components/ui/button";
 import { TrackedLinkTW } from "@/components/ui/tracked-link";

apps/dashboard/src/components/onboarding/LinkWallet.tsx renamed to apps/dashboard/src/app/login/onboarding/LinkWallet.tsx

@@ -1,4 +1,5 @@
 import type { JSX } from "react";
+
 type TitleAndDescriptionProps = {
   heading: string | JSX.Element;
   description: string | JSX.Element;