Add error for when user enters wrong room password (#2534)

add error for when user enters wrong room password Co-authored-by: graham <[email protected]>
hackclub · Nov 5, 2024 · 13db9a4 · 13db9a4
1 parent 5bae3ab
commit 13db9a4
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 4 deletions.
diff --git a/src/components/popups-etc/room-password.tsx b/src/components/popups-etc/room-password.tsx
@@ -13,7 +13,8 @@ export interface RoomPasswordPopupProps {
 
 export default function RoomPasswordPopup(props: RoomPasswordPopupProps) {
 	let password = useSignal("");
-	function checkPassword() {
+	let isWrong = useSignal(false);
+	function checkPassword(noPassCheck = false) {
 		if(props.persistenceState.value.kind !== PersistenceStateKind.COLLAB) return
 		fetch("/api/rooms/check-password", {
 			method: "POST",
@@ -29,10 +30,12 @@ export default function RoomPasswordPopup(props: RoomPasswordPopupProps) {
 						}
 					}
 				)
+			} else {
+				isWrong.value = !noPassCheck;
 			}
 		});
 	}
-	useEffect(checkPassword, [])
+	useEffect(() => checkPassword(true), [])
 	return (
 		<div class={styles.overlay}>
 			<div class={styles.modal}>
@@ -54,7 +57,8 @@ export default function RoomPasswordPopup(props: RoomPasswordPopupProps) {
 								Enter room
 							</Button>
 						</div>
-					</form>	
+					</form>
+					{isWrong.value && <p className={styles.error}>Incorrect password!</p>}
 			</div>
 		</div>
 	)

diff --git a/src/components/popups-etc/share-room.module.css b/src/components/popups-etc/share-room.module.css
@@ -130,4 +130,4 @@ p.muted {
 .warning a {
 	color: #000000;
 	text-decoration: underline;
-}
+}