From 17f7a7eaf272c56d5b7c588c71e222e76af65cf3 Mon Sep 17 00:00:00 2001
From: Max Litruv Boonzaayer <litruv@gmail.com>
Date: Thu, 23 Apr 2026 06:13:40 +1000
Subject: [PATCH] feat: update Direct component to include invites and
 notifications navigation items

---
 src/app/components/create-room/utils.ts |  2 +-
 src/app/pages/client/SidebarNav.tsx     |  2 -
 src/app/pages/client/direct/Direct.tsx  | 70 ++++++++++++++++++++++++-
 3 files changed, 70 insertions(+), 4 deletions(-)

diff --git a/src/app/components/create-room/utils.ts b/src/app/components/create-room/utils.ts
index 86091bf..60f334e 100644
--- a/src/app/components/create-room/utils.ts
+++ b/src/app/components/create-room/utils.ts
@@ -108,7 +108,7 @@ export type CreateRoomData = {
 export const createRoom = async (mx: MatrixClient, data: CreateRoomData): Promise<string> => {
   const initialState: ICreateRoomStateEvent[] = [];
 
-  initialState.push(createRoomPowerLevelsState());
+  // initialState.push(createRoomPowerLevelsState()); // Removed: causes 403 when setting permissions before admin
 
   if (data.encryption) {
     initialState.push(createRoomEncryptionState());
diff --git a/src/app/pages/client/SidebarNav.tsx b/src/app/pages/client/SidebarNav.tsx
index 6545ed5..eca6cff 100644
--- a/src/app/pages/client/SidebarNav.tsx
+++ b/src/app/pages/client/SidebarNav.tsx
@@ -11,7 +11,6 @@ import {
   DirectTab,
   HomeTab,
   SpaceTabs,
-  InboxTab,
   ExploreTab,
   SettingsTab,
   UnverifiedTab,
@@ -52,7 +51,6 @@ export function SidebarNav() {
               <PluginSidebarSlot location="sidebar-actions" />
               <SearchTab />
               <UnverifiedTab />
-              <InboxTab />
               <SettingsTab />
             </SidebarStack>
           </>
diff --git a/src/app/pages/client/direct/Direct.tsx b/src/app/pages/client/direct/Direct.tsx
index d9349c0..238bf7a 100644
--- a/src/app/pages/client/direct/Direct.tsx
+++ b/src/app/pages/client/direct/Direct.tsx
@@ -28,8 +28,9 @@ import {
   NavEmptyLayout,
   NavItem,
   NavItemContent,
+  NavLink,
 } from '../../../components/nav';
-import { getDirectCreatePath, getDirectRoomPath } from '../../pathUtils';
+import { getDirectCreatePath, getDirectRoomPath, getInboxInvitesPath, getInboxNotificationsPath } from '../../pathUtils';
 import { getCanonicalAliasOrRoomId } from '../../../utils/matrix';
 import { useSelectedRoom } from '../../../hooks/router/useSelectedRoom';
 import { VirtualTile } from '../../../components/virtualizer';
@@ -53,6 +54,9 @@ import {
   useRoomsNotificationPreferencesContext,
 } from '../../../hooks/useRoomsNotificationPreferences';
 import { useDirectCreateSelected } from '../../../hooks/router/useDirectSelected';
+import { allInvitesAtom } from '../../../state/room-list/inviteList';
+import { useInboxInvitesSelected, useInboxNotificationsSelected } from '../../../hooks/router/useInbox';
+import { UnreadBadge } from '../../../components/unread-badge';
 
 type DirectMenuProps = {
   requestClose: () => void;
@@ -170,6 +174,66 @@ function DirectEmpty() {
   );
 }
 
+/**
+ * Navigation item for room invites
+ */
+function InvitesNavItem() {
+  const invitesSelected = useInboxInvitesSelected();
+  const allInvites = useAtomValue(allInvitesAtom);
+  const inviteCount = allInvites.length;
+
+  return (
+    <NavItem
+      variant="Background"
+      radii="400"
+      highlight={inviteCount > 0}
+      aria-selected={invitesSelected}
+    >
+      <NavLink to={getInboxInvitesPath()}>
+        <NavItemContent>
+          <Box as="span" grow="Yes" alignItems="Center" gap="200">
+            <Avatar size="200" radii="400">
+              <Icon src={Icons.Mail} size="100" filled={invitesSelected} />
+            </Avatar>
+            <Box as="span" grow="Yes">
+              <Text as="span" size="Inherit" truncate>
+                Invites
+              </Text>
+            </Box>
+            {inviteCount > 0 && <UnreadBadge highlight count={inviteCount} />}
+          </Box>
+        </NavItemContent>
+      </NavLink>
+    </NavItem>
+  );
+}
+
+/**
+ * Navigation item for notifications
+ */
+function NotificationsNavItem() {
+  const notificationsSelected = useInboxNotificationsSelected();
+
+  return (
+    <NavItem variant="Background" radii="400" aria-selected={notificationsSelected}>
+      <NavLink to={getInboxNotificationsPath()}>
+        <NavItemContent>
+          <Box as="span" grow="Yes" alignItems="Center" gap="200">
+            <Avatar size="200" radii="400">
+              <Icon src={Icons.MessageUnread} size="100" filled={notificationsSelected} />
+            </Avatar>
+            <Box as="span" grow="Yes">
+              <Text as="span" size="Inherit" truncate>
+                Notifications
+              </Text>
+            </Box>
+          </Box>
+        </NavItemContent>
+      </NavLink>
+    </NavItem>
+  );
+}
+
 const DEFAULT_CATEGORY_ID = makeNavCategoryId('direct', 'direct');
 export function Direct() {
   const mx = useMatrixClient();
@@ -232,6 +296,10 @@ export function Direct() {
               </NavItem>
               <PluginNavSlot location="direct-messages" />
             </NavCategory>
+            <NavCategory>
+              <NotificationsNavItem />
+              <InvitesNavItem />
+            </NavCategory>
             <NavCategory>
               <NavCategoryHeader>
                 <RoomNavCategoryButton