Repository: provectus/kafka-ui
Issue: Invalid dates after a recent pull
Labels: type/bug
scope/backend
scope/frontend
status/accepted
status/confirmed

<!--

Don't forget to check for existing issues/discussions regarding your proposal. We might already have it.
https://github.com/provectus/kafka-ui/issues
https://github.com/provectus/kafka-ui/discussions

-->

**Describe the bug**
<!--(A clear and concise description of what the bug is.)-->

After i pulled the recent image from master branch, the dates are badly messed up and does not show in correct/readable format. for  e.g. top left, current commit shows like this, notice the date on left side before current commit in brackes.

Fr.10.2022 11:20:53 (7d5b7de)

Also from message viewer, the timestamp formats also messed up with format.
Offset	Partition	Timestamp				Key
10517	11	 		Fr.09.2022 17:30:21 	238087980

**Set up**
<!--
How do you run the app? Please provide as much info as possible:
1. App version (docker image version or check commit hash in the top left corner in UI)
2. Helm chart version, if you use one
3. Any IAAC configs

We might close the issue without further explanation if you don't provide such information.
-->
Commit Hash from top left corner in UI: Fr.10.2022 11:20:53 (7d5b7de)

**Steps to Reproduce**
<!-- We'd like you to provide an example setup (via docker-compose, helm, etc.) 
to reproduce the problem, especially with a complex setups. -->
Steps to reproduce the behavior:

1. docker pull provectuslabs/kafka-ui:master

**Expected behavior**
<!--
(A clear and concise description of what you expected to happen)
-->

Results from Commit hash: d149d26013a81e22e5d0c8b59db56ac0565b9e55
(
[d149d26](https://github.com/provectus/kafka-ui/commit/d149d26)
)

Message Viewer:
Offset|Partition| Timestamp| Key
10389 | 1 | 09.23.22 07:39:30 pm | 238087985


**Screenshots**
<!--
(If applicable, add screenshots to help explain your problem)
-->


**Additional context**
<!--
(Add any other context about the problem here)
-->


Issue comments:
Hey, thanks for reaching out. We're aware, the fix will be available in a few days. Meanwhile, you can set the env variable `timestamp.format` to `DD.MM.YYYY HH:mm:ss`.
thx, adding environment variable for timestamp.format helped to correct the date format.
> Hey, thanks for reaching out. We're aware, the fix will be available in a few days. Meanwhile, you can set the env variable `timestamp.format` to `DD.MM.YYYY HH:mm:ss`.

@Haarolean @nitin1677 I don't understand how to do this, can you write in steps? what is the name of the variable itself and how to export it, this is done through the UI or inside the docker container or at startup
I tried docker exec
timestamp.format=DD.MM.YYYY HH:mm:ss
timestamp_format=DD.MM.YYYY HH:mm:ss
TIMESTAMP_FORMAT=DD.MM.YYYY HH:mm:ss
TIMESTAMP_FORMAT="DD.MM.YYYY HH:mm:ss"

Pull request review comments:

Patch that resolved the issue:
diff --git a/kafka-ui-api/src/main/java/com/provectus/kafka/ui/controller/InfoController.java b/kafka-ui-api/src/main/java/com/provectus/kafka/ui/controller/InfoController.java
index 66e5d70bd33..cdda3d0953e 100644
--- a/kafka-ui-api/src/main/java/com/provectus/kafka/ui/controller/InfoController.java
+++ b/kafka-ui-api/src/main/java/com/provectus/kafka/ui/controller/InfoController.java
@@ -17,9 +17,16 @@ public class InfoController extends AbstractController implements TimeStampForma
 
   @Value("${timestamp.format:dd.MM.YYYY HH:mm:ss}")
   private String timeStampFormat;
+  @Value("${timestamp.format:DD.MM.YYYY HH:mm:ss}")
+  private String timeStampFormatIso;
 
   @Override
   public Mono<ResponseEntity<TimeStampFormatDTO>> getTimeStampFormat(ServerWebExchange exchange) {
     return Mono.just(ResponseEntity.ok(new TimeStampFormatDTO().timeStampFormat(timeStampFormat)));
   }
+
+  @Override
+  public Mono<ResponseEntity<TimeStampFormatDTO>> getTimeStampFormatISO(ServerWebExchange exchange) {
+    return Mono.just(ResponseEntity.ok(new TimeStampFormatDTO().timeStampFormat(timeStampFormatIso)));
+  }
 }
diff --git a/kafka-ui-contract/src/main/resources/swagger/kafka-ui-api.yaml b/kafka-ui-contract/src/main/resources/swagger/kafka-ui-api.yaml
index c4765fb2202..5ea470b4f95 100644
--- a/kafka-ui-contract/src/main/resources/swagger/kafka-ui-api.yaml
+++ b/kafka-ui-contract/src/main/resources/swagger/kafka-ui-api.yaml
@@ -1733,7 +1733,7 @@ paths:
     get:
       tags:
         - TimeStampFormat
-      summary: getTimeStampFormat
+      summary: get system default datetime format
       operationId: getTimeStampFormat
       responses:
         200:
@@ -1742,6 +1742,21 @@ paths:
             application/json:
               schema:
                 $ref: '#/components/schemas/TimeStampFormat'
+
+  /api/info/timestampformat/iso:
+    get:
+      tags:
+        - TimeStampFormat
+      summary: get system default datetime format (in ISO format, for JS)
+      operationId: getTimeStampFormatISO
+      responses:
+        200:
+          description: OK
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/TimeStampFormat'
+
 components:
   schemas:
     TopicSerdeSuggestion:
diff --git a/kafka-ui-react-app/src/lib/hooks/api/__tests__/timeFormat.spec.ts b/kafka-ui-react-app/src/lib/hooks/api/__tests__/timeFormat.spec.ts
index cc080f58e14..c6984c40b15 100644
--- a/kafka-ui-react-app/src/lib/hooks/api/__tests__/timeFormat.spec.ts
+++ b/kafka-ui-react-app/src/lib/hooks/api/__tests__/timeFormat.spec.ts
@@ -3,7 +3,7 @@ import { expectQueryWorks, renderQueryHook } from 'lib/testHelpers';
 import * as hooks from 'lib/hooks/api/timeFormat';
 import { timeFormatPayload } from 'lib/fixtures/timeFormat';
 
-const timeFormatPath = '/api/info/timestampformat';
+const timeFormatPath = '/api/info/timestampformat/iso';
 
 describe('Time format hooks', () => {
   beforeEach(() => fetchMock.restore());
diff --git a/kafka-ui-react-app/src/lib/hooks/api/timeFormat.ts b/kafka-ui-react-app/src/lib/hooks/api/timeFormat.ts
index fcbdf931520..3b36f74066f 100644
--- a/kafka-ui-react-app/src/lib/hooks/api/timeFormat.ts
+++ b/kafka-ui-react-app/src/lib/hooks/api/timeFormat.ts
@@ -5,7 +5,7 @@ import { QUERY_REFETCH_OFF_OPTIONS } from 'lib/constants';
 export function useTimeFormat() {
   return useQuery(
     ['settings', 'timestampformat'],
-    () => api.getTimeStampFormat(),
+    () => api.getTimeStampFormatISO(),
     QUERY_REFETCH_OFF_OPTIONS
   );
 }


Test patch: