refactor: flarum 2.0 upgrade

.github/workflows/backend.yml

@@ -4,9 +4,9 @@ on: [workflow_dispatch, push, pull_request]
 
 jobs:
   run:
-    uses: flarum/framework/.github/workflows/REUSABLE_backend.yml@main
+    uses: flarum/framework/.github/workflows/REUSABLE_backend.yml@2.x
     with:
       enable_backend_testing: false
       enable_phpstan: true
-      php_versions: '["8.0", "8.1", "8.2", "8.3"]'
+      php_versions: '["8.2", "8.3", "8.4"]'
       backend_directory: .

.github/workflows/frontend.yml

@@ -4,7 +4,7 @@ on: [workflow_dispatch, push, pull_request]
 
 jobs:
   run:
-    uses: flarum/framework/.github/workflows/REUSABLE_frontend.yml@main
+    uses: flarum/framework/.github/workflows/REUSABLE_frontend.yml@2.x
     with:
       enable_bundlewatch: false
       enable_prettier: true

composer.json

@@ -19,10 +19,10 @@
         }
     ],
     "require": {
-        "php": "^8.0",
-        "flarum/core": "^1.8.3",
-        "flarum/tags": "^1.8.0",
-        "fof/extend": "^1.2.0"
+        "php": "^8.2",
+        "flarum/core": "^2.0.0",
+        "flarum/tags": "^2.0.0",
+        "fof/extend": "^2.0"
     },
     "authors": [
         {
@@ -79,5 +79,7 @@
     },
     "scripts-descriptions": {
         "analyse:phpstan": "Run static analysis"
-    }
+    },
+    "minimum-stability": "dev",
+    "prefer-stable": true
 }

extend.php

@@ -11,15 +11,16 @@
 
 namespace FoF\FollowTags;
 
-use Flarum\Api\Serializer\DiscussionSerializer;
 use Flarum\Discussion\Event as Discussion;
 use Flarum\Discussion\Filter\DiscussionFilterer;
 use Flarum\Extend;
 use Flarum\Gdpr\Extend\UserData;
 use Flarum\Post\Event as Post;
-use Flarum\Tags\Api\Serializer\TagSerializer;
+use Flarum\Tags\Api\Resource\TagResource;
 use Flarum\Tags\TagState;
 use FoF\Extend\Extend\ExtensionSettings;
+use FoF\FollowTags\Api\Subscribe;
+use FoF\FollowTags\Api\TagResourceFields;
 
 return [
     (new Extend\Frontend('forum'))
@@ -34,9 +35,6 @@
     (new Extend\Model(TagState::class))
         ->cast('subscription', 'string'),
 
-    (new Extend\Routes('api'))
-        ->post('/tags/{id}/subscription', 'fof-follow-tags.subscription', Controllers\ChangeTagSubscription::class),
-
     (new Extend\View())
         ->namespace('fof-follow-tags', __DIR__.'/resources/views'),
 
@@ -52,25 +50,28 @@
         ->listen(Post\Restored::class, Listeners\RestoreNotificationWhenPostIsRestored::class)
         ->subscribe(Listeners\QueueNotificationJobs::class),
 
-    (new Extend\Filter(DiscussionFilterer::class))
-        ->addFilter(Search\FollowTagsFilter::class)
-        ->addFilterMutator(Search\HideTagsFilter::class),
-
     (new Extend\User())
         ->registerPreference('followTagsPageDefault'),
 
-    (new Extend\ApiSerializer(TagSerializer::class))
-        ->attributes(AddTagSubscriptionAttribute::class),
+    // @TODO: Replace with the new implementation https://docs.flarum.org/2.x/extend/api#extending-api-resources
+    (new Extend\ApiResource(TagResource::class))
+        ->fields(TagResourceFields::class)
+        ->endpoints(fn () => [
+            Subscribe::make('fof-follow-tags.subscribe')
+        ]),
 
     (new Extend\Notification())
-        ->type(Notifications\NewDiscussionBlueprint::class, DiscussionSerializer::class, ['alert', 'email'])
-        ->type(Notifications\NewPostBlueprint::class, DiscussionSerializer::class, ['alert', 'email'])
-        ->type(Notifications\NewDiscussionTagBlueprint::class, DiscussionSerializer::class, ['alert', 'email'])
+        ->type(Notifications\NewDiscussionBlueprint::class, ['alert', 'email'])
+        ->type(Notifications\NewPostBlueprint::class, ['alert', 'email'])
+        ->type(Notifications\NewDiscussionTagBlueprint::class, ['alert', 'email'])
         ->beforeSending(Listeners\PreventMentionNotificationsFromIgnoredTags::class),
 
     (new Extend\Conditional())
         ->whenExtensionEnabled('flarum-gdpr', fn () => [
             (new UserData())
                 ->addType(Data\TagSubscription::class),
         ]),
+    (new Extend\SearchDriver(\Flarum\Search\Database\DatabaseSearchDriver::class))
+        ->addFilter(\Flarum\Discussion\Search\DiscussionSearcher::class, Search\FollowTagsFilter::class)
+        ->addMutator(\Flarum\Discussion\Search\DiscussionSearcher::class, Search\HideTagsFilter::class),
 ];

js/package.json

@@ -5,8 +5,8 @@
   "prettier": "@flarum/prettier-config",
   "dependencies": {
     "@flarum/prettier-config": "^1.0.0",
-    "flarum-tsconfig": "^1.0.2",
-    "flarum-webpack-config": "^2.0.0",
+    "flarum-tsconfig": "^2.0.0",
+    "flarum-webpack-config": "^3.0.0",
     "webpack": "^5.94.0",
     "webpack-cli": "^5.1.4",
     "webpack-merge": "^4.2.2"
@@ -20,4 +20,4 @@
     "format": "prettier --write src",
     "format-check": "prettier --check src"
   }
-}
+}

js/src/admin/extend.ts

@@ -0,0 +1,14 @@
+import app from 'flarum/admin/app';
+import Extend from 'flarum/common/extenders';
+import followingPageOptions from '../common/utils/followingPageOptions';
+
+export default [
+  new Extend.Admin().setting(() => ({
+    setting: 'fof-follow-tags.following_page_default',
+    options: followingPageOptions('admin.settings'),
+    type: 'select',
+    label: app.translator.trans('fof-follow-tags.admin.settings.following_page_default_label'),
+    default: 'none',
+    required: true,
+  })),
+];

js/src/admin/index.ts

@@ -1,13 +1,7 @@
 import app from 'flarum/admin/app';
-import followingPageOptions from '../common/utils/followingPageOptions';
+
+export { default as extend } from './extend';
 
 app.initializers.add('fof/follow-tags', () => {
-  app.extensionData.for('fof-follow-tags').registerSetting({
-    setting: 'fof-follow-tags.following_page_default',
-    options: followingPageOptions('admin.settings'),
-    type: 'select',
-    label: app.translator.trans('fof-follow-tags.admin.settings.following_page_default_label'),
-    default: 'none',
-    required: true,
-  });
+  //
 });

js/src/common/utils/followingPageOptions.js

@@ -2,10 +2,11 @@ import app from 'flarum/common/app';
 
 let opts;
 
-export default (section) =>
-  opts ||
-  (opts = ['none', 'tags'].reduce((o, key) => {
-    o[key] = app.translator.trans(`fof-follow-tags.${section}.following_${key}_label`);
+export default function followingPageOptions(section) {
+    return opts ||
+    (opts = ['none', 'tags'].reduce((o, key) => {
+        o[key] = app.translator.trans(`fof-follow-tags.${section}.following_${key}_label`);
 
-    return o;
-  }, {}));
+        return o;
+    }, {}));
+}

js/src/forum/addPreferences.js

@@ -1,14 +1,13 @@
 import app from 'flarum/forum/app';
 import { extend } from 'flarum/common/extend';
 
-import SettingsPage from 'flarum/forum/components/SettingsPage';
 import FieldSet from 'flarum/common/components/FieldSet';
 import Select from 'flarum/common/components/Select';
 
 import { getOptions, getDefaultFollowingFiltering } from './utils/getDefaultFollowingFiltering';
 
 export default () => {
-  extend(SettingsPage.prototype, 'settingsItems', function (items) {
+  extend('flarum/forum/components/SettingsPage', 'settingsItems', function (items) {
     items.add(
       'fof-follow-tags',
       FieldSet.component(

js/src/forum/addSubscriptionControls.js

@@ -1,17 +1,17 @@
+import IndexSidebar from 'flarum/forum/components/IndexSidebar';
 import app from 'flarum/forum/app';
 import { extend } from 'flarum/common/extend';
 import Model from 'flarum/common/Model';
-import IndexPage from 'flarum/forum/components/IndexPage';
 import SubscriptionModal from './components/SubscriptionModal';
 import SubscriptionStateButton from './components/SubscriptionStateButton';
 
 export default () => {
   app.store.models.tags.prototype.subscription = Model.attribute('subscription');
 
-  extend(IndexPage.prototype, 'sidebarItems', function (items) {
-    if (!this.currentTag() || !app.session.user) return;
+  extend(IndexSidebar.prototype, 'items', function (items) {
+    if (!app.currentTag() || !app.session.user) return;
 
-    const tag = this.currentTag();
+    const tag = app.currentTag();
 
     if (items.has('newDiscussion')) items.setPriority('newDiscussion', 10);
 

js/src/forum/components/SubscriptionModal.tsx

@@ -5,7 +5,7 @@ import ItemList from 'flarum/common/utils/ItemList';
 import { utils } from '../utils';
 import SubscriptionOptionItem from './SubscriptionOptionItem';
 import type Mithril from 'mithril';
-import Tag from 'flarum/tags/models/Tag';
+import Tag from 'ext:flarum/tags/common/models/Tag';
 import Stream from 'flarum/common/utils/Stream';
 import Tooltip from 'flarum/common/components/Tooltip';
 
@@ -68,7 +68,7 @@ export default class SubscriptionModal extends Modal<ISubscriptionModalAttrs> {
       'subscription_type',
       <div className="Form-group">
         <label>{app.translator.trans('fof-follow-tags.forum.sub_controls.subscription_label', { tagName: this.attrs.model.name() })}</label>
-        {this.subscriptionOptionItems().toArray()}
+        <div className="SubscriptionModal-options">{this.subscriptionOptionItems().toArray()}</div>
       </div>,
       60
     );

js/src/forum/components/SubscriptionOptionItem.tsx

@@ -1,5 +1,5 @@
 import app from 'flarum/forum/app';
-import icon from 'flarum/common/helpers/icon';
+import Icon from 'flarum/common/components/Icon';
 import Component, { ComponentAttrs } from 'flarum/common/Component';
 
 interface SubscriptionOptionItemAttrs extends ComponentAttrs {
@@ -16,10 +16,10 @@ export default class SubscriptionOptionItem extends Component<SubscriptionOption
 
     return (
       <div className={`SubscriptionOption ${isSelected ? 'selected' : ''}`} onclick={this.attrs.onclick}>
-        {icon(this.attrs.icon, { className: 'SubscriptionOption-icon' })}
+        <Icon name={this.attrs.icon} className="SubscriptionOption-icon" />
         <span className="SubscriptionOption-title">{app.translator.trans(this.attrs.labelKey)}</span>
         <div className="SubscriptionOption-description">{app.translator.trans(this.attrs.descriptionKey)}</div>
-        {isSelected && icon('fas fa-check', { className: 'SubscriptionOption-selectedIcon' })}
+        {isSelected && <Icon name="fas fa-check" className="SubscriptionOption-selectedIcon" />}
       </div>
     );
   }

js/src/forum/components/SubscriptionStateButton.js

@@ -4,6 +4,7 @@ import { utils } from '../utils';
 import Tooltip from 'flarum/common/components/Tooltip';
 import extractText from 'flarum/common/utils/extractText';
 import Stream from 'flarum/common/utils/Stream';
+import classList from 'flarum/common/utils/classList';
 
 export default class SubscriptionStateButton extends Button {
   oninit(vnode) {
@@ -36,7 +37,7 @@ export default class SubscriptionStateButton extends Button {
     let buttonIcon = option ? option.icon : 'fas fa-star';
     let buttonLabel = option ? app.translator.trans(option.labelKey) : app.translator.trans('fof-follow-tags.forum.sub_controls.follow_button');
 
-    this.attrs.className = (this.attrs.className || '') + ' SubscriptionButton ' + 'SubscriptionButton--' + subscription;
+    this.attrs.className = classList(this.attrs.className, `SubscriptionButton SubscriptionButton--${subscription}`);
     this.attrs.icon = buttonIcon;
 
     const preferences = app.session.user.preferences();

js/src/forum/extendNotificationGrid.ts

@@ -1,9 +1,8 @@
 import app from 'flarum/forum/app';
 import { extend } from 'flarum/common/extend';
-import NotificationGrid from 'flarum/forum/components/NotificationGrid';
 
 export default function extendNotificationGrid() {
-  extend(NotificationGrid.prototype, 'notificationTypes', function (items) {
+  extend('flarum/forum/components/NotificationGrid', 'notificationTypes', function (items) {
     items.add('newDiscussionInTag', {
       name: 'newDiscussionInTag',
       icon: 'fas fa-user-tag',

js/tsconfig.json

@@ -1,16 +1,19 @@
 {
-  // Use Flarum's tsconfig as a starting point
   "extends": "flarum-tsconfig",
-  // This will match all .ts, .tsx, .d.ts, .js, .jsx files in your `src` folder
-  // and also tells your Typescript server to read core's global typings for
-  // access to `dayjs` and `$` in the global namespace.
-  "include": ["src/**/*", "../vendor/flarum/core/js/dist-typings/@types/**/*"],
+  "include": [
+    "src/**/*",
+    "../vendor/flarum/core/js/dist-typings/@types/**/*"
+  ],
   "compilerOptions": {
-    // This will output typings to `dist-typings`
     "declarationDir": "./dist-typings",
     "baseUrl": ".",
     "paths": {
-      "flarum/*": ["../vendor/flarum/core/js/dist-typings/*"]
+      "flarum/*": [
+        "../vendor/flarum/core/js/dist-typings/*"
+      ],
+      "ext:flarum/tags": [
+        "../vendor/flarum/tags/js/dist-typings/*"
+      ]
     }
   }
-}
+}