feat/peptide calculator

app/[locale]/(app)/auth/(auth-layout)/layout.tsx

@@ -1,12 +1,13 @@
 import { redirect } from "next/navigation";
 import { headers } from "next/headers";
-
 import { getI18n } from "locales/server";
+
+import type { LayoutParams } from "@/shared/types/next";
+
 import { paths } from "@/shared/constants/paths";
 import { auth } from "@/features/auth/lib/better-auth";
 import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
 
-import type { LayoutParams } from "@/shared/types/next";
 
 export default async function AuthLayout(props: LayoutParams<{}>) {
   const t = await getI18n();

app/[locale]/(app)/auth/(auth-layout)/signup/page.tsx

@@ -1,6 +1,6 @@
 import Link from "next/link";
-
 import { getI18n } from "locales/server";
+
 import { paths } from "@/shared/constants/paths";
 import { SignUpForm } from "@/features/auth/signup/ui/signup-form";
 

app/[locale]/(app)/auth/error.tsx

@@ -2,11 +2,12 @@
 
 import { useEffect } from "react";
 
+import type { ErrorParams } from "@/shared/types/next";
+
 import { logger } from "@/shared/lib/logger";
 import { Card, CardFooter, CardHeader, CardTitle } from "@/components/ui/card";
 import { Button } from "@/components/ui/button";
 
-import type { ErrorParams } from "@/shared/types/next";
 
 export default function RouteError({ error, reset }: ErrorParams) {
   useEffect(() => {

app/[locale]/(app)/auth/verify-email/layout.tsx

@@ -1,6 +1,7 @@
-import type { ReactNode } from "react";
 import { redirect } from "next/navigation";
 
+import type { ReactNode } from "react";
+
 import { getServerUrl } from "@/shared/lib/server-url";
 import { paths } from "@/shared/constants/paths";
 import { serverRequiredUser } from "@/entities/user/model/get-server-session-user";

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

@@ -13,7 +13,8 @@ export default async function RootLayout({ children }: RootLayoutProps) {
   return (
     <div className="mx-auto card w-full max-w-3xl min-h-[500px] max-sm:min-h-screen bg-white dark:bg-[#232324] shadow-xl border border-base-200 dark:border-slate-700 flex flex-col max-sm:rounded-none rounded-lg">
       <Header />
-      <div className="flex-1 flex flex-col max-sm:pb-16">{children}</div>
+      {/* pb-16 clears the docked BottomNavigation, which is fixed at every width. */}
+      <div className="flex-1 flex flex-col pb-16">{children}</div>
       <BottomNavigation />
       <Footer />
     </div>

app/[locale]/(app)/leaderboard/page.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
-
 import { Locale } from "locales/types";
 import { getI18n } from "locales/server";
+
 import LeaderboardPage from "@/features/leaderboard/ui/leaderboard-page";
 import { Breadcrumbs } from "@/components/seo/breadcrumbs";
 

app/[locale]/(app)/profile/page.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { useRouter } from "next/navigation";
-
 import { useI18n } from "locales/client";
+
 import { WorkoutSessionList } from "@/features/workout-session/ui/workout-session-list";
 import { WorkoutSessionHeatmap } from "@/features/workout-session/ui/workout-session-heatmap";
 import { useWorkoutSessions } from "@/features/workout-session/model/use-workout-sessions";

app/[locale]/(app)/programs/[slug]/page.tsx

@@ -1,9 +1,9 @@
 import { notFound } from "next/navigation";
 import { headers } from "next/headers";
 import { Metadata } from "next";
-
 import { Locale } from "locales/types";
 import { getI18n } from "locales/server";
+
 import { generateStructuredData, StructuredDataScript } from "@/shared/lib/structured-data";
 import { getLocalizedMetadata } from "@/shared/config/localized-metadata";
 import { ProgramDetailPage } from "@/features/programs/ui/program-detail-page";

app/[locale]/(app)/programs/[slug]/session/[sessionSlug]/ProgramSessionClient.tsx

@@ -3,9 +3,9 @@
 import { useState } from "react";
 import { useRouter } from "next/navigation";
 import { ArrowLeft, Play } from "lucide-react";
+import { useCurrentLocale, useI18n } from "locales/client";
 import { ExerciseAttributeNameEnum, ProgramWeek } from "@prisma/client";
 
-import { useCurrentLocale, useI18n } from "locales/client";
 import { canStartSession } from "@/shared/lib/access-control";
 import { WorkoutSessionSets } from "@/features/workout-session/ui/workout-session-sets";
 import { WorkoutSessionHeader } from "@/features/workout-session/ui/workout-session-header";

app/[locale]/(app)/programs/[slug]/session/[sessionSlug]/page.tsx

@@ -1,9 +1,11 @@
 import { notFound } from "next/navigation";
 import { headers } from "next/headers";
 import { Metadata } from "next";
-
 import { Locale } from "locales/types";
 import { getI18n } from "locales/server";
+
+import { ProgramSessionClient } from "./ProgramSessionClient";
+
 import { generateStructuredData, StructuredDataScript } from "@/shared/lib/structured-data";
 import { getSessionTitle, getProgramTitle } from "@/features/programs/lib/translations-mapper";
 import { generateSessionMetadata } from "@/features/programs/lib/session-metadata";
@@ -12,7 +14,6 @@ import { auth } from "@/features/auth/lib/better-auth";
 import { Breadcrumbs } from "@/components/seo/breadcrumbs";
 
 // Import the existing session client component
-import { ProgramSessionClient } from "./ProgramSessionClient";
 
 interface SessionDetailPageProps {
   params: Promise<{ slug: string; sessionSlug: string; locale: Locale }>;

app/[locale]/(app)/programs/page.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
-
 import { Locale } from "locales/types";
 import { getI18n } from "locales/server";
+
 import { ProgramsPage } from "@/features/programs/ui/programs-page";
 import { Breadcrumbs } from "@/components/seo/breadcrumbs";
 

app/[locale]/(app)/sponsor/onboarding/page.tsx

@@ -1,7 +1,7 @@
 import { Metadata } from "next";
 import { Sparkles } from "lucide-react";
-
 import { getI18n } from "locales/server";
+
 import { SponsorOnboardingForm } from "@/features/sponsor/onboarding/SponsorOnboardingForm";
 
 export const metadata: Metadata = {

app/[locale]/(app)/statistics/page.tsx

@@ -1,6 +1,6 @@
-import React from "react";
 
 import { getI18n } from "locales/server";
+
 import { ExercisesBrowser } from "@/features/statistics/components/ExercisesBrowser";
 import { PremiumGate } from "@/components/ui/premium-gate";
 

app/[locale]/(app)/tools/bmi-calculator/page.tsx

@@ -1,11 +1,11 @@
-import React from "react";
 import { Metadata } from "next";
-
 import { getI18n } from "locales/server";
 import { BmiEducationalContent } from "app/[locale]/(app)/tools/bmi-calculator/shared/components/BmiEducationalContent";
 import { BmiCalculatorClient } from "app/[locale]/(app)/tools/bmi-calculator/shared/BmiCalculatorClient";
+
 import { getServerUrl } from "@/shared/lib/server-url";
 import { env } from "@/env";
+import { RelatedTools } from "@/components/tools/RelatedTools";
 import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";
 import { HorizontalBottomBanner, HorizontalTopBanner } from "@/components/ads";
 
@@ -115,6 +115,11 @@ export default async function BmiCalculatorPage({ params }: { params: Promise<{
           <div className="mt-16">
             <BmiEducationalContent />
           </div>
+
+          <RelatedTools
+            heading={t("tools.related_title")}
+            tools={[{ href: `/${locale}/tools/peptide-calculator`, label: t("tools.peptide-calculator.title") }]}
+          />
         </div>
         {(env.NEXT_PUBLIC_BOTTOM_BMI_BANNER_AD_SLOT || env.NEXT_PUBLIC_EZOIC_BOTTOM_BMI_PLACEMENT_ID) && (
           <HorizontalBottomBanner

app/[locale]/(app)/tools/bmi-calculator/shared/BmiCalculatorClient.tsx

@@ -1,7 +1,6 @@
 "use client";
 
-import React, { useState, useEffect } from "react";
-
+import { useState, useEffect } from "react";
 import { useI18n } from "locales/client";
 import {
   BmiData,

app/[locale]/(app)/tools/bmi-calculator/shared/components/BmiEducationalContent.tsx

@@ -1,10 +1,12 @@
 "use client";
 
 import { useI18n } from "locales/client";
+
+import { FormulaCard, createFraction, createSuperscript } from "./MathEquation";
+
 import { env } from "@/env";
 import { InArticle } from "@/components/ads";
 
-import { FormulaCard, createFraction, createSuperscript } from "./MathEquation";
 
 export function BmiEducationalContent() {
   const t = useI18n();

app/[locale]/(app)/tools/bmi-calculator/shared/components/BmiHeightInput.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import React from "react";
 
 import { useI18n } from "locales/client";
 import { UnitSystem } from "app/[locale]/(app)/tools/bmi-calculator/bmi-calculator.utils";

app/[locale]/(app)/tools/bmi-calculator/shared/components/BmiResultsDisplay.tsx

@@ -1,8 +1,6 @@
 "use client";
 
-import React from "react";
 import { CheckCircleIcon, AlertTriangleIcon, XCircleIcon, InfoIcon, TrendingUpIcon, TrendingDownIcon } from "lucide-react";
-
 import { useI18n } from "locales/client";
 import { BmiResult, BmiCategory, HealthRisk } from "app/[locale]/(app)/tools/bmi-calculator/bmi-calculator.utils";
 

app/[locale]/(app)/tools/bmi-calculator/shared/components/BmiUnitSelector.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import React from "react";
 
 import { useI18n } from "locales/client";
 import { UnitSystem } from "app/[locale]/(app)/tools/bmi-calculator/bmi-calculator.utils";

app/[locale]/(app)/tools/bmi-calculator/shared/components/BmiWeightInput.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import React from "react";
 
 import { useI18n } from "locales/client";
 import { UnitSystem } from "app/[locale]/(app)/tools/bmi-calculator/bmi-calculator.utils";

app/[locale]/(app)/tools/calorie-calculator/CalorieCalculatorHub.tsx

@@ -3,8 +3,8 @@
 import React from "react";
 import Link from "next/link";
 import { TrendingUpIcon, AwardIcon, TargetIcon, BrainIcon, GlobeIcon, ChartBarIcon } from "lucide-react";
-
 import { useI18n } from "locales/client";
+
 import { env } from "@/env";
 import { HorizontalBottomBanner, HorizontalTopBanner } from "@/components/ads";
 

app/[locale]/(app)/tools/calorie-calculator/calorie-calculator-comparison/CalorieCalculatorComparison.tsx

@@ -1,7 +1,6 @@
 "use client";
 
-import React, { useState } from "react";
-
+import { useState } from "react";
 import { useI18n } from "locales/client";
 import { BodyFatInput } from "app/[locale]/(app)/tools/calorie-calculator/shared/components/BodyFatInput";
 import {
@@ -18,6 +17,7 @@
   CalorieCalculatorInputs,
   CalorieResults,
 } from "app/[locale]/(app)/tools/calorie-calculator/shared/calorie-formulas.utils";
+
 import { env } from "@/env";
 import { HorizontalBottomBanner } from "@/components/ads";
 
@@ -147,7 +147,7 @@
 
           <GoalSelector onChange={(goal) => updateInput("goal", goal)} value={inputs.goal} />
 
           {(env.NEXT_PUBLIC_BOTTOM_CALORIE_CALCULATOR_COMPARISON_AD_SLOT || env.NEXT_PUBLIC_EZOIC_BOTTOM_CALORIE_COMPARISON_PLACEMENT_ID) && (
             <HorizontalBottomBanner
               adSlot={env.NEXT_PUBLIC_BOTTOM_CALORIE_CALCULATOR_COMPARISON_AD_SLOT}
               ezoicPlacementId={env.NEXT_PUBLIC_EZOIC_BOTTOM_CALORIE_COMPARISON_PLACEMENT_ID}

app/[locale]/(app)/tools/calorie-calculator/cunningham-calculator/page.tsx

@@ -1,11 +1,10 @@
-import React from "react";
 import Link from "next/link";
 import { Metadata } from "next";
 import { ChevronLeftIcon } from "lucide-react";
-
 import { getI18n } from "locales/server";
 import { CalorieCalculatorClient } from "app/[locale]/(app)/tools/calorie-calculator/shared/CalorieCalculatorClient";
 import { calculatorConfigs } from "app/[locale]/(app)/tools/calorie-calculator/shared/calculator-configs";
+
 import { getServerUrl } from "@/shared/lib/server-url";
 import { env } from "@/env";
 import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";

app/[locale]/(app)/tools/calorie-calculator/harris-benedict-calculator/page.tsx

@@ -1,11 +1,10 @@
-import React from "react";
 import Link from "next/link";
 import { Metadata } from "next";
 import { ChevronLeftIcon } from "lucide-react";
-
 import { getI18n } from "locales/server";
 import { CalorieCalculatorClient } from "app/[locale]/(app)/tools/calorie-calculator/shared/CalorieCalculatorClient";
 import { calculatorConfigs } from "app/[locale]/(app)/tools/calorie-calculator/shared/calculator-configs";
+
 import { getServerUrl } from "@/shared/lib/server-url";
 import { env } from "@/env";
 import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";

app/[locale]/(app)/tools/calorie-calculator/katch-mcardle-calculator/page.tsx

@@ -1,11 +1,10 @@
-import React from "react";
 import Link from "next/link";
 import { Metadata } from "next";
 import { ChevronLeftIcon } from "lucide-react";
-
 import { getI18n } from "locales/server";
 import { CalorieCalculatorClient } from "app/[locale]/(app)/tools/calorie-calculator/shared/CalorieCalculatorClient";
 import { calculatorConfigs } from "app/[locale]/(app)/tools/calorie-calculator/shared/calculator-configs";
+
 import { getServerUrl } from "@/shared/lib/server-url";
 import { env } from "@/env";
 import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";

app/[locale]/(app)/tools/calorie-calculator/mifflin-st-jeor-calculator/page.tsx

@@ -1,11 +1,10 @@
-import React from "react";
 import Link from "next/link";
 import { Metadata } from "next";
 import { ChevronLeftIcon } from "lucide-react";
-
 import { getI18n } from "locales/server";
 import { CalorieCalculatorClient } from "app/[locale]/(app)/tools/calorie-calculator/shared/CalorieCalculatorClient";
 import { calculatorConfigs } from "app/[locale]/(app)/tools/calorie-calculator/shared/calculator-configs";
+
 import { getServerUrl } from "@/shared/lib/server-url";
 import { env } from "@/env";
 import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";

app/[locale]/(app)/tools/calorie-calculator/oxford-calculator/page.tsx

@@ -1,11 +1,10 @@
-import React from "react";
 import Link from "next/link";
 import { Metadata } from "next";
 import { ChevronLeftIcon } from "lucide-react";
-
 import { getI18n } from "locales/server";
 import { CalorieCalculatorClient } from "app/[locale]/(app)/tools/calorie-calculator/shared/CalorieCalculatorClient";
 import { calculatorConfigs } from "app/[locale]/(app)/tools/calorie-calculator/shared/calculator-configs";
+
 import { getServerUrl } from "@/shared/lib/server-url";
 import { env } from "@/env";
 import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";

app/[locale]/(app)/tools/calorie-calculator/page.tsx

@@ -1,12 +1,12 @@
-import React from "react";
 import { Metadata } from "next";
-
 import { getI18n } from "locales/server";
-import { getServerUrl } from "@/shared/lib/server-url";
-import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";
 
 import { CalorieCalculatorHub } from "./CalorieCalculatorHub";
 
+import { getServerUrl } from "@/shared/lib/server-url";
+import { RelatedTools } from "@/components/tools/RelatedTools";
+import { generateSEOMetadata, SEOScripts } from "@/components/seo/SEOHead";
+
 export async function generateMetadata({ params }: { params: Promise<{ locale: string }> }): Promise<Metadata> {
   const { locale } = await params;
   const t = await getI18n();
@@ -71,6 +71,11 @@ export default async function CalorieCalculatorPage({ params }: { params: Promis
       <div className="light:bg-white dark:bg-base-200/20">
         <div className="container mx-auto px-2 sm:px-4 py-4 sm:py-8 max-w-4xl">
           <CalorieCalculatorHub />
+
+          <RelatedTools
+            heading={t("tools.related_title")}
+            tools={[{ href: `/${locale}/tools/peptide-calculator`, label: t("tools.peptide-calculator.title") }]}
+          />
         </div>
       </div>
     </>

app/[locale]/(app)/tools/calorie-calculator/shared/CalorieCalculatorClient.tsx

@@ -1,11 +1,9 @@
 "use client";
 
-import React, { useState } from "react";
+import { useState } from "react";
 import { Calculator } from "lucide-react";
-
 import { useI18n } from "locales/client";
-import { env } from "@/env";
-import { HorizontalBottomBanner } from "@/components/ads";
+
 
 import { BodyFatInput } from "./components/BodyFatInput";
 import {
@@ -22,6 +20,9 @@ import { calculateCalories, type CalorieCalculatorInputs, type CalorieResults }
 
 import type { CalculatorConfig } from "./types";
 
+import { env } from "@/env";
+import { HorizontalBottomBanner } from "@/components/ads";
+
 interface CalorieCalculatorClientProps {
   config: CalculatorConfig;
 }

app/[locale]/(app)/tools/calorie-calculator/shared/components/ActivityLevelSelector.tsx

@@ -2,7 +2,6 @@
 
 import React from "react";
 import { ActivityIcon, BedIcon, BedDoubleIcon, BikeIcon, ZapIcon } from "lucide-react";
-
 import { useI18n } from "locales/client";
 import { ActivityLevel } from "app/[locale]/(app)/tools/calorie-calculator/calorie-calculator.utils";
 

app/[locale]/(app)/tools/calorie-calculator/shared/components/AgeInput.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import React from "react";
 
 import { useI18n } from "locales/client";
 

app/[locale]/(app)/tools/calorie-calculator/shared/components/BodyFatInput.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import React from "react";
 
 import { useI18n } from "locales/client";
 

app/[locale]/(app)/tools/calorie-calculator/shared/components/FAQSection.tsx

@@ -1,8 +1,7 @@
 "use client";
 
-import React, { useState } from "react";
+import { useState } from "react";
 import { ChevronDownIcon, HelpCircleIcon } from "lucide-react";
-
 import { useI18n } from "locales/client";
 
 export function FAQSection() {