update: start explorer docs (#6102)

* update: start explorer docs

* fix(explorer): Add Explorer to products.yml, move to version folder, add get-started step nav, cleanup

* Updated explorer directory structure, homepage, and beta styling (#6108)

* updated explorer dirctory struction, homepage, and beta styling

* clean up homepage state tags

* Add InfluxDB 3 Explorer installation documentation (#6111)

* InfluxDB 3 Explorer installation instructions

* fixed broken links

* Apply suggestions from code review

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* update: add getting started video

* updated to address PR feedback

* adjust page weights for explorer docs

* other minor updates

* more minor updates

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Peter Barnett <peter.barnett03@gmail.com>

---------

Co-authored-by: Jason Stirnaman <stirnamanj@gmail.com>
Co-authored-by: Scott Anderson <sanderson@users.noreply.github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

assets/styles/layouts/_homepage.scss

@@ -105,7 +105,7 @@
     .product {
       padding: 0 1rem;
       display: flex;
-      flex: 1 1 50%;
+      flex: 1 1 33%;
       flex-direction: column;
       justify-content: space-between;
       max-width: 33%;
@@ -118,11 +118,10 @@
           line-height: 1.5rem;
           color: rgba($article-text, .7);
         }
-      }
 
-      &.new {
+        h3[state] {
-        .product-info h3::after {
+          &::after {
-          content: "New";
+          content: attr(state);
           margin-left: .5rem;
           font-size: 1rem;
           padding: .25em .5em .25em .4em;
@@ -132,6 +131,8 @@
           font-style: italic;
           vertical-align: middle;
         }
+
+        }
       }
 
       ul.product-links {
@@ -227,6 +228,30 @@
       background: $article-bg;
     }
 
+    .categories {
+      display: flex;
+      flex-direction: row;
+      flex-wrap: wrap;
+      // margin: 0 -1rem;
+      width: calc(100% + 2rem);
+
+      .category {
+        &.full-width {
+          width: 100%;
+        }
+        &.two-thirds {
+          width: 66.66%;
+          .product { max-width: 50%; }
+        }
+        &.one-third {
+          width: 33.33%;
+          .product {
+            max-width: 100%;
+          }
+        }
+      }
+    }
+
     .category-head{
       margin: 1rem 0 2rem;
       &::after {
@@ -234,6 +259,7 @@
         display: block;
         border-top: 1px solid $article-hr;
         margin-top: -1.15rem;
+        width: calc(100% - 2rem);
       }
     }
   }
@@ -441,6 +467,16 @@
           ul {margin-bottom: 0;}
         }
       }
+      .categories .category {
+        &.two-thirds {
+          width: 100%;
+          .product { max-width: 100%; }
+        }
+        &.one-third {
+          width: 100%;
+          .product { max-width: 100%; }
+        }
+      }
     }
     #telegraf {
       flex-direction: column;

assets/styles/layouts/article/_blocks.scss

@@ -96,4 +96,5 @@ blockquote {
   "blocks/tip",
   "blocks/important",
   "blocks/warning",
-  "blocks/caution";
+  "blocks/caution",
+  "blocks/beta";

assets/styles/layouts/article/blocks/_beta.scss

@@ -0,0 +1,105 @@
+.block.beta {
+  @include gradient($grad-burningDusk);
+  padding: 4px;
+  border: none;
+  border-radius: 25px !important;
+
+  .beta-content {
+    background: $article-bg;
+    border-radius: 21px;
+    padding: calc(1.65rem - 4px) calc(2rem - 4px) calc(.1rem + 4px) calc(2rem - 4px);
+
+    h4 { 
+      color: $article-heading;
+    }
+
+    p {margin-bottom: 1rem;}
+
+    .expand-wrapper {
+      border: none;
+      margin: .5rem 0 1.5rem;
+    }
+    .expand {
+      border: none;
+      padding: 0;
+
+      .expand-content p {
+        margin-left: 2rem;
+      }
+
+      ul {
+
+        margin-top: -1rem;
+
+        &.feedback-channels {
+
+          padding: 0;
+          margin: -1rem 0 1.5rem 2rem;
+          list-style: none;
+
+          a {
+            color: $article-heading;
+            font-weight: $medium;
+            position: relative;
+
+            &.discord:before {
+              content: url('/svgs/discord.svg');
+              display: inline-block;
+              height: 1.1rem;
+              width: 1.25rem;
+              vertical-align: top;
+              margin: 2px .65rem 0 0;
+            }
+
+            &.community:before {
+              content: "\e900";
+              color: $article-heading;
+              margin: 0 .65rem 0 0;
+              font-size: 1.2rem;
+              font-family: 'icomoon-v2';
+              vertical-align: middle;
+            }
+
+            &.slack:before {
+              content: url('/svgs/slack.svg');
+              display: inline-block;
+              height: 1.1rem;
+              width: 1.1rem;
+              vertical-align: text-top;
+              margin-right: .65rem;
+            }
+
+            &.reddit:before {
+              content: url('/svgs/reddit.svg');
+              display: inline-block;
+              height: 1.1rem;
+              width: 1.2rem;
+              vertical-align: top;
+              margin: 2px .65rem 0 0;
+            }
+
+            &::after {
+              content: "\e90a";
+              font-family: 'icomoon-v4';
+              font-weight: bold;
+              font-size: 1.3rem;
+              display: inline-block;
+              position: absolute;
+              @include gradient($grad-burningDusk);
+              background-clip: text;
+              -webkit-text-fill-color: transparent;
+              right: 0;
+              transform: translateX(.25rem);
+              opacity: 0;
+              transition: transform .2s, opacity .2s;
+            }
+
+            &:hover {
+              &::after {transform: translateX(1.5rem); opacity: 1;}
+            }
+          } 
+        }       
+      }
+    }
+  }
+}

content/influxdb3/explorer/_index.md

@@ -0,0 +1,36 @@
+---
+title: InfluxDB 3 Explorer documentation
+description: >
+  InfluxDB 3 Explorer is a standalone web-based interface for interacting with InfluxDB 3 Core and Enterprise. Visualize, query, and manage your time series data efficiently.
+menu:
+  influxdb3_explorer:
+    name: InfluxDB 3 Explorer
+weight: 1
+---
+
+InfluxDB 3 Explorer is the standalone web application designed for visualizing, querying, and managing your data stored in InfluxDB 3 Core and Enterprise.
+Explorer provides an intuitive interface for interacting with your time series data, streamlining database operations and enhancing data insights.
+
+## Key features
+
+Use InfluxDB 3 Explorer for:
+
+- **Database and query management**: Create and manage InfluxDB 3 databases, admin and resource tokens, and configure new InfluxDB 3 Enterprise instances
+- **Data visualization and analysis**: Query data with a built-in visualizer for enhanced data insights  
+- **Data ingestion**: Write new data and setup Telegraf configurations
+
+## Quick start
+
+Run the Docker image to start InfluxDB 3 Explorer:
+
+```sh
+docker run --detach \
+  --name influxdb3-explorer \
+  --publish 8888:80 \
+  --publish 8889:8888 \
+  --env MODE=admin \
+  quay.io/influxdb/influxdb3-explorer:latest
+```
+
+<a class="btn" href="/influxdb3/explorer/install/">Install and run InfluxDB 3 Explorer</a>  
+<a class="btn" href="/influxdb3/explorer/get-started/">Get started with InfluxDB 3 Explorer</a>

content/influxdb3/explorer/about/_index.md

@@ -0,0 +1,28 @@
+---
+title: About the InfluxDB 3 Explorer project
+description: >
+  Learn about InfluxDB 3 Explorer, the user interface and query tool for InfluxDB 3.
+menu:
+  influxdb3_explorer:
+    name: About Explorer
+weight: 10
+---
+
+InfluxDB 3 Explorer is the user interface component of the InfluxDB 3 platform.
+It provides visual management of databases and tokens and an easy way to querying
+your time series data. Explorer is fully-featured for [InfluxDB 3 Core](/influxdb3/core/)
+and [Enterprise](/influxdb3/enterprise/), but can also be used to query
+[InfluxDB Cloud Serverless](/influxdb3/cloud-serverless/),
+[InfluxDB Cloud Dedicated](/influxdb3/cloud-dedicated/)
+and [InfluxDB Clustered](/influxdb3/clustered/).
+
+## Third Party Software
+
+InfluxData products contain third party software, which means the copyrighted,
+patented, or otherwise legally protected software of third parties that is
+incorporated in InfluxData products.
+
+Third party suppliers make no representation nor warranty with respect to such
+third party software or any portion thereof. Third party suppliers assume no
+liability for any claim that might arise with respect to such third party software,
+nor for a customer’s use of or inability to use the third party software.

content/influxdb3/explorer/get-started/_index.md

@@ -0,0 +1,14 @@
+---
+title: Get started using InfluxDB 3 Explorer
+description: Follow steps to get started using InfluxDB 3 Explorer.
+menu:
+  influxdb3_explorer:
+    name: Get started
+weight: 3
+---
+
+Follow steps to get started using InfluxDB 3 Explorer.
+
+{{< youtube "TbAz0AdaGH0" >}}
+
+<!-- {{< page-nav next="/explorer/v1/get-started/connect/" >}} -->

content/influxdb3/explorer/get-started/connect.md

@@ -0,0 +1,12 @@
+---
+title: Connect to a server
+description:
+  Use InfluxDB 3 Explorer to connect to an InfluxDB 3 server.
+menu:
+  influxdb3_explorer:
+    parent: Get started
+weight: 101
+draft: true
+---
+
+Use InfluxDB 3 Explorer to connect to an InfluxDB 3 server.

content/influxdb3/explorer/install.md

@@ -0,0 +1,216 @@
+---
+title: Install and run InfluxDB 3 Explorer
+description: >
+  Use [Docker](https://docker.com) to install and run **InfluxDB 3 Explorer**.
+menu:
+  influxdb3_explorer:
+    name: Install Explorer
+weight: 2
+---
+
+Use [Docker](https://docker.com) to install and run **InfluxDB 3 Explorer**.
+
+<!-- BEGIN TOC -->
+- [Run the InfluxDB 3 Explorer Docker container](#run-the-influxdb-3-explorer-docker-container)
+- [Enable TLS/SSL (HTTPS)](#enable-tlsssl-https)
+- [Pre-configure InfluxDB connection settings](#pre-configure-influxdb-connection-settings)
+- [Run in admin or query mode](#run-in-admin-or-query-mode)
+- [Environment Variables](#environment-variables)
+- [Volume Reference](#volume-reference)
+- [Exposed Ports](#exposed-ports)
+<!-- END TOC -->
+
+## Run the InfluxDB 3 Explorer Docker container
+
+1.  **Install Docker**
+
+    If you haven't already, install [Docker](https://docs.docker.com/engine/) or
+    [Docker Desktop](https://docs.docker.com/desktop/).
+
+2.  **Pull the {{% product-name %}} Docker image**
+
+    ```bash
+    docker pull quay.io/influxdb/influxdb3-explorer:latest
+    ```
+
+3.  **Create local directories** _(optional)_
+
+    {{% product-name %}} can mount the following directories on your local
+    machine:
+
+    | Directory  | Description                                                                                       | Permissions |
+    | :--------- | :------------------------------------------------------------------------------------------------ | :---------: |
+    | `./db`     | Stores {{% product-name %}} application data                                                      |     700     |
+    | `./config` | Stores [pre-configured InfluxDB connection settings](#pre-configure-influxdb-connection-settings) |     755     |
+    | `./ssl`    | Stores TLS/SSL certificates _(Required when [using TLS/SSL](#enable-tlsssl-https))_               |     755     |
+
+    > [!Important]
+    > If you don't create and mount a local `./db` directory, {{% product-name %}}
+    > stores application data in the container's file system.
+    > This data will be lost when the container is deleted.
+
+    To create these directories with the appropriate permissions, run the
+    following commands from your current working directory:
+
+    ```bash
+    mkdir -m 700 ./db
+    mkdir -m 755 ./config
+    mkdir -m 755 ./ssl
+    ```
+
+4.  **Run the {{% product-name %}} container**
+
+    Use the `docker run` command to start the {{% product-name %}} container.
+    Include the following:
+
+    - Port mappings:
+      - `8888` to `80` (or `443` if using TLS/SSL)
+      - `8889` to `8888`
+    - Mounted volumes:
+      - `$(pwd)/db:/db:rw`
+      - `$(pwd)/config:/app-root/config:ro`
+      - `$(pwd)/ssl:/etc/nginx/ssl:ro`
+    - Any of the available [environment variables](#environment-variables) 
+
+    ```bash
+    docker run --detach \
+      --name influxdb3-explorer \
+      --publish 8888:80 \
+      --publish 8889:8888 \
+      --volume $(pwd)/config:/app-root/config:ro \
+      --volume $(pwd)/db:/db:rw \
+      --volume $(pwd)/ssl:/etc/nginx/ssl:ro \
+      --env MODE=admin \
+      quay.io/influxdb/influxdb3-explorer:latest
+    ```
+
+5.  **Access the {{% product-name %}} user interface (UI) at <http://localhost:8888>**.
+
+---
+
+## Enable TLS/SSL (HTTPS)
+
+To enable TLS/SSL, mount valid certificate and key files into the container:
+
+1.  **Place your TLS/SSL certificate files your local `./ssl` directory**
+
+    Required files:
+
+    - Certificate: `server.crt` or `fullchain.pem`
+    - Private key: `server.key`
+
+2.  **When running your container, mount the SSL directory and map port 443 to port 8888**
+   
+    Include the following options when running your Docker container:
+
+    ```sh
+    --volume $(pwd)/ssl:/etc/nginx/ssl:ro \
+    --publish 8888:443
+    ```
+
+The nginx web server automatically uses certificate files when they are present
+in the mounted path.
+
+---
+
+## Pre-configure InfluxDB connection settings
+
+You can predefine InfluxDB connection settings using a `config.json` file.
+
+{{% code-placeholders "INFLUXDB3_HOST|INFLUXDB_DATABASE_NAME|INFLUXDB3_AUTH_TOKEN|INFLUXDB3_SERVER_NAME" %}}
+
+1.  **Create a `config.json` file in your local `./config` directory**
+
+    ```json
+    {
+      "DEFAULT_INFLUX_SERVER": "INFLUXDB3_HOST",
+      "DEFAULT_INFLUX_DATABASE": "INFLUXDB_DATABASE_NAME",
+      "DEFAULT_API_TOKEN": "INFLUXDB3_AUTH_TOKEN",
+      "DEFAULT_SERVER_NAME": "INFLUXDB3_SERVER_NAME"
+    }
+    ```
+
+    > [!Important]
+    > If connecting to an InfluxDB 3 Core or Enterprise instance running on
+    > localhost (outside of the container), use the internal Docker network to
+    > in your InfluxDB 3 host value--for example:
+    >
+    > ```txt
+    > http://host.docker.internal:8181
+    > ```
+
+2.  **Mount the configuration directory**
+
+    Include the following option when running your Docker container:
+
+    ```sh
+    --volume $(pwd)/config:/app-root/config:ro
+    ```
+
+{{% /code-placeholders %}}
+
+These settings will be used as defaults when the container starts.
+
+---
+
+## Run in query or admin mode
+
+{{% product-name %}} has the following operational modes:
+
+- **Query mode (default):** Read-only UI and query interface
+- **Admin mode:** Full UI and API access for administrators
+
+You can control the operational mode using the `MODE` environment variable.
+
+### Run in query mode {note="(default)"}
+
+```sh
+docker run -d \
+  -e MODE=query \
+  ...
+```
+
+### Run in admin mode
+
+```sh
+docker run -d \
+  -e MODE=admin \
+  ...
+```
+
+If `MODE` is not set, the container defaults to query mode.
+
+---
+
+## Environment Variables
+
+| Variable       | Description                                      | Default              |
+|----------------|--------------------------------------------------|----------------------|
+| `DATABASE_URL` | Path to SQLite DB inside container               | `/db/sqlite.db`      |
+| `MODE`         | Set to `admin` or `query`                        | `query`              |
+
+---
+
+## Volume Reference
+
+| Container Path       | Purpose                      | Host Example               |
+|----------------------|------------------------------|----------------------------|
+| `/db`                | SQLite DB storage            | `./db`                     |
+| `/app-root/config`   | JSON config for defaults     | `./config`                 |
+| `/etc/nginx/ssl`     | SSL certs for HTTPS          | `./ssl`                    |
+
+---
+
+## Exposed Ports
+
+| Port | Protocol | Purpose                 |
+|------|----------|-------------------------|
+| 80   | HTTP     | Web access (unencrypted) |
+| 443  | HTTPS    | Web access (encrypted)   |
+
+### Custom port mapping
+
+```sh
+# Map ports to custom host values
+-p 8888:80 -p 8443:443
+```

data/products.yml

@@ -27,6 +27,20 @@ influxdb3_enterprise:
     - How do I install and run InfluxDB 3 Enterprise?
     - Help me write a plugin for the Python Processing engine?
     - How do I start a read replica node with InfluxDB 3 Enterprise?
+  
+influxdb3_explorer:
+  name: InfluxDB 3 Explorer
+  altname: Explorer
+  namespace: influxdb3_explorer
+  menu_category: tools
+  list_order: 1
+  latest: explorer
+  latest_patch: 1.0.0
+  placeholder_host: localhost:8888
+  ai_sample_questions:
+    - How do I query data using InfluxDB 3 Explorer?
+    - How do I use InfluxDB 3 Explorer to visualize data?
+    - How do I install InfluxDB 3 Explorer?
 
 influxdb3_cloud_serverless:
   name: InfluxDB Cloud Serverless
@@ -108,6 +122,20 @@ influxdb_cloud:
     - How is Cloud 2 different from Cloud Serverless?
     - How do I manage auth tokens in InfluxDB Cloud 2?
 
+explorer:
+  name: InfluxDB 3 Explorer
+  namespace: explorer
+  menu_category: other
+  list_order: 4
+  versions: [v1]
+  latest: v1.0
+  latest_patches:
+    v1: 1.0.0
+  ai_sample_questions:
+    - How do I use InfluxDB 3 Explorer to visualize data?
+    - How do I create a dashboard in InfluxDB 3 Explorer?
+    - How do I query data using InfluxDB 3 Explorer?
+
 telegraf:
   name: Telegraf
   namespace: telegraf

layouts/index.html

@@ -39,64 +39,87 @@
     <div id="influxdb3" class="product-group">      
       <h2>InfluxDB 3</h2>
       <p>The modern time series data engine built for high-speed, high-cardinality data, from the edge to the cloud.</p>
-      <div class="category-head">
+      <div class="categories">
-        <h4>Self-managed</h4>
+        <div class="category full">
-      </div>
+          <div class="category-head">
-      <div class="products">
+            <h4>Self-managed</h4>
-        <div class="product new">
+          </div>
-          <div class="product-info">
+          <div class="products">
-            <h3><a href="/influxdb3/core/">InfluxDB 3 Core</a></h3>
+            <div class="product">
-            <p>The open source recent data engine optimized for time series and event data.</p>
+              <div class="product-info">
+                <h3 state="New"><a href="/influxdb3/core/">InfluxDB 3 Core</a></h3>
+                <p>The open source recent data engine optimized for time series and event data.</p>
+              </div>
+              <ul class="product-links">
+                <li><a href="/influxdb3/core/get-started/">Get started with InfluxDB 3 Core</a></li>
+                <li><a href="/influxdb3/core/">View documentation</a></li>
+              </ul>
+            </div>
+            <div class="product" >
+              <div class="product-info">
+                <h3 state="New"><a href="/influxdb3/enterprise/">InfluxDB 3 Enterprise</a></h3>
+                <p>The scalable data engine built for recent and historical time series and event data.</p>
+              </div>
+              <ul class="product-links">
+                <li><a href="/influxdb3/enterprise/get-started/">Get started with InfluxDB 3 Enterprise</a></li>
+                <li><a href="/influxdb3/enterprise/">View documentation</a></li>
+              </ul>
+            </div>
+            <div class="product">
+              <div class="product-info">
+                <h3><a href="/influxdb3/clustered/">InfluxDB Clustered</a></h3>
+                <p>The Kubernetes-enabled, highly-available InfluxDB 3 cluster built for high write and query workloads on your own infrastructure.</p>
+              </div>
+              <ul class="product-links">
+                <li><a href="/influxdb3/clustered/get-started/">Get started with InfluxDB Clustered</a></li>
+                <li><a href="/influxdb3/clustered/">View documentation</a></li>
+              </ul>
+            </div>
           </div>
-          <ul class="product-links">
-            <li><a href="/influxdb3/core/get-started/">Get started with InfluxDB 3 Core</a></li>
-            <li><a href="/influxdb3/core/">View documentation</a></li>
-          </ul>
         </div>
-        <div class="product new">
+        <div class="category two-thirds">
-          <div class="product-info">
+          <div class="category-head">
-            <h3><a href="/influxdb3/enterprise/">InfluxDB 3 Enterprise</a></h3>
+            <h4>Fully-Managed</h4>
-            <p>The scalable data engine built for recent and historical time series and event data.</p>
+          </div>
+          <div class="products">
+            <div class="product">
+              <div class="product-info">
+                <h3><a href="/influxdb3/cloud-serverless/">InfluxDB Cloud Serverless</a></h3>
+                <p>The fully-managed, multi-tenant InfluxDB 3 service deployed in the cloud.</p>
+              </div>
+              <ul class="product-links">
+                <li><a href="/influxdb3/cloud-serverless/get-started/">Get started with Cloud Serverless</a></li>
+                <li><a href="/influxdb3/cloud-serverless/">View documentation</a></li>
+              </ul>
+            </div>
+            <div class="product">
+              <div class="product-info">
+                <h3><a href="/influxdb3/cloud-dedicated/">InfluxDB Cloud Dedicated</a></h3>
+                <p>The fully-managed InfluxDB 3 cluster dedicated to your workload and deployed in the cloud.</p>
+              </div>
+              <ul class="product-links">
+                <li><a href="/influxdb3/cloud-dedicated/get-started/">Get started with Cloud Dedicated</a></li>
+                <li><a href="/influxdb3/cloud-dedicated/">View documentation</a></li>
+              </ul>
+            </div>
           </div>
-          <ul class="product-links">
-            <li><a href="/influxdb3/enterprise/get-started/">Get started with InfluxDB 3 Enterprise</a></li>
-            <li><a href="/influxdb3/enterprise/">View documentation</a></li>
-          </ul>
         </div>
-        <div class="product">
+        <div class="category one-third">
-          <div class="product-info">
+          <div class="category-head">
-            <h3><a href="/influxdb3/clustered/">InfluxDB Clustered</a></h3>
+            <h4>Tools</h4>
-            <p>The Kubernetes-enabled, highly-available InfluxDB 3 cluster built for high write and query workloads on your own infrastructure.</p>
           </div>
-          <ul class="product-links">
+          <div class="products">
-            <li><a href="/influxdb3/clustered/get-started/">Get started with InfluxDB Clustered</a></li>
+            <div class="product">
-            <li><a href="/influxdb3/clustered/">View documentation</a></li>
+              <div class="product-info">
-          </ul>
+                <h3 state="beta"><a href="/influxdb3/explorer/">InfluxDB 3 Explorer</a></h3>
-        </div>
+                <p>A standalone UI designed for visualizing, querying, and managing data in InfluxDB 3 Core and Enterprise.</p>
-      </div>
+              </div>
-      <div class="category-head">
+              <ul class="product-links">
-        <h4>Fully-Managed</h4>
+                <li><a href="/influxdb3/explorer/get-started/">Get started with Explorer</a></li>
-      </div>
+                <li><a href="/influxdb3/explorer/">View documentation</a></li>
-      <div class="products">
+              </ul>
-        <div class="product">
+            </div>
-          <div class="product-info">
-            <h3><a href="/influxdb3/cloud-serverless/">InfluxDB Cloud Serverless</a></h3>
-            <p>The fully-managed, multi-tenant InfluxDB 3 service deployed in the cloud.</p>
           </div>
-          <ul class="product-links">
-            <li><a href="/influxdb3/cloud-serverless/get-started/">Get started with Cloud Serverless</a></li>
-            <li><a href="/influxdb3/cloud-serverless/">View documentation</a></li>
-          </ul>
-        </div>
-        <div class="product">
-          <div class="product-info">
-            <h3><a href="/influxdb3/cloud-dedicated/">InfluxDB Cloud Dedicated</a></h3>
-            <p>The fully-managed InfluxDB 3 cluster dedicated to your workload and deployed in the cloud.</p>
-          </div>
-          <ul class="product-links">
-            <li><a href="/influxdb3/cloud-dedicated/get-started/">Get started with Cloud Dedicated</a></li>
-            <li><a href="/influxdb3/cloud-dedicated/">View documentation</a></li>
-          </ul>
         </div>
       </div>
     </div>

layouts/partials/article.html

@@ -5,6 +5,7 @@
       {{ partial "article/supported-versions.html" . }}
       {{ partial "article/page-meta.html" . }}
     </div>
+    {{ partial "article/beta.html" . }}
     {{ partial "article/stable-version.html" . }}
     {{ partial "article/flux-experimental.html" . }}
     {{ partial "article/flux-contrib.html" . }}

layouts/partials/article/beta.html

@@ -0,0 +1,39 @@
+<!-- This partial is no longer used but may be repurposed later for other InfluxDB products -->
+{{ $productPathData := split .RelPermalink "/" }}
+{{ $product := index $productPathData 1 }}
+{{ $version := index $productPathData 2 }}
+{{ $productKey := cond (eq $product "influxdb3") (print "influxdb3_" (replaceRE "-" "_" $version)) $product }}
+{{ $productData := index $.Site.Data.products $productKey }}
+{{ $displayName := $productData.name }}
+{{ $earlyAccessList := slice "influxdb3/explorer" }}
+
+{{ if in $earlyAccessList (print $product "/" $version )}}
+<div class="block beta">
+  <div class="beta-content">
+    <h4 id="public-beta">{{ $displayName }} is in Public Beta</h4>
+    <p>
+      {{ $displayName }} is in public beta and available for testing and feedback,
+      but is <strong>not meant for production use yet</strong>.
+      Both the product and this documentation are works in progress.
+      We welcome and encourage your input about your experience with the beta and 
+      invite you to <strong>join our public channels</strong> for updates and to
+      share feedback.
+    </p>
+    <div class="expand-wrapper">
+      <div class="expand" id="beta-feedback-channels">
+        <p class="expand-label">
+          <span class="expand-toggle"></span><span>Join our public channels</span>
+        </p>
+        <div class="expand-content" style="display: none;" >
+          <ul class="feedback-channels">
+            <li><a href="https://discord.gg/9zaNCW2PRT" target="_blank" class="discord">InfluxDB Discord Server <em style="opacity:.5">(Preferred)</em></a></li>
+            <li><a href="https://community.influxdata.com" target="_blank" class="community">InfluxData Community</a></li>
+            <li><a href="https://influxdata.com/slack" target="_blank" class="slack">InfluxDB Community Slack</a></li>
+            <li><a href="https://reddit.com/r/influxdb" target="_blank" class="reddit">InfluxDB Subreddit</a></li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+{{ end }}

layouts/partials/footer/search.html

@@ -5,7 +5,7 @@
 {{ $fluxSupported := slice "influxdb" "enterprise_influxdb" }}
 {{ $influxdbFluxSupport := slice "v1" "v2" "cloud" }}
 {{ $includeFlux := and (in $fluxSupported $product) (in $influxdbFluxSupport $version) }}
-{{ $includeResources := not (in (slice "cloud-serverless" "cloud-dedicated" "clustered" "core" "enterprise") $version) }}
+{{ $includeResources := not (in (slice "cloud-serverless" "cloud-dedicated" "clustered" "core" "enterprise" "explorer") $version) }}
 
 <script src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
 <script>
@@ -27,6 +27,8 @@ docsearch({
         return 'Core';
       } else if (version === 'enterprise') {
         return 'Enterprise';
+      } else if (version === 'explorer') {
+        return 'Explorer';
       } else if (version === 'cloud-serverless') {
         return 'Cloud Serverless';
       } else if (version === 'cloud-dedicated') {

layouts/partials/header/title.html

@@ -22,6 +22,8 @@
   {{ $scratch.Set "siteTitle" "InfluxDB 3 Core Documentation" }}
 {{ else if eq $currentVersion "enterprise"}}
   {{ $scratch.Set "siteTitle" "InfluxDB 3 Enterprise Documentation" }}
+{{ else if eq $currentVersion "explorer"}}
+  {{ $scratch.Set "siteTitle" "InfluxDB 3 Explorer Documentation" }}
 {{ else if eq $currentVersion "cloud-serverless"}}
   {{ $scratch.Set "siteTitle" "InfluxDB Cloud Serverless Documentation" }}
 {{ else if eq $currentVersion "cloud-dedicated"}}

layouts/partials/topnav/product-selector.html

@@ -18,6 +18,7 @@ Identify products by their product path. Dictionary schema:
 {{ $influxdbCloud := dict "influxdb/cloud" (slice $.Site.Data.products.influxdb_cloud.name "cloud") }}
 {{ $influxdb3Core := dict "influxdb3/core" (slice $.Site.Data.products.influxdb3_core.name "core") }}
 {{ $influxdb3Enterprise := dict "influxdb3/enterprise" (slice $.Site.Data.products.influxdb3_enterprise.name "enterprise") }}
+{{ $influxdb3Explorer := dict "influxdb3/explorer" (slice $.Site.Data.products.influxdb3_explorer.name "explorer") }}
 {{ $influxdb3CloudServerless := dict "influxdb3/cloud-serverless" (slice $.Site.Data.products.influxdb3_cloud_serverless.name "cloud-serverless") }}
 {{ $influxdb3CloudDedicated := dict "influxdb3/cloud-dedicated" (slice $.Site.Data.products.influxdb3_cloud_dedicated.name "cloud-dedicated") }}
 {{ $influxdb3Clustered := dict "influxdb3/clustered" (slice $.Site.Data.products.influxdb3_clustered.name "clustered") }}
@@ -27,7 +28,7 @@ Identify products by their product path. Dictionary schema:
 {{ $flux := dict "flux/v0" (slice "Flux" "flux") }}
 {{ $enterpriseInfluxdb := dict "enterprise_influxdb/v1" (slice "InfluxDB Enterprise" "enterprise_v1") }}
 
-{{ $productInfo := merge $influxdbOSSv1 $influxdbOSSv2 $influxdbCloud $influxdb3Core $influxdb3Enterprise $influxdb3CloudServerless $influxdb3CloudDedicated $influxdb3Clustered $telegraf $chronograf $kapacitor $flux $enterpriseInfluxdb }}
+{{ $productInfo := merge $influxdbOSSv1 $influxdbOSSv2 $influxdbCloud $influxdb3Core $influxdb3Enterprise $influxdb3CloudServerless $influxdb3CloudDedicated $influxdb3Clustered $telegraf $chronograf $kapacitor $influxdb3Explorer $flux $enterpriseInfluxdb }}
 
 {{ define "productLink" }}
   {{ $defaultAltProductPage := $.context.GetPage ((replaceRE .pageRoot .productPath $.context.Page.RelPermalink) | replaceRE `\/$` "") }}
@@ -36,8 +37,8 @@ Identify products by their product path. Dictionary schema:
   {{ $productAltLinkKey := index (index $.productInfo .productPath) 1 }}
   {{ $isCurrentProduct := in $.context.RelPermalink .productPath }}
   {{ $link := cond .useRootProductLink (print "/" .productPath "/") (cond (isset .altLinks $productAltLinkKey) (index .altLinks $productAltLinkKey) (cond $defaultAltProductPageExists $defaultAltProductPage.RelPermalink (print "/" .productPath "/"))) }}
-  {{ $isNew := in (slice "influxdb3/core" "influxdb3/enterprise") .productPath }}
+  {{ $state := .state | default "" }}
-  <a href='{{ $link }}' {{ if $isCurrentProduct }}class="active"{{ end }}>{{ index (index $.productInfo .productPath) 0 }}{{ if $isNew }} <span class="state">New</span>{{ end }}</a>
+  <a href='{{ $link }}' {{ if $isCurrentProduct }}class="active"{{ end }}>{{ index (index $.productInfo .productPath) 0 }}{{ if ne $state ""}} <span class="state">{{ $state }}</span>{{ end }}</a>
 {{ end }}
 
 {{ $templateDefaults := dict "context" . "productInfo" $productInfo "altLinks" $altLinks "pageRoot" $pageRoot "useRootProductLink" $useRootProductLink }}
@@ -50,14 +51,17 @@ Identify products by their product path. Dictionary schema:
     <div class="product-group">
       <div class="group-title"><p>InfluxDB 3</p></div>
       <ul class="item-list products" data-category="Self-managed">
-        <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/core") $templateDefaults) }}</li>
+        <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/core" "state" "New") $templateDefaults) }}</li>
-        <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/enterprise") $templateDefaults) }}</li>
+        <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/enterprise" "state" "New") $templateDefaults) }}</li>
         <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/clustered") $templateDefaults) }}</li>
       </ul>
       <ul class="item-list products" data-category="Fully-Managed">
         <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/cloud-serverless") $templateDefaults) }}</li>
         <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/cloud-dedicated") $templateDefaults) }}</li>
       </ul>
+      <ul class="item-list products" data-category="Tools">
+        <li>{{ template "productLink" (merge (dict "productPath" "influxdb3/explorer" "state" "beta") $templateDefaults) }}</li>
+      </ul>
     </div>
     <div class="product-group">
       <div class="group-title"><p>InfluxDB 2</p></div>

layouts/shortcodes/product-name.html

@@ -11,6 +11,8 @@
   {{- $scratch.Set "productData" .Site.Data.products.influxdb3_core -}}
 {{- else if eq $currentProduct "enterprise" -}}
   {{- $scratch.Set "productData" .Site.Data.products.influxdb3_enterprise -}}
+{{- else if eq $currentProduct "explorer" -}}
+  {{- $scratch.Set "productData" .Site.Data.products.influxdb3_explorer -}}
 {{- else if eq $currentProduct "cloud-serverless" -}}
   {{- $scratch.Set "productData" .Site.Data.products.influxdb3_cloud_serverless -}}
 {{- else if eq $currentProduct "cloud-dedicated" -}}