From 097d5413910b718603bfac4ba6b10b33ceb3deeb Mon Sep 17 00:00:00 2001
From: Jannat Patel <pateljannat2308@gmail.com>
Date: Thu, 24 Apr 2025 14:20:51 +0530
Subject: [PATCH 1/3] feat: redesigned job list

---
 frontend/src/components/JobCard.vue           | 56 ++++++++++++++-----
 frontend/src/pages/JobDetail.vue              | 22 ++++----
 .../pages/{JobCreation.vue => JobForm.vue}    | 34 +++++------
 frontend/src/pages/Jobs.vue                   | 25 +++++++--
 frontend/src/router.js                        |  4 +-
 .../job_opportunity/job_opportunity.json      | 37 +++++++-----
 lms/lms/api.py                                |  5 ++
 7 files changed, 121 insertions(+), 62 deletions(-)
 rename frontend/src/pages/{JobCreation.vue => JobForm.vue} (91%)

diff --git a/frontend/src/components/JobCard.vue b/frontend/src/components/JobCard.vue
index 64cd0e01..b84186d4 100644
--- a/frontend/src/components/JobCard.vue
+++ b/frontend/src/components/JobCard.vue
@@ -1,22 +1,35 @@
 <template>
-	<div class="flex flex-col border rounded-md p-4 h-full">
+	<div
+		class="flex flex-col shadow-sm border rounded-md p-3 h-full hover:bg-surface-gray-2"
+	>
 		<div class="flex space-x-4 mb-2">
-			<img :src="job.company_logo" class="size-8 rounded-full object-contain" />
-			<div class="flex flex-col space-y-1 flex-1">
-				<div class="flex items-center justify-between">
-					<span class="text-lg font-semibold text-ink-gray-9">
-						{{ job.job_title }}
-					</span>
-				</div>
-				<div class="text-xs text-ink-gray-5">
+			<div class="flex flex-col space-y-2 flex-1">
+				<div class="text-lg font-semibold text-ink-gray-9">
 					{{ job.company_name }}
 				</div>
+				<span class="font-medium text-ink-gray-7">
+					{{ job.job_title }}
+				</span>
+				<div class="flex items-center space-x-1 text-sm text-ink-gray-7">
+					<MapPin class="size-3" />
+					<span>
+						{{ job.location }}
+					</span>
+				</div>
+				<div
+					v-if="job.applicants"
+					class="flex items-center space-x-1 text-sm text-ink-gray-7"
+				>
+					<User class="size-3" />
+					<span>
+						{{ job.applicants }}
+						{{ job.applicants > 1 ? __('applicants') : __('applicant') }}
+					</span>
+				</div>
 			</div>
+			<!-- <img :src="job.company_logo" alt="Company Logo" class="h-8 object-contain bg-white" /> -->
 		</div>
-		<div class="space-x-4 mt-auto">
-			<Badge>
-				{{ job.location }}
-			</Badge>
+		<div class="space-x-4 mt-2 mb-4">
 			<Badge>
 				{{ job.type }}
 			</Badge>
@@ -24,11 +37,16 @@
 				{{ dayjs(job.creation).fromNow() }}
 			</Badge>
 		</div>
+		<div
+			class="description text-ink-gray-9 text-sm"
+			v-html="job.description"
+		></div>
 	</div>
 </template>
 <script setup>
 import { inject } from 'vue'
 import { Badge } from 'frappe-ui'
+import { MapPin, User } from 'lucide-vue-next'
 
 const dayjs = inject('$dayjs')
 const props = defineProps({
@@ -38,3 +56,15 @@ const props = defineProps({
 	},
 })
 </script>
+<style>
+.description {
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+	text-overflow: ellipsis;
+	width: 100%;
+	overflow: hidden;
+	margin-top: auto;
+	line-height: 1.5;
+}
+</style>
diff --git a/frontend/src/pages/JobDetail.vue b/frontend/src/pages/JobDetail.vue
index 6c8fb519..e3247113 100644
--- a/frontend/src/pages/JobDetail.vue
+++ b/frontend/src/pages/JobDetail.vue
@@ -20,7 +20,7 @@
 				<router-link
 					v-if="user.data.name == job.data?.owner"
 					:to="{
-						name: 'JobCreation',
+						name: 'JobForm',
 						params: { jobName: job.data?.name },
 					}"
 				>
@@ -62,7 +62,7 @@
 					<div class="flex items-center">
 						<img
 							:src="job.data.company_logo"
-							class="w-16 h-16 rounded-lg object-contain cursor-pointer mr-4"
+							class="size-15 rounded-lg object-contain cursor-pointer mr-4"
 							:alt="job.data.company_name"
 							@click="redirectToWebsite(job.data.company_website)"
 						/>
@@ -75,7 +75,7 @@
 							class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-10 gap-y-5 md:gap-y-5"
 						>
 							<div class="flex items-center space-x-4">
-								<Building2 class="h-4 w-4 text-ink-green-2" />
+								<Building2 class="size-4 stroke-1.5 text-ink-gray-7" />
 								<div class="flex flex-col space-y-1 text-ink-gray-7">
 									<span class="text-xs text-ink-gray-5 font-medium uppercase">
 										{{ __('Organisation') }}
@@ -86,9 +86,9 @@
 								</div>
 							</div>
 							<div class="flex items-center space-x-4">
-								<MapPin class="size-4 text-ink-red-3" />
+								<MapPin class="size-4 stroke-1.5 text-ink-gray-7" />
 								<div class="flex flex-col space-y-1 text-ink-gray-7">
-									<span class="text-xs font-medium uppercase">
+									<span class="text-xs text-ink-gray-5 font-medium uppercase">
 										{{ __('Location') }}
 									</span>
 									<span class="text-sm font-semibold">
@@ -97,9 +97,9 @@
 								</div>
 							</div>
 							<div class="flex items-center space-x-4">
-								<ClipboardType class="h-4 w-4 text-yellow-500" />
+								<ClipboardType class="size-4 stroke-1.5 text-ink-gray-7" />
 								<div class="flex flex-col space-y-1 text-ink-gray-7">
-									<span class="text-xs font-medium uppercase">
+									<span class="text-xs text-ink-gray-5 font-medium uppercase">
 										{{ __('Category') }}
 									</span>
 									<span class="text-sm font-semibold">
@@ -108,9 +108,9 @@
 								</div>
 							</div>
 							<div class="flex items-center space-x-4">
-								<CalendarDays class="h-4 w-4 text-ink-blue-2" />
+								<CalendarDays class="size-4 stroke-1.5 text-ink-gray-7" />
 								<div class="flex flex-col space-y-1 text-ink-gray-7">
-									<span class="text-xs font-medium uppercase">
+									<span class="text-xs text-ink-gray-5 font-medium uppercase">
 										{{ __('Posted on') }}
 									</span>
 									<span class="text-sm font-semibold">
@@ -122,9 +122,9 @@
 								v-if="applicationCount.data"
 								class="flex items-center space-x-4"
 							>
-								<SquareUserRound class="h-4 w-4 text-purple-500" />
+								<SquareUserRound class="size-4 stroke-1.5 text-ink-gray-7" />
 								<div class="flex flex-col space-y-1 text-ink-gray-7">
-									<span class="text-xs font-medium uppercase">
+									<span class="text-xs text-ink-gray-5 font-medium uppercase">
 										{{ __('Applications Received') }}
 									</span>
 									<span class="text-sm font-semibold">
diff --git a/frontend/src/pages/JobCreation.vue b/frontend/src/pages/JobForm.vue
similarity index 91%
rename from frontend/src/pages/JobCreation.vue
rename to frontend/src/pages/JobForm.vue
index ba35148f..e4f5468f 100644
--- a/frontend/src/pages/JobCreation.vue
+++ b/frontend/src/pages/JobForm.vue
@@ -13,7 +13,7 @@
 				<div class="text-lg font-semibold mb-4">
 					{{ __('Job Details') }}
 				</div>
-				<div class="grid grid-cols-2 gap-4">
+				<div class="grid grid-cols-2 gap-5">
 					<div>
 						<FormControl
 							v-model="job.job_title"
@@ -45,25 +45,12 @@
 						/>
 					</div>
 				</div>
-				<div class="mt-4">
-					<label class="block text-ink-gray-5 text-xs mb-1">
-						{{ __('Description') }}
-						<span class="text-ink-red-3">*</span>
-					</label>
-					<TextEditor
-						:content="job.description"
-						@change="(val) => (job.description = val)"
-						:editable="true"
-						:fixedMenu="true"
-						editorClass="prose-sm max-w-none border-b border-x bg-surface-gray-2 rounded-b-md py-1 px-2 min-h-[7rem] mb-4"
-					/>
-				</div>
 			</div>
-			<div class="container mb-4 pb-4">
+			<div class="container border-b mb-4 pb-4">
 				<div class="text-lg font-semibold mb-4">
 					{{ __('Company Details') }}
 				</div>
-				<div class="grid grid-cols-2 gap-4">
+				<div class="grid grid-cols-2 gap-5">
 					<div>
 						<FormControl
 							v-model="job.company_name"
@@ -128,6 +115,19 @@
 					</div>
 				</div>
 			</div>
+			<div class="container mt-4">
+				<label class="block text-ink-gray-5 text-xs mb-1">
+					{{ __('Description') }}
+					<span class="text-ink-red-3">*</span>
+				</label>
+				<TextEditor
+					:content="job.description"
+					@change="(val) => (job.description = val)"
+					:editable="true"
+					:fixedMenu="true"
+					editorClass="prose-sm max-w-none border-b border-x bg-surface-gray-2 rounded-b-md py-1 px-2 min-h-[7rem] mb-4"
+				/>
+			</div>
 		</div>
 	</div>
 </template>
@@ -317,7 +317,7 @@ const breadcrumbs = computed(() => {
 		},
 		{
 			label: props.jobName == 'new' ? 'New Job' : 'Edit Job',
-			route: { name: 'JobCreation' },
+			route: { name: 'JobForm' },
 		},
 	]
 	return crumbs
diff --git a/frontend/src/pages/Jobs.vue b/frontend/src/pages/Jobs.vue
index 044a7191..b1d0d13d 100644
--- a/frontend/src/pages/Jobs.vue
+++ b/frontend/src/pages/Jobs.vue
@@ -10,7 +10,7 @@
 			<router-link
 				v-if="user.data?.name"
 				:to="{
-					name: 'JobCreation',
+					name: 'JobForm',
 					params: {
 						jobName: 'new',
 					},
@@ -29,8 +29,11 @@
 				<div
 					class="flex flex-col lg:flex-row space-y-4 lg:space-y-0 lg:items-center justify-between mb-5"
 				>
-					<div class="text-xl text-ink-gray-9 font-semibold">
-						{{ __('Find the perfect job for you') }}
+					<div
+						v-if="jobCount"
+						class="text-xl font-semibold text-ink-gray-7 mb-4 md:mb-0"
+					>
+						{{ __('{0} Open Jobs').format(jobCount) }}
 					</div>
 					<div class="grid grid-cols-2 gap-2">
 						<FormControl
@@ -58,7 +61,7 @@
 					</div>
 				</div>
 
-				<div class="grid grid-cols-1 lg:grid-cols-3 gap-5">
+				<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
 					<router-link
 						v-for="job in jobs.data"
 						:to="{
@@ -94,6 +97,7 @@
 import {
 	Button,
 	Breadcrumbs,
+	call,
 	createResource,
 	FormControl,
 	usePageMeta,
@@ -109,6 +113,7 @@ const { brand } = sessionStore()
 const searchQuery = ref('')
 const filters = ref({})
 const orFilters = ref({})
+const jobCount = ref(0)
 
 onMounted(() => {
 	let queries = new URLSearchParams(location.search)
@@ -116,6 +121,7 @@ onMounted(() => {
 		jobType.value = queries.get('type')
 	}
 	updateJobs()
+	getJobCount()
 })
 
 const jobs = createResource({
@@ -155,6 +161,17 @@ const updateFilters = () => {
 	}
 }
 
+const getJobCount = () => {
+	call('frappe.client.get_count', {
+		doctype: 'Job Opportunity',
+		filters: {
+			status: 'Open',
+			disabled: 0,
+		},
+	}).then((data) => {
+		jobCount.value = data
+	})
+}
 const jobTypes = computed(() => {
 	return [
 		'',
diff --git a/frontend/src/router.js b/frontend/src/router.js
index fb04cc7d..3bf8070d 100644
--- a/frontend/src/router.js
+++ b/frontend/src/router.js
@@ -134,8 +134,8 @@ const routes = [
 	},
 	{
 		path: '/job-opening/:jobName/edit',
-		name: 'JobCreation',
-		component: () => import('@/pages/JobCreation.vue'),
+		name: 'JobForm',
+		component: () => import('@/pages/JobForm.vue'),
 		props: true,
 	},
 	{
diff --git a/lms/job/doctype/job_opportunity/job_opportunity.json b/lms/job/doctype/job_opportunity/job_opportunity.json
index d6ed5c4b..e4c219cd 100644
--- a/lms/job/doctype/job_opportunity/job_opportunity.json
+++ b/lms/job/doctype/job_opportunity/job_opportunity.json
@@ -14,13 +14,13 @@
   "type",
   "status",
   "section_break_6",
-  "description",
-  "company_details_section",
   "company_name",
   "company_website",
-  "column_break_11",
+  "column_break_phkm",
   "company_logo",
-  "company_email_address"
+  "company_email_address",
+  "company_details_section",
+  "description"
  ],
  "fields": [
   {
@@ -62,7 +62,8 @@
   },
   {
    "fieldname": "section_break_6",
-   "fieldtype": "Section Break"
+   "fieldtype": "Section Break",
+   "label": "Company Details"
   },
   {
    "fieldname": "description",
@@ -72,8 +73,7 @@
   },
   {
    "fieldname": "company_details_section",
-   "fieldtype": "Section Break",
-   "label": "Company Details"
+   "fieldtype": "Section Break"
   },
   {
    "fieldname": "company_name",
@@ -89,10 +89,6 @@
    "label": "Company Website",
    "reqd": 1
   },
-  {
-   "fieldname": "column_break_11",
-   "fieldtype": "Column Break"
-  },
   {
    "fieldname": "company_logo",
    "fieldtype": "Attach Image",
@@ -111,13 +107,23 @@
    "label": "Company Email Address",
    "options": "Email",
    "reqd": 1
+  },
+  {
+   "fieldname": "column_break_phkm",
+   "fieldtype": "Column Break"
   }
  ],
+ "grid_page_length": 50,
  "index_web_pages_for_search": 1,
- "links": [],
+ "links": [
+  {
+   "link_doctype": "LMS Job Application",
+   "link_fieldname": "job"
+  }
+ ],
  "make_attachments_public": 1,
- "modified": "2025-01-17 12:38:57.134919",
- "modified_by": "Administrator",
+ "modified": "2025-04-24 13:21:24.311596",
+ "modified_by": "sayali@frappe.io",
  "module": "Job",
  "name": "Job Opportunity",
  "owner": "Administrator",
@@ -157,8 +163,9 @@
    "write": 1
   }
  ],
+ "row_format": "Dynamic",
  "sort_field": "modified",
  "sort_order": "DESC",
  "states": [],
  "title_field": "job_title"
-}
\ No newline at end of file
+}
diff --git a/lms/lms/api.py b/lms/lms/api.py
index 1a133532..226a0781 100644
--- a/lms/lms/api.py
+++ b/lms/lms/api.py
@@ -311,9 +311,14 @@ def get_job_opportunities(filters=None, orFilters=None):
 			"company_logo",
 			"name",
 			"creation",
+			"description",
 		],
 		order_by="creation desc",
 	)
+
+	for job in jobs:
+		job.description = frappe.utils.strip_html_tags(job.description)
+		job.applicants = frappe.db.count("LMS Job Application", {"job": job.name})
 	return jobs
 
 

From 26a278c5f4f72376b78a3d37e647f0c9c7cd2f03 Mon Sep 17 00:00:00 2001
From: Jannat Patel <pateljannat2308@gmail.com>
Date: Thu, 24 Apr 2025 18:22:00 +0530
Subject: [PATCH 2/3] feat: country filter in job list

---
 frontend/src/components/BatchCard.vue         |  2 +-
 frontend/src/components/JobCard.vue           | 16 +--
 frontend/src/pages/JobDetail.vue              | 17 +++-
 frontend/src/pages/Jobs.vue                   | 99 +++++++++++--------
 .../job_opportunity/job_opportunity.json      | 14 ++-
 lms/lms/api.py                                |  1 +
 lms/patches.txt                               |  3 +-
 .../v2_0/update_job_city_and_country.py       | 28 ++++++
 8 files changed, 122 insertions(+), 58 deletions(-)
 create mode 100644 lms/patches/v2_0/update_job_city_and_country.py

diff --git a/frontend/src/components/BatchCard.vue b/frontend/src/components/BatchCard.vue
index fe9d7b01..46b3095b 100644
--- a/frontend/src/components/BatchCard.vue
+++ b/frontend/src/components/BatchCard.vue
@@ -1,6 +1,6 @@
 <template>
 	<div
-		class="flex flex-col border-2 hover:bg-surface-gray-2 rounded-md p-4 h-full"
+		class="flex flex-col border hover:border-outline-gray-4 rounded-md p-4 h-full"
 		style="min-height: 150px"
 	>
 		<div class="text-lg leading-5 font-semibold mb-2 text-ink-gray-9">
diff --git a/frontend/src/components/JobCard.vue b/frontend/src/components/JobCard.vue
index b84186d4..1db6237c 100644
--- a/frontend/src/components/JobCard.vue
+++ b/frontend/src/components/JobCard.vue
@@ -1,19 +1,19 @@
 <template>
 	<div
-		class="flex flex-col shadow-sm border rounded-md p-3 h-full hover:bg-surface-gray-2"
+		class="flex flex-col border rounded-md p-3 h-full hover:border-outline-gray-4"
 	>
-		<div class="flex space-x-4 mb-2">
+		<div class="flex space-x-4 mb-4">
 			<div class="flex flex-col space-y-2 flex-1">
 				<div class="text-lg font-semibold text-ink-gray-9">
 					{{ job.company_name }}
 				</div>
-				<span class="font-medium text-ink-gray-7">
+				<span class="font-medium text-ink-gray-7 leading-5">
 					{{ job.job_title }}
 				</span>
 				<div class="flex items-center space-x-1 text-sm text-ink-gray-7">
 					<MapPin class="size-3" />
 					<span>
-						{{ job.location }}
+						{{ job.location }}{{ job.country ? `, ${job.country}` : '' }}
 					</span>
 				</div>
 				<div
@@ -27,9 +27,9 @@
 					</span>
 				</div>
 			</div>
-			<!-- <img :src="job.company_logo" alt="Company Logo" class="h-8 object-contain bg-white" /> -->
+			<!-- <img :src="job.company_logo" alt="Company Logo" class="size-8  rounded-full object-contain  bg-white" /> -->
 		</div>
-		<div class="space-x-4 mt-2 mb-4">
+		<div class="space-x-2 mt-auto">
 			<Badge>
 				{{ job.type }}
 			</Badge>
@@ -37,10 +37,10 @@
 				{{ dayjs(job.creation).fromNow() }}
 			</Badge>
 		</div>
-		<div
+		<!-- <div
 			class="description text-ink-gray-9 text-sm"
 			v-html="job.description"
-		></div>
+		></div> -->
 	</div>
 </template>
 <script setup>
diff --git a/frontend/src/pages/JobDetail.vue b/frontend/src/pages/JobDetail.vue
index e3247113..d7153e4c 100644
--- a/frontend/src/pages/JobDetail.vue
+++ b/frontend/src/pages/JobDetail.vue
@@ -16,7 +16,7 @@
 					},
 				]"
 			/>
-			<div v-if="user.data?.name" class="flex space-x-2">
+			<div v-if="user.data?.name" class="flex items-center space-x-2">
 				<router-link
 					v-if="user.data.name == job.data?.owner"
 					:to="{
@@ -47,6 +47,9 @@
 					</template>
 					{{ __('Apply') }}
 				</Button>
+				<Badge v-else theme="green">
+					{{ __('You have applied') }}
+				</Badge>
 			</div>
 			<div v-else>
 				<Button @click="redirectToLogin(job.data?.name)">
@@ -56,13 +59,13 @@
 				</Button>
 			</div>
 		</header>
-		<div v-if="job.data" class="max-w-3xl mx-auto">
+		<div v-if="job.data" class="max-w-3xl mx-auto pt-5">
 			<div class="p-4">
 				<div class="space-y-5 mb-10">
 					<div class="flex items-center">
 						<img
 							:src="job.data.company_logo"
-							class="size-15 rounded-lg object-contain cursor-pointer mr-4"
+							class="size-10 rounded-lg object-contain cursor-pointer mr-4"
 							:alt="job.data.company_name"
 							@click="redirectToWebsite(job.data.company_website)"
 						/>
@@ -149,7 +152,13 @@
 	</div>
 </template>
 <script setup>
-import { Button, Breadcrumbs, createResource, usePageMeta } from 'frappe-ui'
+import {
+	Badge,
+	Button,
+	Breadcrumbs,
+	createResource,
+	usePageMeta,
+} from 'frappe-ui'
 import { inject, ref } from 'vue'
 import { sessionStore } from '../stores/session'
 import JobApplicationModal from '@/components/Modals/JobApplicationModal.vue'
diff --git a/frontend/src/pages/Jobs.vue b/frontend/src/pages/Jobs.vue
index b1d0d13d..393b3ab9 100644
--- a/frontend/src/pages/Jobs.vue
+++ b/frontend/src/pages/Jobs.vue
@@ -25,43 +25,48 @@
 			</router-link>
 		</header>
 		<div>
-			<div v-if="jobs.data?.length" class="p-5">
+			<div
+				class="flex flex-col lg:flex-row space-y-4 lg:space-y-0 lg:items-center justify-between w-full md:w-4/5 mx-auto p-5"
+			>
 				<div
-					class="flex flex-col lg:flex-row space-y-4 lg:space-y-0 lg:items-center justify-between mb-5"
+					v-if="jobCount"
+					class="text-xl font-semibold text-ink-gray-7 mb-4 md:mb-0"
 				>
-					<div
-						v-if="jobCount"
-						class="text-xl font-semibold text-ink-gray-7 mb-4 md:mb-0"
-					>
-						{{ __('{0} Open Jobs').format(jobCount) }}
-					</div>
-					<div class="grid grid-cols-2 gap-2">
-						<FormControl
-							type="text"
-							:placeholder="__('Search')"
-							v-model="searchQuery"
-							class="min-w-40 lg:min-w-0 lg:w-32 xl:w-40"
-							@input="updateJobs"
-						>
-							<template #prefix>
-								<Search
-									class="w-4 h-4 stroke-1.5 text-ink-gray-5"
-									name="search"
-								/>
-							</template>
-						</FormControl>
-						<FormControl
-							v-model="jobType"
-							type="select"
-							:options="jobTypes"
-							class="min-w-40 lg:min-w-0 lg:w-32 xl:w-40"
-							:placeholder="__('Type')"
-							@change="updateJobs"
-						/>
-					</div>
+					{{ __('{0} Open Jobs').format(jobCount) }}
 				</div>
-
-				<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+				<div class="grid grid-cols-1 md:grid-cols-3 gap-2">
+					<FormControl
+						type="text"
+						:placeholder="__('Search')"
+						v-model="searchQuery"
+						class="min-w-40 lg:min-w-0 lg:w-32 xl:w-40"
+						@input="updateJobs"
+					>
+						<template #prefix>
+							<Search
+								class="w-4 h-4 stroke-1.5 text-ink-gray-5"
+								name="search"
+							/>
+						</template>
+					</FormControl>
+					<Link
+						doctype="Country"
+						v-model="country"
+						:placeholder="__('Country')"
+						class="min-w-40 lg:min-w-0 lg:w-32 xl:w-40"
+					/>
+					<FormControl
+						v-model="jobType"
+						type="select"
+						:options="jobTypes"
+						class="min-w-40 lg:min-w-0 lg:w-32 xl:w-40"
+						:placeholder="__('Type')"
+						@change="updateJobs"
+					/>
+				</div>
+			</div>
+			<div v-if="jobs.data?.length" class="w-full md:w-4/5 mx-auto p-5 pt-0">
+				<div class="grid grid-cols-1 lg:grid-cols-3 gap-4">
 					<router-link
 						v-for="job in jobs.data"
 						:to="{
@@ -76,18 +81,17 @@
 			</div>
 			<div
 				v-else
-				class="flex flex-col items-center justify-center text-sm text-ink-gray-5 mt-48"
+				class="flex flex-col items-center justify-center text-sm text-ink-gray-5 mt-56"
 			>
 				<Laptop class="size-10 mx-auto stroke-1 text-ink-gray-4" />
 				<div class="text-lg font-medium mb-1">
 					{{ __('No jobs found') }}
 				</div>
 				<div class="leading-5 w-2/5 text-center">
-					{{
-						__(
-							'There are no jobs available at the moment. Open a job opportunity or check here again later.'
-						)
-					}}
+					{{ __('There are no jobs available at the moment.') }}
+				</div>
+				<div class="leading-5 w-1/5 text-center">
+					{{ __('Post a new job or check again later.') }}
 				</div>
 			</div>
 		</div>
@@ -104,13 +108,15 @@ import {
 } from 'frappe-ui'
 import { Laptop, Plus, Search } from 'lucide-vue-next'
 import { sessionStore } from '../stores/session'
-import { inject, computed, ref, onMounted } from 'vue'
+import { inject, computed, ref, onMounted, watch } from 'vue'
 import JobCard from '@/components/JobCard.vue'
+import Link from '@/components/Controls/Link.vue'
 
 const user = inject('$user')
 const jobType = ref(null)
 const { brand } = sessionStore()
 const searchQuery = ref('')
+const country = ref(null)
 const filters = ref({})
 const orFilters = ref({})
 const jobCount = ref(0)
@@ -159,6 +165,12 @@ const updateFilters = () => {
 	} else {
 		orFilters.value = {}
 	}
+
+	if (country.value) {
+		filters.value.country = country.value
+	} else {
+		delete filters.value.country
+	}
 }
 
 const getJobCount = () => {
@@ -172,6 +184,11 @@ const getJobCount = () => {
 		jobCount.value = data
 	})
 }
+
+watch(country, (val) => {
+	updateJobs()
+})
+
 const jobTypes = computed(() => {
 	return [
 		'',
diff --git a/lms/job/doctype/job_opportunity/job_opportunity.json b/lms/job/doctype/job_opportunity/job_opportunity.json
index e4c219cd..f2022f9d 100644
--- a/lms/job/doctype/job_opportunity/job_opportunity.json
+++ b/lms/job/doctype/job_opportunity/job_opportunity.json
@@ -9,10 +9,11 @@
  "field_order": [
   "job_title",
   "location",
-  "disabled",
+  "country",
   "column_break_5",
   "type",
   "status",
+  "disabled",
   "section_break_6",
   "company_name",
   "company_website",
@@ -36,7 +37,7 @@
    "fieldtype": "Data",
    "in_list_view": 1,
    "in_standard_filter": 1,
-   "label": "Location",
+   "label": "City",
    "reqd": 1
   },
   {
@@ -111,6 +112,13 @@
   {
    "fieldname": "column_break_phkm",
    "fieldtype": "Column Break"
+  },
+  {
+   "fieldname": "country",
+   "fieldtype": "Link",
+   "label": "Country",
+   "options": "Country",
+   "reqd": 1
   }
  ],
  "grid_page_length": 50,
@@ -122,7 +130,7 @@
   }
  ],
  "make_attachments_public": 1,
- "modified": "2025-04-24 13:21:24.311596",
+ "modified": "2025-04-24 14:34:35.920242",
  "modified_by": "sayali@frappe.io",
  "module": "Job",
  "name": "Job Opportunity",
diff --git a/lms/lms/api.py b/lms/lms/api.py
index 226a0781..768f997e 100644
--- a/lms/lms/api.py
+++ b/lms/lms/api.py
@@ -306,6 +306,7 @@ def get_job_opportunities(filters=None, orFilters=None):
 		fields=[
 			"job_title",
 			"location",
+			"country",
 			"type",
 			"company_name",
 			"company_logo",
diff --git a/lms/patches.txt b/lms/patches.txt
index 5a1c3eb3..36923e1c 100644
--- a/lms/patches.txt
+++ b/lms/patches.txt
@@ -101,4 +101,5 @@ lms.patches.v2_0.allow_guest_access #05-02-2025
 lms.patches.v2_0.migrate_batch_student_data #10-02-2025
 lms.patches.v2_0.delete_old_enrollment_doctypes
 lms.patches.v2_0.delete_unused_custom_fields
-lms.patches.v2_0.update_certificate_request_status
\ No newline at end of file
+lms.patches.v2_0.update_certificate_request_status
+lms.patches.v2_0.update_job_city_and_country
\ No newline at end of file
diff --git a/lms/patches/v2_0/update_job_city_and_country.py b/lms/patches/v2_0/update_job_city_and_country.py
new file mode 100644
index 00000000..ec6cf62e
--- /dev/null
+++ b/lms/patches/v2_0/update_job_city_and_country.py
@@ -0,0 +1,28 @@
+import frappe
+
+
+def execute():
+	jobs = frappe.get_all("Job Opportunity", fields=["name", "location"])
+
+	for job in jobs:
+		if "," in job.location:
+			city, country = job.location.split(",", 1)
+			city = city.strip()
+			country = country.strip()
+			save_country(country, job)
+			frappe.db.set_value("Job Opportunity", job.name, "location", city)
+		else:
+			save_country(job.location, job)
+
+
+def save_country(country, job):
+	if frappe.db.exists("Country", country):
+		frappe.db.set_value("Job Opportunity", job.name, "country", country)
+	else:
+		country_mapping = {
+			"US": "United States",
+			"USA": "United States",
+			"UAE": "United Arab Emirates",
+		}
+		country = country_mapping.get(country, country)
+		frappe.db.set_value("Job Opportunity", job.name, "country", country)

From 4a36826af088c9ebfb3019f9bb38cce974ab687a Mon Sep 17 00:00:00 2001
From: Jannat Patel <pateljannat2308@gmail.com>
Date: Thu, 24 Apr 2025 18:28:06 +0530
Subject: [PATCH 3/3] fix: if student applied for a job show that on the
 details page

---
 frontend/src/pages/JobDetail.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/JobDetail.vue b/frontend/src/pages/JobDetail.vue
index d7153e4c..9605c937 100644
--- a/frontend/src/pages/JobDetail.vue
+++ b/frontend/src/pages/JobDetail.vue
@@ -47,7 +47,10 @@
 					</template>
 					{{ __('Apply') }}
 				</Button>
-				<Badge v-else theme="green">
+				<Badge v-else variant="subtle" theme="green" size="lg">
+					<template #prefix>
+						<Check class="h-4 w-4" />
+					</template>
 					{{ __('You have applied') }}
 				</Badge>
 			</div>
@@ -164,6 +167,7 @@ import { sessionStore } from '../stores/session'
 import JobApplicationModal from '@/components/Modals/JobApplicationModal.vue'
 import {
 	MapPin,
+	Check,
 	SendHorizonal,
 	Pencil,
 	Building2,