Skip to content

Commit 0b73622

Browse files
pull[bot]pull[bot]
authored
Merge pull request #56 from KelvinTegelaar/main
[pull] main from KelvinTegelaar:main
2 parents 6c4ff8d + c74d16c commit 0b73622

File tree

12 files changed

+715
-204
lines changed

12 files changed

+715
-204
lines changed

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
},
99
"license": "AGPL-3.0",
1010
"engines": {
11-
"node": "^20.18.3"
11+
"node": "^22.13.0"
1212
},
1313
"repository": {
1414
"type": "git",
@@ -71,6 +71,7 @@
7171
"nprogress": "0.2.0",
7272
"numeral": "2.0.6",
7373
"prop-types": "15.8.1",
74+
"punycode": "^2.3.1",
7475
"react": "19.0.0",
7576
"react-apexcharts": "1.7.0",
7677
"react-beautiful-dnd": "13.1.1",

‎public/version.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"version": "7.4.1"
2+
"version": "7.4.2"
33
}

‎src/components/CippCards/CippDomainCards.jsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ import { CippCodeBlock } from "/src/components/CippComponents/CippCodeBlock";
2828
import { CippOffCanvas } from "../CippComponents/CippOffCanvas";
2929
import { CippPropertyListCard } from "./CippPropertyListCard";
3030
import { getCippFormatting } from "../../utils/get-cipp-formatting";
31+
import punycode from "punycode";
3132

3233
const ResultList = ({ passes = [], warns = [], fails = [] }) => (
3334
<Stack direction="column" sx={{ mt: 1 }}>
@@ -395,7 +396,8 @@ export const CippDomainCards = ({ domain: propDomain = "", fullwidth = false })
395396
}, [propDomain, setValue]);
396397

397398
const onSubmit = (values) => {
398-
setDomain(values.domain);
399+
const punycodedDomain = punycode.toASCII(values.domain);
400+
setDomain(punycodedDomain);
399401
setSelector(values.dkimSelector);
400402
setSpfRecord(values.spfRecord);
401403
setSubdomains(values.subdomains);

‎src/components/CippComponents/CippApiDialog.jsx‎

Lines changed: 68 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -282,38 +282,36 @@ export const CippApiDialog = (props) => {
282282
.reduce((acc, key) => (acc && acc[key] !== undefined ? acc[key] : undefined), obj);
283283
};
284284

285-
// Handling external link navigation
286-
useEffect(() => {
287-
if (api.link && createDialog.open) {
288-
const linkWithRowData = api.link.replace(/\[([^\]]+)\]/g, (_, key) => {
289-
return getNestedValue(row, key) || `[${key}]`;
290-
});
285+
const [linkClicked, setLinkClicked] = useState(false);
291286

292-
if (!linkWithRowData.startsWith("/")) {
293-
window.open(linkWithRowData, api.target || "_blank");
294-
createDialog.handleClose();
295-
}
296-
}
297-
}, [api.link, createDialog.open]);
287+
useEffect(() => {
288+
if (api.link && !linkClicked && row && Object.keys(row).length > 0) {
289+
const timeoutId = setTimeout(() => {
290+
const linkWithRowData = api.link.replace(/\[([^\]]+)\]/g, (_, key) => {
291+
return getNestedValue(row, key) || `[${key}]`;
292+
});
298293

299-
// Handling internal link navigation
300-
if (api.link && createDialog.open) {
301-
const linkWithRowData = api.link.replace(/\[([^\]]+)\]/g, (_, key) => {
302-
return getNestedValue(row, key) || `[${key}]`;
303-
});
294+
if (linkWithRowData.startsWith("/")) {
295+
// Internal link navigation
296+
setLinkClicked(true);
297+
router.push(linkWithRowData, undefined, { shallow: true });
298+
} else {
299+
// External link navigation
300+
setLinkClicked(true);
301+
window.open(linkWithRowData, api.target || "_blank");
302+
}
303+
}, 0); // Delay execution to the next event loop cycle
304304

305-
if (linkWithRowData.startsWith("/")) {
306-
router.push(linkWithRowData, undefined, { shallow: true });
307-
createDialog.handleClose();
305+
return () => clearTimeout(timeoutId);
308306
}
309-
}
307+
}, [api.link, linkClicked, row, router]);
310308

311309
useEffect(() => {
312-
if (api.noConfirm) {
310+
if (api.noConfirm && !api.link) {
313311
formHook.handleSubmit(onSubmit)(); // Submits the form on mount
314312
createDialog.handleClose(); // Closes the dialog after submitting
315313
}
316-
}, [api.noConfirm]); // Run effect only when api.noConfirm changes
314+
}, [api.noConfirm, api.link]); // Run effect when noConfirm or link changes
317315

318316
const handleClose = () => {
319317
createDialog.handleClose();
@@ -336,44 +334,52 @@ export const CippApiDialog = (props) => {
336334
}
337335

338336
return (
339-
<Dialog fullWidth maxWidth="sm" onClose={handleClose} open={createDialog.open} {...other}>
340-
<form onSubmit={formHook.handleSubmit(onSubmit)}>
341-
<DialogTitle>{title}</DialogTitle>
342-
<DialogContent>
343-
<Stack spacing={2}>{confirmText}</Stack>
344-
</DialogContent>
345-
<DialogContent>
346-
<Grid container spacing={2}>
347-
{fields &&
348-
fields.map((fieldProps, index) => {
349-
if (fieldProps?.api?.processFieldData) {
350-
fieldProps.api.data = processActionData(fieldProps.api.data, row);
351-
}
352-
return (
353-
<Grid item xs={12} key={index}>
354-
<CippFormComponent
355-
formControl={formHook}
356-
addedFieldData={addedFieldData}
357-
setAddedFieldData={setAddedFieldData}
358-
{...fieldProps}
359-
/>
360-
</Grid>
361-
);
362-
})}
363-
</Grid>
364-
</DialogContent>
365-
<DialogContent>
366-
<CippApiResults apiObject={{ ...selectedType, data: partialResults }} />
367-
</DialogContent>
368-
<DialogActions>
369-
<Button color="inherit" onClick={() => handleClose()}>
370-
Close
371-
</Button>
372-
<Button variant="contained" type="submit" disabled={isFormSubmitted && !allowResubmit}>
373-
{isFormSubmitted && allowResubmit ? "Reconfirm" : "Confirm"}
374-
</Button>
375-
</DialogActions>
376-
</form>
377-
</Dialog>
337+
<>
338+
{!api?.link && (
339+
<Dialog fullWidth maxWidth="sm" onClose={handleClose} open={createDialog.open} {...other}>
340+
<form onSubmit={formHook.handleSubmit(onSubmit)}>
341+
<DialogTitle>{title}</DialogTitle>
342+
<DialogContent>
343+
<Stack spacing={2}>{confirmText}</Stack>
344+
</DialogContent>
345+
<DialogContent>
346+
<Grid container spacing={2}>
347+
{fields &&
348+
fields.map((fieldProps, index) => {
349+
if (fieldProps?.api?.processFieldData) {
350+
fieldProps.api.data = processActionData(fieldProps.api.data, row);
351+
}
352+
return (
353+
<Grid item xs={12} key={index}>
354+
<CippFormComponent
355+
formControl={formHook}
356+
addedFieldData={addedFieldData}
357+
setAddedFieldData={setAddedFieldData}
358+
{...fieldProps}
359+
/>
360+
</Grid>
361+
);
362+
})}
363+
</Grid>
364+
</DialogContent>
365+
<DialogContent>
366+
<CippApiResults apiObject={{ ...selectedType, data: partialResults }} />
367+
</DialogContent>
368+
<DialogActions>
369+
<Button color="inherit" onClick={() => handleClose()}>
370+
Close
371+
</Button>
372+
<Button
373+
variant="contained"
374+
type="submit"
375+
disabled={isFormSubmitted && !allowResubmit}
376+
>
377+
{isFormSubmitted && allowResubmit ? "Reconfirm" : "Confirm"}
378+
</Button>
379+
</DialogActions>
380+
</form>
381+
</Dialog>
382+
)}
383+
</>
378384
);
379385
};

‎src/components/CippComponents/CippApiResults.jsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ const extractAllResults = (data) => {
3838

3939
if (item && typeof item === "object") {
4040
const text = item.resultText || "";
41-
const copyField = item.copyField || text;
41+
const copyField = item.copyField || "";
4242
const severity =
4343
typeof item.state === "string" ? item.state : getSeverity(item) ? "error" : "success";
4444

@@ -47,6 +47,7 @@ const extractAllResults = (data) => {
4747
text,
4848
copyField,
4949
severity,
50+
...item,
5051
};
5152
}
5253
}
@@ -172,6 +173,7 @@ export const CippApiResults = (props) => {
172173
copyField: res.copyField,
173174
severity: res.severity,
174175
visible: true,
176+
...res,
175177
}))
176178
);
177179
} else {

‎src/components/CippComponents/CippCustomVariables.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -92,8 +92,8 @@ const CippCustomVariables = ({ id }) => {
9292
<CardContent>
9393
<Alert severity="info" sx={{ mb: 2 }}>
9494
{id === "AllTenants"
95-
? "Global variables are key-value pairs that can be used to store additional information for All Tenants. These are applied to templates in standards using the format %VariableName%. If a tenant has a custom variable with the same name, the tenant's variable will take precedence."
96-
: "Custom variables are key-value pairs that can be used to store additional information about a tenant. These are applied to templates in standards using the format %VariableName%."}
95+
? "Global variables are key-value pairs that can be used to store additional information for All Tenants. These are applied to templates in standards using the format %variablename%. If a tenant has a custom variable with the same name, the tenant's variable will take precedence."
96+
: "Custom variables are key-value pairs that can be used to store additional information about a tenant. These are applied to templates in standards using the format %variablename%."}
9797
</Alert>
9898
<CippDataTable
9999
queryKey={`CustomVariables_${id}`}

‎src/components/CippTable/CippDataTable.js‎

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ import { CippApiDialog } from "../CippComponents/CippApiDialog";
2424
import { getCippError } from "../../utils/get-cipp-error";
2525
import { Box } from "@mui/system";
2626
import { useSettings } from "../../hooks/use-settings";
27+
import { isEqual } from "lodash"; // Import lodash for deep comparison
2728

2829
export const CippDataTable = (props) => {
2930
const {
@@ -79,9 +80,11 @@ export const CippDataTable = (props) => {
7980

8081
useEffect(() => {
8182
if (Array.isArray(data) && !api?.url) {
82-
setUsedData(data);
83+
if (!isEqual(data, usedData)) {
84+
setUsedData(data);
85+
}
8386
}
84-
}, [data, api?.url]);
87+
}, [data, api?.url, usedData]);
8588

8689
useEffect(() => {
8790
if (getRequestData.isSuccess && !getRequestData.isFetching) {
@@ -127,7 +130,13 @@ export const CippDataTable = (props) => {
127130
queryKey,
128131
]);
129132
useEffect(() => {
130-
if (!Array.isArray(usedData) || usedData.length === 0 || typeof usedData[0] !== "object") {
133+
if (
134+
!Array.isArray(usedData) ||
135+
usedData.length === 0 ||
136+
typeof usedData[0] !== "object" ||
137+
usedData === null ||
138+
usedData === undefined
139+
) {
131140
return;
132141
}
133142
const apiColumns = utilColumnsFromAPI(usedData);
@@ -156,7 +165,7 @@ export const CippDataTable = (props) => {
156165
}
157166
setUsedColumns(finalColumns);
158167
setColumnVisibility(newVisibility);
159-
}, [columns.length, usedData.length, queryKey]);
168+
}, [columns.length, usedData, queryKey]);
160169

161170
const createDialog = useDialog();
162171

@@ -195,7 +204,7 @@ export const CippDataTable = (props) => {
195204
},
196205
}),
197206
columns: memoizedColumns,
198-
data: memoizedData,
207+
data: memoizedData ?? [],
199208
state: {
200209
columnVisibility,
201210
sorting,
@@ -294,8 +303,8 @@ export const CippDataTable = (props) => {
294303
data={data}
295304
columnVisibility={columnVisibility}
296305
getRequestData={getRequestData}
297-
usedColumns={usedColumns}
298-
usedData={usedData}
306+
usedColumns={memoizedColumns}
307+
usedData={memoizedData ?? []}
299308
title={title}
300309
actions={actions}
301310
exportEnabled={exportEnabled}

0 commit comments

Comments
 (0)