Spaces:
Runtime error
Runtime error
feat: secret should be required in production
Browse files- src/components/base/secret.tsx +22 -26
src/components/base/secret.tsx
CHANGED
@@ -1,33 +1,29 @@
|
|
1 |
-
import {
|
2 |
-
IconButton,
|
3 |
-
InputAdornment,
|
4 |
-
TextField,
|
5 |
-
TextFieldProps,
|
6 |
-
} from "@mui/material";
|
7 |
import { useState } from "react";
|
8 |
import { Visibility, VisibilityOff } from "@mui/icons-material";
|
9 |
|
10 |
export default function Secret(props: TextFieldProps) {
|
11 |
-
|
12 |
-
|
13 |
|
14 |
-
|
15 |
|
16 |
-
|
17 |
-
|
18 |
-
|
19 |
-
|
20 |
-
|
21 |
-
|
22 |
-
|
23 |
-
|
24 |
-
|
25 |
-
|
26 |
-
|
27 |
-
|
28 |
-
|
29 |
-
|
30 |
-
|
31 |
-
|
32 |
-
|
|
|
33 |
}
|
|
|
1 |
+
import { IconButton, InputAdornment, TextField, TextFieldProps } from "@mui/material";
|
|
|
|
|
|
|
|
|
|
|
2 |
import { useState } from "react";
|
3 |
import { Visibility, VisibilityOff } from "@mui/icons-material";
|
4 |
|
5 |
export default function Secret(props: TextFieldProps) {
|
6 |
+
const { name = "secret", label = "Secret", required = false } = props;
|
7 |
+
const [showSecret, setShowSecret] = useState(false);
|
8 |
|
9 |
+
const handleShowSecret = () => setShowSecret(!showSecret);
|
10 |
|
11 |
+
return (
|
12 |
+
<TextField
|
13 |
+
variant="filled"
|
14 |
+
label={label}
|
15 |
+
name={name}
|
16 |
+
type={showSecret ? "text" : "password"}
|
17 |
+
required
|
18 |
+
InputProps={{
|
19 |
+
endAdornment: (
|
20 |
+
<InputAdornment position="end">
|
21 |
+
<IconButton onClick={handleShowSecret}>
|
22 |
+
{showSecret ? <Visibility /> : <VisibilityOff />}
|
23 |
+
</IconButton>
|
24 |
+
</InputAdornment>
|
25 |
+
),
|
26 |
+
}}
|
27 |
+
/>
|
28 |
+
);
|
29 |
}
|