generator-kodly-react-app 1.0.14 → 1.0.16

package/generators/app/templates/src/modules/auth/hooks/use-auth-hook.ts

@@ -1,4 +1,4 @@
-import { Route as LoginRoute } from '@/routes/auth/login';
+import { Route as LoginRoute } from "@/routes/auth/login";
 import type {
   AuthResponseDtoUserDetailDto,
   LoginUserAuthResponse,
@@ -6,7 +6,7 @@ import type {
   ResetPasswordUserAuthResponse,
   SendOtpUserAuthResponse,
   ValidateTokenUserAuthResponse,
-} from '@/sdk';
+} from "@/sdk";
 import {
   loginUserAuthMutation,
   logoutUserAuthMutation,
@@ -14,31 +14,38 @@ import {
   resetPasswordUserAuthMutation,
   sendOtpUserAuthMutation,
   validateTokenUserAuthMutation,
-} from '@/sdk/@tanstack/react-query.gen';
-import { client } from '@/sdk/client.gen';
-import { useMutation } from '@tanstack/react-query';
-import { useNavigate } from '@tanstack/react-router';
-import { atom, useAtomValue, useSetAtom } from 'jotai';
-import { atomWithStorage } from 'jotai/utils';
-import { useTranslation } from 'react-i18next';
-import { toast } from 'sonner';
-import { SupportedLanguages } from '@/lib/i18n';
-import { DEFAULT_NON_LOGGED_IN_ROUTE } from '@/lib/routes';
+} from "@/sdk/@tanstack/react-query.gen";
+import { client } from "@/sdk/client.gen";
+import { useMutation } from "@tanstack/react-query";
+import { useNavigate } from "@tanstack/react-router";
+import { atom, useAtomValue, useSetAtom } from "jotai";
+import { atomWithStorage } from "jotai/utils";
+import { useTranslation } from "react-i18next";
+import { toast } from "sonner";
+import { SupportedLanguages } from "@/lib/i18n";
+import { DEFAULT_NON_LOGGED_IN_ROUTE } from "@/lib/routes";
 
 export const HEADER_KEYS = {
-  AUTH_TOKEN: 'x-auth-token',
-  ACCEPT_LANGUAGE: 'accept-language',
+  AUTH_TOKEN: "x-auth-token",
+  ACCEPT_LANGUAGE: "accept-language",
 };
 
 export const LOCAL_STORAGE_KEYS = {
-  AUTH_TOKEN: 'authTokenAtom',
+  AUTH_TOKEN: "authTokenAtom",
 };
 
-export const authTokenAtom = atomWithStorage<string>(LOCAL_STORAGE_KEYS.AUTH_TOKEN, '', undefined, {
-  getOnInit: true,
-});
+export const authTokenAtom = atomWithStorage<string>(
+  LOCAL_STORAGE_KEYS.AUTH_TOKEN,
+  "",
+  undefined,
+  {
+    getOnInit: true,
+  },
+);
 
-export const currentUserDetailsAtom = atom<AuthResponseDtoUserDetailDto | undefined>();
+export const currentUserDetailsAtom = atom<
+  AuthResponseDtoUserDetailDto | undefined
+>();
 
 export const setTokenInClient = (token?: string | null) => {
   if (token) {
@@ -72,13 +79,13 @@ export const useLogin = () => {
     ...loginUserAuthMutation({}),
     onSuccess: (response: LoginUserAuthResponse) => {
       const authData = response.data;
-      setAuthToken(authData?.token || '');
+      setAuthToken(authData?.token || "");
       setCurrentUser(authData);
       setTokenInClient(authData?.token);
     },
     onError: (err) => {
-      console.error('Login error:', err);
-      toast.error(err.response?.data.message || t('auth.messages.loginFailed'));
+      console.error("Login error:", err);
+      toast.error(err.response?.data.message || t("auth.messages.loginFailed"));
     },
   });
 };
@@ -91,13 +98,15 @@ export const useSignup = () => {
     ...registerUserAuthMutation({}),
     onSuccess: (response: RegisterUserAuthResponse) => {
       const authData = response.data;
-      setAuthToken(authData?.token || '');
+      setAuthToken(authData?.token || "");
       setCurrentUser(authData);
       setTokenInClient(authData?.token);
     },
     onError: (err) => {
-      console.error('Signup error:', err);
-      toast.error(err.response?.data.message || t('auth.messages.signupFailed'));
+      console.error("Signup error:", err);
+      toast.error(
+        err.response?.data.message || t("auth.messages.signupFailed"),
+      );
     },
   });
 };
@@ -113,13 +122,13 @@ export const useValidateToken = () => {
     onSuccess: (response: ValidateTokenUserAuthResponse) => {
       const authData = response.data;
       setCurrentUser(authData);
-      setAuthToken(authData?.token || '');
+      setAuthToken(authData?.token || "");
       setTokenInClient(authData?.token);
     },
     onError: (err) => {
-      console.error('Validate token error:', err);
+      console.error("Validate token error:", err);
       setCurrentUser(undefined);
-      setAuthToken('');
+      setAuthToken("");
       setTokenInClient();
     },
   });
@@ -132,7 +141,7 @@ export const useLogout = () => {
   return useMutation({
     ...logoutUserAuthMutation({}),
     onSuccess: () => {
-      setAuthToken('');
+      setAuthToken("");
       setCurrentUser(undefined);
       setTokenInClient();
       navigate({ to: DEFAULT_NON_LOGGED_IN_ROUTE });
@@ -146,19 +155,21 @@ export const useSendOtp = () => {
   return useMutation({
     ...sendOtpUserAuthMutation({}),
     onSuccess: (response: SendOtpUserAuthResponse, variables) => {
-      toast.success(response.message || t('auth.messages.otpSentSuccess'));
+      toast.success(response.message || t("auth.messages.otpSentSuccess"));
       // Extract email from the mutation variables and navigate to reset-password
       const email = variables.query?.authId;
       if (email) {
         navigate({
-          to: '/auth/reset-password',
+          to: "/auth/reset-password",
           search: { email },
         });
       }
     },
     onError: (err) => {
-      console.error('Send OTP error:', err);
-      toast.error(err.response?.data.message || t('auth.messages.otpSendFailed'));
+      console.error("Send OTP error:", err);
+      toast.error(
+        err.response?.data.message || t("auth.messages.otpSendFailed"),
+      );
     },
   });
 };
@@ -169,12 +180,16 @@ export const useResetPassword = () => {
   return useMutation({
     ...resetPasswordUserAuthMutation({}),
     onSuccess: (response: ResetPasswordUserAuthResponse) => {
-      toast.success(response.message || t('auth.messages.passwordResetSuccess'));
+      toast.success(
+        response.message || t("auth.messages.passwordResetSuccess"),
+      );
       navigate({ to: LoginRoute.to });
     },
     onError: (err) => {
-      console.error('Reset password error:', err);
-      toast.error(err.response?.data.message || t('auth.messages.passwordResetFailed'));
+      console.error("Reset password error:", err);
+      toast.error(
+        err.response?.data.message || t("auth.messages.passwordResetFailed"),
+      );
     },
   });
 };

package/generators/app/templates/src/modules/auth/layouts/auth-layout.tsx

@@ -1,28 +1,25 @@
-import { LanguageSwitcher } from '@/components/layout/language-switcher';
-import { ThemeSwitcher } from '@/components/layout/theme-switcher';
-import { Button } from '@/components/ui/button';
-import { Home } from 'lucide-react';
-import { Link } from '@tanstack/react-router';
-import { DEFAULT_NON_LOGGED_IN_ROUTE } from '@/lib/routes';
+import { LanguageSwitcher } from "@/components/layout/language-switcher";
+import { ThemeSwitcher } from "@/components/layout/theme-switcher";
+import { Button } from "@/components/ui/button";
+import { Home } from "lucide-react";
+import { Link } from "@tanstack/react-router";
+import { DEFAULT_NON_LOGGED_IN_ROUTE } from "@/lib/routes";
 
 export function AuthLayout({ children }: { children: React.ReactNode }) {
   return (
-    <div className='flex h-screen items-center justify-center bg-background relative'>
-      <div className='absolute top-4 left-4'>
+    <div className="flex h-screen items-center justify-center bg-background relative">
+      <div className="absolute top-4 left-4">
         <Link to={DEFAULT_NON_LOGGED_IN_ROUTE}>
-          <Button
-            variant='outline'
-            size='icon'
-            aria-label='Go to home'>
-            <Home className='h-4 w-4' />
+          <Button variant="outline" size="icon" aria-label="Go to home">
+            <Home className="h-4 w-4" />
           </Button>
         </Link>
       </div>
-      <div className='absolute top-4 right-4 flex gap-2'>
+      <div className="absolute top-4 right-4 flex gap-2">
         <ThemeSwitcher />
         <LanguageSwitcher />
       </div>
-      <div className='w-full max-w-md p-8'>{children}</div>
+      <div className="w-full max-w-md p-8">{children}</div>
     </div>
   );
 }

package/generators/app/templates/src/modules/auth/locales/auth-en.json

@@ -102,4 +102,3 @@
     "passwordResetFailed": "Failed to reset password"
   }
 }
-

package/generators/app/templates/src/modules/auth/locales/auth-ja.json

@@ -102,4 +102,3 @@
     "passwordResetFailed": "パスワードのリセットに失敗しました"
   }
 }
-

package/generators/app/templates/src/modules/auth/schemas/form-schemas.ts

@@ -1,26 +1,30 @@
-import type { z } from 'zod';
-import { zUserLoginDto, zUserSignupDto, zUserResetPasswordDto } from '@/sdk/zod.gen';
+import type { z } from "zod";
+import {
+  zUserLoginDto,
+  zUserSignupDto,
+  zUserResetPasswordDto,
+} from "@/sdk/zod.gen";
 
 type LoginFormData = z.infer<typeof zUserLoginDto>;
 type SignupFormData = z.infer<typeof zUserSignupDto>;
 type ResetPasswordFormData = z.infer<typeof zUserResetPasswordDto>;
 
 export const loginFormDefaults: LoginFormData = {
-  email: '',
-  password: '',
+  email: "",
+  password: "",
 };
 
 export const signupFormDefaults: SignupFormData = {
-  email: '',
-  password: '',
+  email: "",
+  password: "",
 };
 
 export const forgotPasswordFormDefaults = {
-  email: '',
+  email: "",
 };
 
 export const resetPasswordFormDefaults: ResetPasswordFormData = {
-  email: '',
-  password: '',
-  otp: '',
+  email: "",
+  password: "",
+  otp: "",
 };

package/generators/app/templates/src/modules/landing/components/auth-hero.tsx

@@ -1,34 +1,36 @@
-import { Link } from '@tanstack/react-router';
-import { Button } from '@/components/ui/button';
-import { useTranslation } from 'react-i18next';
-import { Route as LoginRoute } from '@/routes/auth/login';
-import { Route as SignupRoute } from '@/routes/auth/signup';
+import { Link } from "@tanstack/react-router";
+import { Button } from "@/components/ui/button";
+import { useTranslation } from "react-i18next";
+import { Route as LoginRoute } from "@/routes/auth/login";
+import { Route as SignupRoute } from "@/routes/auth/signup";
 
 export function AuthHero() {
-  const { t } = useTranslation('landing');
+  const { t } = useTranslation("landing");
 
   return (
     <>
-      <h1 className='text-4xl md:text-5xl lg:text-6xl font-bold mb-6'>{t('hero.title')}</h1>
-      <p className='text-xl md:text-2xl text-muted-foreground mb-12 max-w-2xl mx-auto'>{t('hero.description')}</p>
-      <div className='flex flex-col sm:flex-row gap-4 justify-center items-center'>
+      <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-6">
+        {t("hero.title")}
+      </h1>
+      <p className="text-xl md:text-2xl text-muted-foreground mb-12 max-w-2xl mx-auto">
+        {t("hero.description")}
+      </p>
+      <div className="flex flex-col sm:flex-row gap-4 justify-center items-center">
         <Link to={LoginRoute.to}>
-          <Button
-            size='lg'
-            className='w-full sm:w-auto min-w-[150px]'>
-            {t('hero.loginButton')}
+          <Button size="lg" className="w-full sm:w-auto min-w-[150px]">
+            {t("hero.loginButton")}
           </Button>
         </Link>
         <Link to={SignupRoute.to}>
           <Button
-            size='lg'
-            variant='outline'
-            className='w-full sm:w-auto min-w-[150px]'>
-            {t('hero.signupButton')}
+            size="lg"
+            variant="outline"
+            className="w-full sm:w-auto min-w-[150px]"
+          >
+            {t("hero.signupButton")}
           </Button>
         </Link>
       </div>
     </>
   );
 }
-

package/generators/app/templates/src/modules/landing/components/welcome-hero.tsx

@@ -1,21 +1,23 @@
-import { Link } from '@tanstack/react-router';
-import { Button } from '@/components/ui/button';
-import { useTranslation } from 'react-i18next';
-import { DEFAULT_LOGGED_IN_ROUTE } from '@/lib/routes';
+import { Link } from "@tanstack/react-router";
+import { Button } from "@/components/ui/button";
+import { useTranslation } from "react-i18next";
+import { DEFAULT_LOGGED_IN_ROUTE } from "@/lib/routes";
 
 export function WelcomeHero() {
   const { t } = useTranslation();
 
   return (
     <>
-      <h1 className='text-4xl md:text-5xl lg:text-6xl font-bold mb-6'>{t('landing.hero.welcomeTitle')}</h1>
-      <p className='text-xl md:text-2xl text-muted-foreground mb-12 max-w-2xl mx-auto'>{t('landing.hero.welcomeDescription')}</p>
-      <div className='flex justify-center items-center'>
+      <h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-6">
+        {t("landing.hero.welcomeTitle")}
+      </h1>
+      <p className="text-xl md:text-2xl text-muted-foreground mb-12 max-w-2xl mx-auto">
+        {t("landing.hero.welcomeDescription")}
+      </p>
+      <div className="flex justify-center items-center">
         <Link to={DEFAULT_LOGGED_IN_ROUTE}>
-          <Button
-            size='lg'
-            className='w-full sm:w-auto min-w-[150px]'>
-            {t('landing.hero.getStartedButton')}
+          <Button size="lg" className="w-full sm:w-auto min-w-[150px]">
+            {t("landing.hero.getStartedButton")}
           </Button>
         </Link>
       </div>

package/generators/app/templates/src/modules/landing/landing-page-layout.tsx

@@ -1,24 +1 @@
-import { LanguageSwitcher } from '@/components/layout/language-switcher';
-import { ThemeSwitcher } from '@/components/layout/theme-switcher';
-import { useTranslation } from 'react-i18next';
-
-export function LandingPageLayout({ children }: { children: React.ReactNode }) {
-  const { t } = useTranslation();
-
-  return (
-    <div className='min-h-screen bg-background'>
-      <header className='border-b'>
-        <div className='container mx-auto flex h-16 items-center justify-between px-4'>
-          <div className='flex items-center gap-4'>
-            <h1 className='text-xl font-semibold'>{t('app.title')}</h1>
-          </div>
-          <div className='flex items-center gap-4'>
-            <ThemeSwitcher />
-            <LanguageSwitcher />
-          </div>
-        </div>
-      </header>
-      <main>{children}</main>
-    </div>
-  );
-}
+export { LandingPageLayout } from "./layouts/landing-page-layout";

package/generators/app/templates/src/modules/landing/landing-page.tsx

@@ -1,7 +1,10 @@
-import { useAtomValue } from 'jotai';
-import { authTokenAtom, currentUserDetailsAtom } from '@/modules/auth/hooks/use-auth-hook';
-import { WelcomeHero } from './components/welcome-hero';
-import { AuthHero } from './components/auth-hero';
+import { useAtomValue } from "jotai";
+import {
+  authTokenAtom,
+  currentUserDetailsAtom,
+} from "@/modules/auth/hooks/use-auth-hook";
+import { WelcomeHero } from "./components/welcome-hero";
+import { AuthHero } from "./components/auth-hero";
 
 export function LandingPage() {
   const token = useAtomValue(authTokenAtom);
@@ -10,8 +13,10 @@ export function LandingPage() {
   const isAuthenticated = token && userData;
 
   return (
-    <div className='container mx-auto px-4 py-16'>
-      <div className='max-w-4xl mx-auto text-center'>{isAuthenticated ? <WelcomeHero /> : <AuthHero />}</div>
+    <div className="container mx-auto px-4 py-16">
+      <div className="max-w-4xl mx-auto text-center">
+        {isAuthenticated ? <WelcomeHero /> : <AuthHero />}
+      </div>
     </div>
   );
 }

package/generators/app/templates/src/modules/landing/layouts/landing-page-layout.tsx

@@ -1,24 +1,5 @@
-import { LanguageSwitcher } from '@/components/layout/language-switcher';
-import { ThemeSwitcher } from '@/components/layout/theme-switcher';
-import { useTranslation } from 'react-i18next';
+import { PageLayout } from "@/components/layout/page-layout";
 
 export function LandingPageLayout({ children }: { children: React.ReactNode }) {
-  const { t } = useTranslation();
-
-  return (
-    <div className='min-h-screen bg-background'>
-      <header className='border-b'>
-        <div className='container mx-auto flex h-16 items-center justify-between px-4'>
-          <div className='flex items-center gap-4'>
-            <h1 className='text-xl font-semibold'>{t('app.title')}</h1>
-          </div>
-          <div className='flex items-center gap-4'>
-            <ThemeSwitcher />
-            <LanguageSwitcher />
-          </div>
-        </div>
-      </header>
-      <main>{children}</main>
-    </div>
-  );
+  return <PageLayout>{children}</PageLayout>;
 }

package/generators/app/templates/src/modules/landing/locales/landing-en.json

@@ -9,4 +9,3 @@
     "getStartedButton": "Get Started"
   }
 }
-

package/generators/app/templates/src/openapi-client-config.ts

@@ -1,4 +1,4 @@
-import type { CreateClientConfig } from '@/sdk/client.gen';
+import type { CreateClientConfig } from "@/sdk/client.gen";
 
 export const createClientConfig: CreateClientConfig = (config) => ({
   ...config,