frontend: prevent contacts content overflowing the viewport + sync UI repo

- ContactsPage: drop whiteSpace:nowrap on the action cell; wrap the
  Edit/History/Delete/⋮ buttons in a flex container with flex-wrap so they
  reflow instead of forcing the table wider than the viewport; allow the
  name/number/email cell to break long strings.
- index.css: td word-break:break-word + table max-width:100% as a guard.
- Sync the UI repo (ContactsPage/ContactHistory/MessagesPage implicit-any
  annotations that unblock npm run build) into the frontend/ mirror.

frontend/src/components/MessagesPage.tsx

@@ -70,7 +70,7 @@ export default function MessagesPage() {
       {isLoading && <div className="card empty">Loading...</div>}
       {error && <div className="card err">{(error as Error).message}</div>}
 
-      {data?.messages?.map((m) => {
+      {data?.messages?.map((m: any) => {
         const whoRaw = m.contact_name || m.callerid || "Unknown caller";
         const num = sanitiseNumber(m.callerid);
         const showAdd = !m.contact_name && num;
@@ -192,7 +192,7 @@ function MsgContactMenu({ number, name, callerid }: { number?: string; name?: st
             )}
             <a
               className="btn"
-              href={"https://who-called.co.uk/Number/" + lookup}
+              href={"https://www.google.com/search?q=uk+number+" + lookup}
               target="_blank"
               rel="noreferrer"
               style={{ display: "block", borderRadius: 0, border: "none", width: "100%", justifyContent: "flex-start" }}