diff --git a/frontend/src/components/MessagesPage.tsx b/frontend/src/components/MessagesPage.tsx
index 9c0e297..0567f5d 100644
--- a/frontend/src/components/MessagesPage.tsx
+++ b/frontend/src/components/MessagesPage.tsx
@@ -124,9 +124,10 @@ export default function MessagesPage() {
         <div className="modal-bg open" onClick={() => setAddingId(null)}>
           <div className="modal" onClick={(e) => e.stopPropagation()}>
             <h3>Add contact</h3>
-            <form onSubmit={(e) => { e.preventDefault(); if (!addName.trim()) return; const target = data?.messages?.find((x: any) => x.id === addingId); const targetNum = target ? (target.callerid || "").replace(/[^\d+]/g, "") : ""; addContact.mutate({ name: addName.trim(), number: targetNum, email: addEmail.trim() || null }); }}>
+            <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 }); }}>
               <label>Name</label>
               <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>
               <input type="email" value={addEmail} onChange={(e) => setAddEmail(e.target.value)} />
               <div className="row">