diff --git a/lib/selectors/user-selectors.js b/lib/selectors/user-selectors.js
index bd0932daf..1f98bb0d4 100644
--- a/lib/selectors/user-selectors.js
+++ b/lib/selectors/user-selectors.js
@@ -1,206 +1,210 @@
 // @flow
 
 import _memoize from 'lodash/memoize.js';
 import { createSelector } from 'reselect';
 
 import {
   getAvatarForUser,
   getRandomDefaultEmojiAvatar,
 } from '../shared/avatar-utils.js';
 import { getSingleOtherUser } from '../shared/thread-utils.js';
 import type { ClientEmojiAvatar } from '../types/avatar-types';
 import type {
   RelativeMemberInfo,
   RawThreadInfo,
 } from '../types/minimally-encoded-thread-permissions-types.js';
 import type { BaseAppState } from '../types/redux-types.js';
 import { userRelationshipStatus } from '../types/relationship-types.js';
 import { threadTypes } from '../types/thread-types-enum.js';
 import type { RawThreadInfos } from '../types/thread-types.js';
 import type {
   UserInfos,
   RelativeUserInfo,
   AccountUserInfo,
   CurrentUserInfo,
 } from '../types/user-types.js';
 
 // Used for specific message payloads that include an array of user IDs, ie.
 // array of initial users, array of added users
 function userIDsToRelativeUserInfos(
   userIDs: $ReadOnlyArray<string>,
   viewerID: ?string,
   userInfos: UserInfos,
 ): RelativeUserInfo[] {
   const relativeUserInfos: RelativeUserInfo[] = [];
   for (const userID of userIDs) {
     const username = userInfos[userID] ? userInfos[userID].username : null;
     const relativeUserInfo = {
       id: userID,
       username,
       isViewer: userID === viewerID,
     };
     if (userID === viewerID) {
       relativeUserInfos.unshift(relativeUserInfo);
     } else {
       relativeUserInfos.push(relativeUserInfo);
     }
   }
   return relativeUserInfos;
 }
 
 function getRelativeMemberInfos(
   threadInfo: ?RawThreadInfo,
   currentUserID: ?string,
   userInfos: UserInfos,
 ): $ReadOnlyArray<RelativeMemberInfo> {
   const relativeMemberInfos: RelativeMemberInfo[] = [];
   if (!threadInfo) {
     return relativeMemberInfos;
   }
   const memberInfos = threadInfo.members;
   for (const memberInfo of memberInfos) {
     if (!memberInfo.role) {
       continue;
     }
     const username = userInfos[memberInfo.id]
       ? userInfos[memberInfo.id].username
       : null;
     if (memberInfo.id === currentUserID) {
       relativeMemberInfos.unshift({
         ...memberInfo,
         username,
         isViewer: true,
       });
     } else {
       relativeMemberInfos.push({
         ...memberInfo,
         username,
         isViewer: false,
       });
     }
   }
   return relativeMemberInfos;
 }
 
 const emptyArray: $ReadOnlyArray<RelativeMemberInfo> = [];
 
 // Includes current user at the start
 const baseRelativeMemberInfoSelectorForMembersOfThread: (
   threadID: ?string,
 ) => (state: BaseAppState<>) => $ReadOnlyArray<RelativeMemberInfo> = (
   threadID: ?string,
 ) => {
   if (!threadID) {
     return () => emptyArray;
   }
   return createSelector(
     (state: BaseAppState<>) => state.threadStore.threadInfos[threadID],
     (state: BaseAppState<>) =>
       state.currentUserInfo && state.currentUserInfo.id,
     (state: BaseAppState<>) => state.userStore.userInfos,
     getRelativeMemberInfos,
   );
 };
 
 const relativeMemberInfoSelectorForMembersOfThread: (
   threadID: ?string,
 ) => (state: BaseAppState<>) => $ReadOnlyArray<RelativeMemberInfo> = _memoize(
   baseRelativeMemberInfoSelectorForMembersOfThread,
 );
 
 const userInfoSelectorForPotentialMembers: (state: BaseAppState<>) => {
   [id: string]: AccountUserInfo,
 } = createSelector(
   (state: BaseAppState<>) => state.userStore.userInfos,
   (state: BaseAppState<>) => state.currentUserInfo && state.currentUserInfo.id,
   (
     userInfos: UserInfos,
     currentUserID: ?string,
   ): { [id: string]: AccountUserInfo } => {
     const availableUsers: { [id: string]: AccountUserInfo } = {};
 
     for (const id in userInfos) {
       const { username, relationshipStatus } = userInfos[id];
       if (id === currentUserID || !username) {
         continue;
       }
       if (
         relationshipStatus !== userRelationshipStatus.BLOCKED_VIEWER &&
         relationshipStatus !== userRelationshipStatus.BOTH_BLOCKED
       ) {
         availableUsers[id] = { id, username, relationshipStatus };
       }
     }
     return availableUsers;
   },
 );
 
 const isLoggedIn = (state: BaseAppState<>): boolean =>
   !!(
     state.currentUserInfo &&
     !state.currentUserInfo.anonymous &&
     state.dataLoaded
   );
 
 const isLoggedInToKeyserver: (
   keyserverID: ?string,
 ) => (state: BaseAppState<>) => boolean = _memoize(
   (keyserverID: ?string) => (state: BaseAppState<>) => {
     if (!keyserverID) {
       return false;
     }
     const cookie = state.keyserverStore.keyserverInfos[keyserverID]?.cookie;
     return !!cookie && cookie.startsWith('user=');
   },
 );
 
 const usersWithPersonalThreadSelector: (
   state: BaseAppState<>,
 ) => $ReadOnlySet<string> = createSelector(
   (state: BaseAppState<>) => state.currentUserInfo && state.currentUserInfo.id,
   (state: BaseAppState<>) => state.threadStore.threadInfos,
   (viewerID: ?string, threadInfos: RawThreadInfos) => {
     const personalThreadMembers = new Set<string>();
 
     for (const threadID in threadInfos) {
       const thread = threadInfos[threadID];
       if (
         thread.type !== threadTypes.PERSONAL ||
         !thread.members.find(member => member.id === viewerID)
       ) {
         continue;
       }
       const otherMemberID = getSingleOtherUser(thread, viewerID);
       if (otherMemberID) {
         personalThreadMembers.add(otherMemberID);
       }
     }
     return personalThreadMembers;
   },
 );
 
 const savedEmojiAvatarSelectorForCurrentUser: (
   state: BaseAppState<>,
 ) => () => ClientEmojiAvatar = createSelector(
   (state: BaseAppState<>) => state.currentUserInfo && state.currentUserInfo,
   (currentUser: ?CurrentUserInfo) => {
     return () => {
       let userAvatar = getAvatarForUser(currentUser);
       if (userAvatar.type !== 'emoji') {
         userAvatar = getRandomDefaultEmojiAvatar();
       }
       return userAvatar;
     };
   },
 );
 
+const getRelativeUserIDs = (state: BaseAppState<>): $ReadOnlyArray<string> =>
+  Object.keys(state.userStore.userInfos);
+
 export {
   userIDsToRelativeUserInfos,
   getRelativeMemberInfos,
   relativeMemberInfoSelectorForMembersOfThread,
   userInfoSelectorForPotentialMembers,
   isLoggedIn,
   isLoggedInToKeyserver,
   usersWithPersonalThreadSelector,
   savedEmojiAvatarSelectorForCurrentUser,
+  getRelativeUserIDs,
 };
diff --git a/lib/types/identity-service-types.js b/lib/types/identity-service-types.js
index 2ffd1cff7..983a99267 100644
--- a/lib/types/identity-service-types.js
+++ b/lib/types/identity-service-types.js
@@ -1,267 +1,272 @@
 // @flow
 
 import t, { type TInterface, type TList, type TDict } from 'tcomb';
 
 import {
   identityKeysBlobValidator,
   type IdentityKeysBlob,
   signedPrekeysValidator,
   type SignedPrekeys,
   type OneTimeKeysResultValues,
 } from './crypto-types.js';
 import {
   type OlmSessionInitializationInfo,
   olmSessionInitializationInfoValidator,
 } from './request-types.js';
 import {
   currentUserInfoValidator,
   type CurrentUserInfo,
 } from './user-types.js';
 import { tShape } from '../utils/validation-utils.js';
 
 export type UserAuthMetadata = {
   +userID: string,
   +accessToken: string,
 };
 
 // This type should not be altered without also updating OutboundKeyInfoResponse
 // in native/native_rust_library/src/identity/x3dh.rs
 export type OutboundKeyInfoResponse = {
   +payload: string,
   +payloadSignature: string,
   +contentPrekey: string,
   +contentPrekeySignature: string,
   +notifPrekey: string,
   +notifPrekeySignature: string,
   +oneTimeContentPrekey: ?string,
   +oneTimeNotifPrekey: ?string,
 };
 
 // This type should not be altered without also updating InboundKeyInfoResponse
 // in native/native_rust_library/src/identity/x3dh.rs
 export type InboundKeyInfoResponse = {
   +payload: string,
   +payloadSignature: string,
   +contentPrekey: string,
   +contentPrekeySignature: string,
   +notifPrekey: string,
   +notifPrekeySignature: string,
   +username?: ?string,
   +walletAddress?: ?string,
 };
 
 export type DeviceOlmOutboundKeys = {
   +identityKeysBlob: IdentityKeysBlob,
   +contentInitializationInfo: OlmSessionInitializationInfo,
   +notifInitializationInfo: OlmSessionInitializationInfo,
   +payloadSignature: string,
 };
 export const deviceOlmOutboundKeysValidator: TInterface<DeviceOlmOutboundKeys> =
   tShape<DeviceOlmOutboundKeys>({
     identityKeysBlob: identityKeysBlobValidator,
     contentInitializationInfo: olmSessionInitializationInfoValidator,
     notifInitializationInfo: olmSessionInitializationInfoValidator,
     payloadSignature: t.String,
   });
 
 export type UserDevicesOlmOutboundKeys = {
   +deviceID: string,
   +keys: ?DeviceOlmOutboundKeys,
 };
 
 export type DeviceOlmInboundKeys = {
   +identityKeysBlob: IdentityKeysBlob,
   +signedPrekeys: SignedPrekeys,
   +payloadSignature: string,
 };
 export const deviceOlmInboundKeysValidator: TInterface<DeviceOlmInboundKeys> =
   tShape<DeviceOlmInboundKeys>({
     identityKeysBlob: identityKeysBlobValidator,
     signedPrekeys: signedPrekeysValidator,
     payloadSignature: t.String,
   });
 
 export type UserDevicesOlmInboundKeys = {
   +keys: {
     +[deviceID: string]: ?DeviceOlmInboundKeys,
   },
   +username?: ?string,
   +walletAddress?: ?string,
 };
 
 // This type should not be altered without also updating FarcasterUser in
 // keyserver/addons/rust-node-addon/src/identity_client/get_farcaster_users.rs
 export type FarcasterUser = {
   +userID: string,
   +username: string,
   +farcasterID: string,
 };
 
 export const farcasterUserValidator: TInterface<FarcasterUser> =
   tShape<FarcasterUser>({
     userID: t.String,
     username: t.String,
     farcasterID: t.String,
   });
 
 export const farcasterUsersValidator: TList<Array<FarcasterUser>> = t.list(
   farcasterUserValidator,
 );
 
 export const userDeviceOlmInboundKeysValidator: TInterface<UserDevicesOlmInboundKeys> =
   tShape<UserDevicesOlmInboundKeys>({
     keys: t.dict(t.String, t.maybe(deviceOlmInboundKeysValidator)),
     username: t.maybe(t.String),
     walletAddress: t.maybe(t.String),
   });
 
 export interface IdentityServiceClient {
   // Only a primary device can initiate account deletion, and web cannot be a
   // primary device
   +deleteWalletUser?: () => Promise<void>;
   // Only a primary device can initiate account deletion, and web cannot be a
   // primary device
   +deletePasswordUser?: (password: string) => Promise<void>;
   +logOut: () => Promise<void>;
   +getKeyserverKeys: string => Promise<DeviceOlmOutboundKeys>;
   +registerPasswordUser?: (
     username: string,
     password: string,
   ) => Promise<IdentityAuthResult>;
   +logInPasswordUser: (
     username: string,
     password: string,
   ) => Promise<IdentityAuthResult>;
   +getOutboundKeysForUser: (
     userID: string,
   ) => Promise<UserDevicesOlmOutboundKeys[]>;
   +getInboundKeysForUser: (
     userID: string,
   ) => Promise<UserDevicesOlmInboundKeys>;
   +uploadOneTimeKeys: (oneTimeKeys: OneTimeKeysResultValues) => Promise<void>;
   +generateNonce: () => Promise<string>;
   +registerWalletUser?: (
     walletAddress: string,
     siweMessage: string,
     siweSignature: string,
   ) => Promise<IdentityAuthResult>;
   +logInWalletUser: (
     walletAddress: string,
     siweMessage: string,
     siweSignature: string,
   ) => Promise<IdentityAuthResult>;
   // on native, publishing prekeys to Identity is called directly from C++,
   // there is no need to expose it to JS
   +publishWebPrekeys?: (prekeys: SignedPrekeys) => Promise<void>;
   +getDeviceListHistoryForUser: (
     userID: string,
     sinceTimestamp?: number,
   ) => Promise<$ReadOnlyArray<SignedDeviceList>>;
   +getDeviceListsForUsers: (
     userIDs: $ReadOnlyArray<string>,
   ) => Promise<UsersSignedDeviceLists>;
   // updating device list is possible only on Native
   // web cannot be a primary device, so there's no need to expose it to JS
   +updateDeviceList?: (newDeviceList: SignedDeviceList) => Promise<void>;
   +uploadKeysForRegisteredDeviceAndLogIn: (
     userID: string,
     signedNonce: SignedNonce,
   ) => Promise<IdentityAuthResult>;
   +getFarcasterUsers: (
     farcasterIDs: $ReadOnlyArray<string>,
   ) => Promise<$ReadOnlyArray<FarcasterUser>>;
   +linkFarcasterAccount: (farcasterID: string) => Promise<void>;
   +unlinkFarcasterAccount: () => Promise<void>;
 }
 
 export type IdentityServiceAuthLayer = {
   +userID: string,
   +deviceID: string,
   +commServicesAccessToken: string,
 };
 
 export type IdentityAuthResult = {
   +userID: string,
   +accessToken: string,
   +username: string,
   +preRequestUserState?: ?CurrentUserInfo,
 };
 export const identityAuthResultValidator: TInterface<IdentityAuthResult> =
   tShape<IdentityAuthResult>({
     userID: t.String,
     accessToken: t.String,
     username: t.String,
     preRequestUserState: t.maybe(currentUserInfoValidator),
   });
 
 export type IdentityNewDeviceKeyUpload = {
   +keyPayload: string,
   +keyPayloadSignature: string,
   +contentPrekey: string,
   +contentPrekeySignature: string,
   +notifPrekey: string,
   +notifPrekeySignature: string,
   +contentOneTimeKeys: $ReadOnlyArray<string>,
   +notifOneTimeKeys: $ReadOnlyArray<string>,
 };
 
 export type IdentityExistingDeviceKeyUpload = {
   +keyPayload: string,
   +keyPayloadSignature: string,
   +contentPrekey: string,
   +contentPrekeySignature: string,
   +notifPrekey: string,
   +notifPrekeySignature: string,
 };
 
 // Device list types
 
 export type RawDeviceList = {
   +devices: $ReadOnlyArray<string>,
   +timestamp: number,
 };
+export const rawDeviceListValidator: TInterface<RawDeviceList> =
+  tShape<RawDeviceList>({
+    devices: t.list(t.String),
+    timestamp: t.Number,
+  });
 
 export type UsersRawDeviceLists = {
   +[userID: string]: RawDeviceList,
 };
 
 export type SignedDeviceList = {
   // JSON-stringified RawDeviceList
   +rawDeviceList: string,
   // Current primary device signature. Absent for Identity Service generated
   // device lists.
   +curPrimarySignature?: string,
   // Previous primary device signature. Present only if primary device
   // has changed since last update.
   +lastPrimarySignature?: string,
 };
 export const signedDeviceListValidator: TInterface<SignedDeviceList> =
   tShape<SignedDeviceList>({
     rawDeviceList: t.String,
     curPrimarySignature: t.maybe(t.String),
     lastPrimarySignature: t.maybe(t.String),
   });
 export const signedDeviceListHistoryValidator: TList<Array<SignedDeviceList>> =
   t.list(signedDeviceListValidator);
 
 export type UsersSignedDeviceLists = {
   +[userID: string]: SignedDeviceList,
 };
 export const usersSignedDeviceListsValidator: TDict<UsersSignedDeviceLists> =
   t.dict(t.String, signedDeviceListValidator);
 
 export type SignedNonce = {
   +nonce: string,
   +nonceSignature: string,
 };
 
 export const ONE_TIME_KEYS_NUMBER = 10;
 
 export const identityDeviceTypes = Object.freeze({
   KEYSERVER: 0,
   WEB: 1,
   IOS: 2,
   ANDROID: 3,
   WINDOWS: 4,
   MAC_OS: 5,
 });
diff --git a/lib/utils/device-list-utils.js b/lib/utils/device-list-utils.js
new file mode 100644
index 000000000..7be2f0062
--- /dev/null
+++ b/lib/utils/device-list-utils.js
@@ -0,0 +1,26 @@
+// @flow
+
+import { assertWithValidator } from './validation-utils.js';
+import type {
+  UsersRawDeviceLists,
+  UsersSignedDeviceLists,
+} from '../types/identity-service-types.js';
+import { rawDeviceListValidator } from '../types/identity-service-types.js';
+
+function convertSignedDeviceListsToRawDeviceLists(
+  signedDeviceLists: UsersSignedDeviceLists,
+): UsersRawDeviceLists {
+  let usersRawDeviceLists: UsersRawDeviceLists = {};
+  for (const userID in signedDeviceLists) {
+    usersRawDeviceLists = {
+      ...usersRawDeviceLists,
+      [userID]: assertWithValidator(
+        JSON.parse(signedDeviceLists[userID].rawDeviceList),
+        rawDeviceListValidator,
+      ),
+    };
+  }
+  return usersRawDeviceLists;
+}
+
+export { convertSignedDeviceListsToRawDeviceLists };
diff --git a/web/settings/account-settings.react.js b/web/settings/account-settings.react.js
index e67186ba3..adb566188 100644
--- a/web/settings/account-settings.react.js
+++ b/web/settings/account-settings.react.js
@@ -1,275 +1,309 @@
 // @flow
 
 import * as React from 'react';
 
+import { setPeerDeviceListsActionType } from 'lib/actions/aux-user-actions.js';
 import { useLogOut, logOutActionTypes } from 'lib/actions/user-actions.js';
 import { useModalContext } from 'lib/components/modal-provider.react.js';
 import SWMansionIcon from 'lib/components/swmansion-icon.react.js';
 import { useStringForUser } from 'lib/hooks/ens-cache.js';
+import { getRelativeUserIDs } from 'lib/selectors/user-selectors.js';
 import { accountHasPassword } from 'lib/shared/account-utils.js';
 import { IdentityClientContext } from 'lib/shared/identity-client-context.js';
 import { useTunnelbroker } from 'lib/tunnelbroker/tunnelbroker-context.js';
 import {
   createOlmSessionsWithOwnDevices,
   getContentSigningKey,
 } from 'lib/utils/crypto-utils.js';
+import { convertSignedDeviceListsToRawDeviceLists } from 'lib/utils/device-list-utils.js';
 import { useDispatchActionPromise } from 'lib/utils/redux-promise-utils.js';
+import { useDispatch } from 'lib/utils/redux-utils.js';
 
 import css from './account-settings.css';
 import AppearanceChangeModal from './appearance-change-modal.react.js';
 import BackupTestRestoreModal from './backup-test-restore-modal.react.js';
 import PasswordChangeModal from './password-change-modal.js';
 import BlockListModal from './relationship/block-list-modal.react.js';
 import FriendListModal from './relationship/friend-list-modal.react.js';
 import TunnelbrokerMessagesScreen from './tunnelbroker-message-list.react.js';
 import TunnelbrokerTestScreen from './tunnelbroker-test.react.js';
 import EditUserAvatar from '../avatars/edit-user-avatar.react.js';
 import Button from '../components/button.react.js';
 import { useSelector } from '../redux/redux-utils.js';
 import { useStaffCanSee } from '../utils/staff-utils.js';
 
 function AccountSettings(): React.Node {
   const sendLogoutRequest = useLogOut();
   const dispatchActionPromise = useDispatchActionPromise();
   const logOutUser = React.useCallback(
     () => dispatchActionPromise(logOutActionTypes, sendLogoutRequest()),
     [dispatchActionPromise, sendLogoutRequest],
   );
   const identityContext = React.useContext(IdentityClientContext);
 
   const userID = useSelector(state => state.currentUserInfo?.id);
   const [deviceID, setDeviceID] = React.useState<?string>();
 
   React.useEffect(() => {
     void (async () => {
       const contentSigningKey = await getContentSigningKey();
       setDeviceID(contentSigningKey);
     })();
   }, []);
 
   const { pushModal, popModal } = useModalContext();
   const showPasswordChangeModal = React.useCallback(
     () => pushModal(<PasswordChangeModal />),
     [pushModal],
   );
 
   const openFriendList = React.useCallback(
     () => pushModal(<FriendListModal />),
     [pushModal],
   );
 
   const openBlockList = React.useCallback(
     () => pushModal(<BlockListModal />),
     [pushModal],
   );
 
   const isAccountWithPassword = useSelector(state =>
     accountHasPassword(state.currentUserInfo),
   );
 
   const currentUserInfo = useSelector(state => state.currentUserInfo);
   const stringForUser = useStringForUser(currentUserInfo);
 
   const staffCanSee = useStaffCanSee();
   const { sendMessage, connected, addListener, removeListener } =
     useTunnelbroker();
   const openTunnelbrokerModal = React.useCallback(
     () =>
       pushModal(
         <TunnelbrokerTestScreen sendMessage={sendMessage} onClose={popModal} />,
       ),
     [popModal, pushModal, sendMessage],
   );
 
   const openTunnelbrokerMessagesModal = React.useCallback(
     () =>
       pushModal(
         <TunnelbrokerMessagesScreen
           addListener={addListener}
           removeListener={removeListener}
           onClose={popModal}
         />,
       ),
     [addListener, popModal, pushModal, removeListener],
   );
 
   const onCreateOlmSessions = React.useCallback(async () => {
     if (!identityContext) {
       return;
     }
     const authMetadata = await identityContext.getAuthMetadata();
     try {
       await createOlmSessionsWithOwnDevices(
         authMetadata,
         identityContext.identityClient,
         sendMessage,
       );
     } catch (e) {
       console.log(`Error creating olm sessions with own devices: ${e.message}`);
     }
   }, [identityContext, sendMessage]);
 
+  const dispatch = useDispatch();
+  const relativeUserIDs = useSelector(getRelativeUserIDs);
+
+  const onCreateInitialPeerList = React.useCallback(async () => {
+    if (!identityContext) {
+      return;
+    }
+
+    try {
+      const userDeviceLists =
+        await identityContext.identityClient.getDeviceListsForUsers(
+          relativeUserIDs,
+        );
+      const usersRawDeviceLists =
+        convertSignedDeviceListsToRawDeviceLists(userDeviceLists);
+      dispatch({
+        type: setPeerDeviceListsActionType,
+        payload: { deviceLists: usersRawDeviceLists },
+      });
+    } catch (e) {
+      console.log(`Error creating initial peer list: ${e.message}`);
+    }
+  }, [dispatch, identityContext, relativeUserIDs]);
+
   const openBackupTestRestoreModal = React.useCallback(
     () => pushModal(<BackupTestRestoreModal onClose={popModal} />),
     [popModal, pushModal],
   );
 
   const showAppearanceModal = React.useCallback(
     () => pushModal(<AppearanceChangeModal />),
     [pushModal],
   );
 
   if (!currentUserInfo || currentUserInfo.anonymous) {
     return null;
   }
 
   let changePasswordSection;
   if (isAccountWithPassword) {
     changePasswordSection = (
       <li>
         <span>Password</span>
         <span className={css.passwordContainer}>
           <span className={css.password}>******</span>
           <a className={css.editPasswordLink} onClick={showPasswordChangeModal}>
             <SWMansionIcon icon="edit-1" size={22} />
           </a>
         </span>
       </li>
     );
   }
 
   let preferences;
   if (staffCanSee) {
     preferences = (
       <div className={css.preferencesContainer}>
         <h4 className={css.preferencesHeader}>Preferences</h4>
         <div className={css.content}>
           <ul>
             <li>
               <span>Appearance</span>
               <a className={css.editPasswordLink} onClick={showAppearanceModal}>
                 <SWMansionIcon icon="edit-1" size={22} />
               </a>
             </li>
           </ul>
         </div>
       </div>
     );
   }
   let tunnelbroker;
   if (staffCanSee) {
     tunnelbroker = (
       <div className={css.preferencesContainer}>
         <h4 className={css.preferencesHeader}>Tunnelbroker menu</h4>
         <div className={css.content}>
           <ul>
             <li>
               <span>Connected</span>
               <span>{connected.toString()}</span>
             </li>
             <li>
               <span>Send message to device</span>
               <Button variant="text" onClick={openTunnelbrokerModal}>
                 <p className={css.buttonText}>Insert data</p>
               </Button>
             </li>
             <li>
               <span>Trace received messages</span>
               <Button variant="text" onClick={openTunnelbrokerMessagesModal}>
                 <p className={css.buttonText}>Show list</p>
               </Button>
             </li>
             <li>
               <span>Create session with own devices</span>
               <Button variant="text" onClick={onCreateOlmSessions}>
                 <p className={css.buttonText}>Create</p>
               </Button>
             </li>
+            <li>
+              <span>Create initial peer list</span>
+              <Button variant="text" onClick={onCreateInitialPeerList}>
+                <p className={css.buttonText}>Create</p>
+              </Button>
+            </li>
           </ul>
         </div>
       </div>
     );
   }
   let backup;
   if (staffCanSee) {
     backup = (
       <div className={css.preferencesContainer}>
         <h4 className={css.preferencesHeader}>Backup menu</h4>
         <div className={css.content}>
           <ul>
             <li>
               <span>Test backup restore</span>
               <Button variant="text" onClick={openBackupTestRestoreModal}>
                 <p className={css.buttonText}>Insert data</p>
               </Button>
             </li>
           </ul>
         </div>
       </div>
     );
   }
   let deviceData;
   if (staffCanSee) {
     deviceData = (
       <div className={css.preferencesContainer}>
         <h4 className={css.preferencesHeader}>Device ID</h4>
         <div className={css.content}>
           <ul>
             <li>
               <span>{deviceID}</span>
             </li>
           </ul>
         </div>
         <h4 className={css.preferencesHeader}>User ID</h4>
         <div className={css.content}>
           <ul>
             <li>
               <span>{userID}</span>
             </li>
           </ul>
         </div>
       </div>
     );
   }
 
   return (
     <div className={css.container}>
       <div className={css.contentContainer}>
         <h4 className={css.header}>My Account</h4>
         <EditUserAvatar userID={currentUserInfo.id} />
         <div className={css.content}>
           <ul>
             <li>
               <p className={css.logoutContainer}>
                 <span className={css.logoutLabel}>{'Logged in as '}</span>
                 <span className={css.username}>{stringForUser}</span>
               </p>
               <Button variant="text" onClick={logOutUser}>
                 <p className={css.buttonText}>Log out</p>
               </Button>
             </li>
             {changePasswordSection}
             <li>
               <span>Friend List</span>
               <Button variant="text" onClick={openFriendList}>
                 <p className={css.buttonText}>See List</p>
               </Button>
             </li>
             <li>
               <span>Block List</span>
               <Button variant="text" onClick={openBlockList}>
                 <p className={css.buttonText}>See List</p>
               </Button>
             </li>
           </ul>
         </div>
         {preferences}
         {tunnelbroker}
         {backup}
         {deviceData}
       </div>
     </div>
   );
 }
 
 export default AccountSettings;