@qlover/create-app 0.4.4 → 0.4.6

package/{templates/react-app/src/pages/base → dist/templates/react-app/src/uikit}/components/BaseHeader.tsx

@@ -3,8 +3,13 @@ import LocaleLink from '@/uikit/components/LocaleLink';
 import LanguageSwitcher from '@/uikit/components/LanguageSwitcher';
 import { PublicAssetsPath } from '@/base/cases/PublicAssetsPath';
 import { IOC } from '@/core/IOC';
+import LogoutButton from './LogoutButton';
 
-export default function BaseHeader() {
+export default function BaseHeader({
+  showLogoutButton
+}: {
+  showLogoutButton?: boolean;
+}) {
   return (
     <header 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">
@@ -26,6 +31,8 @@ export default function BaseHeader() {
         <div className="flex items-center gap-4">
           <LanguageSwitcher />
           <ThemeSwitcher />
+
+          {showLogoutButton && <LogoutButton />}
         </div>
       </div>
     </header>

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

@@ -0,0 +1,32 @@
+import { UserService } from '@/base/services/UserService';
+import { IOC } from '@/core/IOC';
+import {
+  AUTH_LOGOUT_DIALOG_CONTENT,
+  AUTH_LOGOUT_DIALOG_TITLE
+} from '@config/Identifier/common';
+import { Button } from 'antd';
+import { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+
+export default function LogoutButton() {
+  const { t } = useTranslation();
+
+  const tTitle = t(AUTH_LOGOUT_DIALOG_TITLE);
+  const tContent = t(AUTH_LOGOUT_DIALOG_CONTENT);
+
+  const onClick = useCallback(() => {
+    IOC('DialogHandler').confirm({
+      title: tTitle,
+      content: tContent,
+      onOk: () => {
+        IOC(UserService).logout();
+      }
+    });
+  }, [tTitle, tContent]);
+
+  return (
+    <Button danger onClick={onClick}>
+      {tTitle}
+    </Button>
+  );
+}

package/{templates → dist/templates}/react-app/src/uikit/components/ThemeSwitcher.tsx

@@ -1,5 +1,5 @@
 import { IOC } from '@/core/IOC';
-import { ThemeService, ThemeServiceState } from '@qlover/corekit-bridge';
+import { ThemeService } from '@qlover/corekit-bridge';
 import { useStore } from '@/uikit/hooks/useStore';
 import { useTranslation } from 'react-i18next';
 import { Select } from 'antd';
@@ -11,8 +11,7 @@ import {
 } from '@ant-design/icons';
 import clsx from 'clsx';
 import { useMemo } from 'react';
-import * as i18nKeys from '@config/Identifier/I18n';
-import { StoreInterface } from '@/base/port/StoreInterface';
+import * as i18nKeys from '@config/Identifier/common';
 
 const colorMap: Record<
   string,
@@ -37,9 +36,9 @@ const colorMap: Record<
 
 export default function ThemeSwitcher() {
   const themeService = IOC(ThemeService);
-  const { theme } = useStore(
-    themeService as unknown as StoreInterface<ThemeServiceState>
-  );
+  // FIXME:
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const { theme } = useStore(themeService as any);
   const themes = themeService.getSupportedThemes();
   const { t } = useTranslation('common');
 

package/{templates → dist/templates}/react-app/src/uikit/contexts/BaseRouteContext.ts

@@ -5,7 +5,7 @@ import { RouteMeta } from '@/base/types/Page';
 import { createContext } from 'react';
 import merge from 'lodash/merge';
 import i18nConfig from '@config/i18n';
-import { WITHIN_PAGE_PROVIDER } from '@config/Identifier/Error';
+import { WITHIN_PAGE_PROVIDER } from '@config/Identifier/error';
 
 const { defaultNS } = i18nConfig;
 

package/{templates → dist/templates}/react-app/src/uikit/controllers/ExecutorController.ts

@@ -8,8 +8,8 @@ import {
 import { inject, injectable } from 'inversify';
 import {
   StoreInterface,
-  StoreStateInterface
-} from '@/base/port/StoreInterface';
+  type StoreStateInterface
+} from '@qlover/corekit-bridge';
 
 class ExecutorControllerState implements StoreStateInterface {
   helloState = {

package/{templates → dist/templates}/react-app/src/uikit/controllers/JSONStorageController.ts

@@ -1,8 +1,8 @@
 import { JSONStorage } from '@qlover/fe-corekit';
 import {
   StoreInterface,
-  StoreStateInterface
-} from '@/base/port/StoreInterface';
+  type StoreStateInterface
+} from '@qlover/corekit-bridge';
 import { random } from 'lodash';
 
 interface JSONStoragePageState extends StoreStateInterface {

package/{templates → dist/templates}/react-app/src/uikit/controllers/RequestController.ts

@@ -3,7 +3,7 @@ import { FeApi } from '@/base/apis/feApi/FeApi';
 import { logger } from '@/core/globals';
 import { UserApi } from '@/base/apis/userApi/UserApi';
 import { aiHello } from '@/base/apis/AiApi';
-import { StoreInterface } from '@/base/port/StoreInterface';
+import { StoreInterface } from '@qlover/corekit-bridge';
 
 function createDefaultState() {
   return {

package/{templates/react-app/src/uikit/hooks/useLanguageGuard.ts → dist/templates/react-app/src/uikit/hooks/useI18nGuard.ts}

@@ -10,7 +10,7 @@ import { useParams } from 'react-router-dom';
  *
  * TODO: if language not found, use default language
  */
-export function useLanguageGuard() {
+export function useI18nGuard() {
   const { lng } = useParams<{ lng: I18nServiceLocale }>();
   const navigate = useNavigate();
 

package/{templates → dist/templates}/react-app/src/uikit/hooks/useStore.ts

@@ -1,7 +1,7 @@
 import {
   StoreInterface,
-  StoreStateInterface
-} from '@/base/port/StoreInterface';
+  type StoreStateInterface
+} from '@qlover/corekit-bridge';
 import { useSliceStore } from '@qlover/slice-store-react';
 
 export function useStore<

package/dist/templates/react-app/src/uikit/hooks/userRouterService.ts

@@ -0,0 +1,12 @@
+import { RouteService } from '@/base/services/RouteService';
+import { IOC } from '@/core/IOC';
+import { useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+
+export function useRouterService() {
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    IOC(RouteService).setDependencies({ navigate });
+  }, [navigate]);
+}

package/{templates → dist/templates}/react-app/src/uikit/providers/BaseRouteProvider.tsx

@@ -7,6 +7,7 @@ import { useTranslation } from 'react-i18next';
 
 export default function BaseRouteProvider(props: PropsWithChildren<RouteMeta>) {
   const { t } = useTranslation();
+
   useDocumentTitle(props.title ? t(props.title) : IOC('AppConfig').appName);
 
   return (

package/dist/templates/react-app/src/uikit/providers/ProcessExecutorProvider.tsx

@@ -0,0 +1,24 @@
+import { UserAuthProvider } from './UserAuthProvider';
+import { useStrictEffect } from '../hooks/useStrictEffect';
+import { IOC } from '@/core/IOC';
+import { ProcesserExecutor } from '@/base/services/ProcesserExecutor';
+import { useI18nGuard } from '../hooks/useI18nGuard';
+import { useRouterService } from '../hooks/userRouterService';
+
+export function ProcessExecutorProvider({
+  children
+}: {
+  children: React.ReactNode;
+}) {
+  const processerExecutor = IOC(ProcesserExecutor);
+
+  useI18nGuard();
+
+  useRouterService();
+
+  useStrictEffect(() => {
+    processerExecutor.starup();
+  }, []);
+
+  return <UserAuthProvider>{children}</UserAuthProvider>;
+}

package/dist/templates/react-app/src/uikit/providers/UserAuthProvider.tsx

@@ -0,0 +1,16 @@
+import { IOC } from '@/core/IOC';
+import { Loading } from '../components/Loading';
+import { UserService } from '@/base/services/UserService';
+import { useStore } from '../hooks/useStore';
+
+export function UserAuthProvider({ children }: { children: React.ReactNode }) {
+  const userService = IOC(UserService);
+
+  useStore(userService);
+
+  if (!userService.isAuthenticated()) {
+    return <Loading fullscreen />;
+  }
+
+  return children;
+}

package/{templates → dist/templates}/react-app/vite.config.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { defineConfig } from 'vitest/config';
 import react from '@vitejs/plugin-react';
 import {
@@ -111,14 +112,13 @@ export default defineConfig({
       overriedCssFilePath: './src/styles/css/antd-themes/no-context.css',
       targetPath: './src/base/types/deprecated-antd.d.ts'
     })
-  ],
+  ] as any[],
   base: routerPrefix,
   envPrefix: envPrefix,
   publicDir: 'public',
   server: {
     port: Number(process.env.VITE_SERVER_PORT || 3200)
   },
-  mode: process.env.NODE_ENV,
   test: {
     environment: 'jsdom',
     globals: true,

package/package.json

@@ -1,13 +1,11 @@
 {
   "name": "@qlover/create-app",
-  "version": "0.4.4",
+  "version": "0.4.6",
   "description": "Create a new app with a single command",
   "private": false,
   "type": "module",
   "files": [
     "dist",
-    "configs",
-    "templates",
     "package.json",
     "README.md",
     "CHANGELOG.md"
@@ -32,14 +30,14 @@
     "access": "public"
   },
   "devDependencies": {
-    "lodash": "^4.17.21",
     "ignore": "^7.0.3",
+    "lodash": "^4.17.21",
+    "ora": "^8.1.1",
     "@qlover/logger": "0.1.1"
   },
   "dependencies": {
-    "ora": "^8.1.1",
-    "inquirer": "^12.3.2",
     "commander": "^13.1.0",
+    "inquirer": "^12.3.2",
     "@qlover/scripts-context": "0.2.1"
   },
   "scripts": {