@qlover/create-app 0.7.7 → 0.7.9

package/dist/templates/next-app/src/app/[locale]/page.tsx

@@ -1,106 +1,111 @@
-import Image from 'next/image';
+import { Button } from 'antd';
+import { i18nConfig } from '@config/i18n';
+import { homeI18n } from '@config/i18n/HomeI18n ';
+import { PageParams, type PageParamsType } from '@/base/cases/PageParams';
+import { ServerAuth } from '@/base/cases/ServerAuth';
+import type { PageParamsProps } from '@/base/types/PageProps';
+import { BootstrapServer } from '@/core/bootstraps/BootstrapServer';
+import { redirect } from '@/i18n/routing';
+import { BaseLayout } from '@/uikit/components/BaseLayout';
+import type { Metadata } from 'next';
+
+// const navigationItems = [
+//   {
+//     href: '/identifier',
+//     titleKey: 'HOME_IDENTIFIER',
+//     descriptionKey: 'HOME_IDENTIFIER_DESCRIPTION'
+//   }
+// ];
+
+// Generate static params for all supported locales (used for SSG)
+export async function generateStaticParams() {
+  // Return one entry for each supported locale
+  return i18nConfig.supportedLngs.map((locale) => ({ locale }));
+}
+
+// Allow Next.js to statically generate this page if possible (default behavior)
+export const dynamic = 'auto'; // Enable static generation when possible, fallback to dynamic if needed
+
+// Optional: Use revalidate if you want ISR (Incremental Static Regeneration)
+// export const revalidate = 3600; // Rebuild every hour (optional)
+
+// Generate localized SEO metadata per locale (Next.js 15+ best practice)
+export async function generateMetadata({
+  params
+}: {
+  params: Promise<PageParamsType>;
+}): Promise<Metadata> {
+  const pageParams = new PageParams(await params);
+  return await pageParams.getI18nInterface(homeI18n);
+}
+
+export default async function Home({ params }: PageParamsProps) {
+  const server = new BootstrapServer();
+  const pageParams = new PageParams(await params!);
+  const locale = pageParams.getLocale();
+  const tt = await pageParams.getI18nInterface(homeI18n);
+
+  if (!(await new ServerAuth(server).hasAuth())) {
+    return redirect({ href: '/login', locale });
+  }
 
-export default async function Home() {
   return (
-    <div
-      data-testid="Home"
-      className="font-sans grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20"
-    >
-      <main className="flex flex-col gap-[32px] row-start-2 items-center sm:items-start">
-        <Image
-          className="dark:invert"
-          src="/next.svg"
-          alt="Next.js logo"
-          width={180}
-          height={38}
-          priority
-        />
-        <ol className="font-mono list-inside list-decimal text-sm/6 text-center sm:text-left">
-          <li className="mb-2 tracking-[-.01em]">
-            Get started by editing{' '}
-            <code className="bg-black/[.05] dark:bg-white/[.06] font-mono font-semibold px-1 py-0.5 rounded">
-              src/app/page.tsx
-            </code>
-            .
-          </li>
-          <li className="tracking-[-.01em]">
-            Save and see your changes instantly.
-          </li>
-        </ol>
+    <BaseLayout data-testid="HomePage">
+      {/* Hero Section */}
+      <section className="py-16 px-4">
+        <div className="max-w-4xl mx-auto text-center">
+          <h1 className="text-4xl md:text-5xl font-bold mb-6 text-text">
+            {tt.welcome}
+          </h1>
+          <p className="text-xl text-text-secondary mb-8">{tt.description}</p>
+        </div>
+      </section>
+
+      {/* Navigation Grid */}
+      <section className="max-w-6xl mx-auto px-4 py-12">
+        <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
+          {/* {navigationItems.map((item) => (
+            <LocaleLink
+              data-testid={`HomePage-navigation-${item.href}`}
+              key={item.href}
+              title={item.titleKey}
+              className={clsx(
+              href={item.href}
+                'block rounded-lg p-6',
+                'bg-secondary',
+                'border border-border',
+                'hover:bg-elevated',
+                'transition-colors duration-200'
+              )}
+            >
+              <h3 className={`text-xl font-semibold mb-3 text-text`}>
+                {t(item.titleKey)}
+              </h3>
+              <p className="text-text-secondary mb-4">
+                {t(item.descriptionKey)}
+              </p>
+              <Button type="primary" className="w-full">
+                {t(i18nKeys.HOME_EXPLORE)}
+              </Button>
+            </LocaleLink>
+          ))} */}
+        </div>
+      </section>
 
-        <div className="flex gap-4 items-center flex-col sm:flex-row">
-          <a
-            className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground text-background gap-2 hover:bg-[#383838] dark:hover:bg-[#ccc] font-medium text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 sm:w-auto"
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Image
-              className="dark:invert"
-              src="/vercel.svg"
-              alt="Vercel logomark"
-              width={20}
-              height={20}
-            />
-            Deploy now
-          </a>
-          <a
-            className="rounded-full border border-solid border-black/[.08] dark:border-white/[.145] transition-colors flex items-center justify-center hover:bg-[#f2f2f2] dark:hover:bg-[#1a1a1a] hover:border-transparent font-medium text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 w-full sm:w-auto md:w-[158px]"
-            href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Read our docs
-          </a>
+      {/* Call to Action Section */}
+      <section className="py-16 px-4 bg-elevated">
+        <div className="max-w-4xl mx-auto text-center">
+          <h2 className="text-3xl font-bold mb-4 text-text">
+            {tt.getStartedTitle}
+          </h2>
+          <p className="text-lg text-text-secondary mb-8">
+            {tt.getStartedDescription}
+          </p>
+          <Button type="primary" size="large" className="px-8">
+            {tt.getStartedButton}
+          </Button>
         </div>
-      </main>
-      <footer className="row-start-3 flex gap-[24px] flex-wrap items-center justify-center">
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/file.svg"
-            alt="File icon"
-            width={16}
-            height={16}
-          />
-          Learn
-        </a>
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/window.svg"
-            alt="Window icon"
-            width={16}
-            height={16}
-          />
-          Examples
-        </a>
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://nextjs.org?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/globe.svg"
-            alt="Globe icon"
-            width={16}
-            height={16}
-          />
-          Go to nextjs.org →
-        </a>
-      </footer>
-    </div>
+      </section>
+    </BaseLayout>
   );
 }

package/dist/templates/next-app/src/base/cases/DialogHandler.ts

@@ -0,0 +1,92 @@
+import type {
+  AntdStaticApiInterface,
+  MessageApi,
+  ModalApi,
+  NotificationApi
+} from '@brain-toolkit/antd-theme-override/react';
+import type {
+  UIDialogInterface,
+  NotificationOptions
+} from '@qlover/corekit-bridge';
+import type { ModalFuncProps } from 'antd';
+
+export interface DialogHandlerOptions
+  extends NotificationOptions,
+    ModalFuncProps {
+  content: string;
+}
+
+/**
+ * Dialog Handler Implementation
+ *
+ * Implements the InteractionHubInterface using Ant Design components.
+ * Provides concrete implementations for displaying notifications and confirmation dialogs.
+ *
+ * Features:
+ * - Uses Ant Design's message component for notifications
+ * - Uses Ant Design's Modal component for confirmations
+ * - Supports customizable display durations
+ * - Handles error objects appropriately
+ *
+ * @example
+ * const dialog = new DialogHandler();
+ * dialog.success('Data saved successfully');
+ * dialog.confirm({
+ *   title: 'Confirm Delete',
+ *   content: 'Are you sure you want to delete this item?',
+ *   onOk: () => handleDelete(),
+ * });
+ */
+export class DialogHandler
+  implements UIDialogInterface<DialogHandlerOptions>, AntdStaticApiInterface
+{
+  protected antds: {
+    message?: MessageApi;
+    modal?: ModalApi;
+    notification?: NotificationApi;
+  } = {};
+
+  setMessage(message: MessageApi): void {
+    this.antds.message = message;
+  }
+
+  setModal(modal: ModalApi): void {
+    this.antds.modal = modal;
+  }
+
+  setNotification(notification: NotificationApi): void {
+    this.antds.notification = notification;
+  }
+
+  /**
+   * Formats error message from various error types
+   */
+  protected formatErrorMessage(error: unknown): string {
+    if (error instanceof Error) return error.message;
+    if (typeof error === 'string') return error;
+    return 'An unknown error occurred';
+  }
+
+  public success(msg: string, options?: NotificationOptions): void {
+    this.antds.message?.success({ content: msg, ...options });
+  }
+
+  public error(msg: string, options?: NotificationOptions): void {
+    this.antds.message?.error({
+      content: options?.error ? this.formatErrorMessage(options.error) : msg,
+      ...options
+    });
+  }
+
+  public info(msg: string, options?: NotificationOptions): void {
+    this.antds.message?.info({ content: msg, ...options });
+  }
+
+  public warn(msg: string, options?: NotificationOptions): void {
+    this.antds.message?.warning({ content: msg, ...options });
+  }
+
+  public confirm(options: DialogHandlerOptions): void {
+    this.antds.modal?.confirm(options);
+  }
+}

package/dist/templates/next-app/src/base/cases/NavigateBridge.ts

@@ -0,0 +1,16 @@
+import { injectable } from 'inversify';
+import type { UIBridgeInterface } from '@qlover/corekit-bridge';
+import type { AppRouterInstance } from 'next/dist/shared/lib/app-router-context.shared-runtime';
+
+@injectable()
+export class NavigateBridge implements UIBridgeInterface<AppRouterInstance> {
+  protected navigate: AppRouterInstance | null = null;
+
+  setUIBridge(ui: AppRouterInstance): void {
+    this.navigate = ui;
+  }
+
+  getUIBridge(): AppRouterInstance | null {
+    return this.navigate;
+  }
+}

package/dist/templates/next-app/src/base/cases/PageParams.ts

@@ -0,0 +1,74 @@
+import { notFound } from 'next/navigation';
+import { getMessages, getTranslations } from 'next-intl/server';
+import { i18nConfig } from '@config/i18n';
+import type { ParamsHandlerInterface as ParamsHandlerInterface } from '../port/ParamsHandlerInterface';
+import type { LocaleType, PageI18nInterface } from '@config/i18n';
+
+export interface PageWithParams {
+  params?: Promise<PageParamsType>;
+}
+
+export interface PageParamsType {
+  locale?: string;
+}
+
+/**
+ * Handler Page Params
+ */
+export class PageParams implements ParamsHandlerInterface {
+  private locale: string | null;
+
+  constructor(protected readonly params: PageParamsType) {
+    this.locale = this.params.locale || i18nConfig.fallbackLng;
+  }
+
+  public getLocale(defaultLocale?: string): string {
+    if (this.locale) {
+      return this.locale;
+    }
+
+    this.locale = this.params.locale || defaultLocale || i18nConfig.fallbackLng;
+
+    return this.locale;
+  }
+
+  public getI18nWithNotFound(): string {
+    const locale = this.getLocale();
+
+    if (!i18nConfig.supportedLngs.includes(locale as LocaleType)) {
+      notFound();
+    }
+
+    return locale;
+  }
+
+  public async getI18nMessages(): Promise<Record<string, string>> {
+    const locale = this.getLocale();
+
+    const messages = await getMessages({ locale });
+
+    return messages;
+  }
+
+  public async getI18nInterface<T extends PageI18nInterface>(
+    i18nInterface: T,
+    namespace?: string
+  ): Promise<T> {
+    // Load translation messages from the HomePage namespace
+    const t = await getTranslations({
+      locale: this.getLocale(),
+      namespace: namespace
+    });
+
+    const result = Object.fromEntries(
+      Object.entries(i18nInterface).map(([key, value]) => {
+        if (typeof value === 'string') {
+          return [key, t(value)];
+        }
+        return [key, value];
+      })
+    ) as T;
+
+    return result;
+  }
+}

package/dist/templates/next-app/src/base/cases/RouterService.ts

@@ -0,0 +1,35 @@
+import { inject, injectable } from 'inversify';
+import { NavigateBridge } from './NavigateBridge';
+import type { RouterInterface, RouterPathname } from '../port/RouterInterface';
+import type { UIBridgeInterface } from '@qlover/corekit-bridge';
+import type { AppRouterInstance } from 'next/dist/shared/lib/app-router-context.shared-runtime';
+
+@injectable()
+export class RouterService implements RouterInterface {
+  protected locale: string = '';
+
+  constructor(
+    @inject(NavigateBridge)
+    protected uiBridge: UIBridgeInterface<AppRouterInstance>
+  ) {}
+
+  protected padLocaleHref(href: RouterPathname): string {
+    return `/${this.locale}${href === '/' ? '' : href}`;
+  }
+
+  goto(href: RouterPathname): void {
+    this.uiBridge.getUIBridge()?.push(this.padLocaleHref(href));
+  }
+
+  gotoHome(): void {
+    this.goto('/');
+  }
+
+  setLocale(locale: string): void {
+    this.locale = locale;
+  }
+
+  getLocale(): string {
+    return this.locale;
+  }
+}

package/dist/templates/next-app/src/base/cases/ServerAuth.ts

@@ -0,0 +1,17 @@
+import { cookies } from 'next/headers';
+import { I } from '@config/IOCIdentifier';
+import type { ServerAuthInterface } from '../port/ServerAuthInterface';
+import type { ServerInterface } from '../port/ServerInterface';
+
+export class ServerAuth implements ServerAuthInterface {
+  constructor(protected server: ServerInterface) {}
+
+  async hasAuth(): Promise<boolean> {
+    const cookieStore = await cookies();
+    const appConfig = this.server.getIOC(I.AppConfig);
+
+    const token = cookieStore.get(appConfig.userTokenKey);
+
+    return !!token;
+  }
+}

package/dist/templates/next-app/src/base/cases/ServerErrorHandler.ts

@@ -0,0 +1,27 @@
+import { ExecutorError, type ExecutorContext } from '@qlover/fe-corekit';
+import { SERVER_AUTH_ERROR } from '@config/Identifier';
+import type { BootstrapServerContextValue } from '@/core/bootstraps/BootstrapServer';
+import type { BootstrapExecutorPlugin } from '@qlover/corekit-bridge';
+
+export class ServerErrorHandler implements BootstrapExecutorPlugin {
+  pluginName = 'ServerErrorHandler';
+
+  onError(
+    context: ExecutorContext<BootstrapServerContextValue>
+  ): ExecutorError | void {
+    const { parameters, error } = context;
+    const { messages } = parameters;
+
+    if (error instanceof Error) {
+      const messageId = error.message;
+
+      if (messageId === SERVER_AUTH_ERROR) {
+        const message = messages[messageId];
+
+        if (message) {
+          return new ExecutorError(messageId, message);
+        }
+      }
+    }
+  }
+}

package/dist/templates/next-app/src/base/port/IOCInterface.ts

@@ -0,0 +1,24 @@
+import type {
+  EnvConfigInterface,
+  IOCContainerInterface,
+  IOCFunctionInterface
+} from '@qlover/corekit-bridge';
+
+/**
+ * IOC register options
+ */
+export type IocRegisterOptions = {
+  /**
+   * The app config
+   */
+  appConfig: EnvConfigInterface;
+};
+
+export interface IOCInterface<
+  IdentifierMap,
+  IOCContainer extends IOCContainerInterface
+> {
+  create(
+    options: IocRegisterOptions
+  ): IOCFunctionInterface<IdentifierMap, IOCContainer>;
+}

package/dist/templates/next-app/src/base/port/ParamsHandlerInterface.ts

@@ -0,0 +1,11 @@
+import type { PageI18nInterface } from '@config/i18n';
+
+export interface ParamsHandlerInterface {
+  getLocale(defaultLocale?: string): string;
+  getI18nWithNotFound(): string;
+  getI18nMessages(): Promise<Record<string, string>>;
+  getI18nInterface<T extends PageI18nInterface>(
+    i18nInterface: T,
+    namespace?: string
+  ): Promise<T>;
+}

package/dist/templates/next-app/src/base/port/RouterInterface.ts

@@ -0,0 +1,11 @@
+import type { redirect } from '@/i18n/routing';
+export type RouterPathname = Parameters<typeof redirect>[0]['href'];
+
+export interface RouterInterface {
+  gotoHome(): void;
+  goto(href: RouterPathname): void;
+
+  getLocale(): string;
+
+  setLocale(locale: string): void;
+}

package/dist/templates/next-app/src/base/port/ServerAuthInterface.ts

@@ -0,0 +1,3 @@
+export interface ServerAuthInterface {
+  hasAuth(): Promise<boolean>;
+}

package/dist/templates/next-app/src/base/port/ServerInterface.ts

@@ -0,0 +1,12 @@
+import {
+  type IOCContainerInterface,
+  type IOCFunctionInterface
+} from '@qlover/corekit-bridge';
+import { type IOCIdentifierMapServer } from '@config/IOCIdentifier';
+
+export interface ServerInterface {
+  getIOC(): IOCFunctionInterface<IOCIdentifierMapServer, IOCContainerInterface>;
+  getIOC<T extends keyof IOCIdentifierMapServer>(
+    identifier: T
+  ): IOCIdentifierMapServer[T];
+}

package/dist/templates/next-app/src/base/types/PageProps.ts

@@ -0,0 +1,9 @@
+import type { PageWithParams } from '@/base/cases/PageParams';
+
+export interface PageParamsProps extends PageWithParams {
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
+}
+
+export interface PageLayoutProps extends PageWithParams {
+  children: React.ReactNode;
+}

package/dist/templates/next-app/src/core/bootstraps/BootstrapClient.ts

@@ -1,18 +1,12 @@
-import { Bootstrap, createIOCFunction } from '@qlover/corekit-bridge';
+import { Bootstrap } from '@qlover/corekit-bridge';
 import { isObject } from 'lodash';
 import { browserGlobalsName } from '@config/common';
-import { InversifyContainer } from '@/base/cases/InversifyContainer';
 import { BootstrapsRegistry } from './BootstrapsRegistry';
 import * as globals from '../globals';
-import { appConfig } from '../globals';
-import { IocRegisterImpl } from '../IocRegisterImpl';
-import type { IOCContainer } from '../IOC';
 import type { IOCIdentifierMap } from '@config/IOCIdentifier';
 import type {
-  EnvConfigInterface,
   IOCContainerInterface,
-  IOCFunctionInterface,
-  IOCManagerInterface
+  IOCFunctionInterface
 } from '@qlover/corekit-bridge';
 
 export type BootstrapAppArgs = {
@@ -31,37 +25,6 @@ export type BootstrapAppArgs = {
 };
 
 export class BootstrapClient {
-  private static _ioc: IOCFunctionInterface<
-    IOCIdentifierMap,
-    IOCContainerInterface
-  > | null = null;
-
-  static createSingletonIOC(): IOCFunctionInterface<
-    IOCIdentifierMap,
-    IOCContainerInterface
-  > {
-    if (BootstrapClient._ioc) {
-      return BootstrapClient._ioc;
-    }
-
-    BootstrapClient._ioc = createIOCFunction<IOCIdentifierMap>(
-      /**
-       * If not inversify, you can use any IOC container,
-       * then replace the InversifyContainer with your own IOC container
-       */
-      new InversifyContainer()
-    );
-
-    new IocRegisterImpl({
-      appConfig: appConfig as EnvConfigInterface
-    }).register(
-      BootstrapClient._ioc.implemention as IOCContainer,
-      BootstrapClient._ioc as IOCManagerInterface<IOCContainer>
-    );
-
-    return BootstrapClient._ioc;
-  }
-
   static async main(args: BootstrapAppArgs): Promise<BootstrapAppArgs> {
     const { root, IOC } = args;