fix: middleware usage

Author: khushal87

examples/SampleApp/App.tsx

@@ -8,7 +8,7 @@ import {
   Chat,
   createTextComposerEmojiMiddleware,
   OverlayProvider,
-  setupCommandUIMiddleware,
+  setupCommandUIMiddlewares,
   SqliteClient,
   ThemeProvider,
   useOverlayContext,
@@ -135,10 +135,14 @@ const App = () => {
         },
       });
 
-      setupCommandUIMiddleware(composer);
+      setupCommandUIMiddlewares(composer);
 
       composer.textComposer.middlewareExecutor.insert({
-        middleware: [createTextComposerEmojiMiddleware(SearchIndex) as TextComposerMiddleware],
+        middleware: [
+          createTextComposerEmojiMiddleware({
+            emojiSearchIndex: SearchIndex,
+          }) as TextComposerMiddleware,
+        ],
         position: { after: 'stream-io/text-composer/mentions-middleware' },
         unique: true,
       });

package/src/components/MessageInput/components/CommandInput.tsx

@@ -21,6 +21,7 @@ export type CommandInputProps = Partial<
 > & {
   disabled: boolean;
 };
+
 const textComposerStateSelector = (state: TextComposerState) => ({
   command: state.command,
 });

package/src/index.ts

@@ -15,7 +15,7 @@ export * from './types/types';
 
 export * from './utils/patchMessageTextCommand';
 export * from './utils/i18n/Streami18n';
-export * from './utils/setupCommandUIMiddleware';
+export * from './utils/setupCommandUIMiddlewares';
 export * from './utils/utils';
 
 export { default as enTranslations } from './i18n/en.json';

package/src/middlewares/emojiControl.ts

@@ -88,10 +88,13 @@ export type EmojiMiddleware<T extends Emoji = Emoji> = Middleware<
  *   }} options
  * @returns
  */
-export const createTextComposerEmojiMiddleware = (
-  emojiSearchIndex: EmojiSearchIndex,
-  options?: Partial<TextComposerMiddlewareOptions>,
-): EmojiMiddleware => {
+export const createTextComposerEmojiMiddleware = ({
+  emojiSearchIndex,
+  options,
+}: {
+  emojiSearchIndex: EmojiSearchIndex;
+  options?: Partial<TextComposerMiddlewareOptions>;
+}): EmojiMiddleware => {
   const finalOptions = mergeWith(DEFAULT_OPTIONS, options ?? {});
   const emojiSearchSource = new EmojiSearchSource(emojiSearchIndex);
   emojiSearchSource.activate();

…ge/src/utils/setupCommandUIMiddleware.ts …e/src/utils/setupCommandUIMiddlewares.tspackage/src/utils/setupCommandUIMiddleware.ts renamed to package/src/utils/setupCommandUIMiddlewares.ts package/src/utils/setupCommandUIMiddleware.ts renamed to package/src/utils/setupCommandUIMiddlewares.ts

@@ -7,7 +7,7 @@ import {
   TextComposerMiddleware,
 } from 'stream-chat';
 
-export const setupCommandUIMiddleware = (messageComposer: MessageComposer) => {
+export const setupCommandUIMiddlewares = (messageComposer: MessageComposer) => {
   messageComposer.compositionMiddlewareExecutor.insert({
     middleware: [createCommandInjectionMiddleware(messageComposer)],
     position: { after: 'stream-io/message-composer-middleware/attachments' },