chore: upgrade i18next 26, prettier 3, fontsource-variable, domhandler 6, lint-staged 17

- i18next 23->26 + react-i18next 15->17
- prettier 2->3, reformat all files
- replace @fontsource/inter with @fontsource-variable/inter 5, update import path
- domhandler 5->6 (aligns with transitive deps)
- lint-staged 16->17

src/app/features/lobby/DnD.tsx

@@ -21,7 +21,7 @@ export const useDraggableItem = (
   item: HierarchyItem,
   targetRef: RefObject<HTMLElement>,
   onDragging: (item?: HierarchyItem) => void,
-  dragHandleRef?: RefObject<HTMLElement>
+  dragHandleRef?: RefObject<HTMLElement>,
 ): boolean => {
   const [dragging, setDragging] = useState(false);
 
@@ -121,7 +121,7 @@ export function AfterItemDropTarget({
 export const useDnDMonitor = (
   scrollRef: RefObject<HTMLElement>,
   onDragging: (item?: HierarchyItem) => void,
-  onReorder: (item: HierarchyItem, container: DropContainerData) => void
+  onReorder: (item: HierarchyItem, container: DropContainerData) => void,
 ) => {
   useEffect(() => {
     const scrollElement = scrollRef.current;
@@ -140,7 +140,7 @@ export const useDnDMonitor = (
       }),
       autoScrollForElements({
         element: scrollElement,
-      })
+      }),
     );
   }, [scrollRef, onDragging, onReorder]);
 };

src/app/features/lobby/HierarchyItemMenu.tsx

@@ -49,7 +49,7 @@ function SuggestMenuItem({
     useCallback(() => {
       const newContent: MSpaceChildContent = { ...content, suggested: !content.suggested };
       return mx.sendStateEvent(parentId, StateEvent.SpaceChild as any, newContent, roomId);
-    }, [mx, parentId, roomId, content])
+    }, [mx, parentId, roomId, content]),
   );
 
   useEffect(() => {
@@ -86,8 +86,8 @@ function RemoveMenuItem({
   const [removeState, handleRemove] = useAsyncCallback(
     useCallback(
       () => mx.sendStateEvent(parentId, StateEvent.SpaceChild as any, {}, roomId),
-      [mx, parentId, roomId]
-    )
+      [mx, parentId, roomId],
+    ),
   );
 
   useEffect(() => {

src/app/features/lobby/Lobby.tsx

@@ -60,7 +60,7 @@ import { getRoomCreatorsForRoomId } from '../../hooks/useRoomCreators';
 const useCanDropLobbyItem = (
   space: Room,
   roomsPowerLevels: Map<string, IPowerLevels>,
-  getRoom: (roomId: string) => Room | undefined
+  getRoom: (roomId: string) => Room | undefined,
 ): CanDropCallback => {
   const mx = useMatrixClient();
 
@@ -87,7 +87,7 @@ const useCanDropLobbyItem = (
 
       return true;
     },
-    [space, roomsPowerLevels, getRoom, mx]
+    [space, roomsPowerLevels, getRoom, mx],
   );
 
   const canDropRoom: CanDropCallback = useCallback(
@@ -107,7 +107,7 @@ const useCanDropLobbyItem = (
 
         const canChangeJoinRuleAllow = itemPermissions.stateEvent(
           StateEvent.RoomJoinRules,
-          mx.getSafeUserId()
+          mx.getSafeUserId(),
         );
         if (!canChangeJoinRuleAllow) {
           return false;
@@ -125,7 +125,7 @@ const useCanDropLobbyItem = (
       }
       return true;
     },
-    [mx, getRoom, roomsPowerLevels]
+    [mx, getRoom, roomsPowerLevels],
   );
 
   const canDrop: CanDropCallback = useCallback(
@@ -142,7 +142,7 @@ const useCanDropLobbyItem = (
 
       return canDropRoom(item, container);
     },
-    [canDropSpace, canDropRoom]
+    [canDropSpace, canDropRoom],
   );
 
   return canDrop;
@@ -168,7 +168,7 @@ export function Lobby() {
   const [onTop, setOnTop] = useState(true);
   const [closedCategories, setClosedCategories] = useAtom(useClosedLobbyCategoriesAtom());
   const [sidebarItems] = useSidebarItems(
-    useOrphanSpaces(mx, allRoomsAtom, useAtomValue(roomToParentsAtom))
+    useOrphanSpaces(mx, allRoomsAtom, useAtomValue(roomToParentsAtom)),
   );
   const sidebarSpaces = useMemo(() => {
     const sideSpaces = sidebarItems.flatMap((item) => {
@@ -183,7 +183,7 @@ export function Lobby() {
 
   useElementSizeObserver(
     useCallback(() => heroSectionRef.current, []),
-    useCallback((w, height) => setHeroSectionHeight(height), [])
+    useCallback((w, height) => setHeroSectionHeight(height), []),
   );
 
   const getRoom = useGetRoom(allJoinedRooms);
@@ -197,8 +197,8 @@ export function Lobby() {
       (childId) =>
         closedCategories.has(makeLobbyCategoryId(space.roomId, childId)) ||
         (draggingItem ? 'space' in draggingItem : false),
-      [closedCategories, space.roomId, draggingItem]
-    )
+      [closedCategories, space.roomId, draggingItem],
+    ),
   );
 
   const virtualizer = useVirtualizer({
@@ -220,8 +220,8 @@ export function Lobby() {
             return [getRoom(i.space.roomId), ...childRooms];
           })
           .filter((r) => !!r) as Room[],
-      [hierarchy, getRoom]
-    )
+      [hierarchy, getRoom],
+    ),
   );
 
   const canDrop: CanDropCallback = useCanDropLobbyItem(space, roomsPowerLevels, getRoom);
@@ -275,13 +275,13 @@ export function Lobby() {
               reorder.item.parentId,
               StateEvent.SpaceChild as any,
               { ...reorder.item.content, order: reorder.orderKey },
-              reorder.item.roomId
+              reorder.item.roomId,
             );
           });
         }
       },
-      [mx, hierarchy, lex, roomsPowerLevels]
-    )
+      [mx, hierarchy, lex, roomsPowerLevels],
+    ),
   );
   const reorderingSpace = reorderSpaceState.status === AsyncStatus.Loading;
 
@@ -310,7 +310,7 @@ export function Lobby() {
           // restricted room from one space to another
           const joinRuleContent = getStateEvent(
             itemRoom,
-            StateEvent.RoomJoinRules
+            StateEvent.RoomJoinRules,
           )?.getContent<RoomJoinRulesEventContent>();
 
           if (joinRuleContent) {
@@ -326,7 +326,7 @@ export function Lobby() {
         }
 
         const itemSpaces = Array.from(
-          hierarchy?.find((i) => i.space.roomId === containerParentId)?.rooms ?? []
+          hierarchy?.find((i) => i.space.roomId === containerParentId)?.rooms ?? [],
         );
 
         const beforeItem: HierarchyItem | undefined =
@@ -362,13 +362,13 @@ export function Lobby() {
               containerParentId,
               StateEvent.SpaceChild as any,
               { ...reorder.item.content, order: reorder.orderKey },
-              reorder.item.roomId
+              reorder.item.roomId,
             );
           });
         }
       },
-      [mx, hierarchy, lex]
-    )
+      [mx, hierarchy, lex],
+    ),
   );
   const reorderingRoom = reorderRoomState.status === AsyncStatus.Loading;
   const reordering = reorderingRoom || reorderingSpace;
@@ -387,8 +387,8 @@ export function Lobby() {
           reorderRoom(item, container.item);
         }
       },
-      [reorderRoom, reorderSpace, canDrop]
-    )
+      [reorderRoom, reorderSpace, canDrop],
+    ),
   );
 
   const handleSpacesFound = useCallback(
@@ -401,11 +401,11 @@ export function Lobby() {
         return current.size === newItems.size ? current : newItems;
       });
     },
-    [setSpaceRooms]
+    [setSpaceRooms],
   );
 
   const handleCategoryClick = useCategoryHandler(setClosedCategories, (categoryId) =>
-    closedCategories.has(categoryId)
+    closedCategories.has(categoryId),
   );
 
   const handleOpenRoom: MouseEventHandler<HTMLButtonElement> = (evt) => {
@@ -424,7 +424,7 @@ export function Lobby() {
       const newSpacesContent = makeCinnySpacesContent(mx, newItems);
       mx.setAccountData(AccountDataEvent.CinnySpaces as any, newSpacesContent as any);
     },
-    [mx, sidebarItems, sidebarSpaces]
+    [mx, sidebarItems, sidebarSpaces],
   );
 
   return (

src/app/features/lobby/LobbyHeader.tsx

@@ -132,7 +132,7 @@ const LobbyMenu = forwardRef<HTMLDivElement, LobbyMenuProps>(
         </Box>
       </Menu>
     );
-  }
+  },
 );
 
 type LobbyHeaderProps = {
@@ -150,7 +150,7 @@ export function LobbyHeader({ showProfile, powerLevels }: LobbyHeaderProps) {
   const name = useRoomName(space);
   const avatarMxc = useRoomAvatar(space);
   const avatarUrl = avatarMxc
-    ? mxcUrlToHttp(mx, avatarMxc, useAuthentication, 96, 96, 'crop') ?? undefined
+    ? (mxcUrlToHttp(mx, avatarMxc, useAuthentication, 96, 96, 'crop') ?? undefined)
     : undefined;
 
   const handleOpenMenu: MouseEventHandler<HTMLButtonElement> = (evt) => {

src/app/features/lobby/LobbyHero.tsx

@@ -23,7 +23,7 @@ export function LobbyHero() {
   const topic = useRoomTopic(space);
   const avatarMxc = useRoomAvatar(space);
   const avatarUrl = avatarMxc
-    ? mxcUrlToHttp(mx, avatarMxc, useAuthentication, 96, 96, 'crop') ?? undefined
+    ? (mxcUrlToHttp(mx, avatarMxc, useAuthentication, 96, 96, 'crop') ?? undefined)
     : undefined;
 
   return (

src/app/features/lobby/RoomItem.tsx

@@ -47,7 +47,7 @@ function RoomJoinButton({ roomId, via }: RoomJoinButtonProps) {
   const mx = useMatrixClient();
 
   const [joinState, join] = useAsyncCallback<Room, MatrixError, []>(
-    useCallback(() => mx.joinRoom(roomId, { viaServers: via }), [mx, roomId, via])
+    useCallback(() => mx.joinRoom(roomId, { viaServers: via }), [mx, roomId, via]),
   );
 
   const canJoin = joinState.status === AsyncStatus.Idle || joinState.status === AsyncStatus.Error;
@@ -309,7 +309,7 @@ export const RoomItemCard = as<'div', RoomItemCardProps>(
       getRoom,
       ...props
     },
-    ref
+    ref,
   ) => {
     const mx = useMatrixClient();
     const useAuthentication = useMediaAuthentication();
@@ -402,8 +402,8 @@ export const RoomItemCard = as<'div', RoomItemCardProps>(
                   topic={summary.topic}
                   avatarUrl={
                     summary?.avatar_url
-                      ? mxcUrlToHttp(mx, summary.avatar_url, useAuthentication, 96, 96, 'crop') ??
-                        undefined
+                      ? (mxcUrlToHttp(mx, summary.avatar_url, useAuthentication, 96, 96, 'crop') ??
+                        undefined)
                       : undefined
                   }
                   memberCount={summary.num_joined_members}
@@ -419,5 +419,5 @@ export const RoomItemCard = as<'div', RoomItemCardProps>(
         {after}
       </SequenceCard>
     );
-  }
+  },
 );

src/app/features/lobby/SpaceHierarchy.tsx

@@ -63,7 +63,7 @@ export const SpaceHierarchy = forwardRef<HTMLDivElement, SpaceHierarchyProps>(
       onOpenRoom,
       onSpacesFound,
     },
-    ref
+    ref,
   ) => {
     const mx = useMatrixClient();
 
@@ -228,5 +228,5 @@ export const SpaceHierarchy = forwardRef<HTMLDivElement, SpaceHierarchyProps>(
         )}
       </Box>
     );
-  }
+  },
 );

src/app/features/lobby/SpaceItem.tsx

@@ -113,7 +113,7 @@ function UnjoinedSpaceProfile({
   const mx = useMatrixClient();
 
   const [joinState, join] = useAsyncCallback<Room, MatrixError, []>(
-    useCallback(() => mx.joinRoom(roomId, { viaServers: via }), [mx, roomId, via])
+    useCallback(() => mx.joinRoom(roomId, { viaServers: via }), [mx, roomId, via]),
   );
 
   const canJoin = joinState.status === AsyncStatus.Idle || joinState.status === AsyncStatus.Error;
@@ -423,7 +423,7 @@ export const SpaceItemCard = as<'div', SpaceItemCardProps>(
       getRoom,
       ...props
     },
-    ref
+    ref,
   ) => {
     const mx = useMatrixClient();
     const useAuthentication = useMediaAuthentication();
@@ -484,8 +484,14 @@ export const SpaceItemCard = as<'div', SpaceItemCardProps>(
                     name={summary.name || summary.canonical_alias || roomId}
                     avatarUrl={
                       summary?.avatar_url
-                        ? mxcUrlToHttp(mx, summary.avatar_url, useAuthentication, 96, 96, 'crop') ??
-                          undefined
+                        ? (mxcUrlToHttp(
+                            mx,
+                            summary.avatar_url,
+                            useAuthentication,
+                            96,
+                            96,
+                            'crop',
+                          ) ?? undefined)
                         : undefined
                     }
                     suggested={content.suggested}
@@ -505,5 +511,5 @@ export const SpaceItemCard = as<'div', SpaceItemCardProps>(
         {after}
       </Box>
     );
-  }
+  },
 );