refactor(core): move app para src e padroniza estrutura

src/app/(dashboard)/reports/card-usage/layout.tsx

@@ -0,0 +1,23 @@
+import { RiBankCard2Line } from "@remixicon/react";
+import PageDescription from "@/shared/components/page-description";
+
+export const metadata = {
+	title: "Uso de Cartões | OpenMonetis",
+};
+
+export default function RootLayout({
+	children,
+}: {
+	children: React.ReactNode;
+}) {
+	return (
+		<section className="space-y-6 pt-4">
+			<PageDescription
+				icon={<RiBankCard2Line />}
+				title="Uso de Cartões"
+				subtitle="Análise detalhada do uso dos seus cartões de crédito."
+			/>
+			{children}
+		</section>
+	);
+}

src/app/(dashboard)/reports/card-usage/loading.tsx

@@ -0,0 +1,88 @@
+import { Card, CardContent, CardHeader } from "@/shared/components/ui/card";
+import { Skeleton } from "@/shared/components/ui/skeleton";
+
+export default function Loading() {
+	return (
+		<main className="flex flex-col gap-4">
+			{/* MonthNavigation skeleton */}
+			<Skeleton className="h-10 w-64" />
+
+			{/* Summary stats */}
+			<div className="grid gap-3 grid-cols-2 lg:grid-cols-4">
+				{[1, 2, 3, 4].map((i) => (
+					<Card key={i}>
+						<CardContent className="p-4">
+							<Skeleton className="h-3 w-16 mb-1" />
+							<Skeleton className="h-6 w-24" />
+						</CardContent>
+					</Card>
+				))}
+			</div>
+
+			{/* Cards grid */}
+			<div className="grid gap-2 grid-cols-2 lg:grid-cols-4 xl:grid-cols-6">
+				{[1, 2, 3, 4].map((i) => (
+					<Skeleton key={i} className="h-16 w-full rounded-lg" />
+				))}
+			</div>
+
+			{/* CardUsageChart */}
+			<Card>
+				<CardHeader className="pb-2">
+					<div className="flex items-center justify-between">
+						<Skeleton className="h-5 w-32" />
+						<div className="flex items-center gap-2">
+							<Skeleton className="size-6 rounded" />
+							<Skeleton className="h-4 w-24" />
+						</div>
+					</div>
+				</CardHeader>
+				<CardContent>
+					<Skeleton className="h-[280px] w-full" />
+				</CardContent>
+			</Card>
+
+			{/* CategoryBreakdown + TopExpenses */}
+			<div className="grid gap-4 md:grid-cols-2">
+				<Card className="h-full">
+					<CardHeader className="pb-3">
+						<Skeleton className="h-5 w-36" />
+					</CardHeader>
+					<CardContent className="space-y-2">
+						{[1, 2, 3, 4].map((i) => (
+							<Skeleton key={i} className="h-14 w-full" />
+						))}
+					</CardContent>
+				</Card>
+
+				<Card className="h-full">
+					<CardHeader className="pb-3">
+						<Skeleton className="h-5 w-36" />
+					</CardHeader>
+					<CardContent className="space-y-2">
+						{[1, 2, 3, 4].map((i) => (
+							<Skeleton key={i} className="h-14 w-full" />
+						))}
+					</CardContent>
+				</Card>
+			</div>
+
+			{/* CardInvoiceStatus - timeline minimalista */}
+			<Card>
+				<CardHeader className="pb-2">
+					<Skeleton className="h-5 w-24" />
+				</CardHeader>
+				<CardContent>
+					<div className="flex items-center gap-1">
+						{[1, 2, 3, 4, 5, 6].map((i) => (
+							<div key={i} className="flex-1 flex flex-col items-center gap-1">
+								<Skeleton className="w-full h-3 rounded-sm" />
+								<Skeleton className="h-3 w-6" />
+							</div>
+						))}
+					</div>
+				</CardContent>
+			</Card>
+		</main>
+	);
+}

src/app/(dashboard)/reports/card-usage/page.tsx

@@ -0,0 +1,80 @@
+import { RiBankCard2Line } from "@remixicon/react";
+import { fetchCartoesReportData } from "@/features/reports/cards-report-queries";
+import { CardCategoryBreakdown } from "@/features/reports/components/cards/card-category-breakdown";
+import { CardInvoiceStatus } from "@/features/reports/components/cards/card-invoice-status";
+import { CardTopExpenses } from "@/features/reports/components/cards/card-top-expenses";
+import { CardUsageChart } from "@/features/reports/components/cards/card-usage-chart";
+import { CardsOverview } from "@/features/reports/components/cards/cards-overview";
+import MonthNavigation from "@/shared/components/month-picker/month-navigation";
+import { Card } from "@/shared/components/ui/card";
+import { getUser } from "@/shared/lib/auth/server";
+import { parsePeriodParam } from "@/shared/utils/period";
+
+type PageSearchParams = Promise<Record<string, string | string[] | undefined>>;
+
+type PageProps = {
+	searchParams?: PageSearchParams;
+};
+
+const getSingleParam = (
+	params: Record<string, string | string[] | undefined> | undefined,
+	key: string,
+) => {
+	const value = params?.[key];
+	if (!value) return null;
+	return Array.isArray(value) ? (value[0] ?? null) : value;
+};
+
+export default async function RelatorioCartoesPage({
+	searchParams,
+}: PageProps) {
+	const user = await getUser();
+	const resolvedSearchParams = searchParams ? await searchParams : undefined;
+	const periodoParam = getSingleParam(resolvedSearchParams, "periodo");
+	const cartaoParam = getSingleParam(resolvedSearchParams, "cartao");
+	const { period: selectedPeriod } = parsePeriodParam(periodoParam);
+
+	const data = await fetchCartoesReportData(
+		user.id,
+		selectedPeriod,
+		cartaoParam,
+	);
+
+	return (
+		<main className="flex flex-col gap-4">
+			<MonthNavigation />
+
+			<CardsOverview data={data} />
+
+			{data.selectedCard ? (
+				<>
+					<CardUsageChart
+						data={data.selectedCard.monthlyUsage}
+						limit={data.selectedCard.card.limit}
+						card={{
+							name: data.selectedCard.card.name,
+							logo: data.selectedCard.card.logo,
+						}}
+					/>
+
+					<CardInvoiceStatus data={data.selectedCard.invoiceStatus} />
+
+					<div className="grid gap-4 md:grid-cols-2">
+						<CardCategoryBreakdown data={data.selectedCard.categoryBreakdown} />
+						<CardTopExpenses data={data.selectedCard.topExpenses} />
+					</div>
+				</>
+			) : (
+				<Card className="flex flex-col items-center justify-center py-16 text-center">
+					<div className="flex size-14 items-center justify-center rounded-full bg-muted mb-4">
+						<RiBankCard2Line className="size-7 text-muted-foreground" />
+					</div>
+					<p className="text-base font-medium">Nenhum cartão selecionado</p>
+					<p className="text-sm text-muted-foreground mt-1">
+						Selecione um cartão para ver os detalhes de uso.
+					</p>
+				</Card>
+			)}
+		</main>
+	);
+}

src/app/(dashboard)/reports/category-trends/layout.tsx

@@ -0,0 +1,23 @@
+import { RiFileChartLine } from "@remixicon/react";
+import PageDescription from "@/shared/components/page-description";
+
+export const metadata = {
+	title: "Tendências | OpenMonetis",
+};
+
+export default function RootLayout({
+	children,
+}: {
+	children: React.ReactNode;
+}) {
+	return (
+		<section className="space-y-6 pt-4">
+			<PageDescription
+				icon={<RiFileChartLine />}
+				title="Tendências"
+				subtitle="Acompanhe a evolução dos seus gastos e receitas por categoria ao longo do tempo."
+			/>
+			{children}
+		</section>
+	);
+}

src/app/(dashboard)/reports/category-trends/loading.tsx

@@ -0,0 +1,9 @@
+import { CategoryReportSkeleton } from "@/shared/components/skeletons/category-report-skeleton";
+
+export default function Loading() {
+	return (
+		<main className="flex flex-col gap-6">
+			<CategoryReportSkeleton />
+		</main>
+	);
+}

src/app/(dashboard)/reports/category-trends/page.tsx

@@ -0,0 +1,114 @@
+import { redirect } from "next/navigation";
+import type { Categoria } from "@/db/schema";
+import { fetchCategoryChartData } from "@/features/reports/category-chart-queries";
+import { fetchCategoryReport } from "@/features/reports/category-report-queries";
+import { fetchUserCategories } from "@/features/reports/category-trends-queries";
+import { CategoryReportPage } from "@/features/reports/components/category-report-page";
+import type {
+	CategoryOption,
+	FilterState,
+} from "@/features/reports/components/types";
+import { validateDateRange } from "@/features/reports/utils";
+import { getUserId } from "@/shared/lib/auth/server";
+import type { CategoryReportFilters } from "@/shared/lib/types/reports";
+import { addMonthsToPeriod, getCurrentPeriod } from "@/shared/utils/period";
+
+type PageSearchParams = Promise<Record<string, string | string[] | undefined>>;
+
+type PageProps = {
+	searchParams?: PageSearchParams;
+};
+
+const getSingleParam = (
+	params: Record<string, string | string[] | undefined> | undefined,
+	key: string,
+): string | null => {
+	const value = params?.[key];
+	if (!value) return null;
+	return Array.isArray(value) ? (value[0] ?? null) : value;
+};
+
+export default async function Page({ searchParams }: PageProps) {
+	// Get authenticated user
+	const userId = await getUserId();
+
+	// Resolve search params
+	const resolvedSearchParams = searchParams ? await searchParams : undefined;
+
+	// Extract query params
+	const inicioParam = getSingleParam(resolvedSearchParams, "inicio");
+	const fimParam = getSingleParam(resolvedSearchParams, "fim");
+	const categoriasParam = getSingleParam(resolvedSearchParams, "categorias");
+
+	// Calculate default period (last 6 months)
+	const currentPeriod = getCurrentPeriod();
+	const defaultStartPeriod = addMonthsToPeriod(currentPeriod, -5); // 6 months including current
+
+	// Use params or defaults
+	const startPeriod = inicioParam ?? defaultStartPeriod;
+	const endPeriod = fimParam ?? currentPeriod;
+
+	// Parse selected categories
+	const selectedCategoryIds = categoriasParam
+		? categoriasParam.split(",").filter(Boolean)
+		: [];
+
+	// Validate date range
+	const validation = validateDateRange(startPeriod, endPeriod);
+	if (!validation.isValid) {
+		// Redirect to default if validation fails
+		redirect(
+			`/reports/category-trends?inicio=${defaultStartPeriod}&fim=${currentPeriod}`,
+		);
+	}
+
+	// Fetch all categories for the user
+	const categoriaRows = await fetchUserCategories(userId);
+
+	// Map to CategoryOption format
+	const categoryOptions: CategoryOption[] = categoriaRows.map(
+		(cat: Categoria): CategoryOption => ({
+			id: cat.id,
+			name: cat.name,
+			icon: cat.icon,
+			type: cat.type as "despesa" | "receita",
+		}),
+	);
+
+	// Build filters for data fetching
+	const filters: CategoryReportFilters = {
+		startPeriod,
+		endPeriod,
+		categoryIds:
+			selectedCategoryIds.length > 0 ? selectedCategoryIds : undefined,
+	};
+
+	// Fetch report data
+	const reportData = await fetchCategoryReport(userId, filters);
+
+	// Fetch chart data with same filters
+	const chartData = await fetchCategoryChartData(
+		userId,
+		startPeriod,
+		endPeriod,
+		selectedCategoryIds.length > 0 ? selectedCategoryIds : undefined,
+	);
+
+	// Build initial filter state for client component
+	const initialFilters: FilterState = {
+		selectedCategories: selectedCategoryIds,
+		startPeriod,
+		endPeriod,
+	};
+
+	return (
+		<main className="flex flex-col gap-6">
+			<CategoryReportPage
+				initialData={reportData}
+				categories={categoryOptions}
+				initialFilters={initialFilters}
+				chartData={chartData}
+			/>
+		</main>
+	);
+}

src/app/(dashboard)/reports/establishments/layout.tsx

@@ -0,0 +1,23 @@
+import { RiStore2Line } from "@remixicon/react";
+import PageDescription from "@/shared/components/page-description";
+
+export const metadata = {
+	title: "Top Estabelecimentos | OpenMonetis",
+};
+
+export default function RootLayout({
+	children,
+}: {
+	children: React.ReactNode;
+}) {
+	return (
+		<section className="space-y-6 pt-4">
+			<PageDescription
+				icon={<RiStore2Line />}
+				title="Top Estabelecimentos"
+				subtitle="Análise dos locais onde você mais compra e gasta"
+			/>
+			{children}
+		</section>
+	);
+}

src/app/(dashboard)/reports/establishments/loading.tsx

@@ -0,0 +1,58 @@
+import { Card, CardContent, CardHeader } from "@/shared/components/ui/card";
+import { Skeleton } from "@/shared/components/ui/skeleton";
+
+export default function Loading() {
+	return (
+		<main className="flex flex-col gap-4">
+			<div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
+				<div className="flex flex-col gap-1">
+					<Skeleton className="h-8 w-48" />
+					<Skeleton className="h-4 w-64" />
+				</div>
+				<Skeleton className="h-8 w-48" />
+			</div>
+
+			<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
+				{[1, 2, 3, 4].map((i) => (
+					<Card key={i}>
+						<CardContent className="p-4">
+							<Skeleton className="h-16 w-full" />
+						</CardContent>
+					</Card>
+				))}
+			</div>
+
+			<div className="grid gap-4 sm:grid-cols-2">
+				<Skeleton className="h-20 w-full" />
+				<Skeleton className="h-20 w-full" />
+			</div>
+
+			<div className="grid gap-4 lg:grid-cols-3">
+				<div className="lg:col-span-2">
+					<Card>
+						<CardHeader>
+							<Skeleton className="h-5 w-48" />
+						</CardHeader>
+						<CardContent className="space-y-4">
+							{[1, 2, 3, 4, 5, 6, 7, 8].map((i) => (
+								<Skeleton key={i} className="h-16 w-full" />
+							))}
+						</CardContent>
+					</Card>
+				</div>
+				<div>
+					<Card>
+						<CardHeader>
+							<Skeleton className="h-5 w-40" />
+						</CardHeader>
+						<CardContent className="space-y-3">
+							{[1, 2, 3, 4, 5].map((i) => (
+								<Skeleton key={i} className="h-12 w-full" />
+							))}
+						</CardContent>
+					</Card>
+				</div>
+			</div>
+		</main>
+	);
+}

src/app/(dashboard)/reports/establishments/page.tsx

@@ -0,0 +1,76 @@
+import { EstablishmentsList } from "@/features/reports/components/establishments/establishments-list";
+import { HighlightsCards } from "@/features/reports/components/establishments/highlights-cards";
+import { PeriodFilterButtons } from "@/features/reports/components/establishments/period-filter";
+import { SummaryCards } from "@/features/reports/components/establishments/summary-cards";
+import { TopCategories } from "@/features/reports/components/establishments/top-categories";
+import {
+	fetchTopEstabelecimentosData,
+	type PeriodFilter,
+} from "@/features/reports/establishments/queries";
+import { Card } from "@/shared/components/ui/card";
+import { getUser } from "@/shared/lib/auth/server";
+import { parsePeriodParam } from "@/shared/utils/period";
+
+type PageSearchParams = Promise<Record<string, string | string[] | undefined>>;
+
+type PageProps = {
+	searchParams?: PageSearchParams;
+};
+
+const getSingleParam = (
+	params: Record<string, string | string[] | undefined> | undefined,
+	key: string,
+) => {
+	const value = params?.[key];
+	if (!value) return null;
+	return Array.isArray(value) ? (value[0] ?? null) : value;
+};
+
+const validatePeriodFilter = (value: string | null): PeriodFilter => {
+	if (value === "3" || value === "6" || value === "12") {
+		return value;
+	}
+	return "6";
+};
+
+export default async function TopEstabelecimentosPage({
+	searchParams,
+}: PageProps) {
+	const user = await getUser();
+	const resolvedSearchParams = searchParams ? await searchParams : undefined;
+	const periodoParam = getSingleParam(resolvedSearchParams, "periodo");
+	const mesesParam = getSingleParam(resolvedSearchParams, "meses");
+
+	const { period: currentPeriod } = parsePeriodParam(periodoParam);
+	const periodFilter = validatePeriodFilter(mesesParam);
+
+	const data = await fetchTopEstabelecimentosData(
+		user.id,
+		currentPeriod,
+		periodFilter,
+	);
+
+	return (
+		<main className="flex flex-col gap-4">
+			<Card className="flex-row items-center justify-between p-3">
+				<span className="text-sm text-muted-foreground">
+					Selecione o intervalo de meses
+				</span>
+				<PeriodFilterButtons currentFilter={periodFilter} />
+			</Card>
+
+			<SummaryCards summary={data.summary} />
+
+			<HighlightsCards summary={data.summary} />
+
+			<div className="grid grid-cols-1 gap-4 lg:grid-cols-2">
+				<div>
+					<EstablishmentsList establishments={data.establishments} />
+				</div>
+				<div>
+					<TopCategories categories={data.topCategories} />
+				</div>
+			</div>
+		</main>
+	);
+}

src/app/(dashboard)/reports/installment-analysis/layout.tsx

@@ -0,0 +1,23 @@
+import { RiSecurePaymentLine } from "@remixicon/react";
+import PageDescription from "@/shared/components/page-description";
+
+export const metadata = {
+	title: "Análise de Parcelas | OpenMonetis",
+};
+
+export default function RootLayout({
+	children,
+}: {
+	children: React.ReactNode;
+}) {
+	return (
+		<section className="space-y-6 pt-4">
+			<PageDescription
+				icon={<RiSecurePaymentLine />}
+				title="Análise de Parcelas"
+				subtitle="Quanto você gastaria pagando suas despesas parceladas à vista?"
+			/>
+			{children}
+		</section>
+	);
+}

src/app/(dashboard)/reports/installment-analysis/page.tsx

@@ -0,0 +1,14 @@
+import { InstallmentAnalysisPage } from "@/features/dashboard/components/installment-analysis/installment-analysis-page";
+import { fetchInstallmentAnalysis } from "@/features/dashboard/expenses/installment-analysis-queries";
+import { getUser } from "@/shared/lib/auth/server";
+
+export default async function Page() {
+	const user = await getUser();
+	const data = await fetchInstallmentAnalysis(user.id);
+
+	return (
+		<main className="flex flex-col gap-4 pb-8">
+			<InstallmentAnalysisPage data={data} />
+		</main>
+	);
+}