From 31f3bddb34fca91aaedf44ea97bcdb53dcfe14a2 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Mon, 1 Aug 2022 15:01:37 +0530
Subject: [PATCH 1/5] refactor/gui-v2-added-phonenumber-cell

---
 .../nc-gui-v2/components/cell/PhoneNumber.vue | 31 +++++++++++++++++++
 .../nc-gui-v2/components/smartsheet/Cell.vue  |  2 ++
 packages/nc-gui-v2/composables/useColumn.ts   |  2 ++
 3 files changed, 35 insertions(+)
 create mode 100644 packages/nc-gui-v2/components/cell/PhoneNumber.vue

diff --git a/packages/nc-gui-v2/components/cell/PhoneNumber.vue b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
new file mode 100644
index 0000000000..38e2dc3d1b
--- /dev/null
+++ b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import Text from './Text.vue'
+import { computed } from '#imports'
+
+interface Props {
+  modelValue: any
+}
+
+const { modelValue: value } = defineProps<Props>()
+
+const emit = defineEmits(['update:modelValue'])
+
+const localState = computed({
+  get: () => value,
+  set: (val) => emit('update:modelValue', val),
+})
+</script>
+
+<template>
+  <Text v-model="localState" />
+</template>
+
+<style scoped>
+input,
+textarea {
+  width: 100%;
+  height: 100%;
+  color: var(--v-textColor-base);
+  outline: none;
+}
+</style>
diff --git a/packages/nc-gui-v2/components/smartsheet/Cell.vue b/packages/nc-gui-v2/components/smartsheet/Cell.vue
index 119501e22d..4469bea05c 100644
--- a/packages/nc-gui-v2/components/smartsheet/Cell.vue
+++ b/packages/nc-gui-v2/components/smartsheet/Cell.vue
@@ -46,6 +46,7 @@ const {
   isSingleSelect,
   isMultiSelect,
   isPercent,
+  isPhoneNumber,
 } = useColumn(column)
 </script>
 
@@ -183,6 +184,7 @@ todo :
     <CellDuration v-else-if="isDuration" v-model="localState" />
     <CellEmail v-else-if="isEmail" v-model="localState" />
     <CellUrl v-else-if="isURL" v-model="localState" />
+    <CellPhoneNumber v-else-if="isPhoneNumber" v-model="localState" />
     <!-- v-on="parentListeners"
         />
     -->
diff --git a/packages/nc-gui-v2/composables/useColumn.ts b/packages/nc-gui-v2/composables/useColumn.ts
index f71afb6015..cb125fd365 100644
--- a/packages/nc-gui-v2/composables/useColumn.ts
+++ b/packages/nc-gui-v2/composables/useColumn.ts
@@ -30,6 +30,7 @@ export function useColumn(column: ColumnType) {
   const isAttachment = uiDatatype === 'Attachment'
   const isRating = uiDatatype === UITypes.Rating
   const isCurrency = uiDatatype === 'Currency'
+  const isPhoneNumber = uiDatatype === 'PhoneNumber'
   const isDuration = uiDatatype === UITypes.Duration
   const isPercent = uiDatatype === UITypes.Percent
   const isAutoSaved = [
@@ -74,5 +75,6 @@ export function useColumn(column: ColumnType) {
     isSingleSelect,
     isMultiSelect,
     isPercent,
+    isPhoneNumber,
   }
 }

From b1fecd85b5b85fc5360291b1613741cac6e2d6df Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Mon, 1 Aug 2022 19:22:26 +0530
Subject: [PATCH 2/5] chore/gui-v2-phonenumber-cleanup

---
 packages/nc-gui-v2/components/cell/PhoneNumber.vue | 14 +++-----------
 1 file changed, 3 insertions(+), 11 deletions(-)

diff --git a/packages/nc-gui-v2/components/cell/PhoneNumber.vue b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
index 38e2dc3d1b..3aa0a67a10 100644
--- a/packages/nc-gui-v2/components/cell/PhoneNumber.vue
+++ b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
@@ -10,22 +10,14 @@ const { modelValue: value } = defineProps<Props>()
 
 const emit = defineEmits(['update:modelValue'])
 
-const localState = computed({
+const VModal = computed({
   get: () => value,
   set: (val) => emit('update:modelValue', val),
 })
 </script>
 
 <template>
-  <Text v-model="localState" />
+  <Text v-model="VModal" />
 </template>
 
-<style scoped>
-input,
-textarea {
-  width: 100%;
-  height: 100%;
-  color: var(--v-textColor-base);
-  outline: none;
-}
-</style>
+<style scoped></style>

From 759f35acfa77ff41d4acb9174636dfd8d1ba9699 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Mon, 1 Aug 2022 19:45:17 +0530
Subject: [PATCH 3/5] chore/gui-v2-phonenumber-added-icon-for-column-cell

---
 packages/nc-gui-v2/components/smartsheet-header/CellIcon.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/nc-gui-v2/components/smartsheet-header/CellIcon.vue b/packages/nc-gui-v2/components/smartsheet-header/CellIcon.vue
index 45551d4d47..cab337fbdc 100644
--- a/packages/nc-gui-v2/components/smartsheet-header/CellIcon.vue
+++ b/packages/nc-gui-v2/components/smartsheet-header/CellIcon.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { ColumnType } from 'nocodb-sdk'
 import { ColumnInj } from '~/context'
+import FilePhoneIcon from '~icons/mdi/file-phone'
 import { useColumn } from '#imports'
 import KeyIcon from '~icons/mdi/key-variant'
 import JSONIcon from '~icons/mdi/code-json'
@@ -52,6 +53,8 @@ const icon = computed(() => {
     return AttachmentIcon
   } else if (additionalColMeta.isInt || additionalColMeta.isFloat) {
     return NumericIcon
+  } else if (additionalColMeta.isPhoneNumber) {
+    return FilePhoneIcon
   }
   // else if(additionalColMeta.isForeignKey) {
   //   return FKIcon

From 30006b93fc7f138b6dade3bba8f4b6ff5ef71b02 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Mon, 1 Aug 2022 22:17:19 +0530
Subject: [PATCH 4/5] fix/gui-v2-phonenumber-integrated-vmodel

---
 .../nc-gui-v2/components/cell/PhoneNumber.vue   | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/nc-gui-v2/components/cell/PhoneNumber.vue b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
index 3aa0a67a10..b47c56ffcf 100644
--- a/packages/nc-gui-v2/components/cell/PhoneNumber.vue
+++ b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
@@ -1,23 +1,24 @@
 <script setup lang="ts">
 import Text from './Text.vue'
-import { computed } from '#imports'
 
 interface Props {
   modelValue: any
 }
 
-const { modelValue: value } = defineProps<Props>()
+interface Emits {
+  (event: 'update:modelValue', model: number): void
+}
+
+const props = defineProps<Props>()
+
+const emits = defineEmits<Emits>()
 
-const emit = defineEmits(['update:modelValue'])
+const vModel = useVModel(props, 'modelValue', emits)
 
-const VModal = computed({
-  get: () => value,
-  set: (val) => emit('update:modelValue', val),
-})
 </script>
 
 <template>
-  <Text v-model="VModal" />
+  <Text v-model="vModel" />
 </template>
 
 <style scoped></style>

From 86a85d1f3f95ac430efae542721fa31da92c8e70 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Tue, 2 Aug 2022 11:10:13 +0530
Subject: [PATCH 5/5] fix/gui-v2-phonenumber-model-type-changed

---
 packages/nc-gui-v2/components/cell/PhoneNumber.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/nc-gui-v2/components/cell/PhoneNumber.vue b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
index b47c56ffcf..d40fb3ae12 100644
--- a/packages/nc-gui-v2/components/cell/PhoneNumber.vue
+++ b/packages/nc-gui-v2/components/cell/PhoneNumber.vue
@@ -6,7 +6,7 @@ interface Props {
 }
 
 interface Emits {
-  (event: 'update:modelValue', model: number): void
+  (event: 'update:modelValue', model: string): void
 }
 
 const props = defineProps<Props>()
@@ -14,7 +14,6 @@ const props = defineProps<Props>()
 const emits = defineEmits<Emits>()
 
 const vModel = useVModel(props, 'modelValue', emits)
-
 </script>
 
 <template>