From a16bccb10884444e964d68232c1785c937f16063 Mon Sep 17 00:00:00 2001
From: Harsh Tandiya <harsh.tandiya@gmail.com>
Date: Mon, 27 Jul 2026 00:30:55 +0530
Subject: [PATCH] chore: replace FormControl with PhoneInput component for
 phone field (#287)

* fix: use PhoneInput on Edit Proposal dialog

Swap the plain FormControl (type=tel) phone field in ProposalEditDialog.vue
for the shared PhoneInput component so the dial code and number are edited
separately and saved in Frappe's canonical {isd}-{number} format.

This fixes values being saved without the isd- prefix (which render blank
in Desk's Phone field, same class of bug as #244) and prevents casual edits
of existing hyphen-formatted values from corrupting the format.

Fixes #275

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01FZ7AVqnfjnXPQbHQd3RVkK

* fix: phone input style

---------

Co-authored-by: Claude <noreply@anthropic.com>
(cherry picked from commit 40757c12aca5cefe1dced5568dfdaebcab794039)
---
 dashboard/src/components/PhoneInput.vue         | 17 ++++++++---------
 dashboard/src/components/ProposalEditDialog.vue |  4 ++--
 2 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/dashboard/src/components/PhoneInput.vue b/dashboard/src/components/PhoneInput.vue
index 730b0c28..118d5aa6 100644
--- a/dashboard/src/components/PhoneInput.vue
+++ b/dashboard/src/components/PhoneInput.vue
@@ -5,15 +5,14 @@
 			<span v-if="required" class="text-ink-red-8">*</span>
 		</label>
 		<div class="flex gap-1.5">
-			<div class="w-24 shrink-0">
-				<Combobox
-					:model-value="null"
-					@update:model-value="onDialCodeChange"
-					:options="dialCodeOptions"
-					variant="outline"
-					:placeholder="shortDisplay"
-				/>
-			</div>
+			<Combobox
+				class="w-26"
+				:model-value="null"
+				@update:model-value="onDialCodeChange"
+				:options="dialCodeOptions"
+				variant="outline"
+				:placeholder="shortDisplay"
+			/>
 			<TextInput
 				type="tel"
 				:model-value="localNumber"
diff --git a/dashboard/src/components/ProposalEditDialog.vue b/dashboard/src/components/ProposalEditDialog.vue
index 4829d38f..be5211ba 100644
--- a/dashboard/src/components/ProposalEditDialog.vue
+++ b/dashboard/src/components/ProposalEditDialog.vue
@@ -33,9 +33,8 @@
 				</Editor>
 			</div>
 
-			<FormControl
+			<PhoneInput
 				v-if="!eventTalkId"
-				type="tel"
 				:label="__('Phone (optional)')"
 				:placeholder="__('Enter phone number')"
 				v-model="editForm.phone"
@@ -60,6 +59,7 @@
 </template>
 
 <script setup lang="ts">
+import PhoneInput from "@/components/PhoneInput.vue";
 import type { FrappeError } from "@/types";
 import { Button, Dialog, FormControl, createResource, toast } from "frappe-ui";
 import {