Add time search support

README.md

@@ -14,6 +14,7 @@ Web UI to browse [kafka](https://kafka.apache.org/) and [schema registry](https:
 - Support for avro auto-detecting and decoding (via the schema registry). Different subject messages in a topic are supported as well (and as you filter for a specific event type it auto-hides all of the irrelevant columns belonging to the other messages).
 - The raw view shows the data in json format, and allows easy copying to clipboard
 - Server-side search for messages and the ability to search multiple topics at once
+- Filter messages via time range (or offsets)
 - Light and dark themes
 
 ## Images

package.json

@@ -43,12 +43,12 @@
  "ejs": "^2.7.4",
  "express": "^4.17.1",
  "kafka-avro": "^3.2.0",
- "kafkajs": "^1.14.0",
+ "kafkajs": "^1.15.0",
  "long": "^4.0.0",
  "qs": "^6.9.4",
  "react": "^16.13.1",
  "react-dom": "^16.13.1",
- "react-json-view": "^1.19.1",
+ "react-json-view": "^1.21.1",
  "react-router-dom": "^5.2.0",
  "uuid": "^8.1.0"
  }

src/client/common/url.ts

@@ -1,6 +1,6 @@
 import qs = require('qs');
 
-export type UrlProperty = `raw` | `search` | `offset` | `limit` | `searchFrom` | `topics`
+export type UrlProperty = `raw` | `search` | `offset` | `limit` | `searchFrom` | `topics` | `from_time` | `to_time`
 
 export class Url {
  obj: qs.ParsedQs

src/client/kafka/messages/messages.tsx

@@ -214,6 +214,8 @@ export class Messages extends React.Component<Props, State> {
  search={this.state.search}
  offset={this.url.Get(`offset`)}
  limit={this.url.Get(`limit`)}
+ fromTime={this.url.Get(`from_time`)}
+ toTime={this.url.Get(`to_time`)}
  onDataFetched={this.onDataFetched}
  onDataFetchStarted={this.onDataFetchStarted}>
  </SingleTopicInput>