Refactor: consolidate constants and remove duplicate Header barrel#374
Conversation
Co-authored-by: Domenik Töfflinger <dmnktoe@users.noreply.github.com>
|
Warning Rate limit exceeded
To keep reviews running without waiting, you can enable usage-based add-on for your organization. This allows additional reviews beyond the hourly cap. Account admins can enable it under billing. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThis PR migrates import paths from Changes
Sequence DiagramsequenceDiagram
participant User
participant Header as Header Component
participant i18n as useTranslations
participant Nav as Navigation
participant Menu as MobileNavDrawer
participant LP as LanguagePicker
User->>Header: load page
Header->>i18n: request 'common' translations
i18n-->>Header: navigation items, labels
Header->>Nav: render desktop or mobile nav with items
alt Desktop
Header->>Nav: render DesktopNav
else Mobile
User->>Header: tap mobile menu button
Header->>Menu: open MobileNavDrawer
User->>Menu: select item
Menu-->>Header: onNavigate -> close menu
end
User->>Header: open language picker
Header->>LP: open
LP-->>Header: language selected
Header->>i18n: refresh translations
i18n-->>Header: updated navigation items
Header->>Nav: re-render
Estimated Code Review Effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly Related PRs
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Review rate limit: 0/1 reviews remaining, refill in 54 minutes and 47 seconds.Comment |
Co-authored-by: Domenik Töfflinger <dmnktoe@users.noreply.github.com>
Co-authored-by: Domenik Töfflinger <dmnktoe@users.noreply.github.com>
Co-authored-by: Domenik Töfflinger <dmnktoe@users.noreply.github.com>
Co-authored-by: Domenik Töfflinger <dmnktoe@users.noreply.github.com>
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #374 +/- ##
==========================================
- Coverage 77.49% 76.45% -1.04%
==========================================
Files 83 86 +3
Lines 1142 1185 +43
Branches 305 322 +17
==========================================
+ Hits 885 906 +21
- Misses 257 279 +22 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
Actionable comments posted: 4
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/components/layout/DesktopNav.tsx (1)
3-10:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winResolve import-sort lint warning before merge.
CI reports
simple-import-sort/importsin this file; please run autofix or reorder imports to match the configured grouping.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/layout/DesktopNav.tsx` around lines 3 - 10, Reorder the imports in DesktopNav.tsx to satisfy simple-import-sort by grouping and ordering them (builtin/module-level, external packages, React hooks, project absolute imports, then relative local imports): ensure imports for 'clsx' and 'next/navigation' come together as external packages, 'react' is imported as usual, followed by '@/components/ui' (UnderlineLink) and then local relative imports './ServicesDropdownMenu' and './header.types' (NavItemProps); either run your autofix (eslint --fix) or manually reorder these import lines so they match the configured import groups.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@jest.config.js`:
- Around line 15-16: The jest mapping sends all next-intl/* imports to the same
mock which lacks the server export getMessages used by
src/app/[locale]/layout.tsx; update the mock or split the mapper: either add a
getMessages export (matching signature used in layout.tsx) to
src/__mocks__/next-intl.js (so imports from 'next-intl/server' work) or change
moduleNameMapper entries so '^next-intl$' maps to the existing mock and a more
specific pattern (e.g. '^next-intl/server$' or other subpaths) maps to a
different mock that implements getMessages; ensure getMessages symbol is present
and callable where layout.tsx imports it.
In `@src/__mocks__/next-intl.js`:
- Line 65: Sort the named exports in the export list to satisfy
simple-import-sort/exports: change the order of the symbols in the export
statement so they are alphabetically ordered (getTranslations,
NextIntlClientProvider, useLocale, useTranslations) — update the export
statement that currently references NextIntlClientProvider, getTranslations,
useLocale, useTranslations to the normalized alphabetical order.
In `@src/components/layout/Header.tsx`:
- Around line 3-17: Run the import sorter to fix import ordering in Header.tsx:
reorder the import block so external packages (react, next-intl,
react-icons/vsc) come first, then absolute app imports grouped by path (e.g.,
'@/components/ui' and its subpaths like ButtonLink, UnderlineLink,
MobileMenuButton, Icons/Logo), then layout components (Container, DesktopNav,
MobileNavDrawer, MOBILE_NAV_PANEL_ID), hooks/utilities (useMobileMenu), types
(header.types), and finally default or local component imports (LanguagePicker);
ensure the named symbols to look for are useTranslations, React,
VscCallOutgoing, Container, LanguagePicker, ButtonLink, UnderlineLink,
MobileMenuButton, Logo, useMobileMenu, DesktopNav, MobileNavDrawer,
MOBILE_NAV_PANEL_ID, and NavItemProps so the sorter and linter pass.
In `@src/components/layout/index.ts`:
- Around line 1-8: The barrel exports are not sorted, causing a
simple-import-sort/exports lint warning; reorder the export statements (e.g.,
alphabetically by exported identifier: Container, Footer, Header, InfoBar,
Layout, Page, and the type export NavItemProps/SubItem) so the lines export *
from './Container'; export * from './Footer'; export * from './Header'; export *
from './InfoBar'; export type { NavItemProps, SubItem } from './header.types';
export { Layout } from './Layout'; export { Page } from './Page'; or run ESLint
autofix to apply the correct ordering.
---
Outside diff comments:
In `@src/components/layout/DesktopNav.tsx`:
- Around line 3-10: Reorder the imports in DesktopNav.tsx to satisfy
simple-import-sort by grouping and ordering them (builtin/module-level, external
packages, React hooks, project absolute imports, then relative local imports):
ensure imports for 'clsx' and 'next/navigation' come together as external
packages, 'react' is imported as usual, followed by '@/components/ui'
(UnderlineLink) and then local relative imports './ServicesDropdownMenu' and
'./header.types' (NavItemProps); either run your autofix (eslint --fix) or
manually reorder these import lines so they match the configured import groups.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 5b51e601-45c7-4ac1-9f1b-cc30afc79a57
📒 Files selected for processing (50)
jest.config.jssrc/__mocks__/next-intl.jssrc/app/[locale]/agb/page.tsxsrc/app/[locale]/cookie-richtlinie/page.tsxsrc/app/[locale]/datenschutz/page.tsxsrc/app/[locale]/downloads/page.tsxsrc/app/[locale]/impressum/page.tsxsrc/app/[locale]/kontakt/page.tsxsrc/app/[locale]/layout.tsxsrc/app/[locale]/leistungen/page.tsxsrc/app/[locale]/leistungen/vertrieb/page.tsxsrc/app/[locale]/newsroom/[slug]/page.tsxsrc/app/[locale]/newsroom/page.tsxsrc/app/[locale]/not-found.tsxsrc/app/[locale]/page.tsxsrc/app/[locale]/unternehmen/page.tsxsrc/app/api/cms/assets/[...slug]/route.tssrc/app/api/draft/route.tssrc/app/layout.tsxsrc/components/__tests__/Header.test.tsxsrc/components/helpers/ConsentProvider.tsxsrc/components/layout/DesktopNav.tsxsrc/components/layout/Footer.tsxsrc/components/layout/Header.tsxsrc/components/layout/InfoBar.tsxsrc/components/layout/Layout.tsxsrc/components/layout/MobileNavDrawer.tsxsrc/components/layout/Page.tsxsrc/components/layout/ServicesDropdownMenu.tsxsrc/components/layout/header.types.tssrc/components/layout/header/Header.tsxsrc/components/layout/index.tssrc/components/templates/ContactInfo.tsxsrc/components/templates/DistributionProducts.tsxsrc/components/templates/ImageBanner/ImageBanner.tsxsrc/components/templates/LegalNoticeText.tsxsrc/components/templates/PrivacyContent.tsxsrc/components/templates/ProduktionLeistungenView.tsxsrc/components/templates/ReparaturLeistungenView.tsxsrc/constants/__tests__/responsive-image-sizes.test.tssrc/constants/company.tssrc/constants/env.tssrc/constants/responsive-image-sizes.tssrc/lib/__tests__/directus-urls.test.tssrc/lib/__tests__/logger.test.tssrc/lib/directus-logging.tssrc/lib/directus-urls.tssrc/lib/directus-visual-editor.tssrc/lib/directus.tssrc/lib/logger.ts
💤 Files with no reviewable changes (1)
- src/components/layout/header/Header.tsx
| import { useTranslations } from 'next-intl'; | ||
| import * as React from 'react'; | ||
| import { VscCallOutgoing } from 'react-icons/vsc'; | ||
|
|
||
| import { Container } from '@/components/layout/Container'; | ||
| import LanguagePicker from '@/components/templates/LanguagePicker'; | ||
| import { ButtonLink, UnderlineLink } from '@/components/ui'; | ||
| import { MobileMenuButton } from '@/components/ui/Buttons/MobileMenuButton'; | ||
| import { Logo } from '@/components/ui/Icons'; | ||
|
|
||
| import { useMobileMenu } from '@/utils/useMobileMenu'; | ||
|
|
||
| import { DesktopNav } from './DesktopNav'; | ||
| import { MOBILE_NAV_PANEL_ID, MobileNavDrawer } from './MobileNavDrawer'; | ||
| import type { NavItemProps } from './header.types'; |
There was a problem hiding this comment.
Run the import sorter on this file.
This import block still fails simple-import-sort/imports, so the refactor leaves a CI warning behind.
🧰 Tools
🪛 GitHub Actions: CI
[warning] 3-3: ESLint (simple-import-sort/imports): warning at 3:1 — Run autofix to sort these imports!
🪛 GitHub Check: ⬣ ESLint
[warning] 3-3:
Run autofix to sort these imports!
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/layout/Header.tsx` around lines 3 - 17, Run the import sorter
to fix import ordering in Header.tsx: reorder the import block so external
packages (react, next-intl, react-icons/vsc) come first, then absolute app
imports grouped by path (e.g., '@/components/ui' and its subpaths like
ButtonLink, UnderlineLink, MobileMenuButton, Icons/Logo), then layout components
(Container, DesktopNav, MobileNavDrawer, MOBILE_NAV_PANEL_ID), hooks/utilities
(useMobileMenu), types (header.types), and finally default or local component
imports (LanguagePicker); ensure the named symbols to look for are
useTranslations, React, VscCallOutgoing, Container, LanguagePicker, ButtonLink,
UnderlineLink, MobileMenuButton, Logo, useMobileMenu, DesktopNav,
MobileNavDrawer, MOBILE_NAV_PANEL_ID, and NavItemProps so the sorter and linter
pass.
| export * from './Container'; | ||
| export * from './Footer'; | ||
| export type { NavItemProps, SubItem } from './header.types'; | ||
| export * from './Header'; | ||
| export * from './InfoBar'; | ||
| export * from './Layout'; | ||
|
|
||
| export { Layout } from './Layout'; | ||
| export { Page } from './Page'; |
There was a problem hiding this comment.
Resolve export-sort lint warning before merge.
Line 1 triggers simple-import-sort/exports in CI; please reorder exports (or run ESLint autofix) so the barrel stays lint-clean.
🧰 Tools
🪛 GitHub Actions: CI
[warning] 1-1: ESLint (simple-import-sort/exports): warning at 1:1 — Run autofix to sort these exports!
🪛 GitHub Check: ⬣ ESLint
[warning] 1-1:
Run autofix to sort these exports!
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/layout/index.ts` around lines 1 - 8, The barrel exports are
not sorted, causing a simple-import-sort/exports lint warning; reorder the
export statements (e.g., alphabetically by exported identifier: Container,
Footer, Header, InfoBar, Layout, Page, and the type export NavItemProps/SubItem)
so the lines export * from './Container'; export * from './Footer'; export *
from './Header'; export * from './InfoBar'; export type { NavItemProps, SubItem
} from './header.types'; export { Layout } from './Layout'; export { Page } from
'./Page'; or run ESLint autofix to apply the correct ordering.
Co-authored-by: Domenik Töfflinger <dmnktoe@users.noreply.github.com>
Description & Technical Solution
This refactor improves the project’s “first view” structure by consolidating duplicate constant folders and removing confusing duplicate component entrypoints. It also moves root-level Jest mocks under
srcand remaps Jest accordingly. Finally, it standardizes layout exports, flattens the Header component structure, and fixes CI lint/test issues introduced by the refactor.src/constant/*intosrc/constants/*and updated all imports/tests accordingly.__mocks__/next-intl.js→src/__mocks__/next-intl.jsand updatedjest.config.jsmoduleNameMapper.import { Header, Footer, Layout, Page, Container } from '@/components/layout').src/components/layout/header/*intosrc/components/layout/*and removed the now-empty folder.CI/Jest follow-up fixes
src/__mocks__/next-intl.jsto ESM exports (avoidsrequire()lint rule).getMessages()export to the mock soimport { getMessages } from 'next-intl/server'(used bysrc/app/[locale]/layout.tsx) is present and callable under Jest’smoduleNameMapper.simple-import-sort.transformIgnorePatternsto includecobeso ESM-onlycobecode is transformed in tests.Checklist
Screenshots
N/A (refactor only).
Summary by CodeRabbit
Release Notes
New Features
Refactor
Tests