Merge pull request #56 from Turtle-Hwan/feat/template

fix: when make new template, cannot find default icons

Author: Turtle-Hwan

src/apis/client.ts

@@ -366,3 +366,40 @@ export async function patch<T = unknown>(
 ): Promise<ApiResponse<T>> {
   return request<T>(url, "PATCH", data, config);
 }
+
+/**
+ * Public request function (no auth interceptor)
+ * For public endpoints that don't require authentication
+ */
+export async function publicRequest<T = unknown>(
+  url: string,
+  method: string,
+  body?: unknown,
+  config?: RequestConfig
+): Promise<ApiResponse<T>> {
+  try {
+    const { headers = {}, params } = config || {};
+
+    const urlWithParams = buildUrl(url, params);
+    const fullUrl = url.startsWith("http") ? urlWithParams : `${API_BASE_URL}${urlWithParams}`;
+
+    const response = await fetch(fullUrl, {
+      method,
+      headers: { "Content-Type": "application/json", ...headers },
+      body: body ? JSON.stringify(body) : undefined,
+    });
+
+    const data = await response.json();
+
+    if (!response.ok) {
+      return { success: false, status: response.status, error: { code: "ERROR", message: data.message } };
+    }
+
+    // Extract 'result' field if present (backend response format)
+    const resultData = data && typeof data === 'object' && 'result' in data ? data.result : data;
+
+    return { success: true, status: response.status, data: resultData as T };
+  } catch (error) {
+    return { success: false, error: { code: "NETWORK_ERROR", message: String(error) } };
+  }
+}

src/apis/icons.ts

@@ -3,7 +3,7 @@
  * Icon asset management
  */
 
-import { get, post, put, del, ENDPOINTS } from './client';
+import { get, post, put, del, publicRequest, ENDPOINTS } from './client';
 import type { ApiResponse, Icon, CreateIconResponse, DeleteResponse } from '../types/api';
 
 /**
@@ -21,10 +21,10 @@ export async function createIcon(
 }
 
 /**
- * Get list of default system icons
+ * Get list of default system icons (public endpoint, no auth required)
  */
 export async function getDefaultIcons(): Promise<ApiResponse<Icon[]>> {
-  return get<Icon[]>(ENDPOINTS.ICONS.DEFAULT);
+  return publicRequest<Icon[]>(ENDPOINTS.ICONS.DEFAULT, "GET");
 }
 
 /**

src/contexts/EditorContext.tsx

@@ -499,33 +499,43 @@ export const EditorProvider = ({ children, templateId, startFrom }: EditorProvid
     dispatch({ type: 'SET_LOADING', payload: true });
 
     try {
-      // Always fetch server icons first (for icon picker and template items)
-      const iconsResult = await getDefaultIcons();
+      // Fetch both default icons and user icons in parallel
+      const [iconsResult, userIconsResult] = await Promise.allSettled([
+        getDefaultIcons(),
+        getMyIcons(),
+      ]);
 
       console.log('[EditorContext] Icons API full response:', iconsResult);
 
-      // Parse icons from response
-      // client.ts already extracts 'result' field, so iconsResult.data should be Icon[]
+      // Parse default icons from response
       let defaultIcons: Icon[] = [];
 
-      if (iconsResult.success && iconsResult.data) {
-        if (Array.isArray(iconsResult.data)) {
-          defaultIcons = iconsResult.data;
-        } else if (typeof iconsResult.data === 'object' && 'items' in iconsResult.data) {
+      if (iconsResult.status === 'fulfilled' && iconsResult.value.success && iconsResult.value.data) {
+        if (Array.isArray(iconsResult.value.data)) {
+          defaultIcons = iconsResult.value.data;
+        } else if (typeof iconsResult.value.data === 'object' && 'items' in iconsResult.value.data) {
           // Handle paginated response format
-          defaultIcons = (iconsResult.data as { items: Icon[] }).items;
+          defaultIcons = (iconsResult.value.data as { items: Icon[] }).items;
         } else {
-          console.error('[EditorContext] Unexpected response structure:', iconsResult.data);
+          console.error('[EditorContext] Unexpected response structure:', iconsResult.value.data);
         }
-      } else {
-        console.error('[EditorContext] Icons API failed:', iconsResult.error);
+      } else if (iconsResult.status === 'rejected') {
+        console.error('[EditorContext] Icons API failed:', iconsResult.reason);
       }
 
       console.log('[EditorContext] Final defaultIcons count:', defaultIcons.length);
 
       // Load server icons for icon picker (even if empty)
       dispatch({ type: 'LOAD_DEFAULT_ICONS', payload: defaultIcons });
 
+      // Load user icons for icon picker
+      if (userIconsResult.status === 'fulfilled' && userIconsResult.value.success && userIconsResult.value.data) {
+        const userIcons = Array.isArray(userIconsResult.value.data)
+          ? userIconsResult.value.data
+          : (userIconsResult.value.data as { items: Icon[] }).items || [];
+        dispatch({ type: 'LOAD_USER_ICONS', payload: userIcons });
+      }
+
       // Create template based on startFrom mode
       if (startFrom === 'empty') {
         // Empty template - no items, just icons for picker