diff --git a/_site/customizations/README.mdx b/_site/customizations/README.mdx index 522de0b5b..12b8302e0 100644 --- a/_site/customizations/README.mdx +++ b/_site/customizations/README.mdx @@ -15,7 +15,6 @@ See Mintlify's docs on [custom scripts](https://www.mintlify.com/docs/customize/ - `navbar-cta.js` — adds the "Get started" CTA to the navbar. - `clickhouse-sql-lexer-wasm.js` — exposes ClickHouse's SQL lexer (`src/Parsers/Lexer.cpp` compiled to WebAssembly) as a base64 global. Snapshot from ClickHouse `programs/server/play.html`; re-extract if the upstream lexer/keyword list changes. - `clickhouse-sql-highlight.js` — re-highlights `language="sql"` code blocks using the WASM lexer (ClickHouse-native colors, matching play.html / clickhouse-client) in place of Shiki. Must load after `clickhouse-sql-lexer-wasm.js`. Other languages are left as Shiki rendered them. -- `quickstart-back-link.js` — on quickstart pages, relocates the autogenerated "All quickstarts" badge from the top of the body into the header above the title (breadcrumb position). To wire a new script up, add a `{ "src": "/_site/customizations/.js" }` entry to the top-level `scripts` array in `docs.json`. \ No newline at end of file diff --git a/_site/customizations/quickstart-back-link.js b/_site/customizations/quickstart-back-link.js deleted file mode 100644 index 031ed19f7..000000000 --- a/_site/customizations/quickstart-back-link.js +++ /dev/null @@ -1,82 +0,0 @@ -(function () { - 'use strict'; - - // On quickstart pages, move the autogenerated "All quickstarts" back-link - // badge from the top of the MDX body into the page header, above the title - // (where breadcrumbs would normally render). - // - // The original anchor is React-owned, so it is hidden in place and a clone - // is inserted into the header — moving the node itself would crash React - // when it unmounts the page. - - var CLONE_ID = 'qs-back-eyebrow'; - var QS_PATH = /^(?:\/docs)?(?:\/(?:es|ja|ko|pt-BR|ru|zh))?\/get-started\/quickstarts\/([^/]+)$/; - - function apply() { - var clone = document.getElementById(CLONE_ID); - var match = window.location.pathname.replace(/\/+$/, '').match(QS_PATH); - var header = document.getElementById('header'); - var content = document.getElementById('content'); - - if (!match || match[1] === 'home' || !header || !content) { - if (clone) clone.remove(); - return; - } - - // Only the top badge is a direct child of #content; the "All quickstarts" - // link at the bottom of the page is nested in a wrapper div. - var src = content.querySelector(':scope > a[href$="/get-started/quickstarts/home"]'); - if (!src) { - if (clone) clone.remove(); - return; - } - - if (src.style.display !== 'none') { - src.style.display = 'none'; - src.setAttribute('aria-hidden', 'true'); - } - - // Build the locale- and basePath-aware destination. - var base = window.location.pathname.startsWith('/docs') ? '/docs' : ''; - var localeMatch = window.location.pathname.match(/^(?:\/docs)?\/([a-z]{2}(?:-[A-Z]{2})?)(?:\/|$)/); - var locale = localeMatch ? '/' + localeMatch[1] : ''; - var dest = base + locale + '/get-started/quickstarts/home'; - - // Already in place — compare against the rewritten dest, not the source href. - if (clone && header.contains(clone) && clone.getAttribute('href') === dest) { - return; - } - if (clone) clone.remove(); - - clone = src.cloneNode(true); - clone.id = CLONE_ID; - clone.style.display = 'block'; - clone.style.width = 'fit-content'; - clone.style.marginBottom = '0.75rem'; - clone.removeAttribute('aria-hidden'); - - clone.setAttribute('href', dest); - clone.addEventListener('click', function (e) { - e.preventDefault(); - window.location.href = dest; - }); - - header.insertBefore(clone, header.firstChild); - } - - function init() { - apply(); - // Re-apply across SPA navigations / React re-renders. apply() is - // idempotent, so observer feedback loops settle immediately. - new MutationObserver(apply).observe(document.documentElement, { - childList: true, - subtree: true, - }); - } - - if (document.readyState === 'loading') { - document.addEventListener('DOMContentLoaded', init); - } else { - init(); - } -})(); \ No newline at end of file diff --git a/_site/scripts/update_quickstarts.py b/_site/scripts/update_quickstarts.py index 9fd7c79ac..d76c01219 100755 --- a/_site/scripts/update_quickstarts.py +++ b/_site/scripts/update_quickstarts.py @@ -138,8 +138,9 @@ def generate_badges(use_cases: List[str], products: List[str]) -> str: Returns: Badge components as a string """ - # First line: link badge - first_line = 'All quickstarts' + # First line: muted text back-link (arrow icon + label), styled to match the + # homepage links (e.g. "Read the quickstart" / "Set up docs MCP server"). + first_line = 'All quickstarts' # Second line: all other badges second_line_badges = [] diff --git a/docs.json b/docs.json index ff620adc2..c371aa0d1 100644 --- a/docs.json +++ b/docs.json @@ -3875,9 +3875,6 @@ }, { "src": "/_site/customizations/clickhouse-sql-highlight.js" - }, - { - "src": "/_site/customizations/quickstart-back-link.js" } ], "styling": { diff --git a/get-started/quickstarts/connect-your-iceberg-catalog.mdx b/get-started/quickstarts/connect-your-iceberg-catalog.mdx index 028a9f09b..15cb9e3a1 100644 --- a/get-started/quickstarts/connect-your-iceberg-catalog.mdx +++ b/get-started/quickstarts/connect-your-iceberg-catalog.mdx @@ -11,7 +11,7 @@ import CloudPrerequisites from '/get-started/quickstarts/_prerequisites/cloud_pr import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Data Warehousing Cloud @@ -47,7 +47,7 @@ By the end, you'll have ClickHouse Cloud connected to your Iceberg catalog and b In this step, you will connect to your Data Lake Catalog in ClickHouse Cloud. 1. Open your ClickHouse Cloud service. - 2. Navigate to **Data Sources → Connect to your Data Lake Catalog**. + 2. Navigate to **Data Sources → Connect to your Data Lake Catalog**. 3. Select your data catalog in dropdown. 4. Fill out the form with your credential and connection information. For Unity Catalog, enter in: @@ -93,5 +93,5 @@ Be mindful of your quotes. ClickHouse doesn't support three part namespaces, you
-All quickstarts +All quickstarts
diff --git a/get-started/quickstarts/create-your-first-materialized-view.mdx b/get-started/quickstarts/create-your-first-materialized-view.mdx index 3558ce56d..1cb60fead 100644 --- a/get-started/quickstarts/create-your-first-materialized-view.mdx +++ b/get-started/quickstarts/create-your-first-materialized-view.mdx @@ -10,7 +10,7 @@ import CloudPrerequisites from '/get-started/quickstarts/_prerequisites/cloud_pr import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Real-Time Analytics Data Warehousing @@ -211,5 +211,5 @@ Or go deeper with the reference documentation: diff --git a/get-started/quickstarts/create-your-first-mergetree-table.mdx b/get-started/quickstarts/create-your-first-mergetree-table.mdx index 4e771c356..0b8b6acba 100644 --- a/get-started/quickstarts/create-your-first-mergetree-table.mdx +++ b/get-started/quickstarts/create-your-first-mergetree-table.mdx @@ -10,7 +10,7 @@ import CloudPrerequisites from '/get-started/quickstarts/_prerequisites/cloud_pr import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Real-Time Analytics Data Warehousing @@ -184,7 +184,7 @@ By the end, you'll understand why the MergeTree engine is the foundation of almo Each row represents one active data part. Notice: - **`partition`** - the `YYYYMM` value derived from your `PARTITION BY` expression. Each month's data is isolated. - - **`name`** - the part name encodes the partition, the block number range, and the merge level (e.g. `199501_1_4_2` would mean partition `199501`, blocks 1–4, merged twice). + - **`name`** - the part name encodes the partition, the block number range, and the merge level (e.g. `199501_1_4_2` would mean partition `199501`, blocks 1–4, merged twice). - **`marks`** - the number of index granules. Each granule covers 8,192 rows by default, and the primary key index stores one entry per granule. This sparse index is what stays in memory and enables fast data skipping. - **`bytes_on_disk`** - ClickHouse compresses each part column by column using LZ4 by default. Compare this to the raw size to appreciate the compression ratio. @@ -273,5 +273,5 @@ Or go deeper with the reference documentation: \ No newline at end of file diff --git a/get-started/quickstarts/create-your-first-projection.mdx b/get-started/quickstarts/create-your-first-projection.mdx index 9e34c0f1c..434510e2d 100644 --- a/get-started/quickstarts/create-your-first-projection.mdx +++ b/get-started/quickstarts/create-your-first-projection.mdx @@ -10,7 +10,7 @@ import CloudPrerequisites from '/get-started/quickstarts/_prerequisites/cloud_pr import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Real-Time Analytics Data Warehousing @@ -224,5 +224,5 @@ Or go deeper with the reference documentation: diff --git a/get-started/quickstarts/create-your-first-service-on-cloud.mdx b/get-started/quickstarts/create-your-first-service-on-cloud.mdx index 810870907..222080748 100644 --- a/get-started/quickstarts/create-your-first-service-on-cloud.mdx +++ b/get-started/quickstarts/create-your-first-service-on-cloud.mdx @@ -9,7 +9,7 @@ description: 'Create a ClickHouse Cloud service, explore the SQL console, and lo import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Real-Time Analytics Data Warehousing @@ -154,5 +154,5 @@ Check out the following quickstarts next: \ No newline at end of file diff --git a/get-started/quickstarts/home.mdx b/get-started/quickstarts/home.mdx index f3dffb9ff..f79157482 100644 --- a/get-started/quickstarts/home.mdx +++ b/get-started/quickstarts/home.mdx @@ -10,18 +10,9 @@ import { QuickStartsGrid } from '/snippets/components/QuickStartsGrid/QuickStart {/* Featured quickstarts - each has a quickstart ID and a banner image (the title is rendered into the image) */} export const featuredQuickstarts = [ - { - id: 'create-your-first-service-on-cloud', - image: '/images/quickstarts/featured-quickstart-1.png' - }, - { - id: 'insert-data-using-clickhouse-client', - image: '/images/quickstarts/featured-quickstart-2.png' - }, - { - id: 'obtain-your-cloud-connection-details', - image: '/images/quickstarts/featured-quickstart-3.png' - } + { id: 'create-your-first-service-on-cloud' }, + { id: 'insert-data-using-clickhouse-client' }, + { id: 'obtain-your-cloud-connection-details' } ]; {/* Define quickstarts data */} diff --git a/get-started/quickstarts/insert-data-using-clickhouse-client.mdx b/get-started/quickstarts/insert-data-using-clickhouse-client.mdx index dd3231ca0..d73a4f2be 100644 --- a/get-started/quickstarts/insert-data-using-clickhouse-client.mdx +++ b/get-started/quickstarts/insert-data-using-clickhouse-client.mdx @@ -9,7 +9,7 @@ description: 'Learn how to use clickhouse-client to insert data from local CSV a import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Real-Time Analytics Data Warehousing @@ -184,5 +184,5 @@ Or go deeper with the reference documentation: \ No newline at end of file diff --git a/get-started/quickstarts/obtain-your-cloud-connection-details.mdx b/get-started/quickstarts/obtain-your-cloud-connection-details.mdx index ba74cf3ab..d8df0f861 100644 --- a/get-started/quickstarts/obtain-your-cloud-connection-details.mdx +++ b/get-started/quickstarts/obtain-your-cloud-connection-details.mdx @@ -10,7 +10,7 @@ import CloudPrerequisites from '/get-started/quickstarts/_prerequisites/cloud_pr import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Real-Time Analytics Data Warehousing @@ -116,5 +116,5 @@ Or go deeper with the reference documentation: \ No newline at end of file diff --git a/get-started/quickstarts/working-with-the-map-type.mdx b/get-started/quickstarts/working-with-the-map-type.mdx index 679050dc4..a7195ae18 100644 --- a/get-started/quickstarts/working-with-the-map-type.mdx +++ b/get-started/quickstarts/working-with-the-map-type.mdx @@ -9,7 +9,7 @@ description: 'Learn how to use the Map type in ClickHouse to store, query, and a import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academy_cta_generic.mdx' {/* AUTOGENERATED_START */} -All quickstarts +All quickstarts
Observability Cloud @@ -21,7 +21,7 @@ import ClickHouseAcademyCTA from '/get-started/quickstarts/_academy-ctas/_academ - **clickhouse-local** installed on your machine. See the [clickhouse-local setup guide](/concepts/features/tools-and-utilities/clickhouse-local) to get started. ## What you'll build {#what-youll-build} -In OpenTelemetry, every trace span carries a set of **resource attributes** — key-value metadata describing the entity that produced the telemetry (service name, host, cloud region, Kubernetes pod, etc.). The set of keys varies between services and environments, making this a natural fit for ClickHouse's `Map` type: the keys are dynamic and application-specific, but any given row typically has only a handful of them. +In OpenTelemetry, every trace span carries a set of **resource attributes** — key-value metadata describing the entity that produced the telemetry (service name, host, cloud region, Kubernetes pod, etc.). The set of keys varies between services and environments, making this a natural fit for ClickHouse's `Map` type: the keys are dynamic and application-specific, but any given row typically has only a handful of them. In this quickstart you'll use `clickhouse-local` to load real OTel trace data from a CSV file into a table with `Map(LowCardinality(String), String)` columns, and learn how to query, filter, aggregate, and optimise map data. @@ -102,7 +102,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr ### Query the data - **Access a specific key** — use bracket syntax to pull a value out of the map. If the key doesn't exist on a given row, you get the default for the value type (empty string for `String`): + **Access a specific key** — use bracket syntax to pull a value out of the map. If the key doesn't exist on a given row, you get the default for the value type (empty string for `String`): ```sql SELECT @@ -115,7 +115,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr LIMIT 10; ``` - **Filter by a map value** — find all spans from a specific service name: + **Filter by a map value** — find all spans from a specific service name: ```sql SELECT @@ -128,7 +128,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr LIMIT 10; ``` - **Check whether a key exists** — not every span has Kubernetes metadata. Use `mapContains` to find which ones do: + **Check whether a key exists** — not every span has Kubernetes metadata. Use `mapContains` to find which ones do: ```sql SELECT @@ -139,7 +139,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr LIMIT 10; ``` - **Inspect all keys present across the dataset** — useful for understanding what instrumentation is producing: + **Inspect all keys present across the dataset** — useful for understanding what instrumentation is producing: ```sql SELECT DISTINCT arrayJoin(mapKeys(ResourceAttributes)) AS key @@ -147,7 +147,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr ORDER BY key; ``` - **Explode a map into rows with ARRAY JOIN** — turn each key-value pair into its own row, handy for building attribute inventories or feeding dashboards: + **Explode a map into rows with ARRAY JOIN** — turn each key-value pair into its own row, handy for building attribute inventories or feeding dashboards: ```sql SELECT @@ -162,7 +162,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr LIMIT 20; ``` - **Filter maps with mapFilter** — extract only the Kubernetes-related attributes from each span: + **Filter maps with mapFilter** — extract only the Kubernetes-related attributes from each span: ```sql SELECT @@ -173,7 +173,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr LIMIT 10; ``` - **Find error spans and their resource context** — combine regular column filters with map access: + **Find error spans and their resource context** — combine regular column filters with map access: ```sql SELECT @@ -192,7 +192,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr ### Aggregate across maps with the -Map combinator - ClickHouse's `-Map` aggregate combinator lets you apply any aggregate function to a `Map` column and have it operate on each key independently. The result is itself a `Map` — one entry per key, with the aggregated value. This is especially powerful for OTel metrics, where counters or gauges are stored as map values. + ClickHouse's `-Map` aggregate combinator lets you apply any aggregate function to a `Map` column and have it operate on each key independently. The result is itself a `Map` — one entry per key, with the aggregated value. This is especially powerful for OTel metrics, where counters or gauges are stored as map values. To demonstrate, create a small metrics table where each row records HTTP status code counts as a `Map(String, UInt64)`: @@ -236,7 +236,7 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr GROUP BY ServiceName; ``` - You can also combine it with other combinators. For example, `sumMapIf` lets you conditionally aggregate — here, only summing the minute windows where the service already had errors: + You can also combine it with other combinators. For example, `sumMapIf` lets you conditionally aggregate — here, only summing the minute windows where the service already had errors: ```sql SELECT @@ -246,13 +246,13 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr GROUP BY ServiceName; ``` - **Why this matters for OTel:** When your OTel Collector writes per-minute status code breakdowns into ClickHouse, `sumMap` lets you roll them up to hourly or daily totals in a single query — no `ARRAY JOIN`, no unpivoting, no knowing the full set of keys in advance. Any key that appears in any row is automatically included in the result. + **Why this matters for OTel:** When your OTel Collector writes per-minute status code breakdowns into ClickHouse, `sumMap` lets you roll them up to hourly or daily totals in a single query — no `ARRAY JOIN`, no unpivoting, no knowing the full set of keys in advance. Any key that appears in any row is automatically included in the result. ### Optimise for frequently queried keys - If you find yourself constantly filtering on the same map key — `host.name` is a common one — you can extract it into a materialized column. This avoids the linear scan through the map on every query: + If you find yourself constantly filtering on the same map key — `host.name` is a common one — you can extract it into a materialized column. This avoids the linear scan through the map on every query: ```sql ALTER TABLE otel_traces @@ -272,11 +272,11 @@ In this quickstart you'll use `clickhouse-local` to load real OTel trace data fr ## Key takeaways {#key-takeaways} -- **`Map(LowCardinality(String), String)`** is the idiomatic type for OTel attributes — flexible enough to handle varying key sets, and `LowCardinality` keeps the key storage efficient. -- **Bracket syntax** (`map['key']`) is the most common way to access values, but remember it scans linearly — fine for maps with tens of keys, not ideal for hundreds. +- **`Map(LowCardinality(String), String)`** is the idiomatic type for OTel attributes — flexible enough to handle varying key sets, and `LowCardinality` keeps the key storage efficient. +- **Bracket syntax** (`map['key']`) is the most common way to access values, but remember it scans linearly — fine for maps with tens of keys, not ideal for hundreds. - **Materialized columns** are the escape hatch: when a map key becomes a hot filter target, promote it to a real column for indexed, columnar access. - **`mapContains`, `mapKeys`, `mapValues`, `mapFilter`** and `ARRAY JOIN` give you a rich toolkit for exploring and transforming map data without leaving SQL. -- **The `-Map` aggregate combinator** (`sumMap`, `avgMap`, `maxMap`, etc.) aggregates each key independently across rows — ideal for rolling up OTel metric counters without needing to know the key set in advance. It composes with other combinators too (e.g. `sumMapIf`). +- **The `-Map` aggregate combinator** (`sumMap`, `avgMap`, `maxMap`, etc.) aggregates each key independently across rows — ideal for rolling up OTel metric counters without needing to know the key set in advance. It composes with other combinators too (e.g. `sumMapIf`). ## Next steps {#next-steps} Check out the following quickstarts next: @@ -292,5 +292,5 @@ Or go deeper with the reference documentation: \ No newline at end of file diff --git a/images/knowledgebase-featured-articles/kb-01.png b/images/knowledgebase-featured-articles/kb-01.png deleted file mode 100644 index 464e4770d..000000000 Binary files a/images/knowledgebase-featured-articles/kb-01.png and /dev/null differ diff --git a/images/knowledgebase-featured-articles/kb-02.png b/images/knowledgebase-featured-articles/kb-02.png deleted file mode 100644 index 7c669f12c..000000000 Binary files a/images/knowledgebase-featured-articles/kb-02.png and /dev/null differ diff --git a/images/knowledgebase-featured-articles/kb-03.png b/images/knowledgebase-featured-articles/kb-03.png deleted file mode 100644 index 5925708d5..000000000 Binary files a/images/knowledgebase-featured-articles/kb-03.png and /dev/null differ diff --git a/images/quickstarts/featured-quickstart-1.png b/images/quickstarts/featured-quickstart-1.png deleted file mode 100644 index 4ae5bfb6e..000000000 Binary files a/images/quickstarts/featured-quickstart-1.png and /dev/null differ diff --git a/images/quickstarts/featured-quickstart-2.png b/images/quickstarts/featured-quickstart-2.png deleted file mode 100644 index c0d2ea9a5..000000000 Binary files a/images/quickstarts/featured-quickstart-2.png and /dev/null differ diff --git a/images/quickstarts/featured-quickstart-3.png b/images/quickstarts/featured-quickstart-3.png deleted file mode 100644 index 24c325c05..000000000 Binary files a/images/quickstarts/featured-quickstart-3.png and /dev/null differ diff --git a/resources/support-center/home.mdx b/resources/support-center/home.mdx index ef1b59a51..8c99efc7d 100644 --- a/resources/support-center/home.mdx +++ b/resources/support-center/home.mdx @@ -13,18 +13,9 @@ import { kbIndex } from '/snippets/components/KBExplorer/kb-data.jsx' {/* Featured articles - each has an article ID (relative path under knowledge-base, no extension) and a banner image (the article title is rendered into the image) */} export const featuredArticles = [ - { - id: 'cloud-services/aws-privatelink-setup-for-clickpipes', - image: '/images/knowledgebase-featured-articles/kb-01.png' - }, - { - id: 'tables-schema/schema-migration-tools', - image: '/images/knowledgebase-featured-articles/kb-02.png' - }, - { - id: 'data-management/read-consistency', - image: '/images/knowledgebase-featured-articles/kb-03.png' - } + { id: 'cloud-services/aws-privatelink-setup-for-clickpipes' }, + { id: 'tables-schema/schema-migration-tools' }, + { id: 'data-management/read-consistency' } ];
diff --git a/snippets/components/KBExplorer/KBExplorer.jsx b/snippets/components/KBExplorer/KBExplorer.jsx index e06276ddc..836e81ea4 100644 --- a/snippets/components/KBExplorer/KBExplorer.jsx +++ b/snippets/components/KBExplorer/KBExplorer.jsx @@ -127,20 +127,20 @@ export const KBExplorer = ({ index, featured = [] }) => { window.location.assign(withBase(href)); }; - // Featured articles, in the order listed in `featured`. Each keeps its banner - // image; the href falls back to the conventional KB path if the index hasn't - // loaded yet so the cards are clickable immediately. + // Featured articles, in the order listed in `featured`. The banner art is + // drawn in code from the title (see below), so no per-locale image is needed. + // The href falls back to the conventional KB path if the index hasn't loaded + // yet so the cards are clickable immediately. const featuredArticles = featured .map(f => { const article = data.articles.find(a => a.id === f.id); return { id: f.id, - image: f.image, href: (article && article.href) || `/resources/support-center/knowledge-base/${f.id}`, title: (article && article.title) || '', }; }) - .filter(f => f.image); + .filter(f => f.title); // Expandable filter component const Expandable = ({ label, options, selectedOptions, onToggle, isOpen, setIsOpen }) => { @@ -218,14 +218,29 @@ export const KBExplorer = ({ index, featured = [] }) => { onClick={(e) => handleCardClick(e, article.href)} className="group block rounded-xl overflow-hidden border border-gray-200 dark:border-white/10 transition-all hover:border-black dark:hover:border-[#FAFF69] hover:shadow-md" > - {/* Rendered as a background image (not ) so Mintlify's - click-to-zoom doesn't hijack the link navigation. */} -
+ {/* Banner art is drawn in code from the title so it + translates automatically — no per-locale PNG needed. */} +
+ {/* Decorative bar-chart motif, purely visual. */} + + + {article.title} + + {/* ClickHouse wordmark, inlined so it inherits currentColor. */} + +
))}
diff --git a/snippets/components/KBExplorer/kb-data.jsx b/snippets/components/KBExplorer/kb-data.jsx index f4057d504..ec0e5c382 100644 --- a/snippets/components/KBExplorer/kb-data.jsx +++ b/snippets/components/KBExplorer/kb-data.jsx @@ -46,7 +46,7 @@ export const kbIndex = { "articles": [ { "id": "integrations/python-clickhouse-connect-example", - "title": "A Python client working example for connecting to ClickHouse Cloud Service", + "title": "A Python client working example for connecting to ClickHouse Cloud service", "description": "Learn how to connect to ClickHouse Cloud Service using Python with a step-by-step example using the clickhouse-connect driver.", "href": "/resources/support-center/knowledge-base/integrations/python-clickhouse-connect-example", "category": "Integrations & client libraries", @@ -56,7 +56,7 @@ export const kbIndex = { }, { "id": "configuration-settings/about-quotas-and-query-complexity", - "title": "About Quotas and Query complexity", + "title": "About quotas and query complexity", "description": "Quotas and Query Complexity are powerful ways to limit and restrict what users can do in ClickHouse. This KB article shows examples on how to apply these two different approaches.", "href": "/resources/support-center/knowledge-base/configuration-settings/about-quotas-and-query-complexity", "category": "Configuration & settings", @@ -87,7 +87,7 @@ export const kbIndex = { }, { "id": "configuration-settings/alter-user-settings-exception", - "title": "Alter User Settings Exception", + "title": "Alter user settings exception", "description": "Handing the an exception thrown when altering user settings", "href": "/resources/support-center/knowledge-base/configuration-settings/alter-user-settings-exception", "category": "Configuration & settings", @@ -348,7 +348,7 @@ export const kbIndex = { }, { "id": "cloud-services/execute-system-queries-in-cloud", - "title": "Execute SYSTEM Statements on All Nodes in ClickHouse Cloud", + "title": "Execute SYSTEM statements on all nodes in ClickHouse Cloud", "description": "Learn how to use `ON CLUSTER` and `clusterAllReplicas` to execute SYSTEM statements and queries across all nodes in a ClickHouse Cloud service.", "href": "/resources/support-center/knowledge-base/cloud-services/execute-system-queries-in-cloud", "category": "Cloud", @@ -368,7 +368,7 @@ export const kbIndex = { }, { "id": "troubleshooting/fix-developer-verification-error-in-macos", - "title": "Fix the Developer Verification Error in MacOS", + "title": "Fix the developer verification error in macOS", "description": "Learn how to resolve the MacOS developer verification error when running ClickHouse commands, using either System Settings or the terminal.", "href": "/resources/support-center/knowledge-base/troubleshooting/fix-developer-verification-error-in-macos", "category": "Troubleshooting & errors", @@ -389,7 +389,7 @@ export const kbIndex = { }, { "id": "data-import-export/kafka-clickhouse-json", - "title": "How can I use the new JSON Data Type with Kafka?", + "title": "How can I use the new JSON data type with Kafka?", "description": "Learn how to load JSON messages from Apache Kafka directly into a single JSON column in ClickHouse using the Kafka table engine and JSON data type.", "href": "/resources/support-center/knowledge-base/data-import-export/kafka-clickhouse-json", "category": "Data import & export", @@ -400,7 +400,7 @@ export const kbIndex = { }, { "id": "cloud-services/change-billing-email", - "title": "How do I change my Billing Contact in ClickHouse Cloud?", + "title": "How do I change my billing contact in ClickHouse Cloud?", "description": "Let's learn how to change your billing address in ClickHouse Cloud.", "href": "/resources/support-center/knowledge-base/cloud-services/change-billing-email", "category": "Cloud", @@ -420,7 +420,7 @@ export const kbIndex = { }, { "id": "data-import-export/parquet-to-csv-json", - "title": "How do I convert Files from Parquet to CSV or JSON?", + "title": "How do I convert files from Parquet to CSV or JSON?", "description": "Learn how to use ClickHouse's `clickhouse-local` tool to easily convert Parquet files to CSV or JSON formats.", "href": "/resources/support-center/knowledge-base/data-import-export/parquet-to-csv-json", "category": "Data import & export", @@ -431,7 +431,7 @@ export const kbIndex = { }, { "id": "data-import-export/mysql-to-parquet-csv-json", - "title": "How do I export MySQL Data to Parquet, CSV, or JSON Using ClickHouse", + "title": "How do I export MySQL data to Parquet, CSV, or JSON using ClickHouse", "description": "Learn how to use the `clickhouse-local` tool to export MySQL data into formats like Parquet, CSV, or JSON quickly and efficiently.", "href": "/resources/support-center/knowledge-base/data-import-export/mysql-to-parquet-csv-json", "category": "Data import & export", @@ -453,7 +453,7 @@ export const kbIndex = { }, { "id": "setup-installation/install-clickhouse-windows10", - "title": "How do I Install ClickHouse on Windows 10?", + "title": "How do I install ClickHouse on Windows 10?", "description": "Learn how to install and test ClickHouse on Windows 10 using WSL 2. Includes setup, troubleshooting, and running a test environment.", "href": "/resources/support-center/knowledge-base/setup-installation/install-clickhouse-windows10", "category": "Setup & installation", @@ -473,7 +473,7 @@ export const kbIndex = { }, { "id": "cloud-services/ingest-failures-23-9-release", - "title": "How do I resolve Ingest Failures After ClickHouse 23.9 Release?", + "title": "How do I resolve ingest failures after ClickHouse 23.9 release?", "description": "Learn how to resolve ingest failures caused by stricter grant checking introduced in ClickHouse 23.9 for tables using `async_inserts`. Update grants to fix errors.", "href": "/resources/support-center/knowledge-base/cloud-services/ingest-failures-23-9-release", "category": "Cloud", @@ -567,7 +567,7 @@ export const kbIndex = { }, { "id": "cloud-services/how-to-check-my-clickhouse-cloud-sevice-state", - "title": "How to Check Your ClickHouse Cloud Service State", + "title": "How to check your ClickHouse Cloud service state", "description": "Learn how to use the ClickHouse Cloud API to check if your service is stopped, idle, or running without waking it up.", "href": "/resources/support-center/knowledge-base/cloud-services/how-to-check-my-clickhouse-cloud-sevice-state", "category": "Cloud", @@ -577,7 +577,7 @@ export const kbIndex = { }, { "id": "configuration-settings/configure-a-user-setting", - "title": "How to Configure Settings for a User in ClickHouse", + "title": "How to configure settings for a user in ClickHouse", "description": "Learn how to define settings in ClickHouse for individual queries, client sessions, or specific users using `SET` and `ALTER USER` commands.", "href": "/resources/support-center/knowledge-base/configuration-settings/configure-a-user-setting", "category": "Configuration & settings", @@ -597,7 +597,7 @@ export const kbIndex = { }, { "id": "cloud-services/how-to-connect-to-ch-cloud-using-ssh-keys", - "title": "How to connect to ClickHouse using SSH Keys", + "title": "How to connect to ClickHouse using SSH keys", "description": "How to connect to ClickHouse and ClickHouse Cloud using SSH Keys", "href": "/resources/support-center/knowledge-base/cloud-services/how-to-connect-to-ch-cloud-using-ssh-keys", "category": "Cloud", @@ -628,7 +628,7 @@ export const kbIndex = { }, { "id": "setup-installation/enabling-ssl-with-lets-encrypt", - "title": "How to Enable SSL with Let's Encrypt on a Single ClickHouse Server", + "title": "How to enable SSL with Let's Encrypt on a single ClickHouse server", "description": "Learn how to set up SSL for a single ClickHouse server using Let's Encrypt, including certificate issuance, configuration, and validation.", "href": "/resources/support-center/knowledge-base/setup-installation/enabling-ssl-with-lets-encrypt", "category": "Setup & installation", @@ -638,7 +638,7 @@ export const kbIndex = { }, { "id": "data-import-export/file-export", - "title": "How to Export Data from ClickHouse to a File", + "title": "How to export data from ClickHouse to a file", "description": "Learn various methods to export data from ClickHouse, including `INTO OUTFILE`, the File table engine, and command-line redirection.", "href": "/resources/support-center/knowledge-base/data-import-export/file-export", "category": "Data import & export", @@ -659,7 +659,7 @@ export const kbIndex = { }, { "id": "monitoring-debugging/generate-har-file", - "title": "How to Generate a HAR file for support", + "title": "How to generate a HAR file for support", "description": "A HAR (HTTP Archive) file captures the network activity in your browser. It can help our support team diagnose slow page loads, failed requests, or other network issues.", "href": "/resources/support-center/knowledge-base/monitoring-debugging/generate-har-file", "category": "Monitoring & debugging", @@ -679,7 +679,7 @@ export const kbIndex = { }, { "id": "performance-optimization/find-expensive-queries", - "title": "How to Identify the Most Expensive Queries in ClickHouse", + "title": "How to identify the most expensive queries in ClickHouse", "description": "Learn how to use the `query_log` table in ClickHouse to identify the most memory and CPU-intensive queries across distributed nodes.", "href": "/resources/support-center/knowledge-base/performance-optimization/find-expensive-queries", "category": "Performance & optimization", @@ -689,7 +689,7 @@ export const kbIndex = { }, { "id": "configuration-settings/ignoring-incorrect-settings", - "title": "How to Ignore Incorrect Settings in ClickHouse", + "title": "How to ignore incorrect settings in ClickHouse", "description": "Learn how to use the `skip_check_for_incorrect_settings` option to allow ClickHouse to start even when user-level settings are specified incorrectly.", "href": "/resources/support-center/knowledge-base/configuration-settings/ignoring-incorrect-settings", "category": "Configuration & settings", @@ -707,7 +707,7 @@ export const kbIndex = { }, { "id": "setup-installation/how-to-increase-thread-pool-size", - "title": "How to Increase the Number of Threads in ClickHouse", + "title": "How to increase the number of threads in ClickHouse", "description": "Learn how to configure the Global Thread pool in ClickHouse by adjusting settings like `max_thread_pool_size`, `thread_pool_queue_size`, and `max_thread_pool_free_size`.", "href": "/resources/support-center/knowledge-base/setup-installation/how-to-increase-thread-pool-size", "category": "Setup & installation", @@ -717,7 +717,7 @@ export const kbIndex = { }, { "id": "data-import-export/kafka-to-clickhouse-setup", - "title": "How to Ingest Data from Kafka into ClickHouse", + "title": "How to ingest data from Kafka into ClickHouse", "description": "Learn how to ingest data from a Kafka topic into ClickHouse using the Kafka table engine, materialized views, and MergeTree tables.", "href": "/resources/support-center/knowledge-base/data-import-export/kafka-to-clickhouse-setup", "category": "Data import & export", @@ -827,7 +827,7 @@ export const kbIndex = { }, { "id": "monitoring-debugging/check-query-cache-in-use", - "title": "How to Verify Query Cache Usage in ClickHouse", + "title": "How to verify query cache usage in ClickHouse", "description": "Learn how to check if query cache is being utilized in ClickHouse using `clickhouse-client` trace logs or SQL commands.", "href": "/resources/support-center/knowledge-base/monitoring-debugging/check-query-cache-in-use", "category": "Monitoring & debugging", @@ -878,7 +878,7 @@ export const kbIndex = { }, { "id": "performance-optimization/improve-map-performance", - "title": "Improving Map Lookup Performance in ClickHouse", + "title": "Improving Map lookup performance in ClickHouse", "description": "Learn how to optimize Map column lookups in ClickHouse for better query performance by materializing specific keys as standalone columns.", "href": "/resources/support-center/knowledge-base/performance-optimization/improve-map-performance", "category": "Performance & optimization", @@ -1008,7 +1008,7 @@ export const kbIndex = { }, { "id": "data-import-export/cannot-append-data-to-parquet-format", - "title": "Resolving \"Cannot Append Data in Parquet Format\" Error in ClickHouse", + "title": "Resolving \"Cannot Append Data in Parquet Format\" error in ClickHouse", "description": "Are you getting the error \"Cannot append data in format Parquet to file\" error in ClickHouse? Let's take a look at how to resolve it.", "href": "/resources/support-center/knowledge-base/data-import-export/cannot-append-data-to-parquet-format", "category": "Data import & export", @@ -1019,7 +1019,7 @@ export const kbIndex = { }, { "id": "troubleshooting/exception-too-many-parts", - "title": "Resolving \"Too Many Parts\" Error in ClickHouse", + "title": "Resolving \"Too Many Parts\" error in ClickHouse", "description": "Learn how to address the \"Too many parts\" error in ClickHouse by optimizing insert rates, configuring MergeTree settings, and managing partitions effectively.", "href": "/resources/support-center/knowledge-base/troubleshooting/exception-too-many-parts", "category": "Troubleshooting & errors", @@ -1122,7 +1122,7 @@ export const kbIndex = { }, { "id": "general-faqs/use-clickhouse-for-log-analytics", - "title": "Using ClickHouse for Log Analytics", + "title": "Using ClickHouse for log analytics", "description": "ClickHouse is popular for logs and metrics analysis because of the real-time analytics capabilities provided. Ready to find out more?", "href": "/resources/support-center/knowledge-base/general-faqs/use-clickhouse-for-log-analytics", "category": "General & FAQs", @@ -1132,7 +1132,7 @@ export const kbIndex = { }, { "id": "queries-sql/filtered-aggregates", - "title": "Using Filtered Aggregates in ClickHouse", + "title": "Using filtered aggregates in ClickHouse", "description": "Learn how to use filtered aggregates in ClickHouse with `-If` and `-Distinct` aggregate combinators to simplify query syntax and enhance analytics.", "href": "/resources/support-center/knowledge-base/queries-sql/filtered-aggregates", "category": "Queries & SQL", @@ -1175,10 +1175,12 @@ export const kbIndex = { { "id": "general-faqs/columnar-database", "title": "What is a columnar database?", - "description": "This page describes what a columnar database is", + "description": "A columnar database stores the data of each column independently. This allows reading data from disk only for those columns that are used in any given query.", "href": "/resources/support-center/knowledge-base/general-faqs/columnar-database", "category": "General & FAQs", - "tags": [] + "tags": [ + "Core Data Concepts" + ] }, { "id": "general-faqs/olap", diff --git a/snippets/components/QuickStartsGrid/QuickStartsGrid.jsx b/snippets/components/QuickStartsGrid/QuickStartsGrid.jsx index b31b7cbe9..7dc34e2cf 100644 --- a/snippets/components/QuickStartsGrid/QuickStartsGrid.jsx +++ b/snippets/components/QuickStartsGrid/QuickStartsGrid.jsx @@ -140,20 +140,20 @@ export const QuickStartsGrid = ({ quickStartsData = [], featured = [] }) => { window.location.assign(withBase(href)); }; - // Featured quickstarts, in the order listed in `featured`. Each keeps its banner - // image; the href falls back to the conventional quickstart path if the data - // hasn't loaded yet so the cards are clickable immediately. + // Featured quickstarts, in the order listed in `featured`. The banner art is + // drawn in code from the title (see below), so no per-locale image is needed. + // The href falls back to the conventional quickstart path if the data hasn't + // loaded yet so the cards are clickable immediately. const featuredQuickStarts = featured .map(f => { const qs = data.find(q => q.id === f.id); return { id: f.id, - image: f.image, href: (qs && qs.href) || `/get-started/quickstarts/${f.id}`, title: (qs && qs.title) || '', }; }) - .filter(f => f.image); + .filter(f => f.title); // Always-visible filter group (not collapsible) const FilterGroup = ({ label, options, selectedOptions, onToggle }) => { @@ -209,14 +209,29 @@ export const QuickStartsGrid = ({ quickStartsData = [], featured = [] }) => { onClick={(e) => handleCardClick(e, quickStart.href)} className="group block rounded-xl overflow-hidden border border-gray-200 dark:border-white/10 transition-all hover:border-black dark:hover:border-[#FAFF69] hover:shadow-md" > - {/* Rendered as a background image (not ) so Mintlify's - click-to-zoom doesn't hijack the link navigation. */} -
+ {/* Banner art is drawn in code from the title so it + translates automatically — no per-locale PNG needed. */} +
+ {/* Decorative bar-chart motif, purely visual. */} + + + {quickStart.title} + + {/* ClickHouse wordmark, inlined so it inherits currentColor. */} + +
))}