Merge pull request #704 from GetStream/remove-setUser

Fix broken docs

Author: DanC5

examples/tutorial/step1.js

@@ -11,9 +11,9 @@ import { StreamChat } from 'stream-chat';
 
 import 'stream-chat-react/dist/css/index.css';
 
-const chatClient = new StreamChat('qk4nn7rpcn75');
+const chatClient = StreamChat.getInstance('qk4nn7rpcn75');
 
-chatClient.setUser(
+chatClient.connectUser(
   {
     id: 'thierry',
     name: 'Thierry',

examples/tutorial/step2.js

@@ -13,9 +13,9 @@ import { StreamChat } from 'stream-chat';
 
 import 'stream-chat-react/dist/css/index.css';
 
-const chatClient = new StreamChat('qk4nn7rpcn75');
+const chatClient = StreamChat.getInstance('qk4nn7rpcn75');
 
-chatClient.setUser(
+chatClient.connectUser(
   {
     id: 'thierry',
     name: 'Thierry',

examples/tutorial/step3.js

@@ -13,7 +13,7 @@ import { StreamChat } from 'stream-chat';
 
 import 'stream-chat-react/dist/css/index.css';
 
-const chatClient = new StreamChat('qk4nn7rpcn75');
+const chatClient = StreamChat.getInstance('qk4nn7rpcn75');
 
 class MyChannelPreview extends React.Component {
   render() {
@@ -35,14 +35,14 @@ class MyChannelPreview extends React.Component {
   }
 }
 
-// the most minimalistic message component
+// the most minimalist message component
 class MyMessage extends React.Component {
   render() {
     return <div>{this.props.message.text}</div>;
   }
 }
 
-chatClient.setUser(
+chatClient.connectUser(
   {
     id: 'thierry',
     name: 'Thierry',

examples/tutorial/step4.js

@@ -14,9 +14,9 @@ import { StreamChat } from 'stream-chat';
 
 import 'stream-chat-react/dist/css/index.css';
 
-const chatClient = new StreamChat('qk4nn7rpcn75');
+const chatClient = StreamChat.getInstance('qk4nn7rpcn75');
 
-chatClient.setUser(
+chatClient.connectUser(
   {
     id: 'thierry',
     name: 'Thierry',

examples/tutorial/step5.js

@@ -13,7 +13,7 @@ import { StreamChat } from 'stream-chat';
 
 import 'stream-chat-react/dist/css/index.css';
 
-const chatClient = new StreamChat('qk4nn7rpcn75');
+const chatClient = StreamChat.getInstance('qk4nn7rpcn75');
 
 class MyAttachment extends React.Component {
   render() {
@@ -43,7 +43,7 @@ class MyAttachment extends React.Component {
   }
 }
 
-chatClient.setUser(
+chatClient.connectUser(
   {
     id: 'thierry',
     name: 'Thierry',

scripts/send-messages.js

@@ -12,9 +12,9 @@ function sleep(ms) {
 }
 console.log(process.env.REACT_APP_CHAT_SERVER_ENDPOINT);
 async function main() {
-  const chatClient = new StreamChat(process.env.REACT_APP_CHAT_API_KEY);
+  const chatClient = StreamChat.getInstance(process.env.REACT_APP_CHAT_API_KEY);
   chatClient.setBaseURL(process.env.REACT_APP_CHAT_SERVER_ENDPOINT);
-  chatClient.setUser(
+  chatClient.connectUser(
     {
       id: user,
     },

src/components/Chat/hooks/useChat.js

@@ -26,14 +26,16 @@ export const useChat = ({ client, initialNavOpen, i18nInstance }) => {
   const clientMutes = client?.user?.mutes;
 
   useEffect(() => {
-    const userAgent = client.getUserAgent();
-    if (!userAgent.includes('stream-chat-react')) {
-      /**
-       * results in something like: 'stream-chat-react-2.3.2-stream-chat-javascript-client-browser-2.2.2'
-       */
-      client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
+    if (client) {
+      const userAgent = client.getUserAgent();
+      if (!userAgent.includes('stream-chat-react')) {
+        /**
+         * results in something like: 'stream-chat-react-2.3.2-stream-chat-javascript-client-browser-2.2.2'
+         */
+        client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
+      }
     }
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [client]);
 
   useEffect(() => {
     setMutes(clientMutes || []);

src/components/ChatAutoComplete/ChatAutoComplete.js

@@ -18,16 +18,18 @@ const ChatAutoComplete = (props) => {
 
   const members = channel?.state?.members;
   const watchers = channel?.state?.watchers;
-  const { emojiData, EmojiIndex } = emojiConfig;
+  const { emojiData, EmojiIndex } = emojiConfig || {};
 
-  const emojiIndex = useMemo(() => new EmojiIndex(emojiData), [
-    emojiData,
-    EmojiIndex,
-  ]);
+  const emojiIndex = useMemo(() => {
+    if (EmojiIndex) {
+      return new EmojiIndex(emojiData);
+    }
+    return null;
+  }, [emojiData, EmojiIndex]);
 
   /** @param {string} word */
   const emojiReplace = (word) => {
-    const found = emojiIndex.search(word) || [];
+    const found = emojiIndex?.search(word) || [];
     const emoji = found.slice(0, 10).find(
       /** @type {{ ({ emoticons } : import('emoji-mart').EmojiData): boolean }} */
       ({ emoticons }) => !!emoticons?.includes(word),
@@ -91,7 +93,7 @@ const ChatAutoComplete = (props) => {
             if (q.length === 0 || q.charAt(0).match(/[^a-zA-Z0-9+-]/)) {
               return [];
             }
-            const emojis = emojiIndex.search(q) || [];
+            const emojis = emojiIndex?.search(q) || [];
             const result = emojis.slice(0, 10);
 
             if (onReady) onReady(result, q);

src/components/MessageInput/EmojiPicker.js

@@ -22,7 +22,7 @@ const EmojiPicker = ({
   const { emojiConfig } = useContext(ChannelContext);
   const { t } = useContext(TranslationContext);
 
-  const { emojiData, EmojiPicker: Picker } = emojiConfig;
+  const { emojiData, EmojiPicker: Picker } = emojiConfig || {};
 
   if (emojiPickerIsOpen) {
     const className = small

src/components/Reactions/ReactionSelector.js

@@ -27,12 +27,8 @@ const ReactionSelectorWithRef = (
 ) => {
   const { emojiConfig } = useContext(ChannelContext);
 
-  const {
-    defaultMinimalEmojis,
-    Emoji,
-    emojiData: fullEmojiData,
-    emojiSetDef,
-  } = emojiConfig;
+  const { defaultMinimalEmojis, Emoji, emojiData: fullEmojiData, emojiSetDef } =
+    emojiConfig || {};
 
   const emojiData = getStrippedEmojiData(fullEmojiData);
   const reactionOptions = reactionOptionsProp || defaultMinimalEmojis;