tiagobento commented on code in PR #60:
URL:
https://github.com/apache/incubator-kie-website/pull/60#discussion_r3805595722
##########
src/theme/BlogSidebar/Content/index.tsx:
##########
@@ -0,0 +1,79 @@
+/**
+ * Swizzled from @docusaurus/theme-classic to make the year groups collapsible.
+ *
+ * Upstream renders each year as a plain `<div role="group">`, which is fine
for
+ * a handful of posts and unusable once the historical Drools/jBPM/OptaPlanner
+ * archives are in — the sidebar becomes a single scroll of hundreds of titles.
+ * Same grouping, wrapped in `<details>` so a reader can collapse a year.
+ *
+ * Open by default: the most recent year, plus whichever year contains the post
+ * currently being read, so you never land on a page whose own entry is hidden.
+ */
+import React, { memo, useState, type ReactNode } from "react";
+import { useLocation } from "@docusaurus/router";
+import { useThemeConfig } from "@docusaurus/theme-common";
+import { groupBlogSidebarItemsByYear } from
"@docusaurus/plugin-content-blog/client";
+import type { Props } from "@theme/BlogSidebar/Content";
+import type { BlogSidebarItem } from "@docusaurus/plugin-content-blog";
+
+import styles from "./styles.module.css";
+
+function BlogSidebarYearGroup({
+ year,
+ yearGroupHeadingClassName,
+ defaultOpen,
+ children,
+}: {
+ year: string;
+ yearGroupHeadingClassName?: string;
+ defaultOpen: boolean;
+ children: ReactNode;
+}) {
+ const [open, setOpen] = useState(defaultOpen);
+ return (
+ <details
+ className={styles.yearGroup}
+ open={open}
+ onToggle={(e) => setOpen((e.currentTarget as HTMLDetailsElement).open)}
+ >
+ <summary className={styles.yearGroupSummary}>
+ <span className={yearGroupHeadingClassName}>{year}</span>
+ </summary>
+ {children}
+ </details>
Review Comment:
Good catch, fixed in b669c3a. Confirmed the failure mode: the sidebar
survives client-side navigation and the groups are keyed by year, so they are
not remounted and the initial `useState` never re-ran. Added an effect that
syncs on change. It only ever opens, never closes, so a year the reader
collapsed by hand stays collapsed until the current post actually moves into it.
##########
src/theme/BlogSidebar/Content/index.tsx:
##########
@@ -0,0 +1,79 @@
+/**
+ * Swizzled from @docusaurus/theme-classic to make the year groups collapsible.
+ *
+ * Upstream renders each year as a plain `<div role="group">`, which is fine
for
+ * a handful of posts and unusable once the historical Drools/jBPM/OptaPlanner
+ * archives are in — the sidebar becomes a single scroll of hundreds of titles.
+ * Same grouping, wrapped in `<details>` so a reader can collapse a year.
+ *
+ * Open by default: the most recent year, plus whichever year contains the post
+ * currently being read, so you never land on a page whose own entry is hidden.
+ */
+import React, { memo, useState, type ReactNode } from "react";
+import { useLocation } from "@docusaurus/router";
+import { useThemeConfig } from "@docusaurus/theme-common";
+import { groupBlogSidebarItemsByYear } from
"@docusaurus/plugin-content-blog/client";
+import type { Props } from "@theme/BlogSidebar/Content";
+import type { BlogSidebarItem } from "@docusaurus/plugin-content-blog";
+
+import styles from "./styles.module.css";
+
+function BlogSidebarYearGroup({
+ year,
+ yearGroupHeadingClassName,
+ defaultOpen,
+ children,
+}: {
+ year: string;
+ yearGroupHeadingClassName?: string;
+ defaultOpen: boolean;
+ children: ReactNode;
+}) {
+ const [open, setOpen] = useState(defaultOpen);
+ return (
+ <details
+ className={styles.yearGroup}
+ open={open}
+ onToggle={(e) => setOpen((e.currentTarget as HTMLDetailsElement).open)}
+ >
+ <summary className={styles.yearGroupSummary}>
+ <span className={yearGroupHeadingClassName}>{year}</span>
+ </summary>
+ {children}
+ </details>
+ );
+}
+
+function BlogSidebarContent({
+ items,
+ yearGroupHeadingClassName,
+ ListComponent,
+}: Props): ReactNode {
+ const themeConfig = useThemeConfig();
+ const { pathname } = useLocation();
+
+ if (!themeConfig.blog.sidebar.groupByYear) {
+ return <ListComponent items={items} />;
+ }
+
+ const itemsByYear = groupBlogSidebarItemsByYear(items);
+ const containsCurrentPost = (yearItems: BlogSidebarItem[]) =>
+ yearItems.some((item) => item.permalink === pathname);
+
+ return (
+ <>
+ {itemsByYear.map(([year, yearItems], index) => (
+ <BlogSidebarYearGroup
+ key={year}
+ year={year}
+ yearGroupHeadingClassName={yearGroupHeadingClassName}
+ defaultOpen={index === 0 || containsCurrentPost(yearItems)}
+ >
+ <ListComponent items={yearItems} />
+ </BlogSidebarYearGroup>
+ ))}
Review Comment:
Same fix as the thread above — b669c3a.
##########
src/theme/BlogLayout/index.tsx:
##########
@@ -0,0 +1,74 @@
+/**
+ * Swizzled from @docusaurus/theme-classic to give the blog a persistent
+ * right-hand rail.
+ *
+ * Upstream only renders the right column when a `toc` is passed, which the
+ * post pages do and the list page doesn't — so `/blog` had a two-column gap on
+ * the right and nowhere to put the link to the tag index. This renders the
+ * column unconditionally: the tags link on top, the table of contents under it
+ * where there is one.
+ *
+ * The column widths are unchanged from upstream; the rail fills space the grid
+ * was already reserving.
+ */
+import React, { type ReactNode } from "react";
+import clsx from "clsx";
+import Link from "@docusaurus/Link";
+import { useLocation } from "@docusaurus/router";
+import useBaseUrl from "@docusaurus/useBaseUrl";
+import { translate } from "@docusaurus/Translate";
+import Layout from "@theme/Layout";
+import BlogSidebar from "@theme/BlogSidebar";
+import type { Props } from "@theme/BlogLayout";
+
+import styles from "./styles.module.css";
+
+function BlogTagsLink() {
+ const tagsPath = useBaseUrl("/blog/tags");
+ const { pathname } = useLocation();
+
+ // Don't offer the link on the tag index itself, or on an individual tag
+ // page, where it would just point back at where you already are.
+ if (pathname.replace(/\/$/, "") === tagsPath.replace(/\/$/, "")) {
+ return null;
+ }
+
+ return (
+ <Link to="/blog/tags" className={styles.tagsLink}>
+ {translate({
+ id: "theme.blog.sidebar.browseTagsLabel",
+ message: "Browse by tag",
+ description: "The blog sidebar link to the tags index page",
+ })}
+ </Link>
+ );
Review Comment:
Point (1) is right and is fixed in b669c3a: the check now normalises the
trailing slash and prefix-matches, so `/blog/tags` and `/blog/tags/<tag>` are
both covered. Verified in the build output — the link is absent from
`/blog/tags/release`.
Point (2) is not correct, and I left the target as-is. `@docusaurus/Link`
applies `baseUrl` itself via `withBaseUrl`, so a site-relative `to` is the
right input. Passing the already-resolved `tagsPath` risks the prefix being
applied twice. `tagsPath` is deliberately only used for comparison against
`pathname`, which is baseUrl-inclusive. Added a comment saying so, since it
otherwise reads as an inconsistency.
##########
src/css/custom.css:
##########
@@ -199,3 +199,18 @@ html {
height: 3rem;
margin-right: 0.5rem;
}
+
+/* Author names read as body text, not as links.
+ The blog page already carries a lot of the primary colour - tag chips, "Read
+ more", post titles - and the author byline repeating it, once per author per
+ post, tips the list over. `.avatar__name` is Infima's own class, so this
+ holds without swizzling the Author component. The link is still a link:
+ underline on hover, and the primary colour returns on hover so the
+ affordance isn't lost. */
+.avatar__name a {
+ color: var(--ifm-font-color-base);
+}
+
+.avatar__name a:hover {
+ color: var(--ifm-color-primary);
Review Comment:
The underline does happen — Infima sets `a:hover { text-decoration:
var(--ifm-link-hover-decoration) }` with `--ifm-link-hover-decoration:
underline`, and these rules override only `color`, so it survives. But the
comment implied the rules here provide it, so I reworded it to attribute the
underline to Infima instead. b669c3a.
##########
blog/2026-06-09-new-generation-editors-kie-10-2.md:
##########
@@ -1,15 +1,15 @@
---
slug: new-generation-editors-kie-10-2
-title: "The Dawn of a New Era: Next-Generation Editors in Apache KIE 10.2"
+title: "The dawn of a new era: Next-generation Editors in Apache KIE 10.2"
Review Comment:
Agreed — the title now reads "Next-generation editors in Apache KIE 10.2".
b669c3a.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
