@leo-h/create-nodejs-app 1.0.37 → 1.0.38

package/templates/react-vite/scripts/orval-generate-api-definition.ts

@@ -1,9 +1,9 @@
+import { privateEnv } from "@/private-env";
 import { execSync } from "node:child_process";
 import { existsSync } from "node:fs";
 import { mkdir, readdir, readFile, rm, writeFile } from "node:fs/promises";
 import { dirname, resolve } from "node:path";
 import { generate } from "orval";
-import { z } from "zod";
 import { orvalCustomConfig } from "../orval.config";
 
 export type OrvalCustomConfig = {
@@ -19,25 +19,8 @@ export type OrvalCustomConfig = {
   };
 };
 
-const envSchemaFromNodeEnvironment = z.object({
-  API_JSON_DOCS_URL: z
-    .string()
-    .url()
-    .transform(val => new URL(val).toString()),
-});
-
-const parsedEnv = envSchemaFromNodeEnvironment.safeParse(process.env);
-
-if (!parsedEnv.success) {
-  console.error(parsedEnv.error.flatten().fieldErrors);
-
-  throw new Error("Invalid environment variables.");
-}
-
-const env = parsedEnv.data;
-
 (async () => {
-  const apiJsonDocsResponse = await fetch(env.API_JSON_DOCS_URL);
+  const apiJsonDocsResponse = await fetch(privateEnv.API_JSON_DOCS_URL);
   const apiJsonDocs = await apiJsonDocsResponse.text();
   const apiJsonDocsDirPath = dirname(orvalCustomConfig.apiDocs.outputPath);
 

package/templates/react-vite/src/app.tsx

@@ -1,14 +1,6 @@
-import { Helmet, HelmetProvider } from "react-helmet-async";
 import { RouterProvider } from "react-router/dom";
-import { env } from "./env";
 import { router } from "./routes";
 
 export function App() {
-  return (
-    <HelmetProvider>
-      <Helmet titleTemplate={`%s | ${env.APP_NAME}`}></Helmet>
-
-      <RouterProvider router={router} />
-    </HelmetProvider>
-  );
+  return <RouterProvider router={router} />;
 }

package/templates/react-vite/src/pages/_layouts/app.tsx

@@ -1,13 +1,15 @@
-import { useCurrentRouteHandleParams } from "@/hooks/use-current-route-handle-params";
-import { Helmet } from "react-helmet-async";
-import { Outlet } from "react-router";
+import { privateRoutes } from "@/routes";
+import { Outlet, useLocation } from "react-router";
 
 export function AppLayout() {
-  const { handleParams } = useCurrentRouteHandleParams();
+  const { pathname } = useLocation();
+  const currentPublicRoute = Object.values(privateRoutes).find(privateRoute => {
+    return privateRoute.path === pathname;
+  });
 
   return (
     <>
-      <Helmet title={handleParams.metadata.title} />
+      {currentPublicRoute && <title>{currentPublicRoute.title}</title>}
 
       <div>
         <Outlet />

package/templates/react-vite/src/pages/_layouts/auth.tsx

@@ -1,13 +1,15 @@
-import { useCurrentRouteHandleParams } from "@/hooks/use-current-route-handle-params";
-import { Helmet } from "react-helmet-async";
-import { Outlet } from "react-router";
+import { publicRoutes } from "@/routes";
+import { Outlet, useLocation } from "react-router";
 
 export function AuthLayout() {
-  const { handleParams } = useCurrentRouteHandleParams();
+  const { pathname } = useLocation();
+  const currentPublicRoute = Object.values(publicRoutes).find(publicRoute => {
+    return publicRoute.path === pathname;
+  });
 
   return (
     <>
-      <Helmet title={handleParams.metadata.title} />
+      {currentPublicRoute && <title>{currentPublicRoute.title}</title>}
 
       <div>
         <Outlet />

package/templates/react-vite/src/pages/app/dashboard/dashboard.tsx

@@ -1,3 +1,4 @@
+import { publicRoutes } from "@/routes";
 import { Link } from "react-router";
 import "./styles.css";
 
@@ -6,7 +7,7 @@ export function Dashboard() {
     <div className="dashboard-wrapper">
       <h1>Hello world!</h1>
 
-      <Link to="/sign-in">Sign out</Link>
+      <Link to={publicRoutes.signIn.path}>Sign out</Link>
     </div>
   );
 }

package/templates/react-vite/src/pages/auth/sign-in/index.tsx

@@ -1,3 +1,4 @@
+import { privateRoutes } from "@/routes";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
 import { useNavigate } from "react-router";
@@ -12,6 +13,8 @@ const signInFormSchema = z.object({
 type SignInForm = z.infer<typeof signInFormSchema>;
 
 export function SignIn() {
+  const navigate = useNavigate();
+
   const signInForm = useForm<SignInForm>({
     resolver: zodResolver(signInFormSchema),
     defaultValues: {
@@ -19,10 +22,9 @@ export function SignIn() {
       password: "",
     },
   });
-  const navigate = useNavigate();
   const onSignIn = async (input: SignInForm) => {
     console.log(input);
-    navigate("/dashboard");
+    navigate(privateRoutes.dashboard.path);
   };
 
   return (

package/templates/react-vite/src/private-env.ts

@@ -0,0 +1,18 @@
+import { z } from "zod";
+
+const schema = z.object({
+  API_JSON_DOCS_URL: z
+    .string()
+    .url()
+    .transform(url => new URL(url)),
+});
+
+const parsedEnv = schema.safeParse(process.env);
+
+if (!parsedEnv.success) {
+  console.error(parsedEnv.error.flatten().fieldErrors);
+
+  throw new Error("Invalid private environment variables.");
+}
+
+export const privateEnv = parsedEnv.data;

package/templates/react-vite/src/public-env.ts

@@ -0,0 +1,30 @@
+import { z } from "zod";
+
+type PublicEnvironmentVariables = {
+  PUBLIC_APP_NAME: string;
+  PUBLIC_API_BASE_URL: string;
+};
+
+const publicEnvironmentVariables = import.meta.env as ImportMetaEnv &
+  PublicEnvironmentVariables;
+
+const schema = z.object({
+  APP_NAME: z.string(),
+  API_BASE_URL: z
+    .string()
+    .url()
+    .transform(url => new URL(url)),
+});
+
+const parsedEnv = schema.safeParse({
+  APP_NAME: publicEnvironmentVariables.PUBLIC_APP_NAME,
+  API_BASE_URL: publicEnvironmentVariables.PUBLIC_API_BASE_URL,
+});
+
+if (!parsedEnv.success) {
+  console.error(parsedEnv.error.flatten().fieldErrors);
+
+  throw new Error("Invalid public environment variables.");
+}
+
+export const publicEnv = parsedEnv.data;

package/templates/react-vite/src/routes.tsx

@@ -1,65 +1,49 @@
-import { createBrowserRouter } from "react-router";
-import {
-  CustomRouteDefinition,
-  ReactRouterRouteDefinition,
-} from "./@types/routes";
+import { createBrowserRouter, RouteObject } from "react-router";
 import { AppLayout } from "./pages/_layouts/app";
 import { AuthLayout } from "./pages/_layouts/auth";
-import { SignIn } from "./pages/auth/sign-in";
 import { Dashboard } from "./pages/app/dashboard/dashboard";
+import { SignIn } from "./pages/auth/sign-in";
+import { publicEnv } from "./public-env";
 
-export const authNavigationRoutes = [
-  {
-    path: "/sign-in",
-    label: "Sign In",
+export const publicRoutes = Object.freeze({
+  signIn: {
+    path: "/",
+    element: <SignIn />,
+    title: createTitleTemplate("Sign In"),
   },
-] as const satisfies CustomRouteDefinition[];
+} as const);
 
-export const appNavigationRoutes = [
-  {
+export const privateRoutes = Object.freeze({
+  dashboard: {
     path: "/dashboard",
-    label: "Dashboard",
+    element: <Dashboard />,
+    title: createTitleTemplate("Dashboard"),
   },
-] as const satisfies CustomRouteDefinition[];
+} as const);
 
 export const router = createBrowserRouter([
   {
     element: <AuthLayout />,
     children: [
-      {
-        path: "*",
-        element: <SignIn />,
+      ...Object.values(publicRoutes).map<RouteObject>(publicRoute => ({
+        path: publicRoute.path,
+        element: publicRoute.element,
         index: true,
-        handle: {
-          metadata: {
-            title: "Sign In",
-          },
-        },
-      },
-      {
-        path: "/sign-in",
-        element: <SignIn />,
-        index: true,
-        handle: {
-          metadata: {
-            title: "Sign In",
-          },
-        },
-      },
-    ] satisfies ReactRouterRouteDefinition<typeof authNavigationRoutes>[],
+      })),
+    ],
   },
   {
     element: <AppLayout />,
     children: [
-      {
-        path: "/dashboard",
-        element: <Dashboard />,
-        handle: {
-          metadata: {
-            title: "Dashboard",
-          },
-        },
-      },
-    ] satisfies ReactRouterRouteDefinition<typeof appNavigationRoutes>[],
+      ...Object.values(privateRoutes).map<RouteObject>(publicRoute => ({
+        path: publicRoute.path,
+        element: publicRoute.element,
+        index: true,
+      })),
+    ],
   },
 ]);
+
+function createTitleTemplate(title: string) {
+  return `${title} | ${publicEnv.APP_NAME}`;
+}

package/templates/react-vite/tsconfig.app.json

@@ -25,8 +25,9 @@
     /* Custom */
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": ["./src/*"],
+      "@api/*": ["./api/*"]
     }
   },
-  "include": ["src"]
+  "include": ["src", "api"]
 }

package/templates/react-vite/tsconfig.json

@@ -7,7 +7,8 @@
   "compilerOptions": {
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": ["./src/*"],
+      "@api/*": ["./api/*"]
     }
   }
 }

package/templates/react-vite/tsconfig.node.json

@@ -18,7 +18,13 @@
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true
+    "noUncheckedSideEffectImports": true,
+
+    /* Custom */
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
   },
-  "include": ["vite.config.ts"]
+  "include": ["vite.config.ts", "scripts"]
 }

package/templates/react-vite/vite.config.ts

@@ -5,5 +5,5 @@ import tsconfigPaths from "vite-tsconfig-paths";
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react(), tsconfigPaths()],
-  envPrefix: "APP",
+  envPrefix: "PUBLIC",
 });

package/templates/react-vite/src/api/errors/api-error.ts

@@ -1,7 +0,0 @@
-export class ApiError {
-  public constructor(
-    public readonly statusCode: number,
-    public readonly error: string,
-    public readonly message: string,
-  ) {}
-}

package/templates/react-vite/src/api/errors/api-unexpected-response-error.ts

@@ -1,8 +0,0 @@
-const defaultMessage =
-  "Houve uma falha inesperada ao se comunicar com nosso servidor. Por favor, contate nosso suporte." as const;
-
-export class ApiUnexpectedResponseError {
-  static message = defaultMessage;
-
-  constructor(public message = defaultMessage) {}
-}

package/templates/react-vite/src/env.ts

@@ -1,19 +0,0 @@
-import { z } from "zod";
-
-const schema = z.object({
-  APP_NAME: z.string(),
-  APP_API_BASE_URL: z
-    .string()
-    .url()
-    .transform(val => new URL(val).toString()),
-});
-
-const parsedEnv = schema.safeParse(import.meta.env);
-
-if (!parsedEnv.success) {
-  console.error(parsedEnv.error.flatten().fieldErrors);
-
-  throw new Error("Invalid environment variables.");
-}
-
-export const env = parsedEnv.data;

package/templates/react-vite/src/hooks/use-current-route-handle-params.ts

@@ -1,16 +0,0 @@
-import { ReactRouterRouteHandleDefinition } from "@/@types/routes";
-import { useLocation, useMatches } from "react-router";
-
-export function useCurrentRouteHandleParams() {
-  const { pathname } = useLocation();
-  const routeMatches = useMatches();
-  const currentRouteHandleParams = routeMatches.find(routeMatch => {
-    return routeMatch.pathname === pathname && routeMatch.handle;
-  });
-
-  return {
-    pathname,
-    handleParams:
-      currentRouteHandleParams?.handle as ReactRouterRouteHandleDefinition,
-  };
-}