← All changes | payment/src/admin/settings/src/components/admin-settings/admin-settings.tsx +25 -11 5.4.2 → 6.2.5 View file →

		@@ -1,7 +1,8 @@
1	1	import { gettext, getMetadata } from '../../lib/wp-data';
2	2	import { Tabs } from '../tabs';
3	3	import { AdminSettingsMainOptionsTab } from './main-options-tab';
	4	+import { AdminSettingsCCOptionsTab } from './cc-options-tab.tsx';
4	5	import { AdminSettingsExpressOptionsTab } from './express-options-tab';
5	6	import { AdminSettingsCheckoutOptionsTab } from './checkout-options-tab';
6	7	import { AdminSettingsAdvancedOptionsTab } from './advanced-options-tab';
7	8	import { useHash } from '../../hooks/use-hash';
		@@ -30,24 +31,34 @@
30	31	const currency = getMetadata('currency'); // Get currency from metadata
31	32	const paymentMethod = getOption('payment_method_name');
32	33	const showCurrencyWarning = !isPaymentMethodCurrencySupported(paymentMethod, currency);
33	34	// The tabs to render on the admin settings page.
	35	+
	36	+ const MAIN_TAB_ID = gettext('main_options.title');
	37	+ const EXPRESS_TAB_ID = gettext('express_options.title');
	38	+ const CC_TAB_ID = gettext('cc_options.title');
	39	+ const CHECKOUT_TAB_ID = gettext('checkout_options.title');
	40	+ const DEVELOPER_TAB_ID = gettext('developertitle.title');
	41	+ const ADVANCED_TAB_ID = gettext('advanced_options.title');
	42	+
	43	+
34	44	const TAB_IDS = [
35		- gettext('main_options.title'),
36		- gettext('express_options.title'),
	45	+ MAIN_TAB_ID, EXPRESS_TAB_ID, CC_TAB_ID
37	46	];
38	47
	48	+
	49	+
39	50	// Only show checkout options if known to be active (option woo_vipps_checkout_activated is true, or the vipps_checkout_enabled option is yes IOK 2026-04-30
40	51	const checkoutActive = +(getMetadata('vipps_checkout_activated') ?? 0) || getOption('vipps_checkout_enabled') == 'yes';
41	52	if (checkoutActive) {
42		- TAB_IDS.push(gettext('checkout_options.title'));
	53	+ TAB_IDS.push(CHECKOUT_TAB_ID);
43	54	}
	55	+ TAB_IDS.push(ADVANCED_TAB_ID);
44	56	// If the developer mode is enabled, the developer options tab is shown.
45	57	const canShowDeveloperOptions = getOption('developermode') === 'yes';
46	58	if (canShowDeveloperOptions) {
47		- TAB_IDS.push(gettext('developertitle.title'));
	59	+ TAB_IDS.push(DEVELOPER_TAB_ID);
48	60	}
49		- TAB_IDS.push(gettext('advanced_options.title'));
50	61
51	62
52	63	// For debugging: show wizard screen if option is set in wp-config. IOK 2025-10-20
53	64	const force_override = getMetadata('__dev_force_wizard_screen') || "";
		@@ -53,9 +64,9 @@
53	64	const force_override = getMetadata('__dev_force_wizard_screen') || "";
54	65	const force_wizard_screen = __DEV_FORCE_WIZARD_SCREEN || ["1", "yes", "true", "TRUE"].includes(force_override);
55	66
56	67	// Get the active tab from the URL hash.
57		- const [activeTab, setActiveTab] = useHash(TAB_IDS[0]);
	68	+ const [activeTab, setActiveTab] = useHash(MAIN_TAB_ID);
58	69
59	70	// Function to determine if a tab is visible.
60	71	function isVisible(tab: string): boolean {
61	72	return tab === activeTab;
		@@ -153,21 +164,24 @@
153	164	// If the important settings are set, show the normal settings screen.
154	165	<>
155	166	<Tabs tabs={TAB_IDS} onTabChange={setActiveTab} activeTab={activeTab} />
156	167	{/* Renders the main options form fields */}
157		- {isVisible(TAB_IDS[0]) && <AdminSettingsMainOptionsTab />}
	168	+ {isVisible(MAIN_TAB_ID) && <AdminSettingsMainOptionsTab />}
158	169
159	170	{/* Renders the express options form fields */}
160		- {isVisible(TAB_IDS[1]) && <AdminSettingsExpressOptionsTab />}
	171	+ {isVisible(EXPRESS_TAB_ID) && <AdminSettingsExpressOptionsTab />}
161	172
	173	+ {/* Renders the card payments options form fields */}
	174	+ {isVisible(CC_TAB_ID) && <AdminSettingsCCOptionsTab />}
	175	+
162	176	{/* Renders the checkout options form fields */}
163		- {checkoutActive && isVisible(TAB_IDS[2]) && <AdminSettingsCheckoutOptionsTab />}
	177	+ {checkoutActive && isVisible(CHECKOUT_TAB_ID) && <AdminSettingsCheckoutOptionsTab />}
164	178
165	179	{/* Renders the advanced options form fields */}
166		- {isVisible(TAB_IDS[3]) && <AdminSettingsAdvancedOptionsTab />}
	180	+ {isVisible(ADVANCED_TAB_ID) && <AdminSettingsAdvancedOptionsTab />}
167	181
168	182	{/* Renders the developer options form fields */}
169		- {canShowDeveloperOptions && isVisible(TAB_IDS[4]) && <AdminSettingsDeveloperOptionsTab />}
	183	+ {canShowDeveloperOptions && isVisible(DEVELOPER_TAB_ID) && <AdminSettingsDeveloperOptionsTab />}
170	184
171	185	<div className="vipps-mobilepay-react-save-section">
172	186	<WPButton variant="primary" isLoading={isLoading}>
173	187	{gettext('save_changes')}