forum: add notifications page (used in mobile)

js/src/forum/components/NotificationsDropdown.tsx

@@ -31,7 +31,7 @@ export default class NotificationsDropdown extends Dropdown {
         const unread = this.getUnreadCount();
 
         return [
-            icon(this.props.icon, { className: 'Button-icon' }),
+            icon(this.props.icon!, { className: 'Button-icon' }),
             unread ? <span className="NotificationsDropdown-unread">{unread}</span> : '',
             <span className="Button-label">{this.props.label}</span>,
         ];

js/src/forum/components/NotificationsPage.tsx

@@ -0,0 +1,30 @@
+import app from '../app';
+
+import Page from './Page';
+import NotificationList from './NotificationList';
+
+/**
+ * The `NotificationsPage` component shows the notifications list. It is only
+ * used on mobile devices where the notifications dropdown is within the drawer.
+ */
+export default class NotificationsPage extends Page {
+    list = (<NotificationList />);
+
+    oninit(vnode) {
+        super.oninit(vnode);
+
+        app.history.push('notifications');
+
+        this.bodyClass = 'App--notifications';
+    }
+
+    oncreate(vnode) {
+        super.oncreate(vnode);
+
+        m.redraw();
+    }
+
+    view() {
+        return <div className="NotificationsPage">{this.list}</div>;
+    }
+}

js/src/forum/routes.ts

@@ -3,6 +3,7 @@ import DiscussionPage from './components/DiscussionPage';
 import PostsUserPage from './components/PostsUserPage';
 import DiscussionsUserPage from './components/DiscussionsUserPage';
 import SettingsPage from './components/SettingsPage';
+import NotificationsPage from './components/NotificationsPage';
 
 import Discussion from '../common/models/Discussion';
 import Post from '../common/models/Post';
@@ -20,6 +21,7 @@ export default (app) => {
         'user.discussions': { path: '/u/:username/discussions', component: DiscussionsUserPage },
 
         settings: { path: '/settings', component: SettingsPage },
+        notifications: { path: '/notifications', component: NotificationsPage },
 
         'index.filter': { path: '/:filter', component: IndexPage },
     };