| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | /* | 
					
						
							|  |  |  | 	GoToSocial | 
					
						
							| 
									
										
										
										
											2023-01-05 12:43:00 +01:00
										 |  |  | 	Copyright (C) 2021-2023 GoToSocial Authors admin@gotosocial.org | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  | 	This program is free software: you can redistribute it and/or modify | 
					
						
							|  |  |  | 	it under the terms of the GNU Affero General Public License as published by | 
					
						
							|  |  |  | 	the Free Software Foundation, either version 3 of the License, or | 
					
						
							|  |  |  | 	(at your option) any later version. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	This program is distributed in the hope that it will be useful, | 
					
						
							|  |  |  | 	but WITHOUT ANY WARRANTY; without even the implied warranty of | 
					
						
							|  |  |  | 	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the | 
					
						
							|  |  |  | 	GNU Affero General Public License for more details. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	You should have received a copy of the GNU Affero General Public License | 
					
						
							|  |  |  | 	along with this program.  If not, see <http://www.gnu.org/licenses/>. | 
					
						
							|  |  |  | */ | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | "use strict"; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | const React = require("react"); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-01-30 23:46:20 +01:00
										 |  |  | module.exports = function useTextInput({ name, Name }, { | 
					
						
							|  |  |  | 	defaultValue = "", | 
					
						
							|  |  |  | 	dontReset = false, | 
					
						
							|  |  |  | 	validator, | 
					
						
							|  |  |  | 	initValidation: _initValidation | 
					
						
							|  |  |  | } = {}) { | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2022-12-11 16:00:23 +01:00
										 |  |  | 	const [text, setText] = React.useState(defaultValue); | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 	const textRef = React.useRef(null); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-01-30 23:46:20 +01:00
										 |  |  | 	const initValidation = React.useRef(_initValidation); // memoize forever
 | 
					
						
							|  |  |  | 	const [validation, setValidation] = React.useState(_initValidation ?? ""); | 
					
						
							|  |  |  | 	const [_isValidating, startValidation] = React.useTransition(); | 
					
						
							|  |  |  | 	const valid = validation == ""; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	const isFirstUpdate = React.useRef(true); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 	function onChange(e) { | 
					
						
							|  |  |  | 		let input = e.target.value; | 
					
						
							|  |  |  | 		setText(input); | 
					
						
							| 
									
										
										
										
											2023-01-30 23:46:20 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  | 		if (validator) { | 
					
						
							|  |  |  | 			startValidation(() => { | 
					
						
							|  |  |  | 				let validatorMsg = (isFirstUpdate.current && initValidation.current) | 
					
						
							|  |  |  | 					? initValidation.current | 
					
						
							|  |  |  | 					: validator(input); | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 				if (isFirstUpdate.current) { | 
					
						
							|  |  |  | 					isFirstUpdate.current = false; | 
					
						
							|  |  |  | 					return; // No need to update anything
 | 
					
						
							|  |  |  | 				} | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 				setValidation(validatorMsg); | 
					
						
							|  |  |  | 			}); | 
					
						
							|  |  |  | 		} | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 	} | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	function reset() { | 
					
						
							| 
									
										
										
										
											2023-01-18 14:45:14 +01:00
										 |  |  | 		if (!dontReset) { | 
					
						
							|  |  |  | 			setText(defaultValue); | 
					
						
							|  |  |  | 		} | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 	} | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 	React.useEffect(() => { | 
					
						
							| 
									
										
										
										
											2023-01-18 14:45:14 +01:00
										 |  |  | 		if (validator && textRef.current) { | 
					
						
							| 
									
										
										
										
											2023-01-30 23:46:20 +01:00
										 |  |  | 			textRef.current.setCustomValidity(validation); | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 		} | 
					
						
							| 
									
										
										
										
											2023-01-30 23:46:20 +01:00
										 |  |  | 	}, [validation, validator]); | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-01-18 14:45:14 +01:00
										 |  |  | 	// Array / Object hybrid, for easier access in different contexts
 | 
					
						
							|  |  |  | 	return Object.assign([ | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 		onChange, | 
					
						
							|  |  |  | 		reset, | 
					
						
							|  |  |  | 		{ | 
					
						
							|  |  |  | 			[name]: text, | 
					
						
							|  |  |  | 			[`${name}Ref`]: textRef, | 
					
						
							| 
									
										
										
										
											2022-12-11 16:00:23 +01:00
										 |  |  | 			[`set${Name}`]: setText, | 
					
						
							| 
									
										
										
										
											2023-01-18 14:45:14 +01:00
										 |  |  | 			[`${name}Valid`]: valid, | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | 		} | 
					
						
							| 
									
										
										
										
											2023-01-18 14:45:14 +01:00
										 |  |  | 	], { | 
					
						
							|  |  |  | 		onChange, | 
					
						
							|  |  |  | 		reset, | 
					
						
							|  |  |  | 		name, | 
					
						
							|  |  |  | 		value: text, | 
					
						
							|  |  |  | 		ref: textRef, | 
					
						
							|  |  |  | 		setter: setText, | 
					
						
							|  |  |  | 		valid, | 
					
						
							|  |  |  | 		hasChanged: () => text != defaultValue | 
					
						
							|  |  |  | 	}); | 
					
						
							| 
									
										
										
										
											2022-11-08 17:51:44 +01:00
										 |  |  | }; |