[API] Json server mocks

frontend/README.md

@@ -1,2 +0,0 @@
-# kafka-ui
-UI for Apache Kafka management

frontend/mock/index.js

@@ -0,0 +1,44 @@
+const jsonServer = require('json-server');
+const _ = require('lodash');
+const clusters = require('./payload/clusters.json');
+const brokers = require('./payload/brokers.json');
+const brokerMetrics = require('./payload/brokerMetrics.json');
+const topics = require('./payload/topics.json');
+const topicDetails = require('./payload/topicDetails.json');
+const topicConfigs = require('./payload/topicConfigs.json');
+
+const db = {
+  clusters,
+  brokers,
+  brokerMetrics: brokerMetrics.map(({ clusterId, ...rest }) => ({ ...rest, id: clusterId })),
+  topics: topics.map((topic) => ({ ...topic, id: topic.name })),
+  topicDetails,
+  topicConfigs,
+}
+const server = jsonServer.create();
+const router = jsonServer.router(db);
+const middlewares = jsonServer.defaults();
+
+const PORT = 3004;
+const DELAY = 0;
+
+server.use(middlewares);
+server.use((_req, _res, next) => {
+  setTimeout(next, DELAY);
+});
+
+server.use(
+  jsonServer.rewriter({
+    '/*': '/$1',
+    '/clusters/:clusterId/metrics/broker': '/brokerMetrics/:clusterId',
+    '/clusters/:clusterId/topics/:id': '/topicDetails',
+    '/clusters/:clusterId/topics/:id/config': '/topicDetails',
+    '/clusters/:clusterId/topics/:id/config': '/topicConfigs',
+  })
+);
+
+server.use(router);
+
+server.listen(PORT, () => {
+  console.log('JSON Server is running');
+});

frontend/mock/payload/brokerMetrics.json

@@ -0,0 +1,42 @@
+[
+  {
+    "clusterId": "wrYGf-csNgiGdK7B_ADF7Z",
+    "bytesInPerSec": 8027,
+    "brokerCount": 1,
+    "zooKeeperStatus": 1,
+    "activeControllers": 1,
+    "uncleanLeaderElectionCount": 0,
+    "networkPoolUsage": 0.001970896739179595,
+    "requestPoolUsage": 0.00730438980248805,
+    "onlinePartitionCount": 19,
+    "underReplicatedPartitionCount": 9,
+    "offlinePartitionCount": 3,
+    "diskUsage": [
+      {
+        "brokerId": 1,
+        "segmentSize": 479900675
+      }
+    ],
+    "diskUsageDistribution": "even"
+  },
+  {
+    "clusterId": "dMMQx-WRh77BKYas_g2ZTz",
+    "bytesInPerSec": 8194,
+    "brokerCount": 1,
+    "zooKeeperStatus": 1,
+    "activeControllers": 1,
+    "uncleanLeaderElectionCount": 0,
+    "networkPoolUsage": 0.004401004145400575,
+    "requestPoolUsage": 0.004089519725388984,
+    "onlinePartitionCount": 70,
+    "underReplicatedPartitionCount": 1,
+    "offlinePartitionCount": 2,
+    "diskUsage": [
+      {
+        "brokerId": 1,
+        "segmentSize": 968226532
+      }
+    ],
+    "diskUsageDistribution": "even"
+  }
+]

frontend/mock/payload/brokers.json

@@ -0,0 +1,18 @@
+[
+  {
+    "brokerId": 1,
+    "clusterId": "wrYGf-csNgiGdK7B_ADF7Z",
+    "bytesInPerSec": 1234,
+    "bytesOutPerSec": 3567,
+    "segmentSize": 912360707,
+    "partitionReplicas": 20
+  },
+  {
+    "brokerId": 2,
+    "clusterId": "dMMQx-WRh77BKYas_g2ZTz",
+    "bytesInPerSec": 9194,
+    "bytesOutPerSec": 7924,
+    "segmentSize": 840060707,
+    "partitionReplicas": 50
+  }
+]

frontend/mock/payload/clusters.json

@@ -0,0 +1,24 @@
+[
+  {
+    "id": "wrYGf-csNgiGdK7B_ADF7Z",
+    "name": "fake.cluster",
+    "defaultCluster": true,
+    "status": "online",
+    "brokerCount": 1,
+    "onlinePartitionCount": 20,
+    "topicCount": 2,
+    "bytesInPerSec": 3201,
+    "bytesOutPerSec": 4320
+  },
+  {
+    "id": "dMMQx-WRh77BKYas_g2ZTz",
+    "name": "kafka-ui.cluster",
+    "defaultCluster": false,
+    "status": "offline",
+    "brokerCount": 1,
+    "onlinePartitionCount": 20,
+    "topicCount": 2,
+    "bytesInPerSec": 8341,
+    "bytesOutPerSec": 10320
+  }
+]

frontend/mock/payload/topicConfigs.json

@@ -0,0 +1,132 @@
+[
+  {
+    "name": "compression.type",
+    "value": "producer",
+    "defaultValue": "producer"
+  },
+  {
+    "name": "leader.replication.throttled.replicas",
+    "value": "",
+    "defaultValue": ""
+  },
+  {
+    "name": "message.downconversion.enable",
+    "value": "false",
+    "defaultValue": "true"
+  },
+  {
+    "name": "min.insync.replicas",
+    "value": "1",
+    "defaultValue": "1"
+  },
+  {
+    "name": "segment.jitter.ms",
+    "value": "0",
+    "defaultValue": "0"
+  },
+  {
+    "name": "cleanup.policy",
+    "value": "compact",
+    "defaultValue": "delete"
+  },
+  {
+    "name": "flush.ms",
+    "value": "9223372036854775807",
+    "defaultValue": "9223372036854775807"
+  },
+  {
+    "name": "follower.replication.throttled.replicas",
+    "value": "",
+    "defaultValue": ""
+  },
+  {
+    "name": "segment.bytes",
+    "value": "1073741824",
+    "defaultValue": "1073741824"
+  },
+  {
+    "name": "retention.ms",
+    "value": "43200000",
+    "defaultValue": "43200000"
+  },
+  {
+    "name": "flush.messages",
+    "value": "9223372036854775807",
+    "defaultValue": "9223372036854775807"
+  },
+  {
+    "name": "message.format.version",
+    "value": "2.3-IV1",
+    "defaultValue": "2.3-IV1"
+  },
+  {
+    "name": "file.delete.delay.ms",
+    "value": "60000",
+    "defaultValue": "60000"
+  },
+  {
+    "name": "max.compaction.lag.ms",
+    "value": "9223372036854775807",
+    "defaultValue": "9223372036854775807"
+  },
+  {
+    "name": "max.message.bytes",
+    "value": "1000012",
+    "defaultValue": "1000012"
+  },
+  {
+    "name": "min.compaction.lag.ms",
+    "value": "0",
+    "defaultValue": "0"
+  },
+  {
+    "name": "message.timestamp.type",
+    "value": "CreateTime",
+    "defaultValue": "CreateTime"
+  },
+  {
+    "name": "preallocate",
+    "value": "false",
+    "defaultValue": "false"
+  },
+  {
+    "name": "min.cleanable.dirty.ratio",
+    "value": "0.5",
+    "defaultValue": "0.5"
+  },
+  {
+    "name": "index.interval.bytes",
+    "value": "4096",
+    "defaultValue": "4096"
+  },
+  {
+    "name": "unclean.leader.election.enable",
+    "value": "true",
+    "defaultValue": "true"
+  },
+  {
+    "name": "retention.bytes",
+    "value": "-1",
+    "defaultValue": "-1"
+  },
+  {
+    "name": "delete.retention.ms",
+    "value": "86400000",
+    "defaultValue": "86400000"
+  },
+  {
+    "name": "segment.ms",
+    "value": "604800000",
+    "defaultValue": "604800000"
+  },
+  {
+    "name": "message.timestamp.difference.max.ms",
+    "value": "9223372036854775807",
+    "defaultValue": "9223372036854775807"
+  },
+  {
+    "name": "segment.index.bytes",
+    "value": "10485760",
+    "defaultValue": "10485760"
+  }
+]

frontend/mock/payload/topicDetails.json

@@ -0,0 +1,10 @@
+{
+  "partitionCount": 25,
+  "replicationFactor": 1,
+  "replicas": 25,
+  "inSyncReplicas": 25,
+  "bytesInPerSec": 0,
+  "segmentSize": 0,
+  "segmentCount": 25,
+  "underReplicatedPartitions": 0
+}

frontend/mock/payload/topics.json

@@ -0,0 +1,227 @@
+[
+  {
+    "clusterId": "wrYGf-csNgiGdK7B_ADF7Z",
+    "name": "docker-connect-status",
+    "internal": true,
+    "partitions": [
+      {
+        "partition": 0,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": false
+          }
+        ]
+      },
+      {
+        "partition": 1,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 2,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 3,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 4,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "clusterId": "wrYGf-csNgiGdK7B_ADF7Z",
+    "name": "dsadsda",
+    "internal": false,
+    "partitions": [
+      {
+        "partition": 0,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "clusterId": "wrYGf-csNgiGdK7B_ADF7Z",
+    "name": "my-topic",
+    "internal": false,
+    "partitions": [
+      {
+        "partition": 0,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "clusterId": "wrYGf-csNgiGdK7B_ADF7Z",
+    "name": "docker-connect-offsets",
+    "internal": false,
+    "partitions": [
+      {
+        "partition": 0,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 1,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 2,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 3,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 4,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      },
+      {
+        "partition": 5,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "clusterId": "dMMQx-WRh77BKYas_g2ZTz",
+    "name": "_schemas",
+    "internal": false,
+    "partitions": [
+      {
+        "partition": 0,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "clusterId": "dMMQx-WRh77BKYas_g2ZTz",
+    "name": "docker-connect-configs",
+    "internal": false,
+    "partitions": [
+      {
+        "partition": 0,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      }
+    ]
+  },
+  {
+    "clusterId": "dMMQx-WRh77BKYas_g2ZTz",
+    "name": "_kafka-ui-test-topic-monitoring-message-rekey-store",
+    "internal": false,
+    "partitions": [
+      {
+        "partition": 0,
+        "leader": 1,
+        "replicas": [
+          {
+            "broker": 1,
+            "leader": true,
+            "inSync": true
+          }
+        ]
+      }
+    ]
+  }
+]

frontend/package.json

@@ -19,6 +19,7 @@
     "bulma": "^0.8.0",
     "bulma-switch": "^2.0.0",
     "classnames": "^2.2.6",
+    "json-server": "^0.15.1",
     "lodash": "^4.17.15",
     "node-sass": "^4.13.1",
     "react": "^16.12.0",
@@ -37,7 +38,8 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "eject": "react-scripts eject",
+    "mock": "node ./mock/index.js"
   },
   "eslintConfig": {
     "extends": "react-app"

frontend/src/components/App.tsx

@@ -36,6 +36,7 @@ const App: React.FC<AppProps> = ({
         {isClusterListFetched ? (
           <Switch>
             <Route exact path="/" component={Dashboard} />
+            <Route exact path="/clusters" component={Dashboard} />
             <Route path="/clusters/:clusterId/topics" component={TopicsContainer} />
             <Route path="/clusters/:clusterId/brokers" component={BrokersContainer} />
             <Redirect from="/clusters/:clusterId" to="/clusters/:clusterId/brokers" />