rick/rosterchirp-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fix clean-up

Browse Source
This commit is contained in:
Ricky Stretch
2026-03-29 14:04:20 -04:00
parent c378ec59e4
commit 49fa8b61eb
3 changed files with 12 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
frontend/src/components/MobileEventForm.jsx
View File

@@ -74,26 +74,22 @@ function TimeInputMobile({ value, onChange }) {
const [inputVal, setInputVal] = useState(fmt12(value));
const wrapRef = useRef(null);
const listRef = useRef(null);
const inputRef = useRef(null);
useEffect(() => { setInputVal(fmt12(value)); }, [value]);
// Programmatically disable autocomplete after mount
useEffect(() => {
if (inputRef.current) {
inputRef.current.setAttribute('autocomplete', 'off');
inputRef.current.setAttribute('autocorrect', 'off');
inputRef.current.setAttribute('autocapitalize', 'off');
inputRef.current.setAttribute('spellcheck', 'false');
}
}, []);
useEffect(() => {
if (!open || !listRef.current) return;
const idx = TIME_SLOTS.findIndex(s => s.value === value);
if (idx >= 0) listRef.current.scrollTop = idx * 40 - 40;
}, [open, value]);
useEffect(() => {
if (!open) return;
const h = e => { if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false); };
document.addEventListener('mousedown', h);
return () => document.removeEventListener('mousedown', h);
}, [open]);
const commit = (raw) => {
const parsed = parseTypedTime(raw);
if (parsed) { onChange(parsed); setInputVal(fmt12(parsed)); }
@@ -104,16 +100,13 @@ function TimeInputMobile({ value, onChange }) {
return (
<div ref={wrapRef} style={{ position: 'relative', display: 'inline-block' }}>
<input
ref={inputRef}
type="text"
value={inputVal}
onChange={e => setInputVal(e.target.value)}
onFocus={() => setOpen(true)}
onBlur={e => setTimeout(() => commit(e.target.value), 150)}
onKeyDown={e => { if (e.key === 'Enter') { e.preventDefault(); commit(inputVal); } if (e.key === 'Escape') { setInputVal(fmt12(value)); setOpen(false); } }}
autoComplete="nope"
data-autocomplete="off"
inputMode="none"
autoComplete="off"
style={{ fontSize: 15, color: 'var(--primary)', fontWeight: 600, background: 'transparent', border: 'none', outline: 'none', cursor: 'text', width: 90 }}
/>
{open && (
@@ -492,7 +485,7 @@ export default function MobileEventForm({ event, eventTypes, userGroups, selecte
{/* form wrapper suppresses Chrome Android's autofill chip bar; autoComplete="new-password"
on individual inputs is ignored by Chrome but respected on the form element */}
<form autoComplete="nope" onSubmit={e => e.preventDefault()} style={{ flex:1,overflowY:'auto' }}>
<form autoComplete="off" onSubmit={e => e.preventDefault()} style={{ flex:1,overflowY:'auto' }}>
{/* Title */}
<div style={{ padding:'16px 20px',borderBottom:'1px solid var(--border)' }}>
<input value={title} onChange={e => setTitle(e.target.value)} autoComplete="new-password" placeholder="Add title" autoCorrect="off" autoCapitalize="sentences" spellCheck={false} style={{ width:'100%',border:'none',background:'transparent',fontSize:22,fontWeight:700,color:'var(--text-primary)',outline:'none' }}/>

20
frontend/src/components/SchedulePage.jsx
View File

@@ -149,22 +149,11 @@ function TimeInput({ value, onChange, style }) {
const [inputVal, setInputVal] = useState(fmt12(value));
const wrapRef = useRef(null);
const listRef = useRef(null);
const inputRef = useRef(null);
// Keep display in sync when value changes externally
useEffect(() => { setInputVal(fmt12(value)); }, [value]);
// Programmatically disable autocomplete after mount
useEffect(() => {
if (inputRef.current) {
inputRef.current.setAttribute('autocomplete', 'off');
inputRef.current.setAttribute('autocorrect', 'off');
inputRef.current.setAttribute('autocapitalize', 'off');
inputRef.current.setAttribute('spellcheck', 'false');
}
}, []);
// Scroll the dropdown so the selected slot is near the top
// Scroll the dropdown so that selected slot is near the top
useEffect(() => {
if (!open || !listRef.current) return;
const idx = TIME_SLOTS.findIndex(s => s.value === value);
@@ -196,7 +185,6 @@ function TimeInput({ value, onChange, style }) {
return (
<div ref={wrapRef} style={{ position: 'relative', ...style }}>
<input
ref={inputRef}
type="text"
className="input"
value={inputVal}
@@ -208,9 +196,7 @@ function TimeInput({ value, onChange, style }) {
}}
onKeyDown={e => { if (e.key === 'Enter') { e.preventDefault(); commit(inputVal); } if (e.key === 'Escape') { setInputVal(fmt12(value)); setOpen(false); } }}
style={{ width: '100%', cursor: 'text' }}
autoComplete="nope"
data-autocomplete="off"
inputMode="none"
autoComplete="off"
placeholder="9:00 AM"
/>
{open && (
@@ -680,7 +666,7 @@ function EventForm({ event, userGroups, eventTypes, selectedDate, onSave, onCanc
<div style={{width:'100%',maxWidth:1024,overflowX:'auto'}}>
{/* form wrapper suppresses Chrome Android's autofill chip bar; autoComplete="new-password"
on individual inputs is ignored by Chrome but respected on the form element */}
<form autoComplete="nope" onSubmit={e => e.preventDefault()}>
<form autoComplete="off" onSubmit={e => e.preventDefault()}>
<div style={{minWidth:500}} onKeyDown={e=>{if(e.key==='Enter'&&e.target.tagName!=='TEXTAREA') e.preventDefault();}}>
{/* Title */}
<div style={{marginBottom:20}}>