jp/asterisk-voicemail
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sanitise callerid number in add-contact modal

Browse Source 
- extract E.164 from angle brackets when present
- show 'Number: ...' at top of modal instead of readonly input
- use same sanitiseNumber() for message list callback links
This commit is contained in:
jp
2026-08-13 19:04:01 +01:00
parent 20cb36e33b
commit 7dd2d371d2
1 changed files with 10 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/components/MessagesPage.tsx
View File

@ -39,8 +39,14 @@ export default function MessagesPage() {
const onSubmit = (e: React.FormEvent) => e.preventDefault(); const onSubmit = (e: React.FormEvent) => e.preventDefault();
const sanitiseNumber = (raw?: string) => {
if (!raw) return "";
const bracket = raw.match(/<([^>]+)>/);
if (bracket) return bracket[1].trim();
return raw.replace(/[^\d+]/g, "").trim();
};
const startAdd = (m: { id: number; contact_name?: string; callerid?: string }) => { const startAdd = (m: { id: number; contact_name?: string; callerid?: string }) => {
const num = (m.callerid || "").replace(/[^\d+]/g, "");
setAddName(m.contact_name || ""); setAddName(m.contact_name || "");
setAddEmail(""); setAddEmail("");
setAddingId(m.id); setAddingId(m.id);
@ -66,7 +72,7 @@ export default function MessagesPage() {
{data?.messages?.map((m) => { {data?.messages?.map((m) => {
const whoRaw = m.contact_name || m.callerid || "Unknown caller"; const whoRaw = m.contact_name || m.callerid || "Unknown caller";
const num = (m.callerid || "").replace(/[^\d+]/g, ""); const num = sanitiseNumber(m.callerid);
const showAdd = !m.contact_name && num; const showAdd = !m.contact_name && num;
return ( return (
<div key={m.id} className={"card" + (m.is_read ? "" : " unread")}> <div key={m.id} className={"card" + (m.is_read ? "" : " unread")}>
@ -124,10 +130,10 @@ export default function MessagesPage() {
<div className="modal-bg open" onClick={() => setAddingId(null)}> <div className="modal-bg open" onClick={() => setAddingId(null)}>
<div className="modal" onClick={(e) => e.stopPropagation()}> <div className="modal" onClick={(e) => e.stopPropagation()}>
<h3>Add contact</h3> <h3>Add contact</h3>
<form onSubmit={(e) => { e.preventDefault(); if (!addName.trim()) return; const target = data?.messages?.find((x: any) => x.id === addingId); const raw = target ? (target.callerid || "") : ""; const targetNum = raw.replace(/[^\d+]/g, "").trim(); addContact.mutate({ name: addName.trim(), number: targetNum || undefined, email: addEmail.trim() || null }); }}> {(() => { const target = data?.messages?.find((x: any) => x.id === addingId); const num = sanitiseNumber(target?.callerid); return num ? <div style={{ marginBottom: 10, fontFamily: "var(--font-mono)", fontSize: 13, color: "var(--text-secondary)" }}>Number: {num}</div> : null; })()}
<form onSubmit={(e) => { e.preventDefault(); if (!addName.trim()) return; const target = data?.messages?.find((x: any) => x.id === addingId); const targetNum = sanitiseNumber(target?.callerid); addContact.mutate({ name: addName.trim(), number: targetNum || undefined, email: addEmail.trim() || null }); }}>
<label>Name</label> <label>Name</label>
<input value={addName} onChange={(e) => setAddName(e.target.value)} required /> <input value={addName} onChange={(e) => setAddName(e.target.value)} required />
{(() => { const target = data?.messages?.find((x: any) => x.id === addingId); const raw = target ? (target.callerid || "") : ""; const num = raw.replace(/[^\d+]/g, "").trim(); return num ? <><label>Number</label><input value={num} readOnly /></> : null; })()}
<label>Email</label> <label>Email</label>
<input type="email" value={addEmail} onChange={(e) => setAddEmail(e.target.value)} /> <input type="email" value={addEmail} onChange={(e) => setAddEmail(e.target.value)} />
<div className="row"> <div className="row">