Add current user object that holds user session values instead of standalone getters. Closes #2050

web/stories/ReadwriteChat.stories.tsx

@@ -1,11 +1,11 @@
 import React, { useEffect } from 'react';
 import { ComponentStory, ComponentMeta } from '@storybook/react';
-import { RecoilRoot, useSetRecoilState } from 'recoil';
+import { RecoilRoot, useRecoilState, useSetRecoilState } from 'recoil';
 import ReadWritePage from '../pages/embed/chat/readwrite/index';
 import { ChatMessage } from '../interfaces/chat-message.model';
 import {
   chatMessagesAtom,
-  chatDisplayNameAtom,
+  currentUserAtom,
   clientConfigStateAtom,
 } from '../components/stores/ClientConfigStore';
 import { ClientConfig } from '../interfaces/client-config.model';
@@ -21,8 +21,8 @@ const testMessages =
 const messages: ChatMessage[] = JSON.parse(testMessages);
 
 const Page = () => {
+  const [currentUser, setCurrentUser] = useRecoilState(currentUserAtom);
   const setMessages = useSetRecoilState(chatMessagesAtom);
-  const setDisplayName = useSetRecoilState(chatDisplayNameAtom);
   const setClientConfig = useSetRecoilState<ClientConfig>(clientConfigStateAtom);
 
   const fakeConfig: ClientConfig = {
@@ -45,7 +45,11 @@ const Page = () => {
 
   useEffect(() => {
     setMessages(messages);
-    setDisplayName('fake-chat-user');
+    setCurrentUser({
+      ...currentUser,
+      displayName: 'fake-chat-user',
+    });
+
     setClientConfig(fakeConfig);
   }, []);