From 859a306f921376ba5702d9fdbfa01864358534a9 Mon Sep 17 00:00:00 2001
From: FIPalash Gupta <palash@signoz.io>
Date: Tue, 28 Sep 2021 15:21:20 +0530
Subject: [PATCH 1/2] chore: getFormatedDate function is added

---
 frontend/src/lib/getFormatedDate.ts | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 frontend/src/lib/getFormatedDate.ts

diff --git a/frontend/src/lib/getFormatedDate.ts b/frontend/src/lib/getFormatedDate.ts
new file mode 100644
index 00000000000..bd5eb9a3a00
--- /dev/null
+++ b/frontend/src/lib/getFormatedDate.ts
@@ -0,0 +1,13 @@
+function getFormattedDate(date: Date): string {
+	const year = date.getFullYear();
+
+	let month = (1 + date.getMonth()).toString();
+	month = month.length > 1 ? month : '0' + month;
+
+	let day = date.getDate().toString();
+	day = day.length > 1 ? day : '0' + day;
+
+	return month + '/' + day + '/' + year;
+}
+
+export default getFormattedDate;

From 737c958670e9ddd0c1c2700adaa6f01c26d1b471 Mon Sep 17 00:00:00 2001
From: FIPalash Gupta <palash@signoz.io>
Date: Tue, 28 Sep 2021 15:21:57 +0530
Subject: [PATCH 2/2] fix: date format in the all dashboard is updated to
 mm/dd/yyyy HH:MM

---
 .../ListOfDashboard/TableComponents/CreatedBy.tsx     | 11 ++++++-----
 .../ListOfDashboard/TableComponents/Date.tsx          | 10 ++++++++--
 frontend/src/container/ListOfDashboard/index.tsx      | 11 ++++++++++-
 frontend/src/lib/convertDateToAmAndPm.ts              |  2 +-
 4 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/frontend/src/container/ListOfDashboard/TableComponents/CreatedBy.tsx b/frontend/src/container/ListOfDashboard/TableComponents/CreatedBy.tsx
index 9416261f39e..33240935d13 100644
--- a/frontend/src/container/ListOfDashboard/TableComponents/CreatedBy.tsx
+++ b/frontend/src/container/ListOfDashboard/TableComponents/CreatedBy.tsx
@@ -1,5 +1,6 @@
 import { Typography } from 'antd';
 import convertDateToAmAndPm from 'lib/convertDateToAmAndPm';
+import getFormattedDate from 'lib/getFormatedDate';
 import React from 'react';
 
 import { Data } from '..';
@@ -7,11 +8,11 @@ import { Data } from '..';
 const Created = (createdBy: Data['createdBy']): JSX.Element => {
 	const time = new Date(createdBy);
 
-	return (
-		<Typography>{`${time.toLocaleDateString()} ${convertDateToAmAndPm(
-			time,
-		)}`}</Typography>
-	);
+	const date = getFormattedDate(time);
+
+	const timeString = `${date} ${convertDateToAmAndPm(time)}`;
+
+	return <Typography>{`${timeString}`}</Typography>;
 };
 
 export default Created;
diff --git a/frontend/src/container/ListOfDashboard/TableComponents/Date.tsx b/frontend/src/container/ListOfDashboard/TableComponents/Date.tsx
index ef0bce03c97..464119f5c4d 100644
--- a/frontend/src/container/ListOfDashboard/TableComponents/Date.tsx
+++ b/frontend/src/container/ListOfDashboard/TableComponents/Date.tsx
@@ -1,4 +1,6 @@
 import { Typography } from 'antd';
+import convertDateToAmAndPm from 'lib/convertDateToAmAndPm';
+import getFormattedDate from 'lib/getFormatedDate';
 import React from 'react';
 
 import { Data } from '..';
@@ -6,9 +8,13 @@ import { Data } from '..';
 const DateComponent = (
 	lastUpdatedTime: Data['lastUpdatedTime'],
 ): JSX.Element => {
-	const date = new Date(lastUpdatedTime).toDateString();
+	const time = new Date(lastUpdatedTime);
 
-	return <Typography>{date}</Typography>;
+	const date = getFormattedDate(time);
+
+	const timeString = `${date} ${convertDateToAmAndPm(time)}`;
+
+	return <Typography>{timeString}</Typography>;
 };
 
 export default DateComponent;
diff --git a/frontend/src/container/ListOfDashboard/index.tsx b/frontend/src/container/ListOfDashboard/index.tsx
index 2961566e5c5..0719eaeec3c 100644
--- a/frontend/src/container/ListOfDashboard/index.tsx
+++ b/frontend/src/container/ListOfDashboard/index.tsx
@@ -49,13 +49,22 @@ const ListOfAllDashboard = (): JSX.Element => {
 		{
 			title: 'Created By',
 			dataIndex: 'createdBy',
+			sorter: (a: Data, b: Data): number => {
+				const prev = new Date(a.createdBy).getTime();
+				const next = new Date(b.createdBy).getTime();
+
+				return prev - next;
+			},
 			render: Createdby,
 		},
 		{
 			title: 'Last Updated Time',
 			dataIndex: 'lastUpdatedTime',
 			sorter: (a: Data, b: Data): number => {
-				return parseInt(a.lastUpdatedTime, 10) - parseInt(b.lastUpdatedTime, 10);
+				const prev = new Date(a.lastUpdatedTime).getTime();
+				const next = new Date(b.lastUpdatedTime).getTime();
+
+				return prev - next;
 			},
 			render: DateComponent,
 		},
diff --git a/frontend/src/lib/convertDateToAmAndPm.ts b/frontend/src/lib/convertDateToAmAndPm.ts
index ccc13bab22a..0a0ad0a5fc0 100644
--- a/frontend/src/lib/convertDateToAmAndPm.ts
+++ b/frontend/src/lib/convertDateToAmAndPm.ts
@@ -1,6 +1,6 @@
 const convertDateToAmAndPm = (date: Date): string => {
 	return date.toLocaleString('en-US', {
-		hour: 'numeric',
+		hour: '2-digit',
 		minute: 'numeric',
 		hour12: true,
 	});