refactor: restructure frontend code out of app/ into src/

Move all shared frontend code from app/[locale]/(frontend)/ into src/:
- src/types/ — domain types (workout, plan, constants)
- src/lib/ — class-names, date, metrics (fix trackingTypes shim import)
- src/loaders/ — training-plan-loader extracted from page.tsx
- src/components/ — all components in kebab-case folders with index barrels

page.tsx reduced from ~250 to ~30 lines. Delete src/trackingTypes.ts shim.

Author: kriss145

src/app/[locale]/(frontend)/login/page.tsx

@@ -3,10 +3,10 @@
 import { useRouter } from 'next/navigation'
 import { useTranslations } from 'next-intl'
 import React, { useState } from 'react'
-import { errorBannerClass } from '../ui'
-import { Button } from '../components/ui/Button'
-import { Input } from '../components/ui/Input'
-import { Surface } from '../components/ui/Surface'
+import { errorBannerClass } from '@/lib/class-names'
+import { Button } from '@/components/ui/button'
+import { Input } from '@/components/ui/input'
+import { Surface } from '@/components/ui/surface'
 
 export default function LoginPage() {
   const t = useTranslations('login')

src/app/[locale]/(frontend)/page.tsx

@@ -1,245 +1,34 @@
-import { headers as getHeaders } from 'next/headers.js'
 import { redirect } from 'next/navigation'
 import { getTranslations } from 'next-intl/server'
-import { getPayload } from 'payload'
-import React from 'react'
-
-import config from '@/payload.config'
-import LogoutButton from './LogoutButton'
-import type { TWorkout } from './WorkoutTracker'
-import { WorkoutPlansAccordion, type TPlanAccordionItem } from './components/WorkoutPlansAccordion'
-import { STATUS_LABEL } from './types/constants'
+import { loadTrainingPlans } from '@/loaders/training-plan-loader'
+import { WorkoutPlansAccordion } from '@/components/workout/workout-plans-accordion'
+import { LogoutButton } from '@/components/common/logout-button'
 
 export default async function HomePage() {
   const t = await getTranslations('home')
-  const headers = await getHeaders()
-  const payload = await getPayload({ config: await config })
-  const { user } = await payload.auth({ headers })
-
-  if (!user || user.collection !== 'clients') {
-    redirect('/login')
-  }
-
-  const plans = await payload.find({
-    collection: 'plans',
-    where: { client: { equals: user.id } },
-    sort: '-createdAt',
-    depth: 0,
-    limit: 100,
-  })
-
-  const planIds = plans.docs.map((p) => p.id)
-
-  const microcycles = planIds.length
-    ? await payload.find({
-        collection: 'microcycles',
-        where: { plan: { in: planIds } },
-        sort: 'order',
-        depth: 0,
-        limit: 500,
-      })
-    : { docs: [] }
-
-  const mcIds = microcycles.docs.map((m) => m.id)
-
-  const workouts = mcIds.length
-    ? await payload.find({
-        collection: 'workouts',
-        where: { microcycle: { in: mcIds } },
-        sort: 'order',
-        depth: 0,
-        limit: 1000,
-      })
-    : { docs: [] }
-
-  const workoutIds = workouts.docs.map((w) => w.id)
-
-  const workoutGroups = workoutIds.length
-    ? await payload.find({
-        collection: 'workout-groups',
-        where: { workout: { in: workoutIds } },
-        sort: 'order',
-        depth: 0,
-        limit: 10000,
-      })
-    : { docs: [] }
-
-  const groupIds = workoutGroups.docs.map((g) => g.id)
-
-  const exerciseRows = groupIds.length
-    ? await payload.find({
-        collection: 'workout-exercise-rows',
-        where: { group: { in: groupIds } },
-        sort: 'order',
-        depth: 1,
-        limit: 10000,
-      })
-    : { docs: [] }
-
-  const relId = (rel: unknown): number | string | undefined =>
-    rel && typeof rel === 'object' ? (rel as { id: number | string }).id : (rel as number | string)
-
-  const mcByPlan = (planId: number | string) =>
-    microcycles.docs.filter((m) => relId(m.plan) === planId)
-  const woByMc = (mcId: number | string) =>
-    workouts.docs.filter((w) => relId(w.microcycle) === mcId)
-  const groupsByWorkout = (workoutId: number | string) =>
-    workoutGroups.docs.filter((g) => relId(g.workout) === workoutId)
-  const rowsByGroup = (groupId: number | string) =>
-    exerciseRows.docs.filter((r) => relId(r.group) === groupId)
-
-  const fmtDuration = (min?: number | null, sec?: number | null): string | null => {
-    const m = min ?? 0
-    const s = sec ?? 0
-    if (!m && !s) return null
-    const p: string[] = []
-    if (m) p.push(`${m} min`)
-    if (s) p.push(`${s} sek`)
-    return p.join(' ')
-  }
+  const result = await loadTrainingPlans()
 
-  const ok = (v?: string | null) => v && v.trim() !== '' && v.trim().toLowerCase() !== 'x'
-
-  const exMeta = (ex: {
-    rounds?: string | null
-    reps?: string | null
-    durationMin?: number | null
-    durationSec?: number | null
-    rest?: string | null
-    tut?: string | null
-    rir?: string | null
-    kg?: string | null
-  }): string[] => {
-    const parts: string[] = []
-    if (ok(ex.rounds)) parts.push(`${t('seriesPrefix')}: ${ex.rounds}`)
-    if (ok(ex.reps)) parts.push(`${t('repsPrefix')}: ${ex.reps}`)
-    const dur = fmtDuration(ex.durationMin, ex.durationSec)
-    if (dur) parts.push(`${t('durationPrefix')}: ${dur}`)
-    if (ok(ex.rest)) parts.push(`${t('restPrefix')}: ${ex.rest}`)
-    if (ok(ex.tut)) parts.push(`TUT: ${ex.tut}`)
-    if (ok(ex.rir)) parts.push(`RIR: ${ex.rir}`)
-    if (ok(ex.kg)) parts.push(`${ex.kg} kg`)
-    return parts
-  }
-
-  const groupLabel = (g: (typeof workoutGroups.docs)[number]): string => {
-    if (g.label) return g.label as string
-    const protocol = g.protocol as string
-    const rounds = g.rounds as string | null | undefined
-    const durationMinutes = g.durationMinutes as number | null | undefined
-
-    if (protocol === 'emom') return rounds ? `EMOM · ${rounds} min` : 'EMOM'
-    if (protocol === 'amrap') return durationMinutes ? `AMRAP · ${durationMinutes} min` : 'AMRAP'
-    if (protocol === 'for_time') return rounds ? `For Time · ${rounds} rund` : 'For Time'
-    if (protocol === 'tabata') return 'Tabata'
-    return rounds ? `${rounds} serie` : ''
-  }
-
-  const serializeWorkout = (w: (typeof workouts.docs)[number]): TWorkout => {
-    const sections = (w.sections ?? []) as Array<{
-      id?: string
-      title?: string | null
-      subtitle?: string | null
-    }>
-
-    const groups = groupsByWorkout(w.id)
-
-    return {
-      id: w.id,
-      title: w.title,
-      rpe: w.rpe ?? null,
-      sections: sections.map((section) => {
-        const sectionGroups = groups.filter(
-          (g) => (g.sectionRowId as string | null | undefined) === section.id,
-        )
-
-        return {
-          title: section.title ?? null,
-          subtitle: section.subtitle ?? null,
-          groups: sectionGroups.map((group) => {
-            const rows = rowsByGroup(group.id)
-
-            return {
-              protocol: (group.protocol as string) ?? 'standard',
-              label: groupLabel(group),
-              exercises: rows.map((ex) => {
-                const cat =
-                  ex.exercise && typeof ex.exercise === 'object'
-                    ? (ex.exercise as { id: number; name?: string; trackingType?: string; videoUrl?: string })
-                    : null
-                const name = cat?.name || ex.note || ''
-                const extraNote = cat && ex.note && ex.note !== cat.name ? ex.note : null
-
-                return {
-                  rowId: String(ex.id),
-                  numer: (ex.numer as string | null) ?? null,
-                  name,
-                  note: extraNote as string | null,
-                  exerciseId: cat?.id ?? null,
-                  exerciseName: name,
-                  trackingType: cat?.trackingType ?? null,
-                  videoUrl: (cat?.videoUrl as string | null | undefined) ?? null,
-                  rounds: (ex.rounds as string | null) ?? null,
-                  meta: exMeta(ex as Parameters<typeof exMeta>[0]),
-                  prefill: {
-                    reps: (ex.reps as string | null) ?? null,
-                    rir: (ex.rir as string | null) ?? null,
-                  },
-                  setParameters:
-                    (ex.setParameters as Array<{ setNumber: number; reps?: string | null; kg?: string | null }> | null | undefined) ?? null,
-                }
-              }),
-            }
-          }),
-        }
-      }),
-    }
-  }
-
-  const accordionPlans: TPlanAccordionItem[] = plans.docs.map((plan) => {
-    const status = (plan.status as string) || 'active'
-
-    return {
-      id: plan.id,
-      title: plan.title,
-      status,
-      statusLabel: STATUS_LABEL[status] || status,
-      dateRange:
-        plan.startDate || plan.endDate
-          ? [plan.startDate, plan.endDate]
-              .map((d) => (d ? new Date(d).toLocaleDateString('pl-PL') : '…'))
-              .join(' – ')
-          : null,
-      description: plan.description ?? null,
-      microcycles: mcByPlan(plan.id).map((mc) => ({
-        id: mc.id,
-        title: mc.title,
-        rpe: mc.rpe ?? null,
-        workouts: woByMc(mc.id).map((w) => serializeWorkout(w)),
-      })),
-    }
-  })
+  if (!result.user) redirect('/login')
 
   return (
     <div className="mx-auto max-w-3xl px-5 py-6 sm:px-6 sm:py-8">
       <div className="mb-4 flex items-center justify-between gap-3 sm:mb-7 sm:gap-4">
         <div className="flex items-center gap-3">
           <img src="/images/logo.svg" alt="Logo" className="h-7 w-auto sm:h-8" />
           <div>
-            <h1 className="text-sm font-semibold text-ui-fg-base sm:text-xl">{t('greeting', { name: user.name || user.email })}</h1>
+            <h1 className="text-sm font-semibold text-ui-fg-base sm:text-xl">
+              {t('greeting', { name: result.user.name || result.user.email })}
+            </h1>
             <span className="mt-0.5 block text-xs text-ui-fg-muted sm:mt-1">{t('yourTrainingPlans')}</span>
           </div>
         </div>
         <LogoutButton />
       </div>
 
-      {plans.docs.length === 0 && (
-        <div className="py-10 text-center text-sm text-ui-fg-muted">
-          {t('noPlans')}
-        </div>
+      {result.plans.length === 0 && (
+        <div className="py-10 text-center text-sm text-ui-fg-muted">{t('noPlans')}</div>
       )}
-
-      {plans.docs.length > 0 && <WorkoutPlansAccordion plans={accordionPlans} />}
+      {result.plans.length > 0 && <WorkoutPlansAccordion plans={result.plans} />}
     </div>
   )
 }

src/components/common/logout-button/index.ts

@@ -0,0 +1 @@
+export { LogoutButton } from './logout-button'

…app/[locale]/(frontend)/LogoutButton.tsx …s/common/logout-button/logout-button.tsxsrc/app/[locale]/(frontend)/LogoutButton.tsx renamed to src/components/common/logout-button/logout-button.tsx src/app/[locale]/(frontend)/LogoutButton.tsx renamed to src/components/common/logout-button/logout-button.tsx

@@ -3,9 +3,9 @@
 import { useRouter } from 'next/navigation'
 import { useTranslations } from 'next-intl'
 import React, { useState } from 'react'
-import { Button } from './components/ui/Button'
+import { Button } from '@/components/ui/button'
 
-export default function LogoutButton() {
+export function LogoutButton() {
   const t = useTranslations('nav')
   const router = useRouter()
   const [loading, setLoading] = useState(false)

…ale]/(frontend)/components/ui/Button.tsx src/components/ui/button/button.tsxsrc/app/[locale]/(frontend)/components/ui/Button.tsx renamed to src/components/ui/button/button.tsx src/app/[locale]/(frontend)/components/ui/Button.tsx renamed to src/components/ui/button/button.tsx

@@ -8,7 +8,7 @@ import {
   joinClasses,
   primaryButtonClass,
   secondaryButtonClass,
-} from '../../ui'
+} from '@/lib/class-names'
 
 type Variant = 'primary' | 'secondary' | 'dashed' | 'icon' | 'danger' | 'ghost'
 type Size = 'md' | 'sm'

src/components/ui/button/index.ts

@@ -0,0 +1 @@
+export { Button } from './button'

src/components/ui/input/index.ts

@@ -0,0 +1 @@
+export { Input, Select } from './input'

…cale]/(frontend)/components/ui/Input.tsx src/components/ui/input/input.tsxsrc/app/[locale]/(frontend)/components/ui/Input.tsx renamed to src/components/ui/input/input.tsx src/app/[locale]/(frontend)/components/ui/Input.tsx renamed to src/components/ui/input/input.tsx

@@ -7,7 +7,7 @@ import {
   inputClass,
   joinClasses,
   selectClass,
-} from '../../ui'
+} from '@/lib/class-names'
 
 type InputVariant = 'default' | 'compact' | 'compact-unit'
 

src/components/ui/status-badge/index.ts

@@ -0,0 +1 @@
+export { StatusBadge } from './status-badge'

…(frontend)/components/ui/StatusBadge.tsx …ponents/ui/status-badge/status-badge.tsxsrc/app/[locale]/(frontend)/components/ui/StatusBadge.tsx renamed to src/components/ui/status-badge/status-badge.tsx src/app/[locale]/(frontend)/components/ui/StatusBadge.tsx renamed to src/components/ui/status-badge/status-badge.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { statusBadgeClass } from '../../ui'
+import { statusBadgeClass } from '@/lib/class-names'
 
 export function StatusBadge({ children, status }: { children: React.ReactNode; status: string }) {
   return <span className={statusBadgeClass(status)}>{children}</span>