From 95167a19df5666be1c119013c712e4279b7da009 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Sat, 22 Jul 2023 13:07:50 +0530
Subject: [PATCH] fix: remove store from each control

---
 .../public/js/form_builder/components/FieldProperties.vue | 1 +
 .../js/form_builder/components/controls/CheckControl.vue  | 6 ++----
 .../js/form_builder/components/controls/CodeControl.vue   | 8 +++-----
 .../js/form_builder/components/controls/DataControl.vue   | 6 ++----
 .../form_builder/components/controls/FetchFromControl.vue | 5 +++--
 .../js/form_builder/components/controls/LinkControl.vue   | 6 ++----
 .../js/form_builder/components/controls/SelectControl.vue | 6 ++----
 .../js/form_builder/components/controls/TextControl.vue   | 6 ++----
 8 files changed, 17 insertions(+), 27 deletions(-)

diff --git a/frappe/public/js/form_builder/components/FieldProperties.vue b/frappe/public/js/form_builder/components/FieldProperties.vue
index 2018dd8c7e..44690df8a6 100644
--- a/frappe/public/js/form_builder/components/FieldProperties.vue
+++ b/frappe/public/js/form_builder/components/FieldProperties.vue
@@ -73,6 +73,7 @@ let docfield_df = computed(() => {
 					:is="df.fieldtype.replace(' ', '') + 'Control'"
 					:args="args"
 					:df="df"
+					:read_only="store.read_only"
 					:value="store.form.selected_field[df.fieldname]"
 					v-model="store.form.selected_field[df.fieldname]"
 					:data-fieldname="df.fieldname"
diff --git a/frappe/public/js/form_builder/components/controls/CheckControl.vue b/frappe/public/js/form_builder/components/controls/CheckControl.vue
index 8052e979ba..023bcebf66 100644
--- a/frappe/public/js/form_builder/components/controls/CheckControl.vue
+++ b/frappe/public/js/form_builder/components/controls/CheckControl.vue
@@ -1,9 +1,7 @@
 <script setup>
-import { useStore } from "../../store";
 import { useSlots } from "vue";
 
-let store = useStore();
-const props = defineProps(["df", "value"]);
+const props = defineProps(["df", "value", "read_only"]);
 let slots = useSlots();
 </script>
 
@@ -21,7 +19,7 @@ let slots = useSlots();
 			<input
 				type="checkbox"
 				:checked="value"
-				:disabled="store.read_only || df.read_only"
+				:disabled="read_only"
 				@change="event => $emit('update:modelValue', event.target.checked)"
 			/>
 			<span class="label-area" :class="{ reqd: df.reqd }">{{ df.label }}</span>
diff --git a/frappe/public/js/form_builder/components/controls/CodeControl.vue b/frappe/public/js/form_builder/components/controls/CodeControl.vue
index b8051a8f48..b0a45a442f 100644
--- a/frappe/public/js/form_builder/components/controls/CodeControl.vue
+++ b/frappe/public/js/form_builder/components/controls/CodeControl.vue
@@ -1,10 +1,8 @@
 <!-- Used as Code, HTML Editor, Markdown Editor & JSON Control -->
 <script setup>
 import { computed, onMounted, ref, useSlots, watch } from "vue";
-import { useStore } from "../../store";
 
-let store = useStore();
-const props = defineProps(["df", "modelValue"]);
+const props = defineProps(["df", "read_only", "modelValue"]);
 let emit = defineEmits(["update:modelValue"]);
 let slots = useSlots();
 
@@ -25,7 +23,7 @@ onMounted(() => {
 				...props.df,
 				fieldtype: "Code",
 				hidden: 0,
-				read_only: store.read_only,
+				read_only: props.read_only,
 				change: () => {
 					if (update_control.value) {
 						content.value = code_control.value.get_value();
@@ -34,7 +32,7 @@ onMounted(() => {
 				}
 			},
 			value: content.value,
-			disabled: Boolean(slots.label) || store.read_only,
+			disabled: Boolean(slots.label) || props.read_only,
 			render_input: true,
 			only_input: Boolean(slots.label),
 		});
diff --git a/frappe/public/js/form_builder/components/controls/DataControl.vue b/frappe/public/js/form_builder/components/controls/DataControl.vue
index fcbc5d9c77..75e86720d1 100644
--- a/frappe/public/js/form_builder/components/controls/DataControl.vue
+++ b/frappe/public/js/form_builder/components/controls/DataControl.vue
@@ -1,10 +1,8 @@
 <!-- Used as Autocomplete, Barcode, Color, Currency, Data, Date, Duration, Link, Dynamic Link, Float, Int, Password, Percent, Time, Read Only, HTML Control -->
 <script setup>
-import { useStore } from "../../store";
 import { ref, useSlots } from "vue";
 
-let store = useStore();
-const props = defineProps(["df", "value"]);
+const props = defineProps(["df", "value", "read_only"]);
 let slots = useSlots();
 let time_zone = ref("");
 let placeholder = ref("");
@@ -50,7 +48,7 @@ if (props.df.fieldtype === "Icon") {
 			class="form-control"
 			type="text"
 			:value="value"
-			:disabled="store.read_only || df.read_only"
+			:disabled="read_only"
 			@input="event => $emit('update:modelValue', event.target.value)"
 		/>
 		<input
diff --git a/frappe/public/js/form_builder/components/controls/FetchFromControl.vue b/frappe/public/js/form_builder/components/controls/FetchFromControl.vue
index 526ce48efb..7349ba43e5 100644
--- a/frappe/public/js/form_builder/components/controls/FetchFromControl.vue
+++ b/frappe/public/js/form_builder/components/controls/FetchFromControl.vue
@@ -5,7 +5,7 @@ import { ref, computed, watch } from "vue";
 import { computedAsync } from "@vueuse/core";
 
 let store = useStore();
-const props = defineProps(["df", "value", "modelValue"]);
+const props = defineProps(["df", "value", "read_only", "modelValue"]);
 let emit = defineEmits(["update:modelValue"]);
 
 let doctype = ref("");
@@ -76,10 +76,11 @@ watch([() => doctype.value, () => fieldname.value], ([doctype_value, fieldname_v
 </script>
 
 <template>
-	<SelectControl :df="doctype_df" :value="doctype" v-model="doctype" />
+	<SelectControl :df="doctype_df" :value="doctype" :read_only="read_only" v-model="doctype" />
 	<SelectControl
 		v-if="doctype"
 		:df="field_df"
+		:read_only="read_only"
 		:value="fieldname"
 		v-model="fieldname"
 		:no_label="true"
diff --git a/frappe/public/js/form_builder/components/controls/LinkControl.vue b/frappe/public/js/form_builder/components/controls/LinkControl.vue
index 8c1f73f255..09ed47dc5a 100644
--- a/frappe/public/js/form_builder/components/controls/LinkControl.vue
+++ b/frappe/public/js/form_builder/components/controls/LinkControl.vue
@@ -1,10 +1,8 @@
 <!-- Used as Link Control -->
 <script setup>
 import { onMounted, ref, useSlots, computed, watch } from "vue";
-import { useStore } from "../../store";
 
-let store = useStore();
-const props = defineProps(["args", "df", "modelValue"]);
+const props = defineProps(["args", "df", "read_only", "modelValue"]);
 let emit = defineEmits(["update:modelValue"]);
 let slots = useSlots();
 
@@ -39,7 +37,7 @@ onMounted(() => {
 			df: {
 				...props.df,
 				hidden: 0,
-				read_only: Boolean(slots.label) || store.read_only,
+				read_only: Boolean(slots.label) || props.read_only,
 				change: () => {
 					if (update_control.value) {
 						content.value = link_control.value.get_value();
diff --git a/frappe/public/js/form_builder/components/controls/SelectControl.vue b/frappe/public/js/form_builder/components/controls/SelectControl.vue
index de7bf2d096..858bd8a192 100644
--- a/frappe/public/js/form_builder/components/controls/SelectControl.vue
+++ b/frappe/public/js/form_builder/components/controls/SelectControl.vue
@@ -1,9 +1,7 @@
 <script setup>
-import { useStore } from "../../store";
 import { useSlots, onMounted, ref, computed, watch } from "vue";
 
-let store = useStore();
-const props = defineProps(["df", "modelValue", "no_label"]);
+const props = defineProps(["df", "read_only", "modelValue", "no_label"]);
 let emit = defineEmits(["update:modelValue"]);
 let slots = useSlots();
 
@@ -48,7 +46,7 @@ let select_control = computed(() => {
 			fieldtype: "Select",
 			hidden: 0,
 			options: get_options(),
-			read_only: Boolean(slots.label) || store.read_only,
+			read_only: Boolean(slots.label) || props.read_only,
 			change: () => {
 				if (update_control.value) {
 					content.value = select_control.value.get_value();
diff --git a/frappe/public/js/form_builder/components/controls/TextControl.vue b/frappe/public/js/form_builder/components/controls/TextControl.vue
index afcd409cd2..38e9347d4f 100644
--- a/frappe/public/js/form_builder/components/controls/TextControl.vue
+++ b/frappe/public/js/form_builder/components/controls/TextControl.vue
@@ -1,10 +1,8 @@
 <!-- Used as Text, Small Text & Long Text Control -->
 <script setup>
-import { useStore } from "../../store";
 import { useSlots, computed } from "vue";
 
-let store = useStore();
-const props = defineProps(["df", "value", "modelValue"]);
+const props = defineProps(["df", "value", "read_only", "modelValue"]);
 let emit = defineEmits(["update:modelValue"]);
 let slots = useSlots();
 
@@ -39,7 +37,7 @@ let height = computed(() => {
 			class="form-control"
 			type="text"
 			:value="value"
-			:disabled="store.read_only || df.read_only"
+			:disabled="read_only || df.read_only"
 			@input="event => $emit('update:modelValue', event.target.value)"
 		/>