Round off x axis max timestamp to T - 1 min and 0th second (#4238)

* feat: round of x axis max timestamp to t - 1 min and 0th second

* feat: set min width of time selection dropdown to 120px

* feat: update logic comment

---------

Co-authored-by: Srikanth Chekuri <srikanth.chekuri92@gmail.com>

frontend/src/container/TopNav/DateTimeSelection/index.tsx

@@ -292,6 +292,9 @@ function DateTimeSelection({
 							selectedTime,
 						)}
 						data-testid="dropDown"
+						style={{
+							minWidth: 120,
+						}}
 					>
 						{options.map(({ value, label }) => (
 							<Option key={value + label} value={value}>

frontend/src/lib/uPlotLib/utils/getXAxisScale.ts

@@ -36,5 +36,18 @@ export const getXAxisScale = (
 		maxTime = fallbackMax;
 	}
 
+	// As API response is adjusted to return values for  T - 1 min (end timestamp) due to which graph would not have the current timestamp data, we see the empty space in the graph for smaller timeframe. To accommodate this, we will be plotting the graph from (startTime  ->  endTime - 1 min).
+
+	const oneMinuteAgoTimestamp = (maxTime - 60) * 1000;
+	const currentDate = new Date(oneMinuteAgoTimestamp);
+
+	// Set seconds and milliseconds to zero
+	currentDate.setSeconds(0);
+	currentDate.setMilliseconds(0);
+
+	// Get the Unix timestamp in seconds
+	const unixTimestampSeconds = Math.floor(currentDate.getTime() / 1000);
+	maxTime = unixTimestampSeconds;
+
 	return { time: true, auto: false, range: [minTime, maxTime] };
 };