umwd-components 0.1.696 → 0.1.698

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/dist/node_modules/base64-js/index.js +1 -1
  2. package/dist/node_modules/ieee754/index.js +1 -1
  3. package/dist/src/components/common/AmountIndicator.js +0 -1
  4. package/dist/src/components/common/EnhancedTable/EnhancedTable.js +0 -1
  5. package/dist/src/components/e-commerce/customer/CustomerProfileDisplay.js +1 -1
  6. package/dist/src/components/e-commerce/iro/TextualManageIROForm.js +1 -1
  7. package/dist/src/components/e-commerce/opo/PaymentStatusIndicator.js +1 -2
  8. package/dist/src/components/e-commerce/opo/TextualManageOpoForm.js +1 -1
  9. package/dist/src/components/logistics/ipo/TextualManageIPOForm.js +1 -1
  10. package/dist/src/data/actions/e-commerce/iro/updateIroAction.js +1 -1
  11. package/dist/tsconfig.build.tsbuildinfo +1 -1
  12. package/dist/types/components/e-commerce/customer/BackendCustomerProfileDisplay.d.ts +18 -0
  13. package/dist/types/components/e-commerce/customer/FrontendCustomerProfileDisplay.d.ts +13 -0
  14. package/dist/types/types/e-commerce/customer/types.d.ts +2 -2
  15. package/package.json +1 -1
  16. package/src/components/common/AmountIndicator.tsx +0 -2
  17. package/src/components/common/EnhancedTable/EnhancedTable.tsx +0 -2
  18. package/src/components/e-commerce/customer/BackendCustomerProfileDisplay.tsx +261 -0
  19. package/src/components/e-commerce/customer/CustomerProfileDisplay.tsx +10 -2
  20. package/src/components/e-commerce/customer/FrontendCustomerProfileDisplay.tsx +256 -0
  21. package/src/components/e-commerce/iro/TextualManageIROForm.tsx +12 -10
  22. package/src/components/e-commerce/opo/PaymentStatusIndicator.tsx +5 -5
  23. package/src/components/e-commerce/opo/TextualManageOpoForm.tsx +41 -43
  24. package/src/components/logistics/ipo/TextualManageIPOForm.tsx +2 -2
  25. package/src/data/actions/e-commerce/iro/updateIroAction.ts +3 -0
  26. package/src/types/e-commerce/customer/types.ts +2 -2
@@ -0,0 +1,18 @@
1
+ import React from "react";
2
+ import { SxProps, Theme } from "@mui/material/styles";
3
+ import { CustomerProfileProps } from "../../../types/e-commerce/customer/types";
4
+ interface CustomerProfileDisplayProps extends CustomerProfileProps {
5
+ maxWidth: "xs" | "sm" | "md" | "lg" | "xl" | false | undefined;
6
+ sx?: SxProps<Theme>;
7
+ editProfileUrl?: string;
8
+ completeEnough?: boolean;
9
+ }
10
+ /**
11
+ * INFO: This component displays the customer profile information.
12
+ * Other then the FrontendCustomerProfileDisplay, this component is about the user whereas the frontend component is addressing the customer.
13
+ * It list the customer profile information, business credentials, addresses, orders, and returns.
14
+ * */
15
+ export default function CustomerProfileDisplay({ data, }: {
16
+ readonly data: CustomerProfileDisplayProps;
17
+ }): React.JSX.Element;
18
+ export {};
@@ -0,0 +1,13 @@
1
+ import React from "react";
2
+ import { SxProps, Theme } from "@mui/material/styles";
3
+ import { CustomerProfileProps } from "../../../types/e-commerce/customer/types";
4
+ interface CustomerProfileDisplayProps extends CustomerProfileProps {
5
+ maxWidth: "xs" | "sm" | "md" | "lg" | "xl" | false | undefined;
6
+ sx?: SxProps<Theme>;
7
+ editProfileUrl?: string;
8
+ completeEnough?: boolean;
9
+ }
10
+ export default function CustomerProfileDisplay({ data, }: {
11
+ readonly data: CustomerProfileDisplayProps;
12
+ }): React.JSX.Element;
13
+ export {};
@@ -25,10 +25,10 @@ export interface CustomerProfileProps {
25
25
  delivery_address: AddressProps;
26
26
  billing_address: AddressProps;
27
27
  business_credentials: BusinessCredentialsWithJSONProps;
28
- orders: {
28
+ orders?: {
29
29
  data: Opo[];
30
30
  };
31
- returns: {
31
+ returns?: {
32
32
  data: Iro[];
33
33
  };
34
34
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "umwd-components",
3
- "version": "0.1.696",
3
+ "version": "0.1.698",
4
4
  "description": "UMWD Component library",
5
5
  "main": "dist/src/index.js",
6
6
  "module": "dist/src/index.js",
@@ -1,5 +1,3 @@
1
- "use client";
2
-
3
1
  import React from "react";
4
2
  import Box from "@mui/material/Box";
5
3
  import Typography from "@mui/material/Typography";
@@ -1,5 +1,3 @@
1
- "use client";
2
-
3
1
  import React, { useState, useEffect, useMemo } from "react";
4
2
  import Box from "@mui/material/Box";
5
3
  import Table from "@mui/material/Table";
@@ -0,0 +1,261 @@
1
+ "use client";
2
+
3
+ import React from "react";
4
+
5
+ import Paper from "@mui/material/Paper";
6
+ import Stack from "@mui/material/Stack";
7
+ import Box from "@mui/material/Box";
8
+ import Typography from "@mui/material/Typography";
9
+ import Button from "@mui/material/Button";
10
+ import Grid from "@mui/material/Grid";
11
+ import Table from "@mui/material/Table";
12
+ import TableBody from "@mui/material/TableBody";
13
+ import TableCell from "@mui/material/TableCell";
14
+ import TableHead from "@mui/material/TableHead";
15
+ import TableRow from "@mui/material/TableRow";
16
+
17
+ import { SxProps, Theme } from "@mui/material/styles";
18
+ import PersonIcon from "@mui/icons-material/Person";
19
+ import EmailIcon from "@mui/icons-material/Email";
20
+ import PhoneIcon from "@mui/icons-material/Phone";
21
+ import Address from "../../common/Address";
22
+ import BusinessCredentials from "./BusinessCredentials";
23
+ import { StyledLink } from "../../StyledLink";
24
+ import { CustomerProfileProps } from "../../../types/e-commerce/customer/types";
25
+
26
+ import { Alert } from "@mui/material";
27
+
28
+ import { usePathname } from "next/navigation";
29
+
30
+ interface CustomerProfileDisplayProps extends CustomerProfileProps {
31
+ maxWidth: "xs" | "sm" | "md" | "lg" | "xl" | false | undefined;
32
+ sx?: SxProps<Theme>;
33
+ editProfileUrl?: string;
34
+ completeEnough?: boolean;
35
+ }
36
+
37
+ /**
38
+ * INFO: This component displays the customer profile information.
39
+ * Other then the FrontendCustomerProfileDisplay, this component is about the user whereas the frontend component is addressing the customer.
40
+ * It list the customer profile information, business credentials, addresses, orders, and returns.
41
+ * */
42
+ export default function CustomerProfileDisplay({
43
+ data,
44
+ }: {
45
+ readonly data: CustomerProfileDisplayProps;
46
+ }) {
47
+ const {
48
+ first_name,
49
+ last_name,
50
+ email,
51
+ phone,
52
+ company_address,
53
+ billing_address,
54
+ delivery_address,
55
+ business_credentials,
56
+ editProfileUrl = "/user/profile/edit",
57
+ completeEnough = false,
58
+ orders,
59
+ returns,
60
+ } = data;
61
+
62
+ if (!data) {
63
+ return (
64
+ <Stack spacing={2}>
65
+ <Typography>Customer profile not available</Typography>
66
+ </Stack>
67
+ );
68
+ }
69
+
70
+ console.log("CustomerProfileDisplay", data);
71
+
72
+ const pathname = usePathname();
73
+ const isCustomer = pathname.includes("/user/");
74
+
75
+ return (
76
+ <Grid container sx={{ width: "100%" }} spacing={2}>
77
+ {isCustomer && (
78
+ <Grid item xs={12}>
79
+ {!Boolean(completeEnough) ? (
80
+ <Alert
81
+ severity="warning"
82
+ action={
83
+ <StyledLink href={editProfileUrl} target="_self">
84
+ <Button variant="contained">complete profile</Button>
85
+ </StyledLink>
86
+ }
87
+ >
88
+ After completion of your profile you can enjoy all the benefits of
89
+ your services.
90
+ </Alert>
91
+ ) : (
92
+ <Stack direction={"row"} justifyContent={"flex-end"}>
93
+ <StyledLink href={editProfileUrl} target="_self">
94
+ <Button variant="contained">edit profile</Button>
95
+ </StyledLink>
96
+ </Stack>
97
+ )}
98
+ </Grid>
99
+ )}
100
+
101
+ <Grid item xs={12}>
102
+ {business_credentials ? (
103
+ <BusinessCredentials data={business_credentials} />
104
+ ) : (
105
+ <Typography>Business credentials not available</Typography>
106
+ )}
107
+ </Grid>
108
+
109
+ <Grid item xs={12}>
110
+ <Stack spacing={2} direction="row">
111
+ <PersonIcon />
112
+ <Box>
113
+ <Typography variant="body1" component="p">
114
+ {first_name} {last_name} {!first_name && !last_name && "N/A"}
115
+ </Typography>
116
+ </Box>
117
+ </Stack>
118
+ <Stack spacing={2} direction="row">
119
+ <EmailIcon />
120
+ <Box>
121
+ <Typography variant="body1" component="p">
122
+ {email} {!email && "N/A"}
123
+ </Typography>
124
+ </Box>
125
+ </Stack>
126
+ <Stack spacing={2} direction="row">
127
+ <PhoneIcon />
128
+ <Box>
129
+ <Typography variant="body1" component="p">
130
+ {phone} {!phone && "N/A"}
131
+ </Typography>
132
+ </Box>
133
+ </Stack>
134
+ </Grid>
135
+
136
+ {company_address ? (
137
+ <Grid item xs={12} md={4}>
138
+ <Typography variant="h6">Company Address</Typography>
139
+ <Address data={{ ...company_address }} />
140
+ </Grid>
141
+ ) : (
142
+ <Grid item xs={12} md={4}>
143
+ <Typography>Company address not available</Typography>
144
+ </Grid>
145
+ )}
146
+ {delivery_address ? (
147
+ <Grid item xs={12} md={4}>
148
+ <Typography variant="h6">Delivery Address</Typography>
149
+ <Address data={{ ...delivery_address }} />
150
+ </Grid>
151
+ ) : (
152
+ <Grid item xs={12} md={4}>
153
+ <Typography>Delivery address not available</Typography>
154
+ </Grid>
155
+ )}
156
+ {billing_address ? (
157
+ <Grid item xs={12} md={4}>
158
+ <Typography variant="h6">Billing Address</Typography>
159
+ <Address data={{ ...billing_address }} />
160
+ </Grid>
161
+ ) : (
162
+ <Grid item xs={12} md={4}>
163
+ <Typography>Billing address not available</Typography>
164
+ </Grid>
165
+ )}
166
+
167
+ <Grid item xs={12}>
168
+ <Typography variant="h6" gutterBottom>
169
+ Orders
170
+ </Typography>
171
+ <Paper>
172
+ {orders && orders.data && orders.data.length > 0 ? (
173
+ <Table>
174
+ <TableHead>
175
+ <TableRow>
176
+ <TableCell>Order Number</TableCell>
177
+ <TableCell>Date</TableCell>
178
+ <TableCell>Status</TableCell>
179
+ <TableCell align="right">Total</TableCell>
180
+ <TableCell align="right">Actions</TableCell>
181
+ </TableRow>
182
+ </TableHead>
183
+ <TableBody>
184
+ {orders.data.map((order, index) => (
185
+ <TableRow key={index}>
186
+ <TableCell>{order.opo_number}</TableCell>
187
+ <TableCell>
188
+ {new Date(order.order_date).toLocaleDateString()}
189
+ </TableCell>
190
+ <TableCell>{order.status}</TableCell>
191
+ <TableCell align="right">
192
+ {order.total_incl_vat} {order.order_currency}
193
+ </TableCell>
194
+ <TableCell align="right">
195
+ <StyledLink href={`/orders/${order.uuid}`} target="_self">
196
+ <Button variant="contained" size="small">
197
+ View
198
+ </Button>
199
+ </StyledLink>
200
+ </TableCell>
201
+ </TableRow>
202
+ ))}
203
+ </TableBody>
204
+ </Table>
205
+ ) : (
206
+ <Box p={2}>
207
+ <Typography>You have no orders.</Typography>
208
+ </Box>
209
+ )}
210
+ </Paper>
211
+ </Grid>
212
+
213
+ <Grid item xs={12}>
214
+ <Typography variant="h6" gutterBottom>
215
+ Returns
216
+ </Typography>
217
+ <Paper>
218
+ {returns && returns.data && returns.data.length > 0 ? (
219
+ <Table>
220
+ <TableHead>
221
+ <TableRow>
222
+ <TableCell>Return Number</TableCell>
223
+ <TableCell>RMA Number</TableCell>
224
+ <TableCell>Date</TableCell>
225
+ <TableCell>Status</TableCell>
226
+ <TableCell align="right">Actions</TableCell>
227
+ </TableRow>
228
+ </TableHead>
229
+ <TableBody>
230
+ {returns.data.map((returnItem, index) => (
231
+ <TableRow key={index}>
232
+ <TableCell>{returnItem.return_number}</TableCell>
233
+ <TableCell>{returnItem.rma_number}</TableCell>
234
+ <TableCell>
235
+ {new Date(returnItem.return_date).toLocaleDateString()}
236
+ </TableCell>
237
+ <TableCell>{returnItem.status}</TableCell>
238
+ <TableCell align="right">
239
+ <StyledLink
240
+ href={`/returns/${returnItem.uuid}`}
241
+ target="_self"
242
+ >
243
+ <Button variant="contained" size="small">
244
+ View
245
+ </Button>
246
+ </StyledLink>
247
+ </TableCell>
248
+ </TableRow>
249
+ ))}
250
+ </TableBody>
251
+ </Table>
252
+ ) : (
253
+ <Box p={2}>
254
+ <Typography>You have no returns.</Typography>
255
+ </Box>
256
+ )}
257
+ </Paper>
258
+ </Grid>
259
+ </Grid>
260
+ );
261
+ }
@@ -54,6 +54,14 @@ export default function CustomerProfileDisplay({
54
54
  returns,
55
55
  } = data;
56
56
 
57
+ if (!data) {
58
+ return (
59
+ <Stack spacing={2}>
60
+ <Typography>Customer profile not available</Typography>
61
+ </Stack>
62
+ );
63
+ }
64
+
57
65
  console.log("CustomerProfileDisplay", data);
58
66
 
59
67
  const pathname = usePathname();
@@ -156,7 +164,7 @@ export default function CustomerProfileDisplay({
156
164
  Orders
157
165
  </Typography>
158
166
  <Paper>
159
- {orders.data && orders.data.length > 0 ? (
167
+ {orders && orders.data && orders.data.length > 0 ? (
160
168
  <Table>
161
169
  <TableHead>
162
170
  <TableRow>
@@ -202,7 +210,7 @@ export default function CustomerProfileDisplay({
202
210
  Returns
203
211
  </Typography>
204
212
  <Paper>
205
- {returns.data && returns.data.length > 0 ? (
213
+ {returns && returns.data && returns.data.length > 0 ? (
206
214
  <Table>
207
215
  <TableHead>
208
216
  <TableRow>
@@ -0,0 +1,256 @@
1
+ "use client";
2
+
3
+ import React from "react";
4
+
5
+ import Paper from "@mui/material/Paper";
6
+ import Stack from "@mui/material/Stack";
7
+ import Box from "@mui/material/Box";
8
+ import Typography from "@mui/material/Typography";
9
+ import Button from "@mui/material/Button";
10
+ import Grid from "@mui/material/Grid";
11
+ import Table from "@mui/material/Table";
12
+ import TableBody from "@mui/material/TableBody";
13
+ import TableCell from "@mui/material/TableCell";
14
+ import TableHead from "@mui/material/TableHead";
15
+ import TableRow from "@mui/material/TableRow";
16
+
17
+ import { SxProps, Theme } from "@mui/material/styles";
18
+ import PersonIcon from "@mui/icons-material/Person";
19
+ import EmailIcon from "@mui/icons-material/Email";
20
+ import PhoneIcon from "@mui/icons-material/Phone";
21
+ import Address from "../../common/Address";
22
+ import BusinessCredentials from "./BusinessCredentials";
23
+ import { StyledLink } from "../../../components/StyledLink";
24
+ import { CustomerProfileProps } from "../../../types/e-commerce/customer/types";
25
+
26
+ import { Alert } from "@mui/material";
27
+
28
+ import { usePathname } from "next/navigation";
29
+
30
+ interface CustomerProfileDisplayProps extends CustomerProfileProps {
31
+ maxWidth: "xs" | "sm" | "md" | "lg" | "xl" | false | undefined;
32
+ sx?: SxProps<Theme>;
33
+ editProfileUrl?: string;
34
+ completeEnough?: boolean;
35
+ }
36
+
37
+ export default function CustomerProfileDisplay({
38
+ data,
39
+ }: {
40
+ readonly data: CustomerProfileDisplayProps;
41
+ }) {
42
+ const {
43
+ first_name,
44
+ last_name,
45
+ email,
46
+ phone,
47
+ company_address,
48
+ billing_address,
49
+ delivery_address,
50
+ business_credentials,
51
+ editProfileUrl = "/user/profile/edit",
52
+ completeEnough = false,
53
+ orders,
54
+ returns,
55
+ } = data;
56
+
57
+ if (!data) {
58
+ return (
59
+ <Stack spacing={2}>
60
+ <Typography>Customer profile not available</Typography>
61
+ </Stack>
62
+ );
63
+ }
64
+
65
+ console.log("CustomerProfileDisplay", data);
66
+
67
+ const pathname = usePathname();
68
+ const isCustomer = pathname.includes("/user/");
69
+
70
+ return (
71
+ <Grid container sx={{ width: "100%" }} spacing={2}>
72
+ {isCustomer && (
73
+ <Grid item xs={12}>
74
+ {!Boolean(completeEnough) ? (
75
+ <Alert
76
+ severity="warning"
77
+ action={
78
+ <StyledLink href={editProfileUrl} target="_self">
79
+ <Button variant="contained">complete profile</Button>
80
+ </StyledLink>
81
+ }
82
+ >
83
+ After completion of your profile you can enjoy all the benefits of
84
+ your services.
85
+ </Alert>
86
+ ) : (
87
+ <Stack direction={"row"} justifyContent={"flex-end"}>
88
+ <StyledLink href={editProfileUrl} target="_self">
89
+ <Button variant="contained">edit profile</Button>
90
+ </StyledLink>
91
+ </Stack>
92
+ )}
93
+ </Grid>
94
+ )}
95
+
96
+ <Grid item xs={12}>
97
+ {business_credentials ? (
98
+ <BusinessCredentials data={business_credentials} />
99
+ ) : (
100
+ <Typography>Business credentials not available</Typography>
101
+ )}
102
+ </Grid>
103
+
104
+ <Grid item xs={12}>
105
+ <Stack spacing={2} direction="row">
106
+ <PersonIcon />
107
+ <Box>
108
+ <Typography variant="body1" component="p">
109
+ {first_name} {last_name} {!first_name && !last_name && "N/A"}
110
+ </Typography>
111
+ </Box>
112
+ </Stack>
113
+ <Stack spacing={2} direction="row">
114
+ <EmailIcon />
115
+ <Box>
116
+ <Typography variant="body1" component="p">
117
+ {email} {!email && "N/A"}
118
+ </Typography>
119
+ </Box>
120
+ </Stack>
121
+ <Stack spacing={2} direction="row">
122
+ <PhoneIcon />
123
+ <Box>
124
+ <Typography variant="body1" component="p">
125
+ {phone} {!phone && "N/A"}
126
+ </Typography>
127
+ </Box>
128
+ </Stack>
129
+ </Grid>
130
+
131
+ {company_address ? (
132
+ <Grid item xs={12} md={4}>
133
+ <Typography variant="h6">Company Address</Typography>
134
+ <Address data={{ ...company_address }} />
135
+ </Grid>
136
+ ) : (
137
+ <Grid item xs={12} md={4}>
138
+ <Typography>Company address not available</Typography>
139
+ </Grid>
140
+ )}
141
+ {delivery_address ? (
142
+ <Grid item xs={12} md={4}>
143
+ <Typography variant="h6">Delivery Address</Typography>
144
+ <Address data={{ ...delivery_address }} />
145
+ </Grid>
146
+ ) : (
147
+ <Grid item xs={12} md={4}>
148
+ <Typography>Delivery address not available</Typography>
149
+ </Grid>
150
+ )}
151
+ {billing_address ? (
152
+ <Grid item xs={12} md={4}>
153
+ <Typography variant="h6">Billing Address</Typography>
154
+ <Address data={{ ...billing_address }} />
155
+ </Grid>
156
+ ) : (
157
+ <Grid item xs={12} md={4}>
158
+ <Typography>Billing address not available</Typography>
159
+ </Grid>
160
+ )}
161
+
162
+ <Grid item xs={12}>
163
+ <Typography variant="h6" gutterBottom>
164
+ Orders
165
+ </Typography>
166
+ <Paper>
167
+ {orders && orders.data && orders.data.length > 0 ? (
168
+ <Table>
169
+ <TableHead>
170
+ <TableRow>
171
+ <TableCell>Order Number</TableCell>
172
+ <TableCell>Date</TableCell>
173
+ <TableCell>Status</TableCell>
174
+ <TableCell align="right">Total</TableCell>
175
+ <TableCell align="right">Actions</TableCell>
176
+ </TableRow>
177
+ </TableHead>
178
+ <TableBody>
179
+ {orders.data.map((order, index) => (
180
+ <TableRow key={index}>
181
+ <TableCell>{order.opo_number}</TableCell>
182
+ <TableCell>
183
+ {new Date(order.order_date).toLocaleDateString()}
184
+ </TableCell>
185
+ <TableCell>{order.status}</TableCell>
186
+ <TableCell align="right">
187
+ {order.total_incl_vat} {order.order_currency}
188
+ </TableCell>
189
+ <TableCell align="right">
190
+ <StyledLink href={`/orders/${order.uuid}`} target="_self">
191
+ <Button variant="contained" size="small">
192
+ View
193
+ </Button>
194
+ </StyledLink>
195
+ </TableCell>
196
+ </TableRow>
197
+ ))}
198
+ </TableBody>
199
+ </Table>
200
+ ) : (
201
+ <Box p={2}>
202
+ <Typography>You have no orders.</Typography>
203
+ </Box>
204
+ )}
205
+ </Paper>
206
+ </Grid>
207
+
208
+ <Grid item xs={12}>
209
+ <Typography variant="h6" gutterBottom>
210
+ Returns
211
+ </Typography>
212
+ <Paper>
213
+ {returns && returns.data && returns.data.length > 0 ? (
214
+ <Table>
215
+ <TableHead>
216
+ <TableRow>
217
+ <TableCell>Return Number</TableCell>
218
+ <TableCell>RMA Number</TableCell>
219
+ <TableCell>Date</TableCell>
220
+ <TableCell>Status</TableCell>
221
+ <TableCell align="right">Actions</TableCell>
222
+ </TableRow>
223
+ </TableHead>
224
+ <TableBody>
225
+ {returns.data.map((returnItem, index) => (
226
+ <TableRow key={index}>
227
+ <TableCell>{returnItem.return_number}</TableCell>
228
+ <TableCell>{returnItem.rma_number}</TableCell>
229
+ <TableCell>
230
+ {new Date(returnItem.return_date).toLocaleDateString()}
231
+ </TableCell>
232
+ <TableCell>{returnItem.status}</TableCell>
233
+ <TableCell align="right">
234
+ <StyledLink
235
+ href={`/returns/${returnItem.uuid}`}
236
+ target="_self"
237
+ >
238
+ <Button variant="contained" size="small">
239
+ View
240
+ </Button>
241
+ </StyledLink>
242
+ </TableCell>
243
+ </TableRow>
244
+ ))}
245
+ </TableBody>
246
+ </Table>
247
+ ) : (
248
+ <Box p={2}>
249
+ <Typography>You have no returns.</Typography>
250
+ </Box>
251
+ )}
252
+ </Paper>
253
+ </Grid>
254
+ </Grid>
255
+ );
256
+ }
@@ -61,19 +61,21 @@ const INITIAL_STATE = {
61
61
  severity: null,
62
62
  };
63
63
 
64
+ interface OverwritesDialogProps {
65
+ open: boolean;
66
+ handleClose: () => void;
67
+ overwrites: InvoiceOverwrites;
68
+ setOverwrites: (overwrites: InvoiceOverwrites) => void;
69
+ iro: Iro;
70
+ }
71
+
64
72
  function OverwritesDialog({
65
73
  open,
66
74
  handleClose,
67
75
  overwrites,
68
76
  setOverwrites,
69
77
  iro,
70
- }: {
71
- open: boolean;
72
- handleClose: () => void;
73
- overwrites: InvoiceOverwrites;
74
- setOverwrites: (overwrites: InvoiceOverwrites) => void;
75
- iro: Iro;
76
- }) {
78
+ }: OverwritesDialogProps): React.JSX.Element {
77
79
  const [loading, setLoading] = useState(false);
78
80
 
79
81
  // Initialize overwrites values when dialog opens
@@ -163,7 +165,7 @@ function OverwritesDialog({
163
165
  }, [open, iro]);
164
166
 
165
167
  return (
166
- <Dialog open={open} fullWidth maxWidth="lg">
168
+ <Dialog open={open} onClose={handleClose} fullWidth maxWidth="lg">
167
169
  <DialogTitle>Check or overwrite value for the return payment</DialogTitle>
168
170
  <DialogContent>
169
171
  <Stack spacing={2} alignItems="left" sx={{ px: 0 }}>
@@ -407,7 +409,7 @@ function ConfirmFormDialog({
407
409
  };
408
410
 
409
411
  return (
410
- <Dialog open={open}>
412
+ <Dialog open={open} onClose={handleClose}>
411
413
  <DialogTitle>Confirm Return</DialogTitle>
412
414
  <DialogContent>
413
415
  <Stack spacing={2}>
@@ -499,7 +501,7 @@ function CancelIroDialog({
499
501
 
500
502
  return (
501
503
  <form>
502
- <Dialog open={open}>
504
+ <Dialog open={open} onClose={handleClose}>
503
505
  <DialogTitle>Cancel Return</DialogTitle>
504
506
  <DialogContent>
505
507
  <Stack spacing={2}>