refactor: Consolidate icon imports across components and streamline import statements for improved readability

src/app/pages/client/inbox/Inbox.tsx

@@ -1,5 +1,6 @@
 import React, { useRef } from 'react';
-import { Avatar, Box, Icon, Icons, Text } from 'folds';
+import { Avatar, Box, Text } from 'folds';
+import { Icon, Icons } from '../../../components/icons';
 import { useAtomValue } from 'jotai';
 import { NavCategory, NavCategoryHeader, NavItem, NavItemContent, NavLink } from '../../../components/nav';
 import { getInboxInvitesPath, getInboxNotificationsPath } from '../../pathUtils';

src/app/pages/client/inbox/Invites.tsx

@@ -1,22 +1,6 @@
 import React, { useCallback, useMemo, useRef, useState } from 'react';
-import {
-  Avatar,
-  Badge,
-  Box,
-  Button,
-  Chip,
-  Icon,
-  IconButton,
-  Icons,
-  Overlay,
-  OverlayBackdrop,
-  OverlayCenter,
-  Scroll,
-  Spinner,
-  Text,
-  color,
-  config,
-} from 'folds';
+import { Avatar, Badge, Box, Button, Chip, IconButton, Overlay, OverlayBackdrop, OverlayCenter, Scroll, Spinner, Text, color, config } from 'folds';
+import { Icon, Icons } from '../../../components/icons';
 import { useAtomValue } from 'jotai';
 import { RoomTopicEventContent } from 'matrix-js-sdk/lib/types';
 import FocusTrap from 'focus-trap-react';

src/app/pages/client/inbox/Notifications.tsx

@@ -1,18 +1,7 @@
 /* eslint-disable react/destructuring-assignment */
 import React, { MouseEventHandler, useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import {
-  Avatar,
-  Box,
-  Chip,
-  Header,
-  Icon,
-  IconButton,
-  Icons,
-  Scroll,
-  Text,
-  config,
-  toRem,
-} from 'folds';
+import { Avatar, Box, Chip, Header, IconButton, Scroll, Text, config, toRem } from 'folds';
+import { Icon, Icons } from '../../../components/icons';
 import { useSearchParams } from 'react-router-dom';
 import {
   INotification,