From 6e60ba6900b6329168447af74af49a4660214d6e Mon Sep 17 00:00:00 2001
From: Rucha Mahabal <ruchamahabal2@gmail.com>
Date: Wed, 30 Oct 2024 11:21:30 +0530
Subject: [PATCH 1/6] fix(PWA): broken translation strings

---
 frontend/src/components/SalarySlipItem.vue | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/SalarySlipItem.vue b/frontend/src/components/SalarySlipItem.vue
index 4455f2a7e8..ced288400e 100644
--- a/frontend/src/components/SalarySlipItem.vue
+++ b/frontend/src/components/SalarySlipItem.vue
@@ -8,10 +8,12 @@
 				</div>
 				<div class="text-xs font-normal text-gray-500">
 					<span>
-						{{ __("{0}: {1}", null, [
+						{{
+							__("{0}: {1}", [
 								__("Gross Pay"),
 								formatCurrency(doc.gross_pay, doc.currency),
-							]) }}
+							])
+						}}
 					</span>
 					<span class="whitespace-pre"> &middot; </span>
 				</div>
@@ -49,9 +51,9 @@ const title = computed(() => {
 		return dayjs(props.doc.start_date).format("MMM YYYY")
 	} else {
 		// quarterly, bimonthly, etc
-		return `${dayjs(props.doc.start_date).format("MMM YYYY")} - ${dayjs(props.doc.end_date).format(
-			"MMM YYYY"
-		)}`
+		return `${dayjs(props.doc.start_date).format("MMM YYYY")} - ${dayjs(
+			props.doc.end_date
+		).format("MMM YYYY")}`
 	}
 })
 </script>

From 0fbe4a4a5be37b0983d6d1519e07a0da208c5e96 Mon Sep 17 00:00:00 2001
From: Rucha Mahabal <ruchamahabal2@gmail.com>
Date: Wed, 30 Oct 2024 15:04:31 +0530
Subject: [PATCH 2/6] fix(PWA): broken translation strings in expense tables

---
 frontend/src/components/ExpenseItems.vue  | 10 ++++++----
 frontend/src/components/ExpensesTable.vue | 10 ++++++----
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/ExpenseItems.vue b/frontend/src/components/ExpenseItems.vue
index 49f2117a1f..55c9fc57e4 100644
--- a/frontend/src/components/ExpenseItems.vue
+++ b/frontend/src/components/ExpenseItems.vue
@@ -18,10 +18,12 @@
 							</div>
 							<div class="text-xs font-normal text-gray-500">
 								<span>
-									{{ __("{0}: {1}", null, [
-										__("Sanctioned"),
-										formatCurrency(item.sanctioned_amount || 0, currency),
-									]) }}
+									{{
+										__("{0}: {1}", [
+											__("Sanctioned"),
+											formatCurrency(item.sanctioned_amount || 0, currency),
+										])
+									}}
 								</span>
 								<span class="whitespace-pre"> &middot; </span>
 								<span class="whitespace-nowrap" v-if="item.expense_date">
diff --git a/frontend/src/components/ExpensesTable.vue b/frontend/src/components/ExpensesTable.vue
index 7290874d2a..ebd9ce196c 100644
--- a/frontend/src/components/ExpensesTable.vue
+++ b/frontend/src/components/ExpensesTable.vue
@@ -37,10 +37,12 @@
 							</div>
 							<div class="text-xs font-normal text-gray-500">
 								<span>
-									{{ __("{0}: {1}", null, [
-										__("Sanctioned"),
-										formatCurrency(item.sanctioned_amount || 0, currency),
-									]) }}
+									{{
+										__("{0}: {1}", [
+											__("Sanctioned"),
+											formatCurrency(item.sanctioned_amount || 0, currency),
+										])
+									}}
 								</span>
 								<span class="whitespace-pre"> &middot; </span>
 								<span class="whitespace-nowrap" v-if="item.expense_date">

From 59d753f6d020022f20e140e51d60df1c44f71c06 Mon Sep 17 00:00:00 2001
From: Rucha Mahabal <ruchamahabal2@gmail.com>
Date: Wed, 30 Oct 2024 15:05:46 +0530
Subject: [PATCH 3/6] fix: translation function used without injecting

---
 frontend/src/components/AttendanceCalendar.vue        | 1 +
 frontend/src/components/ExpenseTaxesTable.vue         | 3 ++-
 frontend/src/components/FormView.vue                  | 2 ++
 frontend/src/components/WorkflowActionSheet.vue       | 5 ++++-
 frontend/src/views/attendance/ShiftAssignmentList.vue | 3 +++
 5 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/AttendanceCalendar.vue b/frontend/src/components/AttendanceCalendar.vue
index cc725044f1..1c5d45c501 100644
--- a/frontend/src/components/AttendanceCalendar.vue
+++ b/frontend/src/components/AttendanceCalendar.vue
@@ -65,6 +65,7 @@ import { createResource } from "frappe-ui"
 
 const dayjs = inject("$dayjs")
 const employee = inject("$employee")
+const __ = inject("$translate")
 const firstOfMonth = ref(dayjs().date(1).startOf("D"))
 
 const colorMap = {
diff --git a/frontend/src/components/ExpenseTaxesTable.vue b/frontend/src/components/ExpenseTaxesTable.vue
index 984cbd56c5..581848f605 100644
--- a/frontend/src/components/ExpenseTaxesTable.vue
+++ b/frontend/src/components/ExpenseTaxesTable.vue
@@ -127,7 +127,7 @@
 
 <script setup>
 import { FeatherIcon, createResource } from "frappe-ui"
-import { computed, ref, watch } from "vue"
+import { computed, ref, watch, inject } from "vue"
 
 import FormField from "@/components/FormField.vue"
 import EmptyState from "@/components/EmptyState.vue"
@@ -154,6 +154,7 @@ const emit = defineEmits([
 	"update-expense-tax",
 	"delete-expense-tax",
 ])
+const __ = inject("$translate")
 const expenseTax = ref({})
 const editingIdx = ref(null)
 
diff --git a/frontend/src/components/FormView.vue b/frontend/src/components/FormView.vue
index ab8624e57b..be44093366 100644
--- a/frontend/src/components/FormView.vue
+++ b/frontend/src/components/FormView.vue
@@ -377,7 +377,9 @@ const props = defineProps({
 })
 const emit = defineEmits(["validateForm", "update:modelValue"])
 const router = useRouter()
+
 const __ = inject("$translate")
+
 let activeTab = ref(props.tabs?.[0].name)
 let fileAttachments = ref([])
 let statusColor = ref("")
diff --git a/frontend/src/components/WorkflowActionSheet.vue b/frontend/src/components/WorkflowActionSheet.vue
index 343e0225fc..5dd5a70a40 100644
--- a/frontend/src/components/WorkflowActionSheet.vue
+++ b/frontend/src/components/WorkflowActionSheet.vue
@@ -45,8 +45,9 @@
 
 <script setup>
 import { IonActionSheet, modalController } from "@ionic/vue"
-import { computed, ref, onMounted } from "vue"
+import { computed, ref, onMounted, inject } from "vue"
 import { FeatherIcon } from "frappe-ui"
+
 const props = defineProps({
 	doc: {
 		type: Object,
@@ -68,6 +69,8 @@ const emit = defineEmits(["workflow-applied"])
 let showActionSheet = ref(false)
 let actions = ref([])
 
+const __ = inject("$translate")
+
 const getTransitions = async () => {
 	const transitions = await props.workflow.getTransitions(props.doc)
 	actions.value = transitions.map((transition) => {
diff --git a/frontend/src/views/attendance/ShiftAssignmentList.vue b/frontend/src/views/attendance/ShiftAssignmentList.vue
index ed659a8a60..0141958e3d 100644
--- a/frontend/src/views/attendance/ShiftAssignmentList.vue
+++ b/frontend/src/views/attendance/ShiftAssignmentList.vue
@@ -10,9 +10,12 @@
 </template>
 
 <script setup>
+import { inject } from "vue"
 import { IonPage } from "@ionic/vue"
 import ListView from "@/components/ListView.vue"
 
+const __ = inject("$translate")
+
 const SHIFT_ASSIGNMENT_FIELDS = ["name", "shift_type", "start_date", "end_date", "docstatus"]
 const FILTER_CONFIG = [
 	{

From 3fa44d40d3d57bacc1dc94a9ddd0128c47bbc1ff Mon Sep 17 00:00:00 2001
From: Rucha Mahabal <ruchamahabal2@gmail.com>
Date: Wed, 30 Oct 2024 16:27:36 +0530
Subject: [PATCH 4/6] chore: fix formatting

---
 frontend/src/components/EmployeeAdvanceItem.vue | 2 +-
 frontend/src/components/ExpenseItems.vue        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/EmployeeAdvanceItem.vue b/frontend/src/components/EmployeeAdvanceItem.vue
index 309d0aeaea..5349601c58 100644
--- a/frontend/src/components/EmployeeAdvanceItem.vue
+++ b/frontend/src/components/EmployeeAdvanceItem.vue
@@ -41,7 +41,7 @@ import { computed, inject } from "vue"
 
 import ListItem from "@/components/ListItem.vue"
 import EmployeeAdvanceIcon from "@/components/icons/EmployeeAdvanceIcon.vue"
-import { formatCurrency } from "@/utils/formatters";
+import { formatCurrency } from "@/utils/formatters"
 
 const dayjs = inject("$dayjs")
 const props = defineProps({
diff --git a/frontend/src/components/ExpenseItems.vue b/frontend/src/components/ExpenseItems.vue
index 55c9fc57e4..fbe22fd0ca 100644
--- a/frontend/src/components/ExpenseItems.vue
+++ b/frontend/src/components/ExpenseItems.vue
@@ -45,7 +45,7 @@
 import { computed, inject } from "vue"
 
 import { getCompanyCurrency } from "@/data/currencies"
-import { formatCurrency } from "@/utils/formatters";
+import { formatCurrency } from "@/utils/formatters"
 
 const props = defineProps({
 	doc: {

From 96a05bfa8fe727357adf4c0d21068e480215e900 Mon Sep 17 00:00:00 2001
From: Rucha Mahabal <ruchamahabal2@gmail.com>
Date: Wed, 30 Oct 2024 16:54:49 +0530
Subject: [PATCH 5/6] fix: translate passed message in EmptyState component
 instead of translating it everywhere

---
 frontend/src/components/EmptyState.vue             | 2 +-
 frontend/src/components/ExpenseAdvancesTable.vue   | 2 +-
 frontend/src/components/FormField.vue              | 2 +-
 frontend/src/components/ListView.vue               | 2 +-
 frontend/src/components/RequestList.vue            | 2 +-
 frontend/src/views/attendance/ShiftRequestList.vue | 2 ++
 frontend/src/views/salary_slip/Dashboard.vue       | 2 +-
 7 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/EmptyState.vue b/frontend/src/components/EmptyState.vue
index 6589702e3b..132041165b 100644
--- a/frontend/src/components/EmptyState.vue
+++ b/frontend/src/components/EmptyState.vue
@@ -5,7 +5,7 @@
 			props.isTableField ? 'border-2 border-dashed border-gray-300 mt-5' : '',
 		]"
 	>
-		{{ props.message }}
+		{{ __(props.message) }}
 	</div>
 </template>
 
diff --git a/frontend/src/components/ExpenseAdvancesTable.vue b/frontend/src/components/ExpenseAdvancesTable.vue
index 5babbaba80..14f57f8348 100644
--- a/frontend/src/components/ExpenseAdvancesTable.vue
+++ b/frontend/src/components/ExpenseAdvancesTable.vue
@@ -60,7 +60,7 @@
 		</div>
 	</div>
 
-	<EmptyState v-else :message="__('No advances found')" :isTableField="true" />
+	<EmptyState v-else message="No advances found" :isTableField="true" />
 </template>
 
 <script setup>
diff --git a/frontend/src/components/FormField.vue b/frontend/src/components/FormField.vue
index ca92e9de29..ac46cf99c6 100644
--- a/frontend/src/components/FormField.vue
+++ b/frontend/src/components/FormField.vue
@@ -133,7 +133,7 @@
 			:disabled="isReadOnly"
 		/>
 
-		<ErrorMessage :message="__(props.errorMessage)" />
+		<ErrorMessage :message="props.errorMessage" />
 	</div>
 </template>
 
diff --git a/frontend/src/components/ListView.vue b/frontend/src/components/ListView.vue
index 5a37da7418..57559a4be9 100644
--- a/frontend/src/components/ListView.vue
+++ b/frontend/src/components/ListView.vue
@@ -90,7 +90,7 @@
 					</div>
 				</div>
 				<EmptyState
-					:message="__('No {0} found', [__(props.doctype)])"
+					:message="`No ${props.doctype?.toLowerCase()}s found`"
 					v-else-if="!documents.loading"
 				/>
 
diff --git a/frontend/src/components/RequestList.vue b/frontend/src/components/RequestList.vue
index 6ac70546df..5aed5eac4c 100644
--- a/frontend/src/components/RequestList.vue
+++ b/frontend/src/components/RequestList.vue
@@ -28,7 +28,7 @@
 			</Button>
 		</router-link>
 	</div>
-	<EmptyState :message="emptyStateMessage || __('You have no requests')" v-else />
+	<EmptyState :message="emptyStateMessage || 'You have no requests'" v-else />
 
 	<ion-modal
 		ref="modal"
diff --git a/frontend/src/views/attendance/ShiftRequestList.vue b/frontend/src/views/attendance/ShiftRequestList.vue
index f6532b1489..c8eeed3a0d 100644
--- a/frontend/src/views/attendance/ShiftRequestList.vue
+++ b/frontend/src/views/attendance/ShiftRequestList.vue
@@ -11,9 +11,11 @@
 </template>
 
 <script setup>
+import { inject } from "vue"
 import { IonPage } from "@ionic/vue"
 import ListView from "@/components/ListView.vue"
 
+const __ = inject("$translate")
 const TAB_BUTTONS = ["My Requests", "Team Requests"]
 const SHIFT_REQUEST_FIELDS = [
 	"name",
diff --git a/frontend/src/views/salary_slip/Dashboard.vue b/frontend/src/views/salary_slip/Dashboard.vue
index 80f0312fa7..51ad8f3871 100644
--- a/frontend/src/views/salary_slip/Dashboard.vue
+++ b/frontend/src/views/salary_slip/Dashboard.vue
@@ -47,7 +47,7 @@
 							</router-link>
 						</div>
 					</div>
-					<EmptyState :message="__('No salary slips found')" v-else />
+					<EmptyState message="No salary slips found" v-else />
 				</div>
 			</div>
 		</template>

From a49b14c05c5aec123be2a47f25b79b31b580ac6b Mon Sep 17 00:00:00 2001
From: Rucha Mahabal <ruchamahabal2@gmail.com>
Date: Wed, 30 Oct 2024 17:16:46 +0530
Subject: [PATCH 6/6] refactor: simplify translated messages in request action
 sheet

---
 frontend/src/components/RequestActionSheet.vue | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/RequestActionSheet.vue b/frontend/src/components/RequestActionSheet.vue
index 98248d1f44..fba2e51c85 100644
--- a/frontend/src/components/RequestActionSheet.vue
+++ b/frontend/src/components/RequestActionSheet.vue
@@ -276,18 +276,21 @@ const approvalField = computed(() => {
 })
 
 const getSuccessMessage = ({ status = "", docstatus = 0 }) => {
-	if (status) return __([status], __('{0} successfully!'))
-	else if (docstatus)
-		return __('Document {0}', [
+	if (status) {
+		return __("{0} successfully!", [__(status)])
+	} else if (docstatus) {
+		return __("Document {0} successfully!", [
 			docstatus === 1 ? __("submitted") : __("cancelled")]
-			, __('successfully!'))
+		)
+	}
 }
 
 const getFailureMessage = ({ status = "", docstatus = 0 }) => {
-	if (status)
-		return __([status === __("Approved") ? __("Approval") : __("Rejection")], '{0}failed!')
-	else if (docstatus)
+	if (status) {
+		return __("{0} failed!", [status === __("Approved") ? __("Approval") : __("Rejection")])
+	} else if (docstatus) {
 		return __('Document {0} failed!', [docstatus === 1 ? __("submission") : __("cancellation")])
+	}
 }
 
 const updateDocumentStatus = ({ status = "", docstatus = 0 }) => {