From 579f21f515e83ec1be50dd4e85b01b633d6d4c81 Mon Sep 17 00:00:00 2001 From: Gabe Koscky <68292774+gkoscky@users.noreply.github.com> Date: Wed, 4 Oct 2023 18:03:04 -0400 Subject: [PATCH 1/6] Set correct comment count Discourse is very peculiar when it comes to what it counts as a "reply", so in order to get a current, sensible count we must just count all posts and subtract one, for the original post. --- src/components/ForumWidget/ForumWidget.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/ForumWidget/ForumWidget.tsx b/src/components/ForumWidget/ForumWidget.tsx index c2020429..1e3465d2 100644 --- a/src/components/ForumWidget/ForumWidget.tsx +++ b/src/components/ForumWidget/ForumWidget.tsx @@ -24,7 +24,10 @@ const ForumWidget = () => { const { posts_count } = res.data - setCommentAmount(posts_count) + // Discourse topics don't have a separate count just for replies so we must + // get the full count of posts and subtract one, for the original post + // https://meta.discourse.org/t/how-to-get-accurate-reply-count-through-api/144267/2 + setCommentAmount(posts_count - 1) }, [forum_link]) useEffect(() => { From a817d14c11b37e357bb406478d05494a951c7672 Mon Sep 17 00:00:00 2001 From: Gabe Koscky <68292774+gkoscky@users.noreply.github.com> Date: Wed, 4 Oct 2023 18:04:53 -0400 Subject: [PATCH 2/6] Fix comment-button styling The button was disappearing in dark mode The alignment was also off And the color was changing on hover in Firefox --- src/components/ForumWidget/ForumWidget.tsx | 2 +- src/components/ForumWidget/styles.module.scss | 21 +++++++++---------- 2 files changed, 11 insertions(+), 12 deletions(-) diff --git a/src/components/ForumWidget/ForumWidget.tsx b/src/components/ForumWidget/ForumWidget.tsx index 1e3465d2..6a0b36f0 100644 --- a/src/components/ForumWidget/ForumWidget.tsx +++ b/src/components/ForumWidget/ForumWidget.tsx @@ -41,7 +41,7 @@ const ForumWidget = () => {
- +
diff --git a/src/components/ForumWidget/styles.module.scss b/src/components/ForumWidget/styles.module.scss index 07cde9b4..99821b3e 100644 --- a/src/components/ForumWidget/styles.module.scss +++ b/src/components/ForumWidget/styles.module.scss @@ -1,7 +1,7 @@ .root { display: flex; font-size: 13px; - border: 1px solid #CCD0D5; + border: 1px solid #ccd0d5; border-radius: 24px; line-height: 16px; display: flex; @@ -10,7 +10,9 @@ padding: 4px 8px 5px; gap: 4px; width: fit-content; - margin-top: .25rem; + margin-top: 0.25rem; + color: var(--ifm-font-color-base); + & > * { flex: none; order: 1; @@ -18,9 +20,7 @@ } &:hover { text-decoration: none; - } - & span { - color: #1C1E21; + color: unset; } } @@ -28,10 +28,9 @@ display: flex; align-items: center; justify-content: center; - margin-right: 5px; - & img { - width: 100%; - } - -} \ No newline at end of file + & svg { + position: relative; + top: 1px; + } +} From 5d2c10321ee4e50d0b721fc7eafa7cb47309e285 Mon Sep 17 00:00:00 2001 From: Gabe Koscky <68292774+gkoscky@users.noreply.github.com> Date: Wed, 4 Oct 2023 18:07:14 -0400 Subject: [PATCH 3/6] Avoid comment button on empty forum_link If the `forum_link` property was present on a post but had no value, the "Leave a reply" button would be rendered but not be a link (since we have no href). So let's check for any valid `forum_link` instead of just not undefined --- src/components/ForumWidget/ForumWidget.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ForumWidget/ForumWidget.tsx b/src/components/ForumWidget/ForumWidget.tsx index 6a0b36f0..9d93e338 100644 --- a/src/components/ForumWidget/ForumWidget.tsx +++ b/src/components/ForumWidget/ForumWidget.tsx @@ -37,7 +37,7 @@ const ForumWidget = () => { }, [forum_link]) return ( - forum_link !== undefined ? + forum_link ?
@@ -56,4 +56,4 @@ const ForumWidget = () => { ) } -export default ForumWidget \ No newline at end of file +export default ForumWidget From 1af65d7b88f09f454d9d80f53d4bf88b577998f8 Mon Sep 17 00:00:00 2001 From: Gabe Koscky <68292774+gkoscky@users.noreply.github.com> Date: Wed, 4 Oct 2023 18:21:46 -0400 Subject: [PATCH 4/6] Add missing forum_link The latest posts was missing a link to its discussion in the forums --- content/2023-07-24-open-sourcing-flashbots-mev-share-node.mdx | 1 + 1 file changed, 1 insertion(+) diff --git a/content/2023-07-24-open-sourcing-flashbots-mev-share-node.mdx b/content/2023-07-24-open-sourcing-flashbots-mev-share-node.mdx index a377aa4f..e3c17128 100644 --- a/content/2023-07-24-open-sourcing-flashbots-mev-share-node.mdx +++ b/content/2023-07-24-open-sourcing-flashbots-mev-share-node.mdx @@ -4,6 +4,7 @@ title: Open sourcing the Flashbots MEV-Share Node authors: [flashbots] tags: [mev-share] hide_table_of_contents: false +forum_link: https://collective.flashbots.net/t/open-sourcing-the-flashbots-mev-share-node/2045 --- Users should be able to see and control how their transactions are processed in the MEV supply chain. In order to bring more transparency to [orderflow auctions](https://writings.flashbots.net/order-flow-auctions-and-centralisation-II), Flashbots has open sourced our implementation of a [MEV-Share Node](https://github.com/flashbots/mev-share-node). From 23212dd60e71a11990962c5821ee02f52a7e3ab0 Mon Sep 17 00:00:00 2001 From: Gabe Koscky <68292774+gkoscky@users.noreply.github.com> Date: Thu, 5 Oct 2023 21:00:20 -0400 Subject: [PATCH 5/6] Change cursor on navigation buttons So users know they're clickable --- src/scss/custom.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/scss/custom.scss b/src/scss/custom.scss index 5dce06dc..655cd7c0 100644 --- a/src/scss/custom.scss +++ b/src/scss/custom.scss @@ -145,4 +145,8 @@ h1, h2, h3, h4, h5, h6 { // Fix katex math equation overflowing text width .katex-display { overflow-x: scroll; -} \ No newline at end of file +} + +.pagination-nav__item { + cursor: pointer; +} From 391b29aa7aed0da95b873cb001888b3c587a7beb Mon Sep 17 00:00:00 2001 From: Gabe Koscky <68292774+gkoscky@users.noreply.github.com> Date: Thu, 5 Oct 2023 21:02:19 -0400 Subject: [PATCH 6/6] Scroll up to tags list when changing pages Being stuck on the bottom of the page is bad usability, so scroll all the way back up so users can check out the posts --- src/theme/BlogListPage/index.tsx | 12 ++++++++---- src/theme/BlogListPage/styles.module.scss | 4 ++-- src/theme/TagsListInline/index.tsx | 12 +++++++----- src/theme/TagsListInline/styles.module.css | 6 +++++- 4 files changed, 22 insertions(+), 12 deletions(-) diff --git a/src/theme/BlogListPage/index.tsx b/src/theme/BlogListPage/index.tsx index ca960dff..f9a61420 100644 --- a/src/theme/BlogListPage/index.tsx +++ b/src/theme/BlogListPage/index.tsx @@ -49,11 +49,15 @@ const extractTags = ({ items }: Props) => { })) } -const paginate = function (array: Array[], index: number, size: number): any[] { +const paginate = function (array: Array[], index: number, size: number, tagsListRef: React.RefObject): any[] { // transform values index = Math.abs(index); index = index > 0 ? index - 1 : index; size = size < 1 ? 1 : size; + + if (tagsListRef.current) { + tagsListRef.current.scrollIntoView() + } // filter return [...(array.filter((value, n) => { return (n >= (index * size)) && (n < ((index+1) * size)) @@ -71,12 +75,12 @@ function BlogListPage(props: Props): JSX.Element { const isBlogOnlyMode = permalink === "/" const title = isBlogOnlyMode ? siteTitle : blogTitle const tags = extractTags(props) - + const tagsListRef = React.useRef(null) const [page, setPage] = useState(0) const currentPage = useMemo(() => { // @ts-ignore: Readonly prevents mutation calls - return paginate([...items], page + 1, POST_PER_PAGE) + return paginate([...items], page + 1, POST_PER_PAGE, tagsListRef) }, [items, page]) // @ts-ignore: Destructuring doesn't ensure type fulfillment @@ -110,7 +114,7 @@ function BlogListPage(props: Props): JSX.Element {

A collection of articles and papers from Flashbots.

- + {currentPage.filter(item => searchFilter === "" || item.content.frontMatter.title.toLowerCase().includes(searchFilter.toLowerCase())).map(({ content: BlogPostContent }) => ( ) { return ( - <> +
))} - +
) -} +}) + +export default TagsListInline diff --git a/src/theme/TagsListInline/styles.module.css b/src/theme/TagsListInline/styles.module.css index e8c8da63..22d57fcb 100644 --- a/src/theme/TagsListInline/styles.module.css +++ b/src/theme/TagsListInline/styles.module.css @@ -5,7 +5,11 @@ * LICENSE file in the root directory of this source tree. */ -.tags { + .tagsFilter { + padding-top: 6em; + } + + .tags { display: inline; }