mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2025-01-03 23:07:26 +03:00
Code Issues Projects Releases Packages Wiki Activity

Updated color-picker and fixed error when left open and modal is closed

Browse source
This commit is contained in:
Alejandro Celaya 2020-11-14 09:16:26 +01:00
parent f83280068b
commit 4621246cec
3 changed files with 23 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
package-lock.json generated
View file

@ -16452,6 +16452,11 @@
"resolved": "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz", "resolved": "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz",
"integrity": "sha1-s56mIp72B+zYniyN8SU2iRysm40=" "integrity": "sha1-s56mIp72B+zYniyN8SU2iRysm40="
}, },
"lodash-es": {
"version": "4.17.15",
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.15.tgz",
"integrity": "sha512-rlrc3yU3+JNOpZ9zj5pQtxnx2THmvRykwL4Xlxoa8I9lHBlVbbyPhgyPMioxVZ4NqyxaVVtaJnzsyOidQIhyyQ=="
},
"lodash._reinterpolate": { "lodash._reinterpolate": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz", "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
@ -22894,16 +22899,24 @@
} }
}, },
"react-color": { "react-color": {
"version": "2.18.1", "version": "2.19.3",
"resolved": "https://registry.npmjs.org/react-color/-/react-color-2.18.1.tgz", "resolved": "https://registry.npmjs.org/react-color/-/react-color-2.19.3.tgz",
"integrity": "sha512-X5XpyJS6ncplZs74ak0JJoqPi+33Nzpv5RYWWxn17bslih+X7OlgmfpmGC1fNvdkK7/SGWYf1JJdn7D2n5gSuQ==", "integrity": "sha512-LEeGE/ZzNLIsFWa1TMe8y5VYqr7bibneWmvJwm1pCn/eNmrabWDh659JSPn9BuaMpEfU83WTOJfnCcjDZwNQTA==",
"requires": { "requires": {
"@icons/material": "^0.2.4", "@icons/material": "^0.2.4",
"lodash": "^4.17.11", "lodash": "^4.17.15",
"lodash-es": "^4.17.15",
"material-colors": "^1.2.1", "material-colors": "^1.2.1",
"prop-types": "^15.5.10", "prop-types": "^15.5.10",
"reactcss": "^1.2.0", "reactcss": "^1.2.0",
"tinycolor2": "^1.4.1" "tinycolor2": "^1.4.1"
},
"dependencies": {
"lodash": {
"version": "4.17.20",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz",
"integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA=="
}
} }
}, },
"react-copy-to-clipboard": { "react-copy-to-clipboard": {
@ -27150,9 +27163,9 @@
"integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
}, },
"tinycolor2": { "tinycolor2": {
"version": "1.4.1", "version": "1.4.2",
"resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.1.tgz", "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.2.tgz",
"integrity": "sha1-9PrTM0R7wLB9TcjpIJ2POaisd+g=" "integrity": "sha512-vJhccZPs965sV/L2sU4oRQVAos0pQXwsvTLkWYdqJ+a8Q5kPFzJTuOFwy7UniPli44NKQGAglksjvOcpo95aZA=="
}, },
"tmp": { "tmp": {
"version": "0.0.33", "version": "0.0.33",

2
package.json
View file

@ -46,7 +46,7 @@
"react": "^17.0.1", "react": "^17.0.1",
"react-autosuggest": "^10.0.2", "react-autosuggest": "^10.0.2",
"react-chartjs-2": "^2.10.0", "react-chartjs-2": "^2.10.0",
"react-color": "^2.18.1", "react-color": "^2.19.3",
"react-copy-to-clipboard": "^5.0.2", "react-copy-to-clipboard": "^5.0.2",
"react-datepicker": "~1.5.0", "react-datepicker": "~1.5.0",
"react-dom": "^17.0.1", "react-dom": "^17.0.1",

4
src/tags/helpers/EditTagModal.tsx
View file

@ -21,14 +21,14 @@ const EditTagModal = ({ getColorForKey }: ColorGenerator) => (
) => { ) => {
const [ newTagName, setNewTagName ] = useState(tag); const [ newTagName, setNewTagName ] = useState(tag);
const [ color, setColor ] = useState(getColorForKey(tag)); const [ color, setColor ] = useState(getColorForKey(tag));
const [ showColorPicker, toggleColorPicker ] = useToggle(); const [ showColorPicker, toggleColorPicker, , hideColorPicker ] = useToggle();
const saveTag = handleEventPreventingDefault(async () => editTag(tag, newTagName, color) const saveTag = handleEventPreventingDefault(async () => editTag(tag, newTagName, color)
.then(() => tagEdited(tag, newTagName, color)) .then(() => tagEdited(tag, newTagName, color))
.then(toggle) .then(toggle)
.catch(() => {})); .catch(() => {}));
return ( return (
<Modal isOpen={isOpen} toggle={toggle} centered> <Modal isOpen={isOpen} toggle={toggle} centered onClosed={hideColorPicker}>
<form onSubmit={saveTag}> <form onSubmit={saveTag}>
<ModalHeader toggle={toggle}>Edit tag</ModalHeader> <ModalHeader toggle={toggle}>Edit tag</ModalHeader>
<ModalBody> <ModalBody>