fix(frontend): move hooks before conditional return in Lexware components

React hooks must not be called after conditional returns (Rules of Hooks).
Moves all hook calls above the isModuleEnabled check in LexwareSection
and DealVouchersSection to prevent silent component crashes.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Thomas Reitz 2026-03-10 22:37:30 +01:00
parent 81d84e7eb0
commit 6b847cb9f6
2 changed files with 16 additions and 9 deletions

View file

@ -182,11 +182,13 @@ export function DealVouchersSection({
const { isModuleEnabled } = useCrmSettings();
const [isLinkOpen, setLinkOpen] = useState(false);
// Hide entire section if Lexware module is disabled
if (!isModuleEnabled('lexware')) return null;
// All hooks must be called before any conditional return
const { data, isLoading } = useDealVouchers(dealId);
const unlinkMutation = useUnlinkVoucherFromDeal();
// Hide entire section if Lexware module is disabled
if (!isModuleEnabled('lexware')) return null;
const dealVouchers: DealVoucher[] = data?.data ?? [];
const linkedVoucherIds = new Set(dealVouchers.map((dv) => dv.voucher.id));

View file

@ -144,12 +144,10 @@ export function LexwareSection({
VoucherType | ''
>('');
// Hide entire section if Lexware module is disabled
if (!isModuleEnabled('lexware')) return null;
const isLinked = !!lexwareContactId;
const lexwareEnabled = isModuleEnabled('lexware');
// Mutations
// Mutations — all hooks must be called before any conditional return
const linkCompany = useLinkLexwareCompany();
const linkContact = useLinkLexwareContact();
const unlinkCompany = useUnlinkLexwareCompany();
@ -159,19 +157,26 @@ export function LexwareSection({
const refreshCompanyVouchers = useRefreshCompanyVouchers();
const refreshContactVouchers = useRefreshContactVouchers();
// Vouchers (only fetch when linked)
// Vouchers (only fetch when linked AND module enabled)
const vouchersParams = voucherTypeFilter
? { voucherType: voucherTypeFilter as VoucherType, pageSize: 50 }
: { pageSize: 50 };
const companyVouchers = useCompanyVouchers(
entityType === 'company' ? entityId : '',
entityType === 'company' && isLinked ? vouchersParams : undefined,
entityType === 'company' && isLinked && lexwareEnabled
? vouchersParams
: undefined,
);
const contactVouchers = useContactVouchers(
entityType === 'contact' ? entityId : '',
entityType === 'contact' && isLinked ? vouchersParams : undefined,
entityType === 'contact' && isLinked && lexwareEnabled
? vouchersParams
: undefined,
);
// Hide entire section if Lexware module is disabled
if (!lexwareEnabled) return null;
const vouchersData =
entityType === 'company' ? companyVouchers : contactVouchers;
const vouchers: LexwareVoucher[] = vouchersData.data?.data ?? [];