@qlover/create-app 1.0.2 → 2.0.0

package/dist/templates/react-app/src/styles/css/antd-themes/table/_default.css

@@ -1,44 +0,0 @@
-/* custom variables - for antd and custom css */
-html,
-.fe-theme {
-  /* Antd Table 组件变量 */
-  .ant-table-css-var {
-    --fe-table-header-bg: rgb(var(--color-bg-elevated));
-    --fe-table-header-color: rgb(var(--text-primary));
-    --fe-table-header-sort-active-bg: rgb(var(--color-bg-secondary));
-    --fe-table-header-sort-hover-bg: rgb(var(--color-bg-secondary));
-    --fe-table-body-sort-bg: rgb(var(--color-bg-elevated));
-    --fe-table-row-hover-bg: rgb(var(--color-bg-secondary));
-    --fe-table-row-selected-bg: rgba(var(--color-brand), 0.1);
-    --fe-table-row-selected-hover-bg: rgba(var(--color-brand-hover), 0.2);
-    --fe-table-row-expanded-bg: rgba(var(--text-primary), 0.02);
-    --fe-table-cell-padding-block: 16px;
-    --fe-table-cell-padding-inline: 16px;
-    --fe-table-cell-padding-block-md: 12px;
-    --fe-table-cell-padding-inline-md: 8px;
-    --fe-table-cell-padding-block-sm: 8px;
-    --fe-table-cell-padding-inline-sm: 8px;
-    --fe-table-border-color: rgb(var(--color-border));
-    --fe-table-header-border-radius: 8px;
-    --fe-table-footer-bg: rgb(var(--color-bg-elevated));
-    --fe-table-footer-color: rgb(var(--text-primary));
-    --fe-table-cell-font-size: 14px;
-    --fe-table-cell-font-size-md: 14px;
-    --fe-table-cell-font-size-sm: 14px;
-    --fe-table-header-split-color: rgb(var(--color-border));
-    --fe-table-fixed-header-sort-active-bg: rgb(var(--color-bg-secondary));
-    --fe-table-header-filter-hover-bg: rgba(var(--text-primary), 0.06);
-    --fe-table-filter-dropdown-menu-bg: rgb(var(--color-bg-base));
-    --fe-table-filter-dropdown-bg: rgb(var(--color-bg-base));
-    --fe-table-expand-icon-bg: rgb(var(--color-bg-base));
-    --fe-table-selection-column-width: 32px;
-    --fe-table-sticky-scroll-bar-bg: rgba(var(--text-primary), 0.25);
-    --fe-table-sticky-scroll-bar-border-radius: 100px;
-    --fe-table-expand-icon-margin-top: 2.5px;
-    --fe-table-header-icon-color: rgb(var(--text-tertiary));
-    --fe-table-header-icon-hover-color: rgb(var(--text-secondary));
-    --fe-table-expand-icon-half-inner: 7px;
-    --fe-table-expand-icon-size: 17px;
-    --fe-table-expand-icon-scale: 0.9411764705882353;
-  }
-}

package/dist/templates/react-app/src/styles/css/antd-themes/table/dark.css

@@ -1,43 +0,0 @@
-[data-theme='dark'],
-[data-theme='dark'] .fe-theme {
-  /* Antd Table 组件变量 */
-  .ant-table-css-var {
-    --fe-table-header-bg: rgb(var(--color-bg-secondary));
-    --fe-table-header-color: rgb(var(--text-primary));
-    --fe-table-header-sort-active-bg: rgb(var(--color-bg-elevated));
-    --fe-table-header-sort-hover-bg: rgb(var(--color-bg-elevated));
-    --fe-table-body-sort-bg: rgb(var(--color-bg-secondary));
-    --fe-table-row-hover-bg: rgb(var(--color-bg-elevated));
-    --fe-table-row-selected-bg: rgba(var(--color-brand), 0.2);
-    --fe-table-row-selected-hover-bg: rgba(var(--color-brand-hover), 0.3);
-    --fe-table-row-expanded-bg: rgba(var(--text-primary), 0.02);
-    --fe-table-cell-padding-block: 16px;
-    --fe-table-cell-padding-inline: 16px;
-    --fe-table-cell-padding-block-md: 12px;
-    --fe-table-cell-padding-inline-md: 8px;
-    --fe-table-cell-padding-block-sm: 8px;
-    --fe-table-cell-padding-inline-sm: 8px;
-    --fe-table-border-color: rgb(var(--color-border));
-    --fe-table-header-border-radius: 8px;
-    --fe-table-footer-bg: rgb(var(--color-bg-secondary));
-    --fe-table-footer-color: rgb(var(--text-primary));
-    --fe-table-cell-font-size: 14px;
-    --fe-table-cell-font-size-md: 14px;
-    --fe-table-cell-font-size-sm: 14px;
-    --fe-table-header-split-color: rgb(var(--color-border));
-    --fe-table-fixed-header-sort-active-bg: rgb(var(--color-bg-elevated));
-    --fe-table-header-filter-hover-bg: rgba(var(--text-primary), 0.06);
-    --fe-table-filter-dropdown-menu-bg: rgb(var(--color-bg-base));
-    --fe-table-filter-dropdown-bg: rgb(var(--color-bg-base));
-    --fe-table-expand-icon-bg: rgb(var(--color-bg-base));
-    --fe-table-selection-column-width: 32px;
-    --fe-table-sticky-scroll-bar-bg: rgba(var(--text-primary), 0.25);
-    --fe-table-sticky-scroll-bar-border-radius: 100px;
-    --fe-table-expand-icon-margin-top: 2.5px;
-    --fe-table-header-icon-color: rgb(var(--text-tertiary));
-    --fe-table-header-icon-hover-color: rgb(var(--text-secondary));
-    --fe-table-expand-icon-half-inner: 7px;
-    --fe-table-expand-icon-size: 17px;
-    --fe-table-expand-icon-scale: 0.9411764705882353;
-  }
-}

package/dist/templates/react-app/src/styles/css/antd-themes/table/index.css

@@ -1,3 +0,0 @@
-@import './_default.css';
-@import './dark.css';
-@import './pink.css';

package/dist/templates/react-app/src/styles/css/antd-themes/table/pink.css

@@ -1,43 +0,0 @@
-[data-theme='pink'],
-[data-theme='pink'] .fe-theme {
-  /* Antd Table 组件变量 */
-  .ant-table-css-var {
-    --fe-table-header-bg: var(--ant-color-bg-container);
-    --fe-table-header-color: var(--ant-color-text);
-    --fe-table-header-sort-active-bg: var(--ant-color-bg-elevated);
-    --fe-table-header-sort-hover-bg: var(--ant-color-bg-elevated);
-    --fe-table-body-sort-bg: var(--ant-color-bg-container);
-    --fe-table-row-hover-bg: var(--ant-color-bg-elevated);
-    --fe-table-row-selected-bg: var(--fe-color-primary-bg);
-    --fe-table-row-selected-hover-bg: rgba(var(--fe-color-primary-hover), 0.2);
-    --fe-table-row-expanded-bg: rgba(var(--ant-color-text), 0.02);
-    --fe-table-cell-padding-block: 16px;
-    --fe-table-cell-padding-inline: 16px;
-    --fe-table-cell-padding-block-md: 12px;
-    --fe-table-cell-padding-inline-md: 8px;
-    --fe-table-cell-padding-block-sm: 8px;
-    --fe-table-cell-padding-inline-sm: 8px;
-    --fe-table-border-color: var(--ant-color-border);
-    --fe-table-header-border-radius: 8px;
-    --fe-table-footer-bg: var(--ant-color-bg-container);
-    --fe-table-footer-color: var(--ant-color-text);
-    --fe-table-cell-font-size: 14px;
-    --fe-table-cell-font-size-md: 14px;
-    --fe-table-cell-font-size-sm: 14px;
-    --fe-table-header-split-color: var(--ant-color-border);
-    --fe-table-fixed-header-sort-active-bg: var(--ant-color-bg-elevated);
-    --fe-table-header-filter-hover-bg: rgba(var(--ant-color-text), 0.06);
-    --fe-table-filter-dropdown-menu-bg: var(--ant-color-bg-container);
-    --fe-table-filter-dropdown-bg: var(--ant-color-bg-container);
-    --fe-table-expand-icon-bg: var(--ant-color-bg-container);
-    --fe-table-selection-column-width: 32px;
-    --fe-table-sticky-scroll-bar-bg: rgba(var(--ant-color-text), 0.25);
-    --fe-table-sticky-scroll-bar-border-radius: 100px;
-    --fe-table-expand-icon-margin-top: 2.5px;
-    --fe-table-header-icon-color: var(--fe-color-icon);
-    --fe-table-header-icon-hover-color: var(--fe-color-icon-hover);
-    --fe-table-expand-icon-half-inner: 7px;
-    --fe-table-expand-icon-size: 17px;
-    --fe-table-expand-icon-scale: 0.9411764705882353;
-  }
-}

package/dist/templates/react-app/src/styles/css/index.css

@@ -1,6 +0,0 @@
-@import './tailwind.css';
-@import './zIndex.css';
-
-@import './antd-themes/index.css';
-@import './scrollbar.css';
-@import './page.css';

package/dist/templates/react-app/src/styles/css/page.css

@@ -1,20 +0,0 @@
-/**
- * This file is used to define the page styles for the app.
- * 
- * @example --color-primary
- * ```tsx
- * <div className="bg-primary text-primary border-text-tertiary"></div>
- * ```
- */
-@theme {
-  --color-primary: rgba(var(--color-bg-base));
-  --color-secondary: rgba(var(--color-bg-secondary));
-  --color-elevated: rgba(var(--color-bg-elevated));
-  --color-text: rgba(var(--text-primary));
-  --color-text-hover: rgba(var(--text-primary-hover));
-  --color-text-secondary: rgba(var(--text-secondary));
-  --color-text-tertiary: rgba(var(--text-tertiary));
-  --color-c-border: rgba(var(--color-border));
-  --color-c-brand: rgba(var(--color-brand));
-  --color-c-brand-hover: rgba(var(--color-brand-hover));
-}

package/dist/templates/react-app/src/styles/css/scrollbar.css

@@ -1,34 +0,0 @@
-html,
-.fe-theme {
-  --scrollbar-track-color: var(--color-secondary);
-  --scrollbar-thumb-color: var(--color-text-secondary);
-  --scrollbar-thumb-hover-color: var(--color-brand-hover);
-
-  /* Webkit browsers (Chrome, Safari, Edge) - 全局样式，使用最高优先级 */
-  body *::-webkit-scrollbar,
-  *::-webkit-scrollbar {
-    width: 10px;
-    height: 10px;
-  }
-
-  body *::-webkit-scrollbar-track,
-  *::-webkit-scrollbar-track {
-    background: var(--scrollbar-track-color);
-  }
-
-  body *::-webkit-scrollbar-thumb,
-  *::-webkit-scrollbar-thumb {
-    background-color: var(--scrollbar-thumb-color);
-    border-radius: 6px;
-    border: 1px solid var(--scrollbar-track-color);
-    transition: background-color 0.2s ease;
-  }
-
-  body *::-webkit-scrollbar-thumb:hover {
-    background-color: var(--scrollbar-thumb-hover-color) !important;
-  }
-
-  *::-webkit-scrollbar-thumb:hover {
-    background-color: var(--scrollbar-thumb-hover-color) !important;
-  }
-}

package/dist/templates/react-app/src/styles/css/tailwind.css

@@ -1,5 +0,0 @@
-@layer theme, base, antd, components, utilities;
-
-@import 'tailwindcss';
-
-@import './themes/index.css';

package/dist/templates/react-app/src/styles/css/themes/_default.css

@@ -1,30 +0,0 @@
-/* theme variables - for tailwind */
-@layer base {
-  :root {
-    /* 基础背景色 */
-    --color-bg-base: 255 255 255;
-    --color-bg-secondary: 241 245 249; /* slate-100 */
-    --color-bg-elevated: 248 250 252; /* slate-50 */
-
-    /* 文字颜色 */
-    --text-primary: 15 23 42; /* slate-900 */
-    --text-primary-hover: 100 116 139; /* slate-500 */
-    --text-secondary: 71 85 105; /* slate-600 */
-    --text-tertiary: 100 116 139; /* slate-500 */
-
-    /* 边框颜色 */
-    --color-border: 226 232 240; /* slate-200 */
-
-    /* 品牌色 */
-    --color-brand: 37 99 235; /* blue-600 */
-    --color-brand-hover: 59 130 246; /* blue-500 */
-
-    /* 登录页特定样式 */
-    --login-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
-    --login-input-bg: var(--fe-color-bg-container);
-    --login-input-border: var(--fe-color-border);
-    --login-button-text: rgb(255 255 255);
-    --login-social-button-bg: var(--fe-color-bg-container);
-    --login-social-button-border: var(--fe-color-border);
-  }
-}

package/dist/templates/react-app/src/styles/css/themes/dark.css

@@ -1,30 +0,0 @@
-/* theme variables - for tailwind */
-@layer base {
-  [data-theme='dark'] {
-    /* 基础背景色 */
-    --color-bg-base: 15 23 42; /* slate-900 */
-    --color-bg-secondary: 30 41 59; /* slate-800 */
-    --color-bg-elevated: 51 65 85; /* slate-700 */
-
-    /* 文字颜色 */
-    --text-primary: 255 255 255;
-    --text-primary-hover: 148 163 184; /* slate-400 */
-    --text-secondary: 148 163 184; /* slate-400 */
-    --text-tertiary: 100 116 139; /* slate-500 */
-
-    /* 边框颜色 */
-    --color-border: 51 65 85; /* slate-700 */
-
-    /* 品牌色 */
-    --color-brand: 37 99 235; /* blue-600 */
-    --color-brand-hover: 59 130 246; /* blue-500 */
-
-    /* 登录页特定样式 */
-    --login-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
-    --login-input-bg: var(--fe-color-bg-container);
-    --login-input-border: var(--fe-color-border);
-    --login-button-text: rgb(255 255 255);
-    --login-social-button-bg: var(--fe-color-bg-container);
-    --login-social-button-border: var(--fe-color-border);
-  }
-}

package/dist/templates/react-app/src/styles/css/themes/index.css

@@ -1,3 +0,0 @@
-@import './_default.css';
-@import './dark.css';
-@import './pink.css';

package/dist/templates/react-app/src/styles/css/themes/pink.css

@@ -1,30 +0,0 @@
-/* theme variables - for tailwind */
-@layer base {
-  [data-theme='pink'] {
-    /* 基础背景色 */
-    --color-bg-base: 255 241 242; /* rose-50 */
-    --color-bg-secondary: 255 228 230; /* rose-100 */
-    --color-bg-elevated: 254 205 211; /* rose-200 */
-
-    /* 文字颜色 */
-    --text-primary: 190 18 60; /* rose-700 */
-    --text-primary-hover: 244 63 94; /* rose-500 */
-    --text-secondary: 225 29 72; /* rose-600 */
-    --text-tertiary: 244 63 94; /* rose-500 */
-
-    /* 边框颜色 */
-    --color-border: 254 205 211; /* rose-200 */
-
-    /* 品牌色 */
-    --color-brand: 225 29 72; /* rose-600 */
-    --color-brand-hover: 244 63 94; /* rose-500 */
-
-    /* 登录页特定样式 */
-    --login-card-shadow: 0 4px 12px rgba(244 63 94 / 0.15);
-    --login-input-bg: var(--ant-color-bg-container);
-    --login-input-border: var(--ant-color-border);
-    --login-button-text: rgb(255 255 255);
-    --login-social-button-bg: var(--ant-color-bg-container);
-    --login-social-button-border: var(--ant-color-border);
-  }
-}

package/dist/templates/react-app/src/styles/css/zIndex.css

@@ -1,9 +0,0 @@
-/**
- * This file is used to define the z-index values for the app.
- */
-:root {
-  /* antd select popup zindex */
-  --zi-select: 1050;
-  /* antd message zindex */
-  --zi-message: 2010;
-}

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

@@ -1,72 +0,0 @@
-import { RequestState } from '@qlover/corekit-bridge';
-import { inject, injectable } from 'inversify';
-import cloneDeep from 'lodash/cloneDeep';
-import { FeApi } from '@/base/apis/feApi/FeApi';
-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: LifecyclePluginInterface<
-  ExecutorContextInterface<RequestAdapterFetchConfig, unknown>
-> = {
-  pluginName: 'test',
-  async onSuccess({ parameters, returnValue }) {
-    if (
-      parameters.responseType === 'text' &&
-      (returnValue as RequestAdapterResponse).data instanceof Response
-    ) {
-      (returnValue as RequestAdapterResponse<unknown, string>).data = await (
-        returnValue as RequestAdapterResponse<unknown, Response>
-      ).data.text();
-    }
-  }
-};
-
-@injectable()
-export class ExecutorPageBridge extends ExecutorPageBridgeInterface {
-  constructor(@inject(FeApi) protected feApi: FeApi) {
-    super(() => new ExecutorPageBridgeState());
-
-    // FIXME: not cloneDeep, create a new instance
-    this.feApi = cloneDeep(feApi);
-
-    this.feApi.use({
-      pluginName: 'test',
-      onSuccess: TestPlugin.onSuccess
-    });
-  }
-
-  public override onTestPlugins = async () => {
-    this.emit({
-      ...this.state,
-      helloState: new RequestState(true)
-    });
-
-    try {
-      const res = await this.feApi.get('/api/v1/executor/test', {
-        responseType: 'text'
-      });
-
-      this.emit({
-        ...this.state,
-        helloState: new RequestState(false, res).end()
-      });
-    } catch (error) {
-      this.emit({
-        ...this.state,
-        helloState: new RequestState(false, null, error).end()
-      });
-    }
-  };
-}

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

@@ -1,41 +0,0 @@
-import { IOCIdentifier } from '@config/IOCIdentifier';
-import { inject, injectable } from 'inversify';
-import random from 'lodash/random';
-import { JSONStoragePageBridgeInterface } from '@/base/port/JSONStoragePageBridgeInterface';
-import type { SyncStorageInterface } from '@qlover/fe-corekit';
-
-@injectable()
-export class JSONStoragePageBridge extends JSONStoragePageBridgeInterface {
-  constructor(
-    @inject(IOCIdentifier.LocalStorage)
-    protected storage: SyncStorageInterface<string, unknown>
-  ) {
-    super(() => ({
-      testKey1: storage.getItem('testKey1') ?? 0,
-      testKey2: storage.getItem('testKey2') ?? 0,
-      expireTime: 5000,
-      requestTimeout: storage.getItem('requestTimeout') ?? 5000
-    }));
-  }
-
-  public override changeRandomTestKey1 = (): void => {
-    const value = random(100, 9000);
-    this.storage.setItem('testKey1', value);
-    this.emit({ ...this.state, testKey1: value });
-  };
-
-  public override onChangeRandomTestKey2 = (): void => {
-    const value = random(100, 9000);
-    this.storage.setItem('testKey2', value, Date.now() + this.state.expireTime);
-    this.emit({ ...this.state, testKey2: value });
-  };
-
-  public override changeExpireTime = (expireTime: number): void => {
-    this.emit({ ...this.state, expireTime });
-  };
-
-  public override changeRequestTimeout = (requestTimeout: number): void => {
-    this.storage.setItem('requestTimeout', requestTimeout);
-    this.emit({ ...this.state, requestTimeout });
-  };
-}

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

@@ -1,22 +0,0 @@
-import { UIBridgeInterface } from '@qlover/corekit-bridge';
-import { injectable } from 'inversify';
-import { NavigateFunction } from 'react-router-dom';
-
-@injectable()
-export class NavigateBridge implements UIBridgeInterface<NavigateFunction> {
-  protected navigate: NavigateFunction | null = null;
-
-  /**
-   * @override
-   */
-  public setUIBridge(ui: NavigateFunction): void {
-    this.navigate = ui;
-  }
-
-  /**
-   * @override
-   */
-  public getUIBridge(): NavigateFunction | null {
-    return this.navigate;
-  }
-}

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

@@ -1,136 +0,0 @@
-import { IOCIdentifier } from '@config/IOCIdentifier';
-import { RequestState } from '@qlover/corekit-bridge';
-import { inject, injectable } from 'inversify';
-import { aiHello } from '@/base/apis/AiApi';
-import { FeApi } from '@/base/apis/feApi/FeApi';
-import { UserApi } from '@/base/apis/userApi/UserApi';
-import {
-  RequestPageBridgeInterface,
-  RequestPageStateInterface
-} from '@/base/port/RequestPageBridgeInterface';
-import type { LoggerInterface } from '@qlover/logger';
-
-function createDefaultState(): RequestPageStateInterface {
-  return {
-    helloState: new RequestState(),
-    ipInfoState: new RequestState(),
-    randomUserState: new RequestState(),
-    abortState: new RequestState(),
-    apiCatchResultState: new RequestState()
-  };
-}
-
-export type RequestControllerState = ReturnType<typeof createDefaultState>;
-
-@injectable()
-export class RequestPageBridge extends RequestPageBridgeInterface {
-  constructor(
-    @inject(FeApi) protected feApi: FeApi,
-    @inject(UserApi) protected userApi: UserApi,
-    @inject(IOCIdentifier.Logger) protected logger: LoggerInterface
-  ) {
-    super(createDefaultState);
-  }
-
-  public override onHello = async () => {
-    if (this.state.helloState.loading) {
-      return;
-    }
-
-    this.emitState({ helloState: new RequestState(true) });
-
-    try {
-      const result = await aiHello({
-        messages: [{ role: 'user', content: 'Hello, world!' }]
-      });
-      this.emitState({ helloState: new RequestState(false, result).end() });
-    } catch (error) {
-      this.logger.error(error);
-      this.emitState({
-        helloState: new RequestState(false, null, error).end()
-      });
-    }
-  };
-
-  public override onIpInfo = async () => {
-    if (this.state.ipInfoState.loading) {
-      return;
-    }
-
-    this.emitState({ ipInfoState: new RequestState(true) });
-
-    try {
-      const result = await this.feApi.getIpInfo();
-      this.emitState({ ipInfoState: new RequestState(false, result).end() });
-    } catch (error) {
-      this.logger.error(error);
-      this.emitState({
-        ipInfoState: new RequestState(false, null, error).end()
-      });
-    }
-  };
-
-  public override onRandomUser = async () => {
-    if (this.state.randomUserState.loading) {
-      return;
-    }
-
-    this.emitState({ randomUserState: new RequestState(true) });
-    try {
-      const result = await this.userApi.getRandomUser();
-      this.emitState({
-        randomUserState: new RequestState(false, result).end()
-      });
-    } catch (error) {
-      this.logger.error(error);
-      this.emitState({
-        randomUserState: new RequestState(false, null, error).end()
-      });
-    }
-  };
-
-  public override onTriggerApiCatchResult = async () => {
-    if (this.state.apiCatchResultState.loading) {
-      return;
-    }
-
-    this.emitState({ apiCatchResultState: new RequestState(true) });
-    try {
-      const result = await this.userApi.testApiCatchResult();
-      this.emitState({
-        apiCatchResultState: new RequestState(false, result).end()
-      });
-    } catch (error) {
-      this.emitState({
-        apiCatchResultState: new RequestState(false, null, error).end()
-      });
-    }
-  };
-
-  public override onTriggerAbortRequest = async () => {
-    if (this.state.abortState.loading) {
-      this.stopAbortRequest();
-      return;
-    }
-
-    this.emitState({ abortState: new RequestState(true) });
-    try {
-      await this.userApi.request({
-        method: 'GET',
-        url: 'https://api.example.com/users',
-        disabledMock: true,
-        requestId: 'onTriggerAbortRequest'
-      });
-    } catch (error) {
-      this.emitState({
-        abortState: new RequestState(false, null, error).end()
-      });
-    }
-  };
-
-  public override stopAbortRequest = async () => {
-    this.userApi.stop({
-      requestId: 'onTriggerAbortRequest'
-    });
-  };
-}

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

@@ -1,35 +0,0 @@
-import { useStore } from '@brain-toolkit/react-kit';
-import { routerPrefix } from '@config/common';
-import { I } from '@config/IOCIdentifier';
-import { useMemo } from 'react';
-import { createBrowserRouter, RouterProvider } from 'react-router-dom';
-import type { ComponentValue } from '@/base/cases/RouterLoader';
-import { RouterLoader } from '@/base/cases/RouterLoader';
-import { RouterRenderComponent } from './RouterRenderComponent';
-import { useIOC } from '../hooks/useIOC';
-
-export function AppRouterProvider(props: { pages: ComponentValue }) {
-  const { pages } = props;
-
-  const routerService = useIOC(I.RouteServiceInterface);
-  const logger = useIOC(I.Logger);
-  const routes = useStore(routerService, (state) => state.routes);
-
-  const routerLoader = useMemo(() => {
-    return new RouterLoader({
-      componentMaps: pages,
-      render: RouterRenderComponent,
-      logger: logger
-    });
-  }, []);
-
-  const routerBase = useMemo(() => {
-    const routeList = routes.map((route) => routerLoader.toRoute(route));
-    const router = createBrowserRouter(routeList, {
-      basename: routerPrefix
-    });
-    return router;
-  }, [routes]);
-
-  return <RouterProvider router={routerBase} />;
-}

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

@@ -1,51 +0,0 @@
-import { IOCIdentifier } from '@config/IOCIdentifier';
-import { PublicAssetsPath } from '@/base/cases/PublicAssetsPath';
-import { LanguageSwitcher } from '@/uikit/components/LanguageSwitcher';
-import { LocaleLink } from '@/uikit/components/LocaleLink';
-import { ThemeSwitcher } from '@/uikit/components/ThemeSwitcher';
-import { LogoutButton } from './LogoutButton';
-import { useIOC } from '../hooks/useIOC';
-
-export function BaseHeader({
-  showLogoutButton
-}: {
-  showLogoutButton?: boolean;
-}) {
-  const AppConfig = useIOC(IOCIdentifier.AppConfig);
-  const publicAssetsPath = useIOC(PublicAssetsPath);
-
-  return (
-    <header
-      data-testid="BaseHeader"
-      className="h-14 bg-secondary border-b border-border sticky top-0 z-50"
-    >
-      <div className="flex items-center justify-between h-full px-4 mx-auto max-w-7xl">
-        <div className="flex items-center">
-          <LocaleLink
-            href="/"
-            className="flex items-center hover:opacity-80 transition-opacity"
-          >
-            <img
-              data-testid="BaseHeader-logo"
-              src={publicAssetsPath.getPath('/logo.svg')}
-              alt="logo"
-              className="h-8 w-auto"
-            />
-            <span
-              data-testid="BaseHeader-app-name"
-              className="ml-2 text-lg font-semibold text-text"
-            >
-              {AppConfig.appName}
-            </span>
-          </LocaleLink>
-        </div>
-        <div className="flex items-center gap-4">
-          <LanguageSwitcher />
-          <ThemeSwitcher />
-
-          {showLogoutButton && <LogoutButton />}
-        </div>
-      </div>
-    </header>
-  );
-}