This is an automated email from the ASF dual-hosted git repository.

liuyu pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/pulsar.git


The following commit(s) were added to refs/heads/master by this push:
     new f67a92a  [website][upgrade]feat: version list page (#12511)
f67a92a is described below

commit f67a92a47406fadf0a876c5d41a17097129780b9
Author: Li Li <[email protected]>
AuthorDate: Thu Oct 28 09:36:35 2021 +0800

    [website][upgrade]feat: version list page (#12511)
    
    * [website][upgrade]feat: version list page
    
    Signed-off-by: LiLi <[email protected]>
    
    * patch
    
    Signed-off-by: LiLi <[email protected]>
    
    * patch
    
    Signed-off-by: LiLi <[email protected]>
---
 site2/website-next/docs/admin-api-topics.md        |   2 +-
 site2/website-next/docs/client-libraries-java.md   |   7 +-
 site2/website-next/docs/io-influxdb-sink.md        |   7 +
 site2/website-next/docs/io-quickstart.md           |  10 +-
 site2/website-next/docs/reference-cli-tools.md     |   8 +
 site2/website-next/docs/reference-configuration.md |   2 +
 site2/website-next/docs/reference-metrics.md       |   2 +-
 site2/website-next/docs/security-encryption.md     | 281 ++++++++++++++++-----
 .../docs/sql-deployment-configurations.md          |   3 +
 site2/website-next/docusaurus.config.js            |   1 +
 site2/website-next/oldversions.json                |   8 +
 site2/website-next/package.json                    |  16 +-
 site2/website-next/src/components/VersionsTable.js |  67 +++++
 site2/website-next/src/css/custom.css              |   6 +-
 site2/website-next/src/pages/index.js              |   2 +-
 site2/website-next/src/pages/versions.js           |  61 +++++
 site2/website-next/src/utils/index.js              |  10 +-
 site2/website-next/tailwind.config.js              |  12 +-
 .../version-2.7.3/io-influxdb-sink.md              |   7 +
 .../version-2.7.3/reference-metrics.md             |   1 -
 .../version-2.8.0/io-influxdb-sink.md              |   6 +-
 21 files changed, 424 insertions(+), 95 deletions(-)

diff --git a/site2/website-next/docs/admin-api-topics.md 
b/site2/website-next/docs/admin-api-topics.md
index ffd0202..1e5adcd 100644
--- a/site2/website-next/docs/admin-api-topics.md
+++ b/site2/website-next/docs/admin-api-topics.md
@@ -1215,7 +1215,7 @@ $ pulsar-admin topics reset-cursor \
 String topic = "persistent://my-tenant/my-namespace/my-topic";
 String subName = "my-subscription";
 long timestamp = 2342343L;
-admin.topics().skipAllMessages(topic, subName, timestamp);
+admin.topics().resetCursor(topic, subName, timestamp);
 
 ```
 
diff --git a/site2/website-next/docs/client-libraries-java.md 
b/site2/website-next/docs/client-libraries-java.md
index dc54b79..a47c27f 100644
--- a/site2/website-next/docs/client-libraries-java.md
+++ b/site2/website-next/docs/client-libraries-java.md
@@ -152,21 +152,24 @@ Check out the Javadoc for the {@inject: 
javadoc:PulsarClient:/client/org/apache/
 > In addition to client-level configuration, you can also apply 
 > [producer](#configure-producer) and [consumer](#configure-consumer) specific 
 > configuration as described in sections below.
 
 ### Client memory allocator configuration
-You can set the client memory allocator configurations through Java 
properties.<br/>
+You can set the client memory allocator configurations through Java 
properties.<br />
 
 | Property | Type |  <div>Description</div> | Default | Available values
 |---|---|---|---|---
-`pulsar.allocator.pooled` | String | If set to `true`, the client uses a 
direct memory pool. </br> If set to `false`, the client uses a heap memory 
without pool | true | <li> true </li> <li> false </li>
+`pulsar.allocator.pooled` | String | If set to `true`, the client uses a 
direct memory pool. <br /> If set to `false`, the client uses a heap memory 
without pool | true | <li> true </li> <li> false </li> 
 `pulsar.allocator.exit_on_oom` | String | Whether to exit the JVM when OOM 
happens | false |  <li> true </li> <li> false </li>
 `pulsar.allocator.leak_detection` | String | Service URL provider for Pulsar 
service | Disabled | <li> Disabled </li> <li> Simple </li> <li> Advanced </li> 
<li> Paranoid </li>
 `pulsar.allocator.out_of_memory_policy` | String | When an OOM occurs, the 
client throws an exception or fallbacks to heap | FallbackToHeap | <li> 
ThrowException </li> <li> FallbackToHeap </li>
 
 **Example**:
+
 ```
+
 -Dpulsar.allocator.pooled=true
 -Dpulsar.allocator.exit_on_oom=false
 -Dpulsar.allocator.leak_detection=Disabled
 -Dpulsar.allocator.out_of_memory_policy=ThrowException
+
 ```
 
 ## Producer
diff --git a/site2/website-next/docs/io-influxdb-sink.md 
b/site2/website-next/docs/io-influxdb-sink.md
index f6912ed..647ee5d 100644
--- a/site2/website-next/docs/io-influxdb-sink.md
+++ b/site2/website-next/docs/io-influxdb-sink.md
@@ -68,7 +68,9 @@ Before using the InfluxDB sink connector, you need to create 
a configuration fil
 
   
 * YAML
+
   ```yaml
+  
   configs:
       influxdbUrl: "http://localhost:9999";
       organization: "example-org"
@@ -79,7 +81,9 @@ Before using the InfluxDB sink connector, you need to create 
a configuration fil
       gzipEnable: false
       batchTimeMs: 1000
       batchSize: 100
+  
   ```
+
   
 #### InfluxDBv1
 
@@ -103,6 +107,7 @@ Before using the InfluxDB sink connector, you need to 
create a configuration fil
 * YAML
 
   ```yaml
+  
   configs:
       influxdbUrl: "http://localhost:8086";
       database: "test_db"
@@ -112,4 +117,6 @@ Before using the InfluxDB sink connector, you need to 
create a configuration fil
       gzipEnable: false
       batchTimeMs: 1000
       batchSize: 100
+  
   ```
+
diff --git a/site2/website-next/docs/io-quickstart.md 
b/site2/website-next/docs/io-quickstart.md
index 7f1efb6..5215afc 100644
--- a/site2/website-next/docs/io-quickstart.md
+++ b/site2/website-next/docs/io-quickstart.md
@@ -658,7 +658,7 @@ The sink has been created successfully if the following 
message appears.
 
 ```bash
 
-"Created successfully"
+Created successfully
 
 ```
 
@@ -806,7 +806,7 @@ The sink instance has been stopped successfully if the 
following message disappe
 
 ```bash
 
-"Stopped successfully"
+Stopped successfully
 
 ```
 
@@ -834,7 +834,7 @@ The sink instance has been started successfully if the 
following message disappe
 
 ```bash
 
-"Started successfully"
+Started successfully
 
 ```
 
@@ -871,7 +871,7 @@ The sink connector has been updated successfully if the 
following message disapp
 
 ```bash
 
-"Updated successfully"
+Updated successfully
 
 ```
 
@@ -940,7 +940,7 @@ The sink connector has been deleted successfully if the 
following message appear
 
 ```text
 
-"Deleted successfully"
+Deleted successfully
 
 ```
 
diff --git a/site2/website-next/docs/reference-cli-tools.md 
b/site2/website-next/docs/reference-cli-tools.md
index af1cd0f..5792cc6 100644
--- a/site2/website-next/docs/reference-cli-tools.md
+++ b/site2/website-next/docs/reference-cli-tools.md
@@ -442,6 +442,7 @@ $ pulsar-daemon command
 Commands
 * `start`
 * `stop`
+* `restart`
 
 
 ### `start`
@@ -472,7 +473,14 @@ Options
 |---|---|---|
 |-force|Stop the service forcefully if not stopped by normal shutdown.|false|
 
+### `restart`
+Restart a service that has already been started.
 
+```bash
+
+$ pulsar-daemon restart service
+
+```
 
 ## `pulsar-perf`
 A tool for performance testing a Pulsar broker.
diff --git a/site2/website-next/docs/reference-configuration.md 
b/site2/website-next/docs/reference-configuration.md
index 53c4cbf..a064609 100644
--- a/site2/website-next/docs/reference-configuration.md
+++ b/site2/website-next/docs/reference-configuration.md
@@ -483,6 +483,8 @@ You can set the log level and configuration in the  
[log4j2.yaml](https://github
 |subscribeRatePeriodPerConsumerInSecond|Rate period for 
{subscribeThrottlingRatePerConsumer}. By default, it is 30s.|30|
 | dispatchThrottlingRatePerTopicInMsg | Default messages (per second) dispatch 
throttling-limit for every topic. When the value is set to 0, default message 
dispatch throttling-limit is disabled. |0 |
 | dispatchThrottlingRatePerTopicInByte | Default byte (per second) dispatch 
throttling-limit for every topic. When the value is set to 0, default byte 
dispatch throttling-limit is disabled. | 0|
+| dispatchThrottlingOnBatchMessageEnabled |Apply dispatch rate limiting on 
batch message instead individual messages with in batch message. (Default is 
disabled). | false|
+
 | dispatchThrottlingRateRelativeToPublishRate | Enable dispatch rate-limiting 
relative to publish rate. | false |
 |dispatchThrottlingRatePerSubscriptionInMsg|The defaulted number of message 
dispatching throttling-limit for a subscription. The value of 0 disables 
message dispatch-throttling.|0|
 |dispatchThrottlingRatePerSubscriptionInByte|The default number of 
message-bytes dispatching throttling-limit for a subscription. The value of 0 
disables message-byte dispatch-throttling.|0|
diff --git a/site2/website-next/docs/reference-metrics.md 
b/site2/website-next/docs/reference-metrics.md
index cd4609f..854b515 100644
--- a/site2/website-next/docs/reference-metrics.md
+++ b/site2/website-next/docs/reference-metrics.md
@@ -311,7 +311,7 @@ All the loadbalancing metrics are labelled with the 
following labels:
 | pulsar_lb_bandwidth_in_usage | Gauge | The broker inbound bandwith usage (in 
percent). |
 | pulsar_lb_bandwidth_out_usage | Gauge | The broker outbound bandwith usage 
(in percent). |
 | pulsar_lb_cpu_usage | Gauge | The broker cpu usage (in percent). |
-| pulsar_lb_directMemory_usage | Gauge | The broker process direct memory 
usage (in percent). |
+| pulsar_lb_directMemory_usage | Gauge | The broker process direct memory 
usage (in percent). | 
 | pulsar_lb_memory_usage | Gauge | The broker process memory usage (in 
percent). |
 
 #### BundleUnloading metrics
diff --git a/site2/website-next/docs/security-encryption.md 
b/site2/website-next/docs/security-encryption.md
index 04c32c2..419e6d7 100644
--- a/site2/website-next/docs/security-encryption.md
+++ b/site2/website-next/docs/security-encryption.md
@@ -45,65 +45,202 @@ openssl ec -in test_ecdsa_privkey.pem -pubout -outform pem 
-out test_ecdsa_pubke
 
 4. Add encryption key name to producer builder: 
PulsarClient.newProducer().addEncryptionKey("myapp.key").
 
-5. Add CryptoKeyReader implementation to producer or consumer builder: 
PulsarClient.newProducer().cryptoKeyReader(keyReader) / 
PulsarClient.newConsumer().cryptoKeyReader(keyReader).
-
-6. Sample producer application:
+5. Configure a `CryptoKeyReader` to a producer, consumer or reader. 
+
+<Tabs 
+  defaultValue="Java"
+  values={[
+  {
+    "label": "Java",
+    "value": "Java"
+  },
+  {
+    "label": "C++",
+    "value": "C++"
+  },
+  {
+    "label": "Python",
+    "value": "Python"
+  },
+  {
+    "label": "Node.JS",
+    "value": "Node.JS"
+  }
+]}>
+<TabItem value="Java">
 
 ```java
 
-class RawFileKeyReader implements CryptoKeyReader {
+PulsarClient pulsarClient = 
PulsarClient.builder().serviceUrl("pulsar://localhost:6650").build();
+String topic = "persistent://my-tenant/my-ns/my-topic";
+// RawFileKeyReader is just an example implementation that's not provided by 
Pulsar
+CryptoKeyReader keyReader = new RawFileKeyReader("test_ecdsa_pubkey.pem", 
"test_ecdsa_privkey.pem");
+
+Producer<byte[]> producer = pulsarClient.newProducer()
+        .topic(topic)
+        .cryptoKeyReader(keyReader)
+        .addEncryptionKey(“myappkey”)
+        .create();
+
+Consumer<byte[]> consumer = pulsarClient.newConsumer()
+        .topic(topic)
+        .subscriptionName("my-subscriber-name")
+        .cryptoKeyReader(keyReader)
+        .subscribe();
+
+Reader<byte[]> reader = pulsarClient.newReader()
+        .topic(topic)
+        .startMessageId(MessageId.earliest)
+        .cryptoKeyReader(keyReader)
+        .create();
 
-    String publicKeyFile = "";
-    String privateKeyFile = "";
+```
 
-    RawFileKeyReader(String pubKeyFile, String privKeyFile) {
-        publicKeyFile = pubKeyFile;
-        privateKeyFile = privKeyFile;
-    }
+</TabItem>
+<TabItem value="C++">
 
-    @Override
-    public EncryptionKeyInfo getPublicKey(String keyName, Map<String, String> 
keyMeta) {
-        EncryptionKeyInfo keyInfo = new EncryptionKeyInfo();
-        try {
-            keyInfo.setKey(Files.readAllBytes(Paths.get(publicKeyFile)));
-        } catch (IOException e) {
-            System.out.println("ERROR: Failed to read public key from file " + 
publicKeyFile);
-            e.printStackTrace();
-        }
-        return keyInfo;
-    }
+```c++
 
-    @Override
-    public EncryptionKeyInfo getPrivateKey(String keyName, Map<String, String> 
keyMeta) {
-        EncryptionKeyInfo keyInfo = new EncryptionKeyInfo();
-        try {
-            keyInfo.setKey(Files.readAllBytes(Paths.get(privateKeyFile)));
-        } catch (IOException e) {
-            System.out.println("ERROR: Failed to read private key from file " 
+ privateKeyFile);
-            e.printStackTrace();
-        }
-        return keyInfo;
-    }
-}
+Client client("pulsar://localhost:6650");
+std::string topic = "persistent://my-tenant/my-ns/my-topic";
+// DefaultCryptoKeyReader is a built-in implementation that reads public key 
and private key from files
+auto keyReader = 
std::make_shared<DefaultCryptoKeyReader>("test_ecdsa_pubkey.pem", 
"test_ecdsa_privkey.pem");
 
-PulsarClient pulsarClient = 
PulsarClient.builder().serviceUrl("pulsar://localhost:6650").build();
+Producer producer;
+ProducerConfiguration producerConf;
+producerConf.setCryptoKeyReader(keyReader);
+producerConf.addEncryptionKey("myappkey");
+client.createProducer(topic, producerConf, producer);
+
+Consumer consumer;
+ConsumerConfiguration consumerConf;
+consumerConf.setCryptoKeyReader(keyReader);
+client.subscribe(topic, "my-subscriber-name", consumerConf, consumer);
+
+Reader reader;
+ReaderConfiguration readerConf;
+readerConf.setCryptoKeyReader(keyReader);
+client.createReader(topic, MessageId::earliest(), readerConf, reader);
+
+```
+
+</TabItem>
+<TabItem value="Python">
+
+```python
+
+from pulsar import Client, CryptoKeyReader
 
-Producer producer = pulsarClient.newProducer()
-                .topic("persistent://my-tenant/my-ns/my-topic")
-                .addEncryptionKey("myappkey")
-                .cryptoKeyReader(new RawFileKeyReader("test_ecdsa_pubkey.pem", 
"test_ecdsa_privkey.pem"))
-                .create();
+client = Client('pulsar://localhost:6650')
+topic = 'persistent://my-tenant/my-ns/my-topic'
+# CryptoKeyReader is a built-in implementation that reads public key and 
private key from files
+key_reader = CryptoKeyReader('test_ecdsa_pubkey.pem', 'test_ecdsa_privkey.pem')
+
+producer = client.create_producer(
+    topic=topic,
+    encryption_key='myappkey',
+    crypto_key_reader=key_reader
+)
+
+consumer = client.subscribe(
+    topic=topic,
+    subscription_name='my-subscriber-name',
+    crypto_key_reader=key_reader
+)
+
+reader = client.create_reader(
+    topic=topic,
+    start_message_id=MessageId.earliest,
+    crypto_key_reader=key_reader
+)
+
+client.close()
+
+```
+
+</TabItem>
+<TabItem value="Node.JS">
+
+```nodejs
+
+const Pulsar = require('pulsar-client');
+
+(async () => {
+// Create a client
+const client = new Pulsar.Client({
+    serviceUrl: 'pulsar://localhost:6650',
+    operationTimeoutSeconds: 30,
+});
+
+// Create a producer
+const producer = await client.createProducer({
+    topic: 'persistent://public/default/my-topic',
+    sendTimeoutMs: 30000,
+    batchingEnabled: true,
+    publicKeyPath: "public-key.client-rsa.pem",
+    encryptionKey: "encryption-key"
+});
+
+// Create a consumer
+const consumer = await client.subscribe({
+    topic: 'persistent://public/default/my-topic',
+    subscription: 'sub1',
+    subscriptionType: 'Shared',
+    ackTimeoutMs: 10000,
+    privateKeyPath: "private-key.client-rsa.pem"
+});
+
+// Send messages
+for (let i = 0; i < 10; i += 1) {
+    const msg = `my-message-${i}`;
+    producer.send({
+    data: Buffer.from(msg),
+    });
+    console.log(`Sent message: ${msg}`);
+}
+await producer.flush();
 
-for (int i = 0; i < 10; i++) {
-    producer.send("my-message".getBytes());
+// Receive messages
+for (let i = 0; i < 10; i += 1) {
+    const msg = await consumer.receive();
+    console.log(msg.getData().toString());
+    consumer.acknowledge(msg);
 }
 
-producer.close();
-pulsarClient.close();
+await consumer.close();
+await producer.close();
+await client.close();
+})();
 
 ```
 
-7. Sample Consumer Application:
+</TabItem>
+
+</Tabs>
+
+6. Below is an example of a **customized** `CryptoKeyReader` implementation.
+
+<Tabs 
+  defaultValue="Java"
+  values={[
+  {
+    "label": "Java",
+    "value": "Java"
+  },
+  {
+    "label": "C++",
+    "value": "C++"
+  },
+  {
+    "label": "Python",
+    "value": "Python"
+  },
+  {
+    "label": "Node.JS",
+    "value": "Node.JS"
+  }
+]}>
+<TabItem value="Java">
 
 ```java
 
@@ -142,27 +279,49 @@ class RawFileKeyReader implements CryptoKeyReader {
     }
 }
 
-PulsarClient pulsarClient = 
PulsarClient.builder().serviceUrl("pulsar://localhost:6650").build();
-Consumer consumer = pulsarClient.newConsumer()
-                .topic("persistent://my-tenant/my-ns/my-topic")
-                .subscriptionName("my-subscriber-name")
-                .cryptoKeyReader(new RawFileKeyReader("test_ecdsa_pubkey.pem", 
"test_ecdsa_privkey.pem"))
-                .subscribe();
-Message msg = null;
-
-for (int i = 0; i < 10; i++) {
-    msg = consumer.receive();
-    // do something
-    System.out.println("Received: " + new String(msg.getData()));
-}
+```
+
+</TabItem>
+<TabItem value="C++">
+
+```c++
+
+class CustomCryptoKeyReader : public CryptoKeyReader {
+    public:
+    Result getPublicKey(const std::string& keyName, std::map<std::string, 
std::string>& metadata,
+                        EncryptionKeyInfo& encKeyInfo) const override {
+        // TODO:
+        return ResultOk;
+    }
+
+    Result getPrivateKey(const std::string& keyName, std::map<std::string, 
std::string>& metadata,
+                        EncryptionKeyInfo& encKeyInfo) const override {
+        // TODO:
+        return ResultOk;
+    }
+};
 
-// Acknowledge the consumption of all messages at once
-consumer.acknowledgeCumulative(msg);
-consumer.close();
-pulsarClient.close();
+auto keyReader = std::make_shared<CustomCryptoKeyReader>(/* ... */);
+// TODO: create producer, consumer or reader based on keyReader here
 
 ```
 
+Besides, you can use the **default** implementation of `CryptoKeyReader` by 
specifying the paths of `private key` and `public key`.
+
+</TabItem>
+<TabItem value="Python">
+
+Currently, **customized** `CryptoKeyReader` implementation is not supported in 
Python. However, you can use the **default** implementation by specifying the 
path of `private key` and `public key`.
+
+</TabItem>
+<TabItem value="Node.JS">
+
+Currently, **customized** `CryptoKeyReader` implementation is not supported in 
Node.JS. However, you can use the **default** implementation by specifying the 
path of `private key` and `public key`.
+
+</TabItem>
+
+</Tabs>
+
 ## Key rotation
 Pulsar generates a new AES data key every 4 hours or after publishing a 
certain number of messages. A producer fetches the asymmetric public key every 
4 hours by calling CryptoKeyReader.getPublicKey() to retrieve the latest 
version.
 
diff --git a/site2/website-next/docs/sql-deployment-configurations.md 
b/site2/website-next/docs/sql-deployment-configurations.md
index 0a74c33..48f99e4 100644
--- a/site2/website-next/docs/sql-deployment-configurations.md
+++ b/site2/website-next/docs/sql-deployment-configurations.md
@@ -30,6 +30,9 @@ pulsar.entry-read-batch-size=100
 # default number of splits to use per query
 pulsar.target-num-splits=4
 
+# max size of one batch message (default value is 5MB)
+pulsar.max-message-size=5242880
+
 ```
 
 You can connect Presto to a Pulsar cluster with multiple hosts. To configure 
multiple hosts for brokers, add multiple URLs to `pulsar.web-service-url`. To 
configure multiple hosts for ZooKeeper, add multiple URIs to 
`pulsar.zookeeper-uri`. The following is an example.
diff --git a/site2/website-next/docusaurus.config.js 
b/site2/website-next/docusaurus.config.js
index 36b40b7..7d3f4a4 100644
--- a/site2/website-next/docusaurus.config.js
+++ b/site2/website-next/docusaurus.config.js
@@ -115,6 +115,7 @@ module.exports = {
           position: "left",
           label: "Docs",
         },
+        { to: "/versions", label: "Versions", position: "left" },
         { to: "/blog", label: "Blog", position: "left" },
         {
           href: "https://github.com/apache/pulsar";,
diff --git a/site2/website-next/oldversions.json 
b/site2/website-next/oldversions.json
new file mode 100644
index 0000000..a83f27f
--- /dev/null
+++ b/site2/website-next/oldversions.json
@@ -0,0 +1,8 @@
+[
+    "2.0.1-incubating",
+    "2.0.0-rc1-incubating",
+    "1.22.0-incubating",
+    "1.21.0-incubating",
+    "1.20.0-incubating",
+    "1.19.0-incubating"
+]
diff --git a/site2/website-next/package.json b/site2/website-next/package.json
index 785bcdf..ff48623 100644
--- a/site2/website-next/package.json
+++ b/site2/website-next/package.json
@@ -14,25 +14,25 @@
     "write-heading-ids": "docusaurus write-heading-ids"
   },
   "dependencies": {
-    "@docusaurus/core": "2.0.0-beta.7",
-    "@docusaurus/plugin-client-redirects": "^2.0.0-beta.7",
-    "@docusaurus/preset-classic": "2.0.0-beta.7",
+    "@docusaurus/core": "2.0.0-beta.8",
+    "@docusaurus/plugin-client-redirects": "^2.0.0-beta.8",
+    "@docusaurus/preset-classic": "2.0.0-beta.8",
     "@emotion/react": "^11.5.0",
     "@emotion/styled": "^11.3.0",
     "@mdx-js/react": "^1.6.22",
-    "@mui/material": "^5.0.4",
+    "@mui/material": "^5.0.6",
     "@svgr/webpack": "^5.5.0",
     "clsx": "^1.1.1",
     "file-loader": "^6.2.0",
     "install": "^0.13.0",
-    "npm": "^8.1.0",
+    "npm": "^8.1.1",
     "prism-react-renderer": "^1.2.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-markdown": "^7.0.1",
-    "react-svg": "^14.0.16",
+    "react-markdown": "^7.1.0",
+    "react-svg": "^14.0.17",
     "remark-linkify-regex": "^1.0.0",
-    "replace-in-file": "^6.3.1",
+    "replace-in-file": "^6.3.2",
     "url-loader": "^4.1.1"
   },
   "browserslist": {
diff --git a/site2/website-next/src/components/VersionsTable.js 
b/site2/website-next/src/components/VersionsTable.js
new file mode 100644
index 0000000..82352b6
--- /dev/null
+++ b/site2/website-next/src/components/VersionsTable.js
@@ -0,0 +1,67 @@
+import * as React from "react";
+import Table from "@mui/material/Table";
+import TableBody from "@mui/material/TableBody";
+import TableCell from "@mui/material/TableCell";
+import TableRow from "@mui/material/TableRow";
+import Link from "@mui/material/Link";
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+import { docUrl } from "../utils/index";
+const versions = require("../../versions.json");
+
+export default function VersionsTable(props) {
+  const { siteConfig } = useDocusaurusContext();
+  const latestStableVersion = versions[0];
+
+  const repoUrl = 
`https://github.com/${siteConfig.organizationName}/${siteConfig.projectName}`;
+  return (
+    <Table size="small" sx={{ maxWidth: 500 }}>
+      <TableBody>
+        {props.data.map((row) => (
+          <TableRow key={row.name}>
+            <TableCell
+              className="border-gray-300"
+              sx={{ border: 1, color: "inherit" }}
+              align="left font-bold"
+            >
+              <p>{row.name}</p>
+            </TableCell>
+            <TableCell
+              className="border-gray-300"
+              sx={{ border: 1 }}
+              align="center"
+            >
+              <Link
+                className="text-primary"
+                href={docUrl(
+                  "",
+                  "",
+                  row.name == latestStableVersion ? "" : row.name
+                )}
+                underline="none"
+              >
+                Documentation
+              </Link>
+            </TableCell>
+            <TableCell
+              className="border-gray-300"
+              sx={{ border: 1 }}
+              align="center"
+            >
+              <Link
+                className="text-primary"
+                href={
+                  row.name == "next"
+                    ? repoUrl
+                    : `${siteConfig.baseUrl}release-notes#${row.name}`
+                }
+                underline="none"
+              >
+                {row.name == "next" ? "Source Code" : "Release Notes"}
+              </Link>
+            </TableCell>
+          </TableRow>
+        ))}
+      </TableBody>
+    </Table>
+  );
+}
diff --git a/site2/website-next/src/css/custom.css 
b/site2/website-next/src/css/custom.css
index a15083b..d090ca9 100644
--- a/site2/website-next/src/css/custom.css
+++ b/site2/website-next/src/css/custom.css
@@ -12,9 +12,9 @@
   @tailwind screens;
 }
 
-/* .section {
-  @apply max-w-screen-xl xl:max-w-screen-xl px-8 container;
-} */
+.tailwind .section {
+  @apply max-w-screen-xl container mx-auto;
+}
 
 svg {
   width: inherit;
diff --git a/site2/website-next/src/pages/index.js 
b/site2/website-next/src/pages/index.js
index a412a18..3373450 100644
--- a/site2/website-next/src/pages/index.js
+++ b/site2/website-next/src/pages/index.js
@@ -15,7 +15,7 @@ function HomepageHeader(props) {
     <header className={clsx("tailwind hero", styles.heroBanner)}>
       <div className="flex flex-col items-center container mt-24">
         <Svg src="/img/pulsar.svg" className="h-36" />
-        <h3 className="mt-12 font-medium mb-12">{siteConfig.tagline}</h3>
+        <h2 className="mt-12 font-medium mb-12">{siteConfig.tagline}</h2>
         <Stack spacing={2} direction="row">
           <Button
             variant="contained"
diff --git a/site2/website-next/src/pages/versions.js 
b/site2/website-next/src/pages/versions.js
new file mode 100644
index 0000000..10a06b5
--- /dev/null
+++ b/site2/website-next/src/pages/versions.js
@@ -0,0 +1,61 @@
+import * as React from "react";
+import Layout from "@theme/Layout";
+import Table from "@mui/material/Table";
+import TableBody from "@mui/material/TableBody";
+import TableCell from "@mui/material/TableCell";
+import TableRow from "@mui/material/TableRow";
+import Link from "@mui/material/Link";
+import VersionsTable from "../components/VersionsTable";
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+import { docUrl } from "../utils/index";
+const versions = require("../../versions.json");
+const oldversions = require("../../oldversions.json");
+
+export default function DenseTable() {
+  const { siteConfig } = useDocusaurusContext();
+  const latestStableVersion = versions[0];
+  const repoUrl = 
`https://github.com/${siteConfig.organizationName}/${siteConfig.projectName}`;
+  return (
+    <Layout>
+      <div className="tailwind">
+        <div className="my-12 container">
+          <h1 className="mb-6">{siteConfig.title} Versions</h1>
+          <h3 className="mb-4" id="latest">
+            Latest Stable Version
+          </h3>
+          <p className="mb-2">Latest stable release of Apache Pulsar.</p>
+          <VersionsTable
+            data={[{ name: latestStableVersion }]}
+            type="stable"
+          ></VersionsTable>
+          <h3 className="mt-8 mb-4" id="latest">
+            Latest Version
+          </h3>
+          <p className="mb-2">
+            Here you can find the latest documentation and unreleased code.
+          </p>
+          <VersionsTable
+            data={[{ name: "next" }]}
+            type="stable"
+          ></VersionsTable>
+          <h3 className="mt-8 mb-4" id="latest">
+            Past Version
+          </h3>
+          <p className="mb-2">
+            Here you can find documentation for previous versions of Apache
+            Pulsar.
+          </p>
+          <VersionsTable
+            data={versions
+              .filter((item) => item != latestStableVersion)
+              .concat(oldversions)
+              .map((item) => ({
+                name: item
+              }))}
+            type="stable"
+          ></VersionsTable>
+        </div>
+      </div>
+    </Layout>
+  );
+}
diff --git a/site2/website-next/src/utils/index.js 
b/site2/website-next/src/utils/index.js
index adbdf80..db16e02 100644
--- a/site2/website-next/src/utils/index.js
+++ b/site2/website-next/src/utils/index.js
@@ -8,8 +8,14 @@ export function imgUrl(img) {
   return siteConfig.baseUrl + "img/" + img;
 }
 
-export function docUrl(doc, language) {
-  return siteConfig.baseUrl + "docs/" + (language ? language + "/" : "") + doc;
+export function docUrl(doc, language, version) {
+  return (
+    siteConfig.baseUrl +
+    "docs/" +
+    (language ? language + "/" : "") +
+    (version ? version + "/" : "") +
+    (doc ? doc : "")
+  );
 }
 
 export function pageUrl(page, language) {
diff --git a/site2/website-next/tailwind.config.js 
b/site2/website-next/tailwind.config.js
index 60fdd35..3a047b5 100644
--- a/site2/website-next/tailwind.config.js
+++ b/site2/website-next/tailwind.config.js
@@ -17,27 +17,27 @@ module.exports = {
     plugin(function ({ addBase, config }) {
       addBase({
         h1: {
-          fontSize: config("theme.fontSize.6xl"),
+          fontSize: config("theme.fontSize.4xl"),
           fontWeight: config("theme.fontWeight.bold"),
         },
         h2: {
-          fontSize: config("theme.fontSize.5xl"),
+          fontSize: config("theme.fontSize.3xl"),
           fontWeight: config("theme.fontWeight.bold"),
         },
         h3: {
-          fontSize: config("theme.fontSize.4xl"),
+          fontSize: config("theme.fontSize.2xl"),
           fontWeight: config("theme.fontWeight.bold"),
         },
         h4: {
-          fontSize: config("theme.fontSize.3xl"),
+          fontSize: config("theme.fontSize.xl"),
           fontWeight: config("theme.fontWeight.bold"),
         },
         h5: {
-          fontSize: config("theme.fontSize.2xl"),
+          fontSize: config("theme.fontSize.lg"),
           fontWeight: config("theme.fontWeight.bold"),
         },
         h6: {
-          fontSize: config("theme.fontSize.xl"),
+          fontSize: config("theme.fontSize.base"),
           fontWeight: config("theme.fontWeight.bold"),
         },
       });
diff --git 
a/site2/website-next/versioned_docs/version-2.7.3/io-influxdb-sink.md 
b/site2/website-next/versioned_docs/version-2.7.3/io-influxdb-sink.md
index d2dbeed..4023423 100644
--- a/site2/website-next/versioned_docs/version-2.7.3/io-influxdb-sink.md
+++ b/site2/website-next/versioned_docs/version-2.7.3/io-influxdb-sink.md
@@ -69,7 +69,9 @@ Before using the InfluxDB sink connector, you need to create 
a configuration fil
 
   
 * YAML
+
   ```yaml
+  
   configs:
       influxdbUrl: "http://localhost:9999";
       organization: "example-org"
@@ -80,7 +82,9 @@ Before using the InfluxDB sink connector, you need to create 
a configuration fil
       gzipEnable: false
       batchTimeMs: 1000
       batchSize: 100
+  
   ```
+
   
 #### InfluxDBv1
 
@@ -104,6 +108,7 @@ Before using the InfluxDB sink connector, you need to 
create a configuration fil
 * YAML
 
   ```yaml
+  
   configs:
       influxdbUrl: "http://localhost:8086";
       database: "test_db"
@@ -113,4 +118,6 @@ Before using the InfluxDB sink connector, you need to 
create a configuration fil
       gzipEnable: false
       batchTimeMs: 1000
       batchSize: 100
+  
   ```
+
diff --git 
a/site2/website-next/versioned_docs/version-2.7.3/reference-metrics.md 
b/site2/website-next/versioned_docs/version-2.7.3/reference-metrics.md
index 89c3275..3e2326a 100644
--- a/site2/website-next/versioned_docs/version-2.7.3/reference-metrics.md
+++ b/site2/website-next/versioned_docs/version-2.7.3/reference-metrics.md
@@ -25,7 +25,6 @@ The following types of metrics are available:
 - [Counter](https://prometheus.io/docs/concepts/metric_types/#counter): a 
cumulative metric that represents a single monotonically increasing counter. 
The value increases by default. You can reset the value to zero or restart your 
cluster.
 - [Gauge](https://prometheus.io/docs/concepts/metric_types/#gauge): a metric 
that represents a single numerical value that can arbitrarily go up and down.
 - [Histogram](https://prometheus.io/docs/concepts/metric_types/#histogram): a 
histogram samples observations (usually things like request durations or 
response sizes) and counts them in configurable buckets. The `_bucket` suffix 
is the number of observations within a histogram bucket, configured with 
parameter `{le="<upper inclusive bound>"}`. The `_count` suffix is the number 
of observations, shown as a time series and behaves like a counter. The `_sum` 
suffix is the sum of observed val [...]
-
 - [Summary](https://prometheus.io/docs/concepts/metric_types/#summary): 
similar to a histogram, a summary samples observations (usually things like 
request durations and response sizes). While it also provides a total count of 
observations and a sum of all observed values, it calculates configurable 
quantiles over a sliding time window.
 
 ## ZooKeeper
diff --git 
a/site2/website-next/versioned_docs/version-2.8.0/io-influxdb-sink.md 
b/site2/website-next/versioned_docs/version-2.8.0/io-influxdb-sink.md
index 0a0593e..4023423 100644
--- a/site2/website-next/versioned_docs/version-2.8.0/io-influxdb-sink.md
+++ b/site2/website-next/versioned_docs/version-2.8.0/io-influxdb-sink.md
@@ -72,7 +72,7 @@ Before using the InfluxDB sink connector, you need to create 
a configuration fil
 
   ```yaml
   
-  {
+  configs:
       influxdbUrl: "http://localhost:9999";
       organization: "example-org"
       bucket: "example-bucket"
@@ -82,7 +82,6 @@ Before using the InfluxDB sink connector, you need to create 
a configuration fil
       gzipEnable: false
       batchTimeMs: 1000
       batchSize: 100
-  }
   
   ```
 
@@ -110,7 +109,7 @@ Before using the InfluxDB sink connector, you need to 
create a configuration fil
 
   ```yaml
   
-  {
+  configs:
       influxdbUrl: "http://localhost:8086";
       database: "test_db"
       consistencyLevel: "ONE"
@@ -119,7 +118,6 @@ Before using the InfluxDB sink connector, you need to 
create a configuration fil
       gzipEnable: false
       batchTimeMs: 1000
       batchSize: 100
-  }
   
   ```
 

Reply via email to