Skip to content

Commit ceea6b3

Browse files
DakshithaSDakshithaS
committed
Refactor ListGWEnvironments component to eliminate code duplication
1 parent b159be2 commit ceea6b3

File tree

3 files changed

+126
-231
lines changed

3 files changed

+126
-231
lines changed

‎portals/admin/src/main/webapp/source/src/app/components/GatewayEnvironments/ListGWEnviornments.jsx‎

Lines changed: 123 additions & 228 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,6 @@ function apiCall() {
6969
*/
7070
export default function ListGWEnviornments() {
7171
const intl = useIntl();
72-
let columProps;
7372
const { settings } = useAppContext();
7473
// Dialog state for Live Gateways
7574
const [liveGatewaysOpen, setLiveGatewaysOpen] = useState(false);
@@ -89,19 +88,82 @@ export default function ListGWEnviornments() {
8988
};
9089

9190
const isGatewayTypeAvailable = settings.gatewayTypes.length >= 2;
92-
if (isGatewayTypeAvailable) {
93-
columProps = [
94-
{ name: 'name', options: { display: false } },
95-
{
96-
name: 'displayName',
97-
label: intl.formatMessage({
98-
id: 'AdminPages.Gateways.table.header.displayName',
99-
defaultMessage: 'Name',
100-
}),
101-
options: {
102-
sort: true,
103-
},
91+
92+
// Helper function to render virtual hosts
93+
const renderVhosts = (vhosts) => {
94+
return (
95+
vhosts.map((vhost) => (
96+
<div key={`${vhost.host}:${vhost.httpsPort}`}>
97+
{
98+
'https://' + vhost.host + (vhost.httpsPort === 443 ? '' : ':' + vhost.httpsPort)
99+
+ (vhost.httpContext ? '/' + vhost.httpContext.replace(/^\//g, '') : '')
100+
}
101+
</div>
102+
))
103+
);
104+
};
105+
106+
// Helper function to render permissions
107+
const renderPermissions = (permissions) => {
108+
return (
109+
<div>
110+
<Permission
111+
type={permissions.permissionType}
112+
roles={permissions.roles}
113+
/>
114+
</div>
115+
);
116+
};
117+
118+
// Helper function to render gateway instances
119+
const renderGatewayInstances = (value, tableMeta) => {
120+
if (typeof tableMeta.rowData === 'object') {
121+
const envId = tableMeta.rowData[isGatewayTypeAvailable ? 8 : 7];
122+
const envName = tableMeta.rowData[1]; // 'displayName'
123+
// Default to 'Regular' if no gatewayType column
124+
const gatewayType = isGatewayTypeAvailable ? tableMeta.rowData[2] : 'Regular';
125+
const isDisabled = gatewayType !== 'Regular';
126+
127+
const button = (
128+
<IconButton
129+
onClick={() => handleOpenLiveGateways(envId, envName)}
130+
disabled={isDisabled}
131+
>
132+
<FormatListBulletedIcon aria-label='gateway-instances-list-icon' />
133+
</IconButton>
134+
);
135+
136+
return isDisabled ? (
137+
<StyledTooltip
138+
title={intl.formatMessage({
139+
id: 'AdminPages.Gateways.table.gatewayInstances.tooltip.'
140+
+ 'notSupported',
141+
defaultMessage: 'Not supported for this gateway type',
142+
})}
143+
>
144+
<span>{button}</span>
145+
</StyledTooltip>
146+
) : button;
147+
} else {
148+
return <div />;
149+
}
150+
};
151+
152+
// Build column configuration
153+
const columProps = [
154+
{ name: 'name', options: { display: false } },
155+
{
156+
name: 'displayName',
157+
label: intl.formatMessage({
158+
id: 'AdminPages.Gateways.table.header.displayName',
159+
defaultMessage: 'Name',
160+
}),
161+
options: {
162+
sort: true,
104163
},
164+
},
165+
// Conditionally include gatewayType column
166+
...(isGatewayTypeAvailable ? [
105167
{
106168
name: 'gatewayType',
107169
label: intl.formatMessage({
@@ -112,232 +174,65 @@ export default function ListGWEnviornments() {
112174
sort: false,
113175
},
114176
},
115-
{
116-
name: 'type',
117-
label: intl.formatMessage({
118-
id: 'AdminPages.Gateways.table.header.type',
119-
defaultMessage: 'Type',
120-
}),
121-
options: {
122-
sort: false,
123-
},
124-
},
125-
{
126-
name: 'description',
127-
label: intl.formatMessage({
128-
id: 'AdminPages.Gateways.table.header.description',
129-
defaultMessage: 'Description',
130-
}),
131-
options: {
132-
sort: false,
133-
},
134-
},
135-
{
136-
name: 'vhosts',
137-
label: intl.formatMessage({
138-
id: 'AdminPages.Gateways.table.header.vhosts',
139-
defaultMessage: 'Virtual Host(s)',
140-
}),
141-
options: {
142-
sort: false,
143-
customBodyRender: (vhosts) => {
144-
return (
145-
vhosts.map((vhost) => (
146-
<div>
147-
{
148-
'https://' + vhost.host + (vhost.httpsPort === 443 ? '' : ':' + vhost.httpsPort)
149-
+ (vhost.httpContext ? '/' + vhost.httpContext.replace(/^\//g, '') : '')
150-
}
151-
</div>
152-
))
153-
);
154-
},
155-
},
156-
},
157-
{
158-
name: 'permissions',
159-
label: intl.formatMessage({
160-
id: 'AdminPages.Gateways.table.header.permission',
161-
defaultMessage: 'Visibility',
162-
}),
163-
options: {
164-
sort: false,
165-
customBodyRender: (permissions) => {
166-
return (
167-
<div>
168-
<Permission
169-
type={permissions.permissionType}
170-
roles={permissions.roles}
171-
/>
172-
</div>
173-
);
174-
},
175-
},
177+
] : []),
178+
{
179+
name: 'type',
180+
label: intl.formatMessage({
181+
id: 'AdminPages.Gateways.table.header.type',
182+
defaultMessage: 'Type',
183+
}),
184+
options: {
185+
sort: false,
176186
},
177-
...(settings.isGatewayNotificationEnabled ? [
178-
{
179-
name: 'gatewayInstances',
180-
label: intl.formatMessage({
181-
id: 'AdminPages.Gateways.table.header.gatewayInstances',
182-
defaultMessage: 'Gateway Instances',
183-
}),
184-
options: {
185-
sort: false,
186-
customBodyRender: (value, tableMeta) => {
187-
if (typeof tableMeta.rowData === 'object') {
188-
const envId = tableMeta.rowData[8]; // 'id' is the last column
189-
const envName = tableMeta.rowData[1]; // 'displayName'
190-
const gatewayType = tableMeta.rowData[2]; // 'gatewayType'
191-
const isDisabled = gatewayType !== 'Regular';
192-
193-
const button = (
194-
<IconButton
195-
onClick={() => handleOpenLiveGateways(envId, envName)}
196-
disabled={isDisabled}
197-
>
198-
<FormatListBulletedIcon aria-label='gateway-instances-list-icon' />
199-
</IconButton>
200-
);
201-
202-
return isDisabled ? (
203-
<StyledTooltip
204-
title={intl.formatMessage({
205-
id: 'AdminPages.Gateways.table.gatewayInstances.tooltip.notSupported',
206-
defaultMessage: 'Not supported for this gateway type',
207-
})}
208-
>
209-
<span>{button}</span>
210-
</StyledTooltip>
211-
) : button;
212-
} else {
213-
return <div />;
214-
}
215-
},
216-
},
217-
},
218-
] : []),
219-
{ name: 'id', options: { display: false } },
220-
];
221-
} else {
222-
columProps = [
223-
{ name: 'name', options: { display: false } },
224-
{
225-
name: 'displayName',
226-
label: intl.formatMessage({
227-
id: 'AdminPages.Gateways.table.header.displayName',
228-
defaultMessage: 'Name',
229-
}),
230-
options: {
231-
sort: true,
232-
},
233-
},
234-
{
235-
name: 'type',
236-
label: intl.formatMessage({
237-
id: 'AdminPages.Gateways.table.header.type',
238-
defaultMessage: 'Type',
239-
}),
240-
options: {
241-
sort: false,
242-
},
187+
},
188+
{
189+
name: 'description',
190+
label: intl.formatMessage({
191+
id: 'AdminPages.Gateways.table.header.description',
192+
defaultMessage: 'Description',
193+
}),
194+
options: {
195+
sort: false,
243196
},
244-
{
245-
name: 'description',
246-
label: intl.formatMessage({
247-
id: 'AdminPages.Gateways.table.header.description',
248-
defaultMessage: 'Description',
249-
}),
250-
options: {
251-
sort: false,
252-
},
197+
},
198+
{
199+
name: 'vhosts',
200+
label: intl.formatMessage({
201+
id: 'AdminPages.Gateways.table.header.vhosts',
202+
defaultMessage: 'Virtual Host(s)',
203+
}),
204+
options: {
205+
sort: false,
206+
customBodyRender: renderVhosts,
253207
},
254-
{
255-
name: 'vhosts',
256-
label: intl.formatMessage({
257-
id: 'AdminPages.Gateways.table.header.vhosts',
258-
defaultMessage: 'Virtual Host(s)',
259-
}),
260-
options: {
261-
sort: false,
262-
customBodyRender: (vhosts) => {
263-
return (
264-
vhosts.map((vhost) => (
265-
<div>
266-
{
267-
'https://' + vhost.host + (vhost.httpsPort === 443 ? '' : ':' + vhost.httpsPort)
268-
+ (vhost.httpContext ? '/' + vhost.httpContext.replace(/^\//g, '') : '')
269-
}
270-
</div>
271-
))
272-
);
273-
},
274-
},
208+
},
209+
{
210+
name: 'permissions',
211+
label: intl.formatMessage({
212+
id: 'AdminPages.Gateways.table.header.permission',
213+
defaultMessage: 'Visibility',
214+
}),
215+
options: {
216+
sort: false,
217+
customBodyRender: renderPermissions,
275218
},
219+
},
220+
// Conditionally include gateway instances column
221+
...(settings.isGatewayNotificationEnabled ? [
276222
{
277-
name: 'permissions',
223+
name: 'gatewayInstances',
278224
label: intl.formatMessage({
279-
id: 'AdminPages.Gateways.table.header.permission',
280-
defaultMessage: 'Visibility',
225+
id: 'AdminPages.Gateways.table.header.gatewayInstances',
226+
defaultMessage: 'Gateway Instances',
281227
}),
282228
options: {
283229
sort: false,
284-
customBodyRender: (permissions) => {
285-
return (
286-
<div>
287-
<Permission
288-
type={permissions.permissionType}
289-
roles={permissions.roles}
290-
/>
291-
</div>
292-
);
293-
},
230+
customBodyRender: renderGatewayInstances,
294231
},
295232
},
296-
...(settings.isGatewayNotificationEnabled ? [
297-
{
298-
name: 'gatewayInstances',
299-
label: intl.formatMessage({
300-
id: 'AdminPages.Gateways.table.header.gatewayInstances',
301-
defaultMessage: 'Gateway Instances',
302-
}),
303-
options: {
304-
sort: false,
305-
customBodyRender: (value, tableMeta) => {
306-
if (typeof tableMeta.rowData === 'object') {
307-
const envId = tableMeta.rowData[8]; // 'id' is the last column
308-
const envName = tableMeta.rowData[1]; // 'displayName'
309-
const gatewayType = tableMeta.rowData[2]; // 'gatewayType'
310-
const isDisabled = gatewayType !== 'Regular';
311-
312-
const button = (
313-
<IconButton
314-
onClick={() => handleOpenLiveGateways(envId, envName)}
315-
disabled={isDisabled}
316-
>
317-
<FormatListBulletedIcon aria-label='gateway-instances-list-icon' />
318-
</IconButton>
319-
);
320-
321-
return isDisabled ? (
322-
<StyledTooltip
323-
title={intl.formatMessage({
324-
id: 'AdminPages.Gateways.table.gatewayInstances.tooltip.notSupported',
325-
defaultMessage: 'Not supported for this gateway type',
326-
})}
327-
>
328-
<span>{button}</span>
329-
</StyledTooltip>
330-
) : button;
331-
} else {
332-
return <div />;
333-
}
334-
},
335-
},
336-
},
337-
] : []),
338-
{ name: 'id', options: { display: false } },
339-
];
340-
}
233+
] : []),
234+
{ name: 'id', options: { display: false } },
235+
];
341236
const addButtonProps = {
342237
triggerButtonText: intl.formatMessage({
343238
id: 'AdminPages.Gateways.List.addButtonProps.triggerButtonText',

‎portals/publisher/src/main/webapp/site/public/conf/settings.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@
4242
},
4343
"loadDefaultLocales": false,
4444
"supportedDocTypes": "application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/msword, application/pdf, text/plain, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.oasis.opendocument.text, application/vnd.oasis.opendocument.spreadsheet, application/json, application/x-yaml, .yaml, .md",
45-
"docUrl": "https://apim.docs.wso2.com/en/4.5.0/",
45+
"docUrl": "https://apim.docs.wso2.com/en/4.6.0/",
4646
"environmentsPolling": {
4747
"maxDurationMs": 120000,
4848
"intervalMs": 3000

0 commit comments

Comments
 (0)