即将到来的主题列表变更——如何准备主题和插件

作为我们持续标准化 Discourse 代码库中渲染系统的一部分,我们正在替换主题列表的实现。

以前,这使用了“原始 handlebars”(.hbr)方法,并且可以通过模板覆盖和原始插件出口进行自定义。主题列表的新实现使用了现代 Glimmer 组件,并且从头开始构建,以可持续的方式进行自定义。

新实现现在可通过 glimmer_topic_list_mode 设置启用。

  • disabled:使用旧版“原始 handlebars”主题列表
  • auto:将检测您当前插件和主题的兼容性。如果任何一个不兼容,它将使用旧版系统;否则,它将使用新实现。
  • enabled:将使用新的主题列表实现。如果您有任何不兼容的插件或主题,您的站点可能会损坏。

我们已经更新了我们的大部分官方主题和插件以兼容新菜单。但是,如果您运行任何第三方插件、主题或主题组件来定制主题列表,则需要升级它们。

浏览器控制台中将打印警告,指明不兼容的来源。

:timer_clock: 发布时间表

这些是大致估计,可能会发生变化

2024 年第四季度:

  • :white_check_mark: 核心实现完成
  • :white_check_mark: 更新官方主题/插件(进行中)
  • :white_check_mark: 在 Meta 上启用
  • :white_check_mark: 发布升级建议

2025 年第一季度:

  • :white_check_mark: 更新官方主题/插件

  • :white_check_mark: glimmer_topic_list_mode 默认为 auto;启用控制台弃用消息

  • :white_check_mark: 弃用将触发管理员警告横幅,以处理任何剩余问题

  • 应更新第三方插件和主题

  • :white_check_mark: 3 月 1 日 - 为所有站点启用新的主题列表。站点设置的默认值将切换为 enabled,但仍可切换回“disabled”。

2025 年第二季度

  • :white_check_mark: 4 月 1 日之后 - 最终移除旧版模式及相关代码

:eyes: 这对我意味着什么?

如果您的插件或主题包含任何“原始 handlebars”文件(命名为 .hbr.raw.hbs),则需要更新这些文件以兼容新版本。常规的 Ember 组件/路由的 .hbs 文件不受此更改的影响。

如果您使用 modifyClass 修改 component:topic-listcomponent:topic-list-item,也需要进行升级。

如果您的站点有任何这些不兼容的自定义,浏览器开发者控制台中将打印警告消息,其中包含有关哪个主题/插件导致问题的说明。

替换项是什么?

一些旧的原始插件出口已转换为常规插件出口。这些可以一对一地更新。

更高级的自定义需要逐案评估。新的主题列表提供了许多新 API,可实现轻松而稳健的自定义。在此处了解更多信息:

以下是一些示例:

:sos: 其他自定义怎么办?

如果使用我们引入的新 API 无法实现您的自定义,请通过创建新的 Dev 主题进行讨论,告知我们。

:sparkles: 我是一名插件/主题作者。如何更新主题/插件以在过渡期间同时支持旧版和新版主题列表?

新插件出口在新旧主题列表的实现中都会被渲染。所以:当您实现了新版本后,只需删除旧的原始插件出口连接器即可。

对于替换模板覆盖或未现代化出口的 DAG(有向无环图)式自定义,您需要在过渡期间同时维护这两种实现。

一旦您的主题/插件同时支持旧版和新版实现,您可以在所有 .hbr 文件的顶部添加此魔术注释:

{{!-- has-modern-replacement --}}

这将消除弃用消息,并在“auto”模式下允许使用新实现。

12 个赞

抱歉吹毛求疵,但这是否真的意味着“如果您的插件或主题中有任何与主题列表相关的‘原始 handlebars’文件,则需要更新它们”?

与我无关的其他模型的原始 handlebars 文件将继续正常工作,对吗?还是说原始 handlebars 文件将完全消失?(我认为它们对于其他模型/路由是必需的,对吗?)

3 个赞

“原始 Handlebars” 指的是我们特定于 discourse 的模板,其文件扩展名为 .hbr(或历史上为 .raw.hbs)。我们仅将此系统用于 topic-list 和一些“autocomplete”内部组件。

其他 .hbs 文件(例如 Ember 组件或路由的文件)不受影响。

我将更新 OP 以使其更清晰。谢谢 @pfaffman

编辑:好了:

1 个赞

哦。你确实努力让它变得清晰。你明确说明了扩展名。我认为你不能再让它更清晰了。我想这事怪我。:person_shrugging:

但也许加上那句额外的话能帮我读懂。

1 个赞

谢谢分享。我一直对此感到担忧,它终于来了……:grimacing: 这看起来不会是一段轻松的旅程……:sweat_smile: 但价值转换器可能会让它变得更容易。:crossed_fingers:

2 个赞

我认为 GitHub - discourse/discourse-topic-excerpts: Add topic excerpts to all topics in the topic list 还没有更新?

1 个赞

是的,我们仍有许多官方主题/插件等待升级。我将在 OP 中将该项目符号延长至第一季度 :writing_hand:

1 个赞

谢谢!到目前为止,开发者体验很不错!等我进行到 TLP 部分时,如果遇到任何问题,我会通知你。

2 个赞

太棒了!官方的 topic-list-thumbnails 是我们已经完成更新的一个,所以它或许可以作为有用的参考。

2 个赞

哦,我的错!@isaac 上周更新了 topic-excerpts:DEV: Update plugin for `glimmer-topic-list` (#34) · discourse/discourse-topic-excerpts@0dd3c6c · GitHub

所以它在新主题列表下应该可以正常工作 :crossed_fingers:

1 个赞

我遇到了以下问题:

两个版本都是最新的。

添加列时,添加可排序列标题的策略是什么?

通过使用:

api.registerValueTransformer("topic-list-header-sortable-column"

除了其他转换器之外?

      api.registerValueTransformer(
        "topic-list-columns",

似乎不能单独完成此操作? :thinking:

cc @isaac. If I had to guess: perhaps the new logic needs updating to handle uncategorised topics?

你找到的转换器是为了覆盖现有列的可排序性(例如,我们在 discourse-calendar 中使用它来防止在查看按时间顺序排列的主题视图时使用任何其他排序方法)。

如果你要添加一个新列,那么你应该“只需”能够使用 SortableColumn 组件来定义你的标题。例如,这是核心中的一个:

(新 API 的一个真正优点是,所有核心列都使用与你从主题/插件使用的相同的 API 来定义!)

2 个赞

是的,我在代码搜索时注意到了这一点,很棒!

1 个赞

Fixed :slight_smile:

2 个赞

问:是否可以将整个组件分配给单元格,而不仅仅是<template>

例如,如果我想在需要一些最小 JavaScript 逻辑的单元格中显示一个透明按钮,该怎么办?

是的!从技术上讲,一个裸露的 <template> 标签实际上是在创建一个“仅模板组件”。这与当你将一个裸露的 .hbs 文件放在 components/ 目录下时得到的组件类型类似。

所以是的,导入和传递一个普通的组件类同样有效。它甚至适用于经典的组件!(尽管我们显然推荐使用更现代的 Glimmer 组件)。

2 个赞

太棒了!

这改变了……很多:exploding_head:

1 个赞

愚蠢的问题,也许吧。

但如何将更改应用于……移动主题列表?

1 个赞

对于移动设备,我们提供了一系列新的插件插槽(包括包装器插槽)。

或者,您也可以使用 valueTransformer 在所有地方强制使用桌面视图(我们对 topic-thumbnails 这样做)。

我计划下周编写一份更详细的“如何自定义主题列表”Documentation > Developer Guides,因此一定会将这些信息包含在其中。

4 个赞