create-lumen 1.1.4 → 1.2.0-beta.1

package/templates/conditional/axios/component-based/src/services/user.service.js

@@ -0,0 +1,33 @@
+/**
+ * @typedef {import("@/types").ApiResponse} ApiResponse
+ * @typedef {import("@/types").CreateUserPayload} CreateUserPayload
+ * @typedef {import("@/types").User} User
+ */
+import api from "@/services/axios.client";
+
+export const userService = {
+  async getAll() {
+    const { data } = await api.get("/users");
+    return data;
+  },
+
+  async getById(id) {
+    const { data } = await api.get(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload) {
+    const { data } = await api.post("/users", payload);
+    return data;
+  },
+
+  async update(id, payload) {
+    const { data } = await api.put(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id) {
+    const { data } = await api.delete(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/axios/component-based/src/services/user.service.ts

@@ -0,0 +1,29 @@
+import api from "@/services/axios.client";
+import type { ApiResponse, CreateUserPayload, User } from "@/types";
+
+export const userService = {
+  async getAll(): Promise<ApiResponse<User[]>> {
+    const { data } = await api.get<ApiResponse<User[]>>("/users");
+    return data;
+  },
+
+  async getById(id: string): Promise<ApiResponse<User>> {
+    const { data } = await api.get<ApiResponse<User>>(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.post<ApiResponse<User>>("/users", payload);
+    return data;
+  },
+
+  async update(id: string, payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.put<ApiResponse<User>>(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id: string): Promise<ApiResponse<null>> {
+    const { data } = await api.delete<ApiResponse<null>>(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/axios/feature-based/src/features/home/services/user.service.js

@@ -0,0 +1,33 @@
+/**
+ * @typedef {import("@/shared/types").ApiResponse} ApiResponse
+ * @typedef {import("@/shared/types").CreateUserPayload} CreateUserPayload
+ * @typedef {import("@/shared/types").User} User
+ */
+import { api } from "@/shared/lib/axios";
+
+export const userService = {
+  async getAll() {
+    const { data } = await api.get("/users");
+    return data;
+  },
+
+  async getById(id) {
+    const { data } = await api.get(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload) {
+    const { data } = await api.post("/users", payload);
+    return data;
+  },
+
+  async update(id, payload) {
+    const { data } = await api.put(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id) {
+    const { data } = await api.delete(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/axios/feature-based/src/features/home/services/user.service.ts

@@ -0,0 +1,29 @@
+import { api } from "@/shared/lib/axios";
+import type { ApiResponse, CreateUserPayload, User } from "@/shared/types";
+
+export const userService = {
+  async getAll(): Promise<ApiResponse<User[]>> {
+    const { data } = await api.get<ApiResponse<User[]>>("/users");
+    return data;
+  },
+
+  async getById(id: string): Promise<ApiResponse<User>> {
+    const { data } = await api.get<ApiResponse<User>>(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.post<ApiResponse<User>>("/users", payload);
+    return data;
+  },
+
+  async update(id: string, payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.put<ApiResponse<User>>(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id: string): Promise<ApiResponse<null>> {
+    const { data } = await api.delete<ApiResponse<null>>(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/axios/feature-based/src/shared/lib/axios/api.client.js

@@ -0,0 +1,24 @@
+import axios from "axios";
+import { axiosConfig } from "./api.config";
+
+const api = axios.create(axiosConfig);
+
+api.interceptors.request.use((config) => {
+  const token = localStorage.getItem("access_token");
+  if (token) {
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+  return config;
+});
+
+api.interceptors.response.use(
+  (response) => response,
+  (error) => {
+    if (error.response?.status === 401) {
+      localStorage.removeItem("access_token");
+    }
+    return Promise.reject(error);
+  },
+);
+
+export default api;

package/templates/conditional/axios/feature-based/src/shared/lib/axios/api.client.ts

@@ -0,0 +1,24 @@
+import axios from "axios";
+import { axiosConfig } from "./api.config";
+
+const api = axios.create(axiosConfig);
+
+api.interceptors.request.use((config) => {
+  const token = localStorage.getItem("access_token");
+  if (token) {
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+  return config;
+});
+
+api.interceptors.response.use(
+  (response) => response,
+  (error) => {
+    if (error.response?.status === 401) {
+      localStorage.removeItem("access_token");
+    }
+    return Promise.reject(error);
+  },
+);
+
+export default api;

package/templates/conditional/axios/feature-based/src/shared/lib/axios/api.config.js

@@ -0,0 +1,7 @@
+export const axiosConfig = {
+  baseURL: import.meta.env.VITE_API_URL || "http://localhost:3000",
+  timeout: 10000,
+  headers: {
+    "Content-Type": "application/json",
+  },
+};

package/templates/conditional/axios/feature-based/src/shared/lib/axios/api.config.ts

@@ -0,0 +1,7 @@
+export const axiosConfig = {
+  baseURL: import.meta.env.VITE_API_URL || "http://localhost:3000",
+  timeout: 10000,
+  headers: {
+    "Content-Type": "application/json",
+  },
+};

package/templates/conditional/axios/feature-based/src/shared/lib/axios/index.js

@@ -0,0 +1 @@
+export { default as api } from "./api.client";

package/templates/conditional/axios/feature-based/src/shared/lib/axios/index.ts

@@ -0,0 +1 @@
+export { default as api } from "./api.client";

package/templates/conditional/fetch/component-based/src/config/api.config.js

@@ -0,0 +1,7 @@
+export const apiConfig = {
+  baseURL: import.meta.env.VITE_API_URL || "http://localhost:3000",
+  timeout: 10000,
+  headers: {
+    "Content-Type": "application/json",
+  },
+};

package/templates/conditional/fetch/component-based/src/config/api.config.ts

@@ -0,0 +1,7 @@
+export const apiConfig = {
+  baseURL: import.meta.env.VITE_API_URL || "http://localhost:3000",
+  timeout: 10000,
+  headers: {
+    "Content-Type": "application/json",
+  },
+};

package/templates/conditional/fetch/component-based/src/services/api.client.js

@@ -0,0 +1,51 @@
+import { apiConfig } from "@/config/api.config";
+
+async function request(endpoint, options = {}) {
+  const token = localStorage.getItem("access_token");
+
+  const headers = {
+    "Content-Type": "application/json",
+    ...options.headers,
+  };
+
+  if (token) {
+    headers["Authorization"] = `Bearer ${token}`;
+  }
+
+  const response = await fetch(`${apiConfig.baseURL}${endpoint}`, {
+    ...options,
+    headers,
+  });
+
+  if (response.status === 401) {
+    localStorage.removeItem("access_token");
+  }
+
+  if (!response.ok) {
+    throw new Error(`HTTP error! status: ${response.status}`);
+  }
+
+  const data = await response.json();
+
+  return { data };
+}
+
+const api = {
+  get(endpoint) {
+    return request(endpoint);
+  },
+
+  post(endpoint, body) {
+    return request(endpoint, { method: "POST", body: JSON.stringify(body) });
+  },
+
+  put(endpoint, body) {
+    return request(endpoint, { method: "PUT", body: JSON.stringify(body) });
+  },
+
+  delete(endpoint) {
+    return request(endpoint, { method: "DELETE" });
+  },
+};
+
+export default api;

package/templates/conditional/fetch/component-based/src/services/api.client.ts

@@ -0,0 +1,55 @@
+import { apiConfig } from "@/config/api.config";
+
+type FetchOptions = Omit<RequestInit, "headers"> & {
+  headers?: Record<string, string>;
+};
+
+async function request<T>(endpoint: string, options: FetchOptions = {}): Promise<{ data: T }> {
+  const token = localStorage.getItem("access_token");
+
+  const headers: Record<string, string> = {
+    "Content-Type": "application/json",
+    ...options.headers,
+  };
+
+  if (token) {
+    headers["Authorization"] = `Bearer ${token}`;
+  }
+
+  const response = await fetch(`${apiConfig.baseURL}${endpoint}`, {
+    ...options,
+    headers,
+  });
+
+  if (response.status === 401) {
+    localStorage.removeItem("access_token");
+  }
+
+  if (!response.ok) {
+    throw new Error(`HTTP error! status: ${response.status}`);
+  }
+
+  const data = (await response.json()) as T;
+
+  return { data };
+}
+
+const api = {
+  get<T>(endpoint: string): Promise<{ data: T }> {
+    return request<T>(endpoint);
+  },
+
+  post<T>(endpoint: string, body?: unknown): Promise<{ data: T }> {
+    return request<T>(endpoint, { method: "POST", body: JSON.stringify(body) });
+  },
+
+  put<T>(endpoint: string, body?: unknown): Promise<{ data: T }> {
+    return request<T>(endpoint, { method: "PUT", body: JSON.stringify(body) });
+  },
+
+  delete<T>(endpoint: string): Promise<{ data: T }> {
+    return request<T>(endpoint, { method: "DELETE" });
+  },
+};
+
+export default api;

package/templates/conditional/fetch/component-based/src/services/user.service.js

@@ -0,0 +1,33 @@
+/**
+ * @typedef {import("@/types").ApiResponse} ApiResponse
+ * @typedef {import("@/types").CreateUserPayload} CreateUserPayload
+ * @typedef {import("@/types").User} User
+ */
+import api from "@/services/api.client";
+
+export const userService = {
+  async getAll() {
+    const { data } = await api.get("/users");
+    return data;
+  },
+
+  async getById(id) {
+    const { data } = await api.get(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload) {
+    const { data } = await api.post("/users", payload);
+    return data;
+  },
+
+  async update(id, payload) {
+    const { data } = await api.put(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id) {
+    const { data } = await api.delete(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/fetch/component-based/src/services/user.service.ts

@@ -0,0 +1,29 @@
+import api from "@/services/api.client";
+import type { ApiResponse, CreateUserPayload, User } from "@/types";
+
+export const userService = {
+  async getAll(): Promise<ApiResponse<User[]>> {
+    const { data } = await api.get<ApiResponse<User[]>>("/users");
+    return data;
+  },
+
+  async getById(id: string): Promise<ApiResponse<User>> {
+    const { data } = await api.get<ApiResponse<User>>(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.post<ApiResponse<User>>("/users", payload);
+    return data;
+  },
+
+  async update(id: string, payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.put<ApiResponse<User>>(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id: string): Promise<ApiResponse<null>> {
+    const { data } = await api.delete<ApiResponse<null>>(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/fetch/feature-based/src/features/home/services/user.service.js

@@ -0,0 +1,33 @@
+/**
+ * @typedef {import("@/shared/types").ApiResponse} ApiResponse
+ * @typedef {import("@/shared/types").CreateUserPayload} CreateUserPayload
+ * @typedef {import("@/shared/types").User} User
+ */
+import { api } from "@/shared/api";
+
+export const userService = {
+  async getAll() {
+    const { data } = await api.get("/users");
+    return data;
+  },
+
+  async getById(id) {
+    const { data } = await api.get(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload) {
+    const { data } = await api.post("/users", payload);
+    return data;
+  },
+
+  async update(id, payload) {
+    const { data } = await api.put(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id) {
+    const { data } = await api.delete(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/fetch/feature-based/src/features/home/services/user.service.ts

@@ -0,0 +1,29 @@
+import { api } from "@/shared/api";
+import type { ApiResponse, CreateUserPayload, User } from "@/shared/types";
+
+export const userService = {
+  async getAll(): Promise<ApiResponse<User[]>> {
+    const { data } = await api.get<ApiResponse<User[]>>("/users");
+    return data;
+  },
+
+  async getById(id: string): Promise<ApiResponse<User>> {
+    const { data } = await api.get<ApiResponse<User>>(`/users/${id}`);
+    return data;
+  },
+
+  async create(payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.post<ApiResponse<User>>("/users", payload);
+    return data;
+  },
+
+  async update(id: string, payload: CreateUserPayload): Promise<ApiResponse<User>> {
+    const { data } = await api.put<ApiResponse<User>>(`/users/${id}`, payload);
+    return data;
+  },
+
+  async remove(id: string): Promise<ApiResponse<null>> {
+    const { data } = await api.delete<ApiResponse<null>>(`/users/${id}`);
+    return data;
+  },
+};

package/templates/conditional/fetch/feature-based/src/shared/api/api.client.js

@@ -0,0 +1,51 @@
+import { apiConfig } from "./api.config";
+
+async function request(endpoint, options = {}) {
+  const token = localStorage.getItem("access_token");
+
+  const headers = {
+    "Content-Type": "application/json",
+    ...options.headers,
+  };
+
+  if (token) {
+    headers["Authorization"] = `Bearer ${token}`;
+  }
+
+  const response = await fetch(`${apiConfig.baseURL}${endpoint}`, {
+    ...options,
+    headers,
+  });
+
+  if (response.status === 401) {
+    localStorage.removeItem("access_token");
+  }
+
+  if (!response.ok) {
+    throw new Error(`HTTP error! status: ${response.status}`);
+  }
+
+  const data = await response.json();
+
+  return { data };
+}
+
+const api = {
+  get(endpoint) {
+    return request(endpoint);
+  },
+
+  post(endpoint, body) {
+    return request(endpoint, { method: "POST", body: JSON.stringify(body) });
+  },
+
+  put(endpoint, body) {
+    return request(endpoint, { method: "PUT", body: JSON.stringify(body) });
+  },
+
+  delete(endpoint) {
+    return request(endpoint, { method: "DELETE" });
+  },
+};
+
+export default api;

package/templates/conditional/fetch/feature-based/src/shared/api/api.client.ts

@@ -0,0 +1,55 @@
+import { apiConfig } from "./api.config";
+
+type FetchOptions = Omit<RequestInit, "headers"> & {
+  headers?: Record<string, string>;
+};
+
+async function request<T>(endpoint: string, options: FetchOptions = {}): Promise<{ data: T }> {
+  const token = localStorage.getItem("access_token");
+
+  const headers: Record<string, string> = {
+    "Content-Type": "application/json",
+    ...options.headers,
+  };
+
+  if (token) {
+    headers["Authorization"] = `Bearer ${token}`;
+  }
+
+  const response = await fetch(`${apiConfig.baseURL}${endpoint}`, {
+    ...options,
+    headers,
+  });
+
+  if (response.status === 401) {
+    localStorage.removeItem("access_token");
+  }
+
+  if (!response.ok) {
+    throw new Error(`HTTP error! status: ${response.status}`);
+  }
+
+  const data = (await response.json()) as T;
+
+  return { data };
+}
+
+const api = {
+  get<T>(endpoint: string): Promise<{ data: T }> {
+    return request<T>(endpoint);
+  },
+
+  post<T>(endpoint: string, body?: unknown): Promise<{ data: T }> {
+    return request<T>(endpoint, { method: "POST", body: JSON.stringify(body) });
+  },
+
+  put<T>(endpoint: string, body?: unknown): Promise<{ data: T }> {
+    return request<T>(endpoint, { method: "PUT", body: JSON.stringify(body) });
+  },
+
+  delete<T>(endpoint: string): Promise<{ data: T }> {
+    return request<T>(endpoint, { method: "DELETE" });
+  },
+};
+
+export default api;

package/templates/conditional/fetch/feature-based/src/shared/api/api.config.js

@@ -0,0 +1,7 @@
+export const apiConfig = {
+  baseURL: import.meta.env.VITE_API_URL || "http://localhost:3000",
+  timeout: 10000,
+  headers: {
+    "Content-Type": "application/json",
+  },
+};

package/templates/conditional/fetch/feature-based/src/shared/api/api.config.ts

@@ -0,0 +1,7 @@
+export const apiConfig = {
+  baseURL: import.meta.env.VITE_API_URL || "http://localhost:3000",
+  timeout: 10000,
+  headers: {
+    "Content-Type": "application/json",
+  },
+};

package/templates/conditional/fetch/feature-based/src/shared/api/index.js

@@ -0,0 +1 @@
+export { default as api } from "./api.client";

package/templates/conditional/fetch/feature-based/src/shared/api/index.ts

@@ -0,0 +1 @@
+export { default as api } from "./api.client";

package/templates/conditional/icons/huge/component-based/bootstrap/src/pages/Home/Home.jsx

@@ -0,0 +1,20 @@
+import { HugeiconsIcon } from "@hugeicons/react";
+import { Sun01Icon, Moon01Icon, Github01Icon } from "@hugeicons/core-free-icons";
+import { Button } from "@/components/common";
+
+export function HomePage() {
+  return (
+    <div className="text-center">
+      <div className="d-flex justify-content-center gap-3 mb-4">
+        <HugeiconsIcon icon={Sun01Icon} style={{ width: 32, height: 32 }} className="text-warning" />
+        <HugeiconsIcon icon={Moon01Icon} style={{ width: 32, height: 32 }} className="text-primary" />
+        <HugeiconsIcon icon={Github01Icon} style={{ width: 32, height: 32 }} className="text-dark" />
+      </div>
+      <h1 className="h1 fw-bold text-dark mb-4">Welcome to Lumen</h1>
+      <p className="text-muted mb-5">
+        Your React + Vite project is ready. Start building!
+      </p>
+      <Button>Get Started</Button>
+    </div>
+  );
+}

package/templates/conditional/icons/huge/component-based/bootstrap/src/pages/Home/Home.tsx

@@ -0,0 +1,20 @@
+import { HugeiconsIcon } from "@hugeicons/react";
+import { Sun01Icon, Moon01Icon, Github01Icon } from "@hugeicons/core-free-icons";
+import { Button } from "@/components/common";
+
+export function HomePage() {
+  return (
+    <div className="text-center">
+      <div className="d-flex justify-content-center gap-3 mb-4">
+        <HugeiconsIcon icon={Sun01Icon} style={{ width: 32, height: 32 }} className="text-warning" />
+        <HugeiconsIcon icon={Moon01Icon} style={{ width: 32, height: 32 }} className="text-primary" />
+        <HugeiconsIcon icon={Github01Icon} style={{ width: 32, height: 32 }} className="text-dark" />
+      </div>
+      <h1 className="h1 fw-bold text-dark mb-4">Welcome to Lumen</h1>
+      <p className="text-muted mb-5">
+        Your React + Vite project is ready. Start building!
+      </p>
+      <Button>Get Started</Button>
+    </div>
+  );
+}

package/templates/conditional/icons/huge/component-based/src/pages/Home/Home.jsx

@@ -4,17 +4,33 @@ import { Button } from "@/components/common";
 
 export function HomePage() {
   return (
-    <div className="text-center">
-      <div className="flex justify-center gap-4 mb-6">
-        <HugeiconsIcon icon={Sun01Icon} className="w-8 h-8 text-yellow-500" />
-        <HugeiconsIcon icon={Moon01Icon} className="w-8 h-8 text-blue-500" />
-        <HugeiconsIcon icon={Github01Icon} className="w-8 h-8 text-gray-800" />
+    <div style={{ textAlign: "center" }}>
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "center",
+          gap: "1rem",
+          marginBottom: "1.5rem",
+        }}
+      >
+        <HugeiconsIcon icon={Sun01Icon} style={{ width: 32, height: 32, color: "#eab308" }} />
+        <HugeiconsIcon icon={Moon01Icon} style={{ width: 32, height: 32, color: "#3b82f6" }} />
+        <HugeiconsIcon icon={Github01Icon} style={{ width: 32, height: 32, color: "#1f2937" }} />
       </div>
-      <h1 className="text-4xl font-bold text-gray-900 mb-4">Welcome to Lumen</h1>
-      <p className="text-gray-600 mb-8">
+      <h1
+        style={{
+          fontSize: "2.25rem",
+          fontWeight: 700,
+          color: "#111827",
+          marginBottom: "1rem",
+        }}
+      >
+        Welcome to Lumen
+      </h1>
+      <p style={{ color: "#4b5563", marginBottom: "2rem" }}>
         Your React + Vite project is ready. Start building!
       </p>
       <Button>Get Started</Button>
     </div>
   );
-}
+}