Console

User Center

After logging in, users can access the User Center by clicking the avatar dropdown menu. Here they can view their orders, edit personal information, and more.

You can add more features to the user console based on your needs.

user-orders

Console Layout

ShipAny includes a built-in console layout, located in the components/console/layout.tsx file.

To implement a user center layout, simply import the console layout component and pass a sidebar prop.

app/[locale]/(default)/(console)/layout.tsx

import ConsoleLayout from "@/components/console/layout";
import { ReactNode } from "react";
import { Sidebar } from "@/types/blocks/sidebar";
import { getTranslations } from "next-intl/server";
import { getUserInfo } from "@/services/user";
import { redirect } from "next/navigation";
 
export default async function ({ children }: { children: ReactNode }) {
  const userInfo = await getUserInfo();
  if (!userInfo || !userInfo.email) {
    redirect("/auth/signin");
  }
 
  const t = await getTranslations();
 
  const sidebar: Sidebar = {
    nav: {
      items: [
        {
          title: t("user.my_orders"),
          url: "/my-orders",
          icon: "RiOrderPlayLine",
          is_active: true,
        },
      ],
    },
  };
 
  return <ConsoleLayout sidebar={sidebar}>{children}</ConsoleLayout>;
}

Emails New Table