This is an automated email from the ASF dual-hosted git repository.
hansva pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/hop-website.git
The following commit(s) were added to refs/heads/main by this push:
new ce13f47bd2 [DOCS] add native type for spark engine (#281)
ce13f47bd2 is described below
commit ce13f47bd20c1b74c2ab1607059ac334d56d8545
Author: Hans Van Akelyen <[email protected]>
AuthorDate: Mon Sep 14 17:30:05 2026 +0200
[DOCS] add native type for spark engine (#281)
---
README.md | 5 ++++-
ui/css/site.css | 7 +++++--
ui/helpers/engines.js | 23 +++++++++++++++++------
ui/partials/engines.hbs | 8 ++++++--
4 files changed, 32 insertions(+), 11 deletions(-)
diff --git a/README.md b/README.md
index 500128e6ae..f3eb63a32e 100644
--- a/README.md
+++ b/README.md
@@ -98,7 +98,10 @@ UI rather than by Asciidoctor:
```
The first becomes the engine tags under the breadcrumb - names written out in
-full, states `yes`, `no` or anything else for unknown. The second marks a page
+full, states `yes`, `no`, `native` or anything else for unknown. `native` is
+for an engine that implements the transform itself where `yes` would mean the
+Hop transform runs wrapped inside it, as most transforms do on Spark; use it
+only where the engine draws that line. The second marks a page
as documenting a plugin the standard client does not ship, and takes the id the
marketplace installs by, so the note can give the exact command.
diff --git a/ui/css/site.css b/ui/css/site.css
index 016b8b7cc7..75407bfb2a 100644
--- a/ui/css/site.css
+++ b/ui/css/site.css
@@ -56,8 +56,10 @@
/* ---------- engine tags ----------
Which engines a transform runs on, under the breadcrumb. The state is drawn
by a symbol, never by colour alone, so the colours here reinforce a
- distinction that is already made without them. All three sit on --surface
- and are pairs check-contrast already gates. */
+ distinction that is already made without them. All of them sit on --surface
+ and are pairs check-contrast already gates. Native and supported share a
+ colour on purpose: both mean "runs here", and the double check alone says
+ which is the engine's own implementation. */
.engines {
display: flex; flex-wrap: wrap; gap: 6px;
list-style: none; margin: 0 0 20px; padding: 0;
@@ -71,6 +73,7 @@
white-space: nowrap;
}
.engine__mark { flex: none; }
+.engine--native .engine__mark,
.engine--supported .engine__mark { color: var(--tip); }
.engine--unknown .engine__mark { color: var(--warning); }
/* An unsupported engine is still worth stating, but it is not the news on the
diff --git a/ui/helpers/engines.js b/ui/helpers/engines.js
index eabf8512ba..6f8ce3cf9e 100644
--- a/ui/helpers/engines.js
+++ b/ui/helpers/engines.js
@@ -27,13 +27,21 @@
* of and it still renders: when a new engine arrives, the docs declare it and
* nothing here needs changing. The order is the page's own.
*
- * States are normalised to three - supported, unsupported, unknown - so the
- * docs can write yes/no, true/false or supported/unsupported and mean the same
- * thing. Anything unrecognised, "maybe" included, lands on unknown, which is
- * the honest reading of a value this does not understand.
+ * States are normalised to four - native, supported, unsupported, unknown - so
+ * the docs can write yes/no, true/false or supported/unsupported and mean the
+ * same thing. Anything unrecognised, "maybe" included, lands on unknown, which
+ * is the honest reading of a value this does not understand.
+ *
+ * "native" is a step above "supported": the engine has its own implementation
+ * of the transform (Spark doing the sort or the join itself), where "yes" on
an
+ * engine like Spark means the Hop transform runs wrapped inside the engine -
+ * it works, but sees one partition at a time. The distinction is only stated
+ * where an engine makes it; for the Hop engine every "yes" is native and the
+ * pages simply say yes.
*/
-const SUPPORTED = new Set(['yes', 'true', 'supported'])
+const NATIVE = new Set(['native'])
+const SUPPORTED = new Set(['yes', 'true', 'supported', 'wrapped'])
const UNSUPPORTED = new Set(['no', 'false', 'unsupported'])
const slug = (s) => s.toLowerCase().replace(/[^a-z0-9]+/g,
'-').replace(/^-|-$/g, '')
@@ -48,7 +56,10 @@ module.exports = (value) => {
return {
label,
slug: slug(label),
- state: SUPPORTED.has(state) ? 'supported' : UNSUPPORTED.has(state) ?
'unsupported' : 'unknown',
+ state: NATIVE.has(state) ? 'native'
+ : SUPPORTED.has(state) ? 'supported'
+ : UNSUPPORTED.has(state) ? 'unsupported'
+ : 'unknown',
}
}).filter(Boolean)
}
diff --git a/ui/partials/engines.hbs b/ui/partials/engines.hbs
index 9735379e94..7ed7b14e73 100644
--- a/ui/partials/engines.hbs
+++ b/ui/partials/engines.hbs
@@ -22,18 +22,22 @@
The state is carried by a symbol and by a word, never by colour alone
(1.4.1). The word is for screen readers only: the symbol says it on screen,
and reading "Hop Engine supported, Native Spark not supported" is what
makes
- the list usable when the symbols cannot be seen. }}
+ the list usable when the symbols cannot be seen.
+
+ A native state gets a double check: the engine runs the transform itself
+ rather than wrapping the Hop implementation. Supported is a single check.
}}
{{#with (engines page.attributes.engines)}}
<ul class="engines" data-pagefind-ignore>
{{#each this}}
<li class="engine engine--{{state}}" data-engine="{{slug}}">
<svg class="engine__mark" width="12" height="12" viewBox="0 0 12 12"
aria-hidden="true" focusable="false">
+ {{#if (eq state 'native')}}<path d="M1 6.4 3.4 9 8 3.2M5.2 8.6 6.2 9.8
11 4" fill="none" stroke="currentColor" stroke-width="1.6"
stroke-linecap="round" stroke-linejoin="round"/>{{/if}}
{{#if (eq state 'supported')}}<path d="M2 6.4 4.6 9 10 3.2" fill="none"
stroke="currentColor" stroke-width="1.8" stroke-linecap="round"
stroke-linejoin="round"/>{{/if}}
{{#if (eq state 'unsupported')}}<path d="M3 3l6 6M9 3l-6 6" fill="none"
stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/>{{/if}}
{{#if (eq state 'unknown')}}<path d="M4.1 4.3a1.9 1.9 0 1 1 2.6
1.8c-.5.2-.7.6-.7 1.1v.3" fill="none" stroke="currentColor" stroke-width="1.6"
stroke-linecap="round"/><circle cx="6" cy="9.3" r=".85"
fill="currentColor"/>{{/if}}
</svg>
{{label}}
- <span class="visually-hidden">{{#if (eq state
'supported')}}supported{{/if}}{{#if (eq state 'unsupported')}}not
supported{{/if}}{{#if (eq state 'unknown')}}support unknown{{/if}}</span>
+ <span class="visually-hidden">{{#if (eq state 'native')}}native
implementation{{/if}}{{#if (eq state 'supported')}}supported{{/if}}{{#if (eq
state 'unsupported')}}not supported{{/if}}{{#if (eq state 'unknown')}}support
unknown{{/if}}</span>
</li>
{{/each}}
</ul>