diff --git a/hrms/hr/doctype/job_opening/job_opening.json b/hrms/hr/doctype/job_opening/job_opening.json
index f9a30f4b6e..d1e34066a6 100644
--- a/hrms/hr/doctype/job_opening/job_opening.json
+++ b/hrms/hr/doctype/job_opening/job_opening.json
@@ -257,6 +257,7 @@
 <<<<<<< HEAD
 <<<<<<< HEAD
 <<<<<<< HEAD
+<<<<<<< HEAD
 <<<<<<< HEAD
  "modified": "2023-09-14 16:50:39.316079",
 =======
@@ -283,6 +284,9 @@
 =======
  "modified": "2023-09-14 15:57:04.756209",
 >>>>>>> 311249ba9 (feat: add description to Closes On field)
+=======
+ "modified": "2023-09-15 13:41:54.111743",
+>>>>>>> 836271d4b (feat: handle view for closed openings)
  "modified_by": "Administrator",
  "module": "HR",
  "name": "Job Opening",
@@ -307,6 +311,15 @@
  ],
  "sort_field": "modified",
  "sort_order": "ASC",
- "states": [],
+ "states": [
+  {
+   "color": "Green",
+   "title": "Open"
+  },
+  {
+   "color": "Gray",
+   "title": "Closed"
+  }
+ ],
  "title_field": "job_title"
 }
\ No newline at end of file
diff --git a/hrms/templates/generators/job_opening.html b/hrms/templates/generators/job_opening.html
index ac3fe80026..31198f1573 100644
--- a/hrms/templates/generators/job_opening.html
+++ b/hrms/templates/generators/job_opening.html
@@ -13,13 +13,17 @@ <h1 class="mt-0 mb-3" style="font-size: 3rem">{{ job_title }}</h1>
 				</div>
 			</div>
 			<div class="ml-auto">
-				{%- if job_application_route -%}
+				{%- if status == "Open" -%}
 					<a class="btn btn-primary btn-lg"
-					   href="/{{ job_application_route }}/new?job_title={{ name }}">{{ _("Apply
-					Now") }}</a>
-				{% else %}
-					<a class="btn btn-primary btn-lg"
-					   href="/job_application/new?job_title={{ name }}">{{ _("Apply Now") }}</a>
+					   href="{{ '/' ~ job_application_route ~ '/new?job_title=' ~ name if job_application_route else '/job_application/new?job_title=' ~ name }}">
+						{{ _("Apply Now") }}
+					</a>
+				{%- else -%}
+					<div class="py-4 px-10 font-weight-bold text-nowrap"
+						 style="background: var(--bg-gray);
+								font-size: 1.1rem;
+								border-radius: var(--border-radius)">{{ _("Opening closed.") }}
+					</div>
 				{% endif %}
 			</div>
 		</div>
@@ -81,13 +85,9 @@ <h1 class="mt-0 mb-3" style="font-size: 3rem">{{ job_title }}</h1>
 								<div class="ml-5">
 									<div class="text-secondary" style="font-size: 14px">{{ _("Salary Range") }}</div>
 									<div class="font-weight-bold">
-										{%- if lower_range -%}
-										{{ frappe.format_value(frappe.utils.flt(lower_range), currency=currency) }}
-										{% endif %}
+										{%- if lower_range -%}{{ frappe.format_value(frappe.utils.flt(lower_range) , currency=currency) }}{% endif %}
 										{%- if lower_range and upper_range -%}{{ " - " }}{% endif %}
-										{%- if upper_range -%}
-										{{ frappe.format_value(frappe.utils.flt(upper_range), currency=currency) }}
-										{% endif %}
+										{%- if upper_range -%}{{ frappe.format_value(frappe.utils.flt(upper_range) , currency=currency) }}{% endif %}
 										/ {{ salary_per.lower() }}
 									</div>
 								</div>
@@ -128,7 +128,7 @@ <h1 class="mt-0 mb-3" style="font-size: 3rem">{{ job_title }}</h1>
 							</div>
 						</div>
 					</div>
-					{%- if closes_on -%}
+					{%- if (status == 'Open' and closes_on) or (status == 'Closed' and closed_on) -%}
 						<div class="col-4 mb-8">
 							<div class="flex flex-row align-items-center">
 								<div class="rounded-circle p-4" style="background: var(--red-50)">
@@ -140,8 +140,10 @@ <h1 class="mt-0 mb-3" style="font-size: 3rem">{{ job_title }}</h1>
 									</svg>
 								</div>
 								<div class="ml-5">
-									<div class="text-secondary" style="font-size: 14px">{{ _("Closes On") }}</div>
-									<div class="font-weight-bold">{{ frappe.format_date(closes_on, "d MMM, YYYY") }}</div>
+									<div class="text-secondary" style="font-size: 14px">{{ _("Closes On" if status == "Open" else "Closed On") }}</div>
+									<div class="font-weight-bold">
+										{{ frappe.format_date(closes_on if status == "Open" else closed_on, "d MMM, YYYY") }}
+									</div>
 								</div>
 							</div>
 						</div>