sonamu 0.4.12 → 0.4.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sonamu",
-  "version": "0.4.12",
+  "version": "0.4.14",
   "description": "Sonamu — TypeScript Fullstack API Framework",
   "keywords": [
     "typescript",
@@ -59,7 +59,7 @@
     "qs": "^6.11.0",
     "tsicli": "^1.0.5",
     "uuid": "^8.3.2",
-    "zod": "^3.18.0"
+    "zod": "3.25.76"
   },
   "devDependencies": {
     "@types/fs-extra": "^9.0.13",

package/src/api/caster.ts

@@ -15,8 +15,8 @@ function isZodNumberAnyway(zodType: z.ZodType<any>) {
   ) {
   } else if (
     zodType instanceof z.ZodOptional &&
-    zodType._def.innerType instanceof z.ZodOptional &&
-    zodType._type.def.innerType instanceof z.ZodNumber
+    zodType._def?.innerType instanceof z.ZodOptional &&
+    zodType._type?.def?.innerType instanceof z.ZodNumber
   ) {
     return true;
   }

package/src/api/code-converters.ts

@@ -415,6 +415,13 @@ export function apiParamToTsCode(
     .join(", ");
 }
 
+export function apiParamToTsCodeAsObject(
+  params: ApiParam[],
+  injectImportKeys: string[]
+): string {
+  return `{ ${params.map((param) => `${param.name}${param.optional ? "?" : ""}: ${apiParamTypeToTsType(param.type, injectImportKeys)}${param.defaultDef ? `= ${param.defaultDef}` : ""}`).join(", ")} }`;
+}
+
 export function apiParamTypeToTsType(
   paramType: ApiParamType,
   injectImportKeys: string[]

package/src/api/decorators.ts

@@ -1,12 +1,12 @@
 import { HTTPMethods } from "fastify";
 import inflection from "inflection";
 import { ApiParam, ApiParamType } from "../types/types";
+import { z } from "zod";
 
 export type ServiceClient =
   | "axios"
   | "axios-multipart"
   | "swr"
-  | "socketio"
   | "window-fetch";
 export type ApiDecoratorOptions = {
   httpMethod?: HTTPMethods;
@@ -22,17 +22,27 @@ export type ApiDecoratorOptions = {
   guards?: string[];
   description?: string;
 };
+export type StreamDecoratorOptions = {
+  type: "sse"; // | 'ws
+  events: z.ZodObject<any>;
+  path?: string;
+  resourceName?: string;
+  guards?: string[];
+  description?: string;
+};
 export const registeredApis: {
   modelName: string;
   methodName: string;
   path: string;
   options: ApiDecoratorOptions;
+  streamOptions?: StreamDecoratorOptions;
 }[] = [];
 export type ExtendedApi = {
   modelName: string;
   methodName: string;
   path: string;
   options: ApiDecoratorOptions;
+  streamOptions?: StreamDecoratorOptions;
   typeParameters: ApiParamType.TypeParam[];
   parameters: ApiParam[];
   returnType: ApiParamType;
@@ -55,12 +65,34 @@ export function api(options: ApiDecoratorOptions = {}) {
       true
     )}/${inflection.camelize(propertyKey, true)}`;
 
-    const api = {
+    registeredApis.push({
       modelName,
       methodName,
       path: options.path ?? defaultPath,
       options,
-    };
-    registeredApis.push(api);
+    });
+  };
+}
+
+export function stream(options: StreamDecoratorOptions) {
+  return function (target: Object, propertyKey: string) {
+    const modelName = target.constructor.name.match(/(.+)Class$/)![1];
+    const methodName = propertyKey;
+
+    const defaultPath = `/${inflection.camelize(
+      modelName.replace(/Model$/, "").replace(/Frame$/, ""),
+      true
+    )}/${inflection.camelize(propertyKey, true)}`;
+
+    registeredApis.push({
+      modelName,
+      methodName,
+      path: options.path ?? defaultPath,
+      options: {
+        ...options,
+        httpMethod: "GET",
+      },
+      streamOptions: options,
+    });
   };
 }

package/src/shared/web.shared.ts.txt

@@ -126,3 +126,228 @@ export const SQLDateTimeString = z
   .max(19)
   .describe("SQLDateTimeString");
 export type SQLDateTimeString = z.infer<typeof SQLDateTimeString>;
+
+/*
+  Stream
+*/
+export type SSEStreamOptions = {
+  enabled?: boolean;
+  retry?: number;
+  retryInterval?: number;
+};
+export type SSEStreamState = {
+  isConnected: boolean;
+  error: string | null;
+  retryCount: number;
+  isEnded: boolean;
+};
+export type EventHandlers<T> = {
+  [K in keyof T]: (data: T[K]) => void;
+};
+import { useEffect, useRef, useState } from "react";
+
+export function useSSEStream<T extends Record<string, any>>(
+  url: string,
+  params: Record<string, any>,
+  handlers: {
+    [K in keyof T]?: (data: T[K]) => void;
+  },
+  options: SSEStreamOptions = {}
+): SSEStreamState {
+  const { enabled = true, retry = 3, retryInterval = 3000 } = options;
+
+  const [state, setState] = useState<SSEStreamState>({
+    isConnected: false,
+    error: null,
+    retryCount: 0,
+    isEnded: false,
+  });
+
+  const eventSourceRef = useRef<EventSource | null>(null);
+  const retryTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const handlersRef = useRef(handlers);
+
+  // handlers를 ref로 관리해서 재연결 없이 업데이트
+  useEffect(() => {
+    handlersRef.current = handlers;
+  }, [handlers]);
+
+  // 연결 함수
+  const connect = () => {
+    if (!enabled) return;
+
+    try {
+      // 기존 연결이 있으면 정리
+      if (eventSourceRef.current) {
+        eventSourceRef.current.close();
+        eventSourceRef.current = null;
+      }
+
+      // 재시도 타이머 정리
+      if (retryTimeoutRef.current) {
+        clearTimeout(retryTimeoutRef.current);
+        retryTimeoutRef.current = null;
+      }
+
+      // URL에 파라미터 추가
+      const queryString = qs.stringify(params);
+      const fullUrl = queryString ? `${url}?${queryString}` : url;
+
+      const eventSource = new EventSource(fullUrl);
+      eventSourceRef.current = eventSource;
+
+      // 연결 시도 중 상태 표시
+      setState((prev) => ({
+        ...prev,
+        isConnected: false,
+        error: null,
+        isEnded: false,
+      }));
+
+      eventSource.onopen = () => {
+        setState((prev) => ({
+          ...prev,
+          isConnected: true,
+          error: null,
+          retryCount: 0,
+          isEnded: false,
+        }));
+      };
+
+      eventSource.onerror = (event) => {
+        // 이미 다른 연결로 교체되었는지 확인
+        if (eventSourceRef.current !== eventSource) {
+          return; // 이미 새로운 연결이 있으면 무시
+        }
+
+        setState((prev) => ({
+          ...prev,
+          isConnected: false,
+          error: "Connection failed",
+          isEnded: false,
+        }));
+
+        // 자동 재연결 시도
+        if (state.retryCount < retry) {
+          retryTimeoutRef.current = setTimeout(() => {
+            // 여전히 같은 연결인지 확인
+            if (eventSourceRef.current === eventSource) {
+              setState((prev) => ({
+                ...prev,
+                retryCount: prev.retryCount + 1,
+                isEnded: false,
+              }));
+              connect();
+            }
+          }, retryInterval);
+        } else {
+          setState((prev) => ({
+            ...prev,
+            error: `Connection failed after ${retry} attempts`,
+          }));
+        }
+      };
+
+      // 공통 'end' 이벤트 처리 (사용자 정의 이벤트와 별도)
+      eventSource.addEventListener("end", () => {
+        console.log("SSE 연결 정상종료");
+        if (eventSourceRef.current === eventSource) {
+          eventSource.close();
+          eventSourceRef.current = null;
+          setState((prev) => ({
+            ...prev,
+            isConnected: false,
+            error: null, // 정상 종료
+            isEnded: true,
+          }));
+
+          if (handlersRef.current.end) {
+            const endHandler = handlersRef.current.end;
+            endHandler("end" as T[string]);
+          }
+        }
+      });
+
+      // 각 이벤트 타입별 리스너 등록
+      Object.keys(handlersRef.current).forEach((eventType) => {
+        const handler = handlersRef.current[eventType as keyof T];
+        if (handler) {
+          eventSource.addEventListener(eventType, (event) => {
+            // 여전히 현재 연결인지 확인
+            if (eventSourceRef.current !== eventSource) {
+              return; // 이미 새로운 연결로 교체되었으면 무시
+            }
+
+            try {
+              const data = JSON.parse(event.data);
+              handler(data);
+            } catch (error) {
+              console.error(
+                `Failed to parse SSE data for event ${eventType}:`,
+                error
+              );
+            }
+            setState((prev) => ({
+              ...prev,
+              isEnded: false,
+            }));
+          });
+        }
+      });
+
+      // 기본 message 이벤트 처리 (event 타입이 없는 경우)
+      eventSource.onmessage = (event) => {
+        // 여전히 현재 연결인지 확인
+        if (eventSourceRef.current !== eventSource) {
+          return;
+        }
+
+        try {
+          const data = JSON.parse(event.data);
+          // 'message' 핸들러가 있으면 호출
+          const messageHandler = handlersRef.current["message" as keyof T];
+          if (messageHandler) {
+            messageHandler(data);
+          }
+        } catch (error) {
+          console.error("Failed to parse SSE message:", error);
+        }
+      };
+    } catch (error) {
+      setState((prev) => ({
+        ...prev,
+        error: error instanceof Error ? error.message : "Unknown error",
+        isConnected: false,
+        isEnded: false,
+      }));
+    }
+  };
+
+  // 연결 시작
+  useEffect(() => {
+    if (enabled) {
+      connect();
+    }
+
+    return () => {
+      // cleanup
+      if (eventSourceRef.current) {
+        eventSourceRef.current.close();
+        eventSourceRef.current = null;
+      }
+      if (retryTimeoutRef.current) {
+        clearTimeout(retryTimeoutRef.current);
+        retryTimeoutRef.current = null;
+      }
+    };
+  }, [url, JSON.stringify(params), enabled]);
+
+  // 파라미터가 변경되면 재연결
+  useEffect(() => {
+    if (enabled && eventSourceRef.current) {
+      connect();
+    }
+  }, [JSON.stringify(params)]);
+
+  return state;
+}

package/src/syncer/syncer.ts

@@ -130,11 +130,16 @@ export class Syncer {
   async sync(): Promise<void> {
     const { targets } = Sonamu.config.sync;
 
+    // 번들러 여부에 따라 현재 디렉토리가 바뀌므로
+    const currentDirname = __dirname.endsWith("/syncer")
+      ? __dirname
+      : path.join(__dirname, "./syncer");
+
     // 트리거와 무관하게 shared 분배
     await Promise.all(
       targets.map(async (target) => {
         const srcCodePath = path
-          .join(__dirname, `../shared/${target}.shared.ts.txt`)
+          .join(currentDirname, `../shared/${target}.shared.ts.txt`)
           .replace("/dist/", "/src/");
         if (!fs.existsSync(srcCodePath)) {
           return;
@@ -158,6 +163,7 @@ export class Syncer {
           return;
         }
         fs.writeFileSync(dstCodePath, fs.readFileSync(srcCodePath));
+        console.log(chalk.blue("shared.ts is synced"));
       })
     );
 

package/src/templates/service.template.ts

@@ -7,6 +7,8 @@ import {
   apiParamTypeToTsType,
   apiParamToTsCode,
   unwrapPromiseOnce,
+  zodTypeToTsTypeDef,
+  apiParamToTsCodeAsObject,
 } from "../api/code-converters";
 import { ExtendedApi } from "../api/decorators";
 import { Template } from "./base-template";
@@ -43,7 +45,7 @@ export class Template__service extends Template {
         `import { z } from 'zod';`,
         `import qs from "qs";`,
         `import useSWR, { SWRResponse } from "swr";`,
-        `import { fetch, ListResult, SWRError, SwrOptions, handleConditional, swrPostFetcher } from '../sonamu.shared';`,
+        `import { fetch, ListResult, SWRError, SwrOptions, handleConditional, swrPostFetcher, EventHandlers, SSEStreamOptions, useSSEStream } from '../sonamu.shared';`,
         ...(hasAxiosProgressEvent
           ? [`import { AxiosProgressEvent } from 'axios';`]
           : []),
@@ -91,6 +93,12 @@ export class Template__service extends Template {
               importKeys
             );
 
+            // 파라미터 정의 (객체 형태)
+            const paramsDefAsObject = apiParamToTsCodeAsObject(
+              paramsWithoutContext,
+              importKeys
+            );
+
             // 리턴 타입 정의
             const returnTypeDef = apiParamTypeToTsType(
               unwrapPromiseOnce(api.returnType),
@@ -102,11 +110,14 @@ export class Template__service extends Template {
               .map((param) => param.name)
               .join(", ")} }`;
 
-            return _.sortBy(api.options.clients, (client) =>
-              client === "swr" ? 0 : 1
-            )
-              .map((client) => {
-                const apiBaseUrl = `${Sonamu.config.route.prefix}${api.path}`;
+            // 기본 URL
+            const apiBaseUrl = `${Sonamu.config.route.prefix}${api.path}`;
+
+            return [
+              // 클라이언트별로 생성
+              ..._.sortBy(api.options.clients, (client) =>
+                client === "swr" ? 0 : 1
+              ).map((client) => {
                 switch (client) {
                   case "axios":
                     return this.renderAxios(
@@ -143,12 +154,15 @@ export class Template__service extends Template {
                       paramsDef,
                       payloadDef
                     );
-                  case "socketio":
                   default:
                     return `// Not supported ${inflection.camelize(client, true)} yet.`;
                 }
-              })
-              .join("\n");
+              }),
+              // 스트리밍인 경우
+              ...(api.streamOptions
+                ? [this.renderStream(api, apiBaseUrl, paramsDefAsObject)]
+                : []),
+            ].join("\n");
           })
           .join("\n\n");
 
@@ -274,4 +288,31 @@ export async function ${api.methodName}${typeParamsDef}(${paramsDef}): Promise<R
 }
     `.trim();
   }
+
+  renderStream(
+    api: ExtendedApi,
+    apiBaseUrl: string,
+    paramsDefAsObject: string
+  ) {
+    if (!api.streamOptions) {
+      return "// streamOptions not found";
+    }
+
+    const methodNameStream = api.options.resourceName
+      ? "use" + inflection.camelize(api.options.resourceName)
+      : "use" + inflection.camelize(api.methodName);
+    const methodNameStreamCamelized = inflection.camelize(
+      methodNameStream,
+      true
+    );
+
+    const eventsTypeDef = zodTypeToTsTypeDef(api.streamOptions.events);
+
+    return `  export function ${methodNameStreamCamelized}(
+  params: ${paramsDefAsObject},
+  handlers: EventHandlers<${eventsTypeDef} & { end?: () => void }>,
+  options: SSEStreamOptions) {
+    return useSSEStream<${eventsTypeDef}>(\`${apiBaseUrl}\`, params, handlers, options);
+  }`;
+  }
 }