@qlover/create-app 0.12.0 → 1.0.0

package/dist/templates/react-app/src/base/cases/I18nKeyErrorPlugin.ts

@@ -1,8 +1,8 @@
 import { IOCIdentifier } from '@config/IOCIdentifier';
 import {
+  ExecutorContextInterface,
   ExecutorError,
-  type ExecutorContext,
-  type ExecutorPlugin
+  LifecyclePluginInterface
 } from '@qlover/fe-corekit';
 import { inject, injectable } from 'inversify';
 import type { I18nServiceInterface } from '../port/I18nServiceInterface';
@@ -14,7 +14,9 @@ import type { LoggerInterface } from '@qlover/logger';
  * If the error thrown is an i18n key, it will be converted to the corresponding text
  */
 @injectable()
-export class I18nKeyErrorPlugin implements ExecutorPlugin {
+export class I18nKeyErrorPlugin implements LifecyclePluginInterface<
+  ExecutorContextInterface<unknown, unknown>
+> {
   public readonly pluginName = 'I18nKeyErrorPlugin';
 
   constructor(
@@ -30,7 +32,9 @@ export class I18nKeyErrorPlugin implements ExecutorPlugin {
   /**
    * @override
    */
-  public onError(context: ExecutorContext<unknown>): Error | void {
+  public onError(
+    context: ExecutorContextInterface<unknown, unknown>
+  ): ExecutorError | void {
     const { error } = context;
 
     if (!error) {
@@ -39,6 +43,7 @@ export class I18nKeyErrorPlugin implements ExecutorPlugin {
 
     if (error instanceof ExecutorError) {
       const i18nText = this.translateById(error.id);
+      this.logger.error('i18nText', i18nText);
       return new ExecutorError(error.id, i18nText);
     }
 
@@ -50,7 +55,8 @@ export class I18nKeyErrorPlugin implements ExecutorPlugin {
 
         if (i18nText && i18nText !== i18nKey) {
           this.logger.debug('I18nKeyErrorPlugin Error:', i18nText);
-          return new Error(i18nText);
+          // Use i18nText as cause (string) so ExecutorError.message will be the translated text
+          return new ExecutorError(i18nKey, i18nText);
         }
       }
     }

package/dist/templates/react-app/src/base/cases/RequestLanguages.ts

@@ -1,11 +1,13 @@
 import type { I18nServiceInterface } from '@/base/port/I18nServiceInterface';
 import type {
-  ExecutorContext,
-  ExecutorPlugin,
+  ExecutorContextInterface,
+  LifecyclePluginInterface,
   RequestAdapterConfig
 } from '@qlover/fe-corekit';
 
-export class RequestLanguages implements ExecutorPlugin {
+export class RequestLanguages implements LifecyclePluginInterface<
+  ExecutorContextInterface<RequestAdapterConfig, unknown>
+> {
   public readonly pluginName = 'RequestLanguages';
 
   constructor(
@@ -25,18 +27,29 @@ export class RequestLanguages implements ExecutorPlugin {
   /**
    * @override
    */
-  public onBefore(context: ExecutorContext<RequestAdapterConfig>): void {
+  public onBefore(
+    context: ExecutorContextInterface<RequestAdapterConfig, unknown>
+  ): void {
     const currentLanguage = this.i18nService.getCurrentLanguage();
     const languages = this.i18nService.getSupportedLanguages();
 
     if (!context.parameters.headers) {
-      context.parameters.headers = {};
+      context.setParameters({
+        ...context.parameters,
+        headers: {}
+      });
     }
 
     const languageValue = this.buildAcceptLanguage(
       Array.from(new Set([currentLanguage, ...languages]))
     );
 
-    context.parameters.headers[this.headerName] = languageValue;
+    context.setParameters({
+      ...context.parameters,
+      headers: {
+        ...context.parameters.headers,
+        [this.headerName]: languageValue
+      }
+    });
   }
 }

package/dist/templates/react-app/src/base/cases/RequestLogger.ts

@@ -1,11 +1,8 @@
 import { IOCIdentifier } from '@config/IOCIdentifier';
+import { type ApiCatchPluginResponse } from '@qlover/corekit-bridge';
 import {
-  type ApiCatchPluginConfig,
-  type ApiCatchPluginResponse
-} from '@qlover/corekit-bridge';
-import {
-  type ExecutorPlugin,
-  type ExecutorContext,
+  type LifecyclePluginInterface,
+  type ExecutorContextInterface,
   type RequestAdapterFetchConfig,
   type RequestAdapterResponse
 } from '@qlover/fe-corekit';
@@ -13,7 +10,9 @@ import { injectable, inject } from 'inversify';
 import type { LoggerInterface } from '@qlover/logger';
 
 @injectable()
-export class RequestLogger implements ExecutorPlugin<RequestAdapterFetchConfig> {
+export class RequestLogger implements LifecyclePluginInterface<
+  ExecutorContextInterface<RequestAdapterFetchConfig, unknown>
+> {
   public readonly pluginName = 'RequestLogger';
 
   constructor(@inject(IOCIdentifier.Logger) public logger: LoggerInterface) {}
@@ -22,7 +21,7 @@ export class RequestLogger implements ExecutorPlugin<RequestAdapterFetchConfig>
    * @override
    */
   public onBefore(
-    context: ExecutorContext<RequestAdapterFetchConfig<unknown>>
+    context: ExecutorContextInterface<RequestAdapterFetchConfig, unknown>
   ): void {
     this.logger.log(
       `%c[Request before]%c [${new Date().toLocaleString()}] ${context.parameters.method} ${context.parameters.url}`,
@@ -38,8 +37,9 @@ export class RequestLogger implements ExecutorPlugin<RequestAdapterFetchConfig>
   public async onSuccess({
     parameters,
     returnValue
-  }: ExecutorContext<
-    RequestAdapterFetchConfig & ApiCatchPluginConfig
+  }: ExecutorContextInterface<
+    RequestAdapterFetchConfig,
+    unknown
   >): Promise<void> {
     const _returnValue = returnValue as RequestAdapterResponse &
       ApiCatchPluginResponse;
@@ -65,7 +65,7 @@ export class RequestLogger implements ExecutorPlugin<RequestAdapterFetchConfig>
   public onError({
     parameters,
     error
-  }: ExecutorContext<RequestAdapterFetchConfig>): void {
+  }: ExecutorContextInterface<RequestAdapterFetchConfig, unknown>): void {
     this.loggerError(parameters, error);
   }
 

package/dist/templates/react-app/src/base/services/BaseLayoutService.ts

@@ -1,18 +1,22 @@
 import { I } from '@config/IOCIdentifier';
-import { AsyncExecutor, ExecutorPlugin } from '@qlover/fe-corekit';
+import {
+  ExecutorContextInterface,
+  LifecycleExecutor,
+  LifecyclePluginInterface
+} from '@qlover/fe-corekit';
 import { injectable, inject } from 'inversify';
 import { UserBootstrap } from './UserBootstrap';
 import type { RouteServiceInterface } from '../port/RouteServiceInterface';
 import type { UserServiceInterface } from '../port/UserServiceInterface';
 import type {
-  BootstrapContextValue,
+  BootstrapPluginOptions,
   IOCContainerInterface
 } from '@qlover/corekit-bridge';
 import type { LoggerInterface } from '@qlover/logger';
 
 @injectable()
 export class BaseLayoutService {
-  protected executor: AsyncExecutor = new AsyncExecutor();
+  protected executor: LifecycleExecutor = new LifecycleExecutor();
 
   constructor(
     @inject(I.Logger) protected logger: LoggerInterface,
@@ -24,7 +28,9 @@ export class BaseLayoutService {
     this.use(new UserBootstrap(userService));
   }
 
-  public use(plugin: ExecutorPlugin): this {
+  public use(
+    plugin: LifecyclePluginInterface<ExecutorContextInterface<unknown, unknown>>
+  ): this {
     this.executor.use(plugin);
     return this;
   }
@@ -36,7 +42,7 @@ export class BaseLayoutService {
   }
 
   public async starup(ioc: IOCContainerInterface): Promise<unknown> {
-    const context: BootstrapContextValue = {
+    const context: BootstrapPluginOptions = {
       root: {},
       logger: this.logger,
       ioc: ioc

package/dist/templates/react-app/src/base/services/UserBootstrap.ts

@@ -1,7 +1,7 @@
 import { LOCAL_NO_USER_TOKEN } from '@config/Identifier';
 import { I } from '@config/IOCIdentifier';
+import { ExecutorError } from '@qlover/fe-corekit';
 import { inject, injectable } from 'inversify';
-import { AppError } from '../cases/AppError';
 import type { UserServiceInterface } from '../port/UserServiceInterface';
 import type { BootstrapExecutorPlugin } from '@qlover/corekit-bridge';
 
@@ -17,7 +17,7 @@ export class UserBootstrap implements BootstrapExecutorPlugin {
   /**
    * @override
    */
-  public async onBefore(): Promise<void> {
+  public onBefore(): void {
     const userService = this.userService;
 
     if (userService.isAuthenticated()) {
@@ -29,18 +29,17 @@ export class UserBootstrap implements BootstrapExecutorPlugin {
     if (userService.isUserCredential(credential)) {
       userService.getStore().start();
 
-      const user = await userService.refreshUserInfo();
-
-      userService.getStore().success(user);
+      userService.refreshUserInfo().then((user) => {
+        userService.getStore().success(user);
+      });
 
       return;
     }
 
-    const newError = new AppError(LOCAL_NO_USER_TOKEN);
+    const newError = new ExecutorError(LOCAL_NO_USER_TOKEN);
 
     userService.getStore().failed(newError);
 
-    // 否则还是抛出错误
     throw newError;
   }
 }

package/dist/templates/react-app/src/base/services/UserService.ts

@@ -1,8 +1,5 @@
 import { I } from '@config/IOCIdentifier';
-import {
-  UserService as CorekitBridgeUserService,
-  GatewayExecutor
-} from '@qlover/corekit-bridge';
+import { UserService as CorekitBridgeUserService } from '@qlover/corekit-bridge';
 import { inject, injectable } from 'inversify';
 import { isObject, isString } from 'lodash';
 import { UserApi } from '@/base/apis/userApi/UserApi';
@@ -28,7 +25,6 @@ export class UserService
     logger: LoggerInterface
   ) {
     super({
-      executor: new GatewayExecutor(),
       gateway: userApi,
       logger: logger,
       store: {

package/dist/templates/react-app/src/core/clientIoc/ClientIOCRegister.ts

@@ -6,16 +6,15 @@ import { themeConfig } from '@config/theme';
 import {
   ApiCatchPlugin,
   ApiMockPlugin,
-  RequestCommonPlugin,
   ThemeService
 } from '@qlover/corekit-bridge';
+import { RequestPlugin } from '@qlover/fe-corekit';
 import { I18nKeyErrorPlugin } from '@/base/cases/I18nKeyErrorPlugin';
 import { RequestStatusCatcher } from '@/base/cases/RequestStatusCatcher';
 import type { IocRegisterOptions } from '@/base/port/IOCInterface';
 import type { UserServiceInterface } from '@/base/port/UserServiceInterface';
 import { I18nService } from '@/base/services/I18nService';
 import { RouteService } from '@/base/services/RouteService';
-import { UserGatewayPlugin } from '@/base/services/UserGatewayPlugin';
 import { UserService } from '@/base/services/UserService';
 import { ExecutorPageBridge } from '@/uikit/bridges/ExecutorPageBridge';
 import { JSONStoragePageBridge } from '@/uikit/bridges/JSONStoragePageBridge';
@@ -95,9 +94,10 @@ export class ClientIOCRegister implements IOCRegisterInterface<
 
     ioc.bind(
       I.UserServiceInterface,
-      ioc
-        .get<UserServiceInterface>(UserService)
-        .use(new UserGatewayPlugin(routeService))
+      ioc.get<UserService>(UserService)
+      // TODO: use executor replace
+      // .use(new UserGatewayPlugin(routeService))
+      // .use(ioc.get(I.I18nKeyErrorPlugin))
     );
     ioc.bind(I.RequestCatcherInterface, ioc.get(RequestStatusCatcher));
     ioc.bind(I.ExecutorPageBridgeInterface, ioc.get(ExecutorPageBridge));
@@ -109,9 +109,8 @@ export class ClientIOCRegister implements IOCRegisterInterface<
     const { appConfig } = this.options;
     const logger = ioc.get<LoggerInterface>(I.Logger);
 
-    const feApiRequestCommonPlugin = new RequestCommonPlugin({
+    const feApiRequestCommonPlugin = new RequestPlugin({
       tokenPrefix: appConfig.openAiTokenPrefix,
-      requiredToken: true,
       token: () =>
         ioc.get<UserServiceInterface>(I.UserServiceInterface).getToken()
     });

package/dist/templates/react-app/src/main.tsx

@@ -2,7 +2,7 @@
 import 'reflect-metadata';
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
-import App from './App.tsx';
+import App from './App';
 import { BootstrapClient } from './core/bootstraps/BootstrapClient';
 import { clientIOC } from './core/clientIoc/ClientIOC';
 

package/dist/templates/react-app/src/pages/auth/LoginPage.tsx

@@ -1,6 +1,6 @@
 import { UserOutlined, LockOutlined, GoogleOutlined } from '@ant-design/icons';
 import { login18n } from '@config/i18n/login18n';
-import { IOCIdentifier } from '@config/IOCIdentifier';
+import { I } from '@config/IOCIdentifier';
 import { Form, Input, Button } from 'antd';
 import { useState } from 'react';
 import { LocaleLink } from '@/uikit/components/LocaleLink';
@@ -14,10 +14,10 @@ interface LoginFormData {
 
 export default function LoginPage() {
   const tt = useI18nInterface(login18n);
-  const userService = useIOC(IOCIdentifier.UserServiceInterface);
-  const AppConfig = useIOC(IOCIdentifier.AppConfig);
-  const routeService = useIOC(IOCIdentifier.RouteServiceInterface);
-  const logger = useIOC(IOCIdentifier.Logger);
+  const logger = useIOC(I.Logger);
+  const userService = useIOC(I.UserServiceInterface);
+  const AppConfig = useIOC(I.AppConfig);
+  const routeService = useIOC(I.RouteServiceInterface);
 
   const [loading, setLoading] = useState(false);
 

package/dist/templates/react-app/src/pages/base/ExecutorPage.tsx

@@ -277,7 +277,9 @@ export default function ExecutorPage() {
               <Input
                 placeholder={tt.enterUrl}
                 value={customUrl}
-                onChange={(e) => setCustomUrl(e.target.value)}
+                onChange={(e) =>
+                  setCustomUrl((e.target as HTMLInputElement).value)
+                }
                 className="flex-1"
               />
               <Select

package/dist/templates/react-app/src/pages/base/JSONStoragePage.tsx

@@ -74,7 +74,9 @@ export default function JSONStoragePage() {
                     type="number"
                     value={pageState.expireTime}
                     onChange={(e) =>
-                      pageBridge.changeExpireTime(Number(e.target.value))
+                      pageBridge.changeExpireTime(
+                        Number((e.target as HTMLInputElement).value)
+                      )
                     }
                     className="w-32"
                     min="1000"
@@ -111,7 +113,9 @@ export default function JSONStoragePage() {
                   type="number"
                   value={pageState.requestTimeout}
                   onChange={(e) =>
-                    pageBridge.changeRequestTimeout(Number(e.target.value))
+                    pageBridge.changeRequestTimeout(
+                      Number((e.target as HTMLInputElement).value)
+                    )
                   }
                   className="w-32"
                   min="1000"

package/dist/templates/react-app/src/pages/base/MessagePage.tsx

@@ -3,8 +3,10 @@ import { chatMessageI18n } from '@config/i18n/chatMessageI18n';
 import {
   ChatMessageStore,
   ChatSenderStrategy,
+  MessageSenderExecutor,
   SendFailureStrategy
 } from '@qlover/corekit-bridge';
+import { Aborter, AborterPlugin } from '@qlover/fe-corekit';
 import { useState } from 'react';
 import { logger } from '@/core/globals';
 import { ChatMessageBridge } from '@/uikit/components/chatMessage/ChatMessageBridge';
@@ -12,19 +14,48 @@ import { ChatRoot } from '@/uikit/components/chatMessage/ChatRoot';
 import { MessageApi } from '@/uikit/components/chatMessage/MessageApi';
 import { MessageBaseList } from '@/uikit/components/MessageBaseList';
 import { useI18nInterface } from '@/uikit/hooks/useI18nInterface';
+import { useIOC } from '@/uikit/hooks/useIOC';
+import type { ChatMessage, MessageSenderOptions } from '@qlover/corekit-bridge';
+import type { AborterConfig } from '@qlover/fe-corekit';
+
+// TODO: message sender getconfig type not match, need to fix
+function toAborterConfig<T>(
+  parameters: unknown | MessageSenderOptions<ChatMessage<T>>
+): any {
+  const options = parameters as MessageSenderOptions<ChatMessage<T>>;
+  return {
+    abortId: options.currentMessage.id,
+    onAborted: options.gatewayOptions?.onAborted,
+    abortTimeout: options.gatewayOptions?.timeout,
+    signal: options.gatewayOptions?.signal
+  } as AborterConfig;
+}
 
 export default function MessagePage() {
   const tt = useI18nInterface(chatMessageI18n);
   const messagesStore = useFactory(ChatMessageStore<string>);
   const messageApi = useFactory(MessageApi, messagesStore);
+  const aborter = useIOC(Aborter);
 
   const [bridge] = useState(() => {
-    return new ChatMessageBridge<string>(messagesStore, {
+    const messageBridge = new ChatMessageBridge<string>(messagesStore, {
       gateway: messageApi,
       logger: logger,
+      aborter: aborter,
       senderName: 'ChatSender',
-      gatewayOptions: { stream: true }
-    }).use(new ChatSenderStrategy(SendFailureStrategy.KEEP_FAILED, logger));
+      gatewayOptions: { stream: true },
+      executor: new MessageSenderExecutor()
+    });
+    return messageBridge
+      .use(
+        new AborterPlugin<
+          AborterConfig & MessageSenderOptions<ChatMessage<string>>
+        >({
+          aborter: aborter,
+          getConfig: toAborterConfig
+        })
+      )
+      .use(new ChatSenderStrategy(SendFailureStrategy.KEEP_FAILED, logger));
   });
 
   return (

package/dist/templates/react-app/src/uikit/bridges/ExecutorPageBridge.ts

@@ -1,9 +1,4 @@
 import { RequestState } from '@qlover/corekit-bridge';
-import {
-  ExecutorPlugin,
-  RequestAdapterResponse,
-  RequestAdapterFetchConfig
-} from '@qlover/fe-corekit';
 import { inject, injectable } from 'inversify';
 import cloneDeep from 'lodash/cloneDeep';
 import { FeApi } from '@/base/apis/feApi/FeApi';
@@ -11,12 +6,20 @@ import {
   ExecutorPageBridgeInterface,
   ExecutorPageStateInterface
 } from '@/base/port/ExecutorPageBridgeInterface';
+import type {
+  RequestAdapterResponse,
+  RequestAdapterFetchConfig,
+  LifecyclePluginInterface,
+  ExecutorContextInterface
+} from '@qlover/fe-corekit';
 
 class ExecutorPageBridgeState implements ExecutorPageStateInterface {
   public helloState = new RequestState();
 }
 
-const TestPlugin: ExecutorPlugin<RequestAdapterFetchConfig> = {
+const TestPlugin: LifecyclePluginInterface<
+  ExecutorContextInterface<RequestAdapterFetchConfig, unknown>
+> = {
   pluginName: 'test',
   async onSuccess({ parameters, returnValue }) {
     if (
@@ -38,7 +41,10 @@ export class ExecutorPageBridge extends ExecutorPageBridgeInterface {
     // FIXME: not cloneDeep, create a new instance
     this.feApi = cloneDeep(feApi);
 
-    this.feApi.usePlugin(TestPlugin);
+    this.feApi.use({
+      pluginName: 'test',
+      onSuccess: TestPlugin.onSuccess
+    });
   }
 
   public override onTestPlugins = async () => {

package/dist/templates/react-app/src/uikit/components/LogoutButton.tsx

@@ -15,6 +15,7 @@ export function LogoutButton() {
   const { t } = useAppTranslation();
   const dialogHandler = useIOC(IOCIdentifier.DialogHandler);
   const userService = useIOC(IOCIdentifier.UserServiceInterface);
+  const routeService = useIOC(IOCIdentifier.RouteServiceInterface);
   const breakpoint = useBreakpoint();
   const tTitle = t(AUTH_LOGOUT_DIALOG_TITLE);
   const tContent = t(AUTH_LOGOUT_DIALOG_CONTENT);
@@ -29,7 +30,11 @@ export function LogoutButton() {
         'data-testid': 'LogoutButton-CancelButton'
       },
       content: tContent,
-      onOk: () => userService.logout()
+      onOk: async () => {
+        await userService.logout();
+        routeService.reset();
+        routeService.gotoLogin();
+      }
     });
   }, [tTitle, tContent]);
 

package/dist/templates/react-app/src/uikit/components/MessageBaseList.tsx

@@ -3,6 +3,7 @@ import { messageBaseListI18n } from '@config/i18n/messageBaseListI18n';
 import { I } from '@config/IOCIdentifier';
 import {
   MessageSender,
+  MessageSenderExecutor,
   MessagesStore,
   MessageStatus,
   SenderStrategyPlugin,
@@ -15,7 +16,9 @@ import { useCallback, useMemo, useState } from 'react';
 import { useI18nInterface } from '../hooks/useI18nInterface';
 import { useIOC } from '../hooks/useIOC';
 import type {
+  GatewayOptions,
   MessageGetwayInterface,
+  MessageInterface,
   MessagesStateInterface,
   MessageStoreMsg
 } from '@qlover/corekit-bridge';
@@ -32,37 +35,46 @@ class MessageBaseApi implements MessageGetwayInterface {
   /**
    * @override
    */
-  public async sendMessage<M extends MessageStoreMsg<string>>(
-    message: M
-  ): Promise<unknown> {
+  public async sendMessage<M extends MessageInterface<unknown>>(
+    message: M,
+    options?: GatewayOptions<M>
+  ): Promise<unknown | M> {
     const times = random(200, 1000);
 
     await ThreadUtil.sleep(times);
 
-    const messageContent = message.content ?? '';
+    const messageContent = (message as any).content ?? '';
     if (messageContent.includes('Failed') || messageContent.includes('error')) {
-      throw new Error('Failed to send message');
+      const error = new Error('Failed to send message');
+      await options?.onError?.(error);
+      throw error;
     }
 
     if (times % 5 === 0) {
-      throw new Error(`Network error(${times})`);
+      const error = new Error(`Network error(${times})`);
+      await options?.onError?.(error);
+      throw error;
     }
 
     // Return object response to demonstrate formatting
-    return {
+    const result = {
       status: 'success',
       timestamp: new Date().toISOString(),
       delay: `${times}ms`,
-      echo: message.content,
+      echo: messageContent,
       data: {
         message: 'Message received successfully',
         processed: true,
         metadata: {
-          length: message.content?.length || 0,
+          length: messageContent?.length || 0,
           type: 'text'
         }
       }
     };
+
+    options?.onComplete?.(message);
+
+    return result;
   }
 }
 
@@ -79,7 +91,8 @@ export function MessageBaseList() {
   const [messagesSender] = useState(() =>
     new MessageSender<MessageBaseMsg>(messagesStore, {
       gateway: messageBaseApi,
-      logger
+      logger,
+      executor: new MessageSenderExecutor()
     }).use(new SenderStrategyPlugin(SendFailureStrategy.KEEP_FAILED))
   );
 
@@ -220,7 +233,9 @@ export function MessageBaseList() {
           <Input
             value={inputValue}
             onPressEnter={onSend}
-            onChange={(e) => setInputValue(e.target.value)}
+            onChange={(e) =>
+              setInputValue((e.target as HTMLInputElement).value)
+            }
             placeholder={tt.inputPlaceholder}
             size="large"
             className="flex-1"

package/dist/templates/react-app/src/uikit/components/chatMessage/ChatMessageBridge.ts

@@ -22,7 +22,7 @@ export class ChatMessageBridge<
 
   constructor(
     protected readonly messages: ChatMessageStore<T>,
-    config?: MessageSenderConfig
+    config?: MessageSenderConfig<ChatMessage<T>>
   ) {
     this.messageSender = new MessageSender(messages, config);
   }

package/dist/templates/react-app/src/uikit/components/chatMessage/FocusBar.tsx

@@ -80,7 +80,9 @@ export function FocusBar({ bridge, tt }: FocusBarProps) {
           autoFocus
           value={inputText}
           onKeyDown={handleKeyDown}
-          onChange={(e) => bridge.onChangeContent(e.target.value)}
+          onChange={(e) =>
+            bridge.onChangeContent((e.target as HTMLTextAreaElement).value)
+          }
           placeholder={tt.inputPlaceholder}
           autoSize={{ minRows: 2, maxRows: 6 }}
           className="resize-none"

package/dist/templates/react-app/src/uikit/components/chatMessage/MessageApi.ts

@@ -8,7 +8,8 @@ import type {
   MessageStoreMsg,
   ChatMessageStore,
   MessageGetwayInterface,
-  GatewayOptions
+  GatewayOptions,
+  MessageInterface
 } from '@qlover/corekit-bridge';
 
 export class MessageApi implements MessageGetwayInterface {
@@ -24,11 +25,13 @@ export class MessageApi implements MessageGetwayInterface {
 
    * @override
       */
-  public async sendMessage<M extends MessageStoreMsg<string>>(
+  public async sendMessage<M extends MessageInterface<unknown>>(
     message: M,
     options?: GatewayOptions<M>
-  ): Promise<M> {
-    const messageContent = message.content ?? '';
+  ): Promise<unknown | M> {
+    // Type assertion: we expect MessageStoreMsg<string> in this implementation
+    const storeMessage = message as unknown as MessageStoreMsg<string>;
+    const messageContent = storeMessage.content ?? '';
 
     // Check if error simulation is needed
     if (messageContent.includes('Failed') || messageContent.includes('error')) {
@@ -40,13 +43,19 @@ export class MessageApi implements MessageGetwayInterface {
     // Determine which mode to use
     if (options?.stream === true) {
       // Streaming mode: progressive output
-      return this.sendStreamMode(message, options);
+      return this.sendStreamMode(
+        storeMessage,
+        options as GatewayOptions<MessageStoreMsg<string>>
+      ) as Promise<unknown | M>;
     } else if (options) {
       // Interruptible normal mode: one-time return, but supports stop
-      return this.sendInterruptibleMode(message, options);
+      return this.sendInterruptibleMode(
+        storeMessage,
+        options as GatewayOptions<MessageStoreMsg<string>>
+      ) as Promise<unknown | M>;
     } else {
       // Fast normal mode: non-interruptible
-      return this.sendNormalMode(message);
+      return this.sendNormalMode(storeMessage) as Promise<unknown | M>;
     }
   }