sales-frontend-debug 0.0.23 → 0.0.24

package/dist/index.cjs

@@ -28,12 +28,12 @@ var debugMenuPanelStyle = {
   bottom: "90px",
   display: "flex",
   flexDirection: "column",
-  maxHeight: "500px",
+  // maxHeight: '500px',
   backgroundColor: "#ffffff",
   border: "1px solid #e0e0e0",
   borderRadius: "8px",
   boxShadow: "0 4px 8px rgba(0, 0, 0, 0.1)",
-  zIndex: 9999
+  zIndex: 1e4
 };
 var panelHeaderStyle = {
   display: "flex",
@@ -55,7 +55,7 @@ var modalOverlayStyle = {
   width: "100%",
   height: "100%",
   backgroundColor: "rgba(0, 0, 0, 0.5)",
-  zIndex: 1e4
+  zIndex: 9999
 };
 var debugFeaturePanelStyle = {
   margin: "20px",
@@ -144,8 +144,8 @@ var logContentStyle = {
 };
 var pageNavigationContentStyle = {
   display: "flex",
+  flexDirection: "column",
   gap: "10px",
-  alignItems: "center",
   padding: "20px"
 };
 var h3Style = {
@@ -285,8 +285,135 @@ var FloatingButton = ({ onClick }) => {
   );
 };
 var floating_button_default = FloatingButton;
-var MenuPanel = ({ menuItems: menuItems2, onMenuItemClick, onClose }) => {
-  return /* @__PURE__ */ React4__default.default.createElement("div", { style: debugMenuPanelStyle }, /* @__PURE__ */ React4__default.default.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React4__default.default.createElement("h2", { style: h2Style }, "Debug Menu"), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React4__default.default.createElement("ul", null, menuItems2.map((item) => /* @__PURE__ */ React4__default.default.createElement("li", { key: item.id, onClick: () => onMenuItemClick(item.component), style: menuItemStyle }, item.label))));
+var cookieClient = {
+  getCookie(name) {
+    if (typeof document === "undefined") {
+      return "";
+    }
+    const match = document.cookie.match(new RegExp(`(^|; *)${name}=([^;]*)`));
+    return match ? decodeURIComponent(match[2] || "") : "";
+  },
+  setCookie(name, value, options = {}) {
+    if (typeof document === "undefined") {
+      return;
+    }
+    let cookieString = `${name}=${encodeURIComponent(value)}`;
+    if (options.expires) {
+      let expiresDate;
+      if (typeof options.expires === "number") {
+        expiresDate = /* @__PURE__ */ new Date();
+        expiresDate.setDate(expiresDate.getDate() + options.expires);
+      } else {
+        expiresDate = options.expires;
+      }
+      cookieString += `; expires=${expiresDate.toUTCString()}`;
+    }
+    cookieString += `; path=${options.path || "/"}`;
+    if (options.domain) {
+      cookieString += `; domain=${options.domain}`;
+    }
+    if (options.secure) {
+      cookieString += "; secure";
+    }
+    document.cookie = cookieString;
+  },
+  deleteCookie(name, options = {}) {
+    cookieClient.setCookie(name, "", { ...options, expires: -1 });
+  }
+};
+var useStorage = (storageType) => {
+  const [items, setItems] = React4.useState([]);
+  const loadItems = React4.useCallback(() => {
+    const newItems = [];
+    if (storageType === "localStorage") {
+      for (let i = 0; i < localStorage.length; i++) {
+        const key = localStorage.key(i);
+        if (key) {
+          newItems.push({ key, value: localStorage.getItem(key) || "" });
+        }
+      }
+    } else {
+      const cookies = document.cookie.split(";");
+      cookies.forEach((cookie) => {
+        const parts = cookie.split("=");
+        const key = parts.shift()?.trim();
+        if (key) {
+          newItems.push({ key, value: decodeURIComponent(parts.join("=")) });
+        }
+      });
+    }
+    setItems(newItems);
+  }, [storageType]);
+  React4.useEffect(() => {
+    loadItems();
+  }, [loadItems]);
+  const setItem = React4.useCallback(
+    (key, value) => {
+      if (storageType === "localStorage") {
+        localStorage.setItem(key, value);
+      } else {
+        cookieClient.setCookie(key, value);
+      }
+      loadItems();
+    },
+    [storageType, loadItems]
+  );
+  const removeItem = React4.useCallback(
+    (key) => {
+      if (storageType === "localStorage") {
+        localStorage.removeItem(key);
+      } else {
+        cookieClient.deleteCookie(key);
+      }
+      loadItems();
+    },
+    [storageType, loadItems]
+  );
+  return { items, setItem, removeItem, loadItems };
+};
+
+// src/components/menu-panel.tsx
+var MenuPanel = ({ menuItems: menuItems2, onMenuItemClick, onClose, serviceCode }) => {
+  const handleDeleteCustomCookie = () => {
+    cookieClient.deleteCookie("x-channel-appversion");
+    cookieClient.deleteCookie("x-channel-deviceid");
+    cookieClient.deleteCookie("x-channel-devicemodel");
+    cookieClient.deleteCookie("x-channel-formfactor");
+    cookieClient.deleteCookie("x-channel-loginchannel");
+    cookieClient.deleteCookie("x-channel-logintype");
+    cookieClient.deleteCookie("x-channel-platformname");
+    cookieClient.deleteCookie("x-channel-platformversion");
+    cookieClient.deleteCookie("x-channel-screenid");
+    cookieClient.deleteCookie("x-channel-business-work-division-code");
+    cookieClient.deleteCookie("accessToken");
+    cookieClient.deleteCookie("dsp-debug-mode");
+    cookieClient.deleteCookie("Debug-Step-Validation-Off");
+    alert("\uCEE4\uC2A4\uD140\uCFE0\uD0A4\uAC00 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
+    console.log("\uCEE4\uC2A4\uD140\uCFE0\uD0A4\uAC00 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.", {
+      "x-channel-appversion": cookieClient.getCookie("x-channel-appversion"),
+      "x-channel-deviceid": cookieClient.getCookie("x-channel-deviceid"),
+      "x-channel-devicemodel": cookieClient.getCookie("x-channel-devicemodel"),
+      "x-channel-formfactor": cookieClient.getCookie("x-channel-formfactor"),
+      "x-channel-loginchannel": cookieClient.getCookie("x-channel-loginchannel"),
+      "x-channel-logintype": cookieClient.getCookie("x-channel-logintype"),
+      "x-channel-platformname": cookieClient.getCookie("x-channel-platformname"),
+      "x-channel-platformversion": cookieClient.getCookie("x-channel-platformversion"),
+      "x-channel-screenid": cookieClient.getCookie("x-channel-screenid"),
+      "x-channel-business-work-division-code": cookieClient.getCookie("x-channel-business-work-division-code")
+    });
+  };
+  const handleDeleteTokenCookie = () => {
+    cookieClient.deleteCookie("accessToken");
+    cookieClient.deleteCookie("dsp-debug-mode");
+    cookieClient.deleteCookie("Debug-Step-Validation-Off");
+    alert("\uD1A0\uD070\uCFE0\uD0A4\uAC00 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
+    console.log("\uD1A0\uD070\uCFE0\uD0A4\uAC00 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.", {
+      accessToken: cookieClient.getCookie("accessToken"),
+      "dsp-debug-mode": cookieClient.getCookie("dsp-debug-mode"),
+      "Debug-Step-Validation-Off": cookieClient.getCookie("Debug-Step-Validation-Off")
+    });
+  };
+  return /* @__PURE__ */ React4__default.default.createElement(React4__default.default.Fragment, null, /* @__PURE__ */ React4__default.default.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React4__default.default.createElement("div", { style: debugMenuPanelStyle }, /* @__PURE__ */ React4__default.default.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React4__default.default.createElement("h2", { style: h2Style }, "Debug Menu"), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React4__default.default.createElement("ul", null, menuItems2.map((item) => /* @__PURE__ */ React4__default.default.createElement("li", { key: item.id, onClick: () => onMenuItemClick(item.component), style: menuItemStyle }, item.label))), serviceCode === "dsp" && /* @__PURE__ */ React4__default.default.createElement(React4__default.default.Fragment, null, /* @__PURE__ */ React4__default.default.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React4__default.default.createElement("h2", { style: h2Style }, "\uD504\uB9AC\uC14B")), /* @__PURE__ */ React4__default.default.createElement("ul", null, /* @__PURE__ */ React4__default.default.createElement("li", { style: menuItemStyle }, "\uC544\uC774\uD3F0"), /* @__PURE__ */ React4__default.default.createElement("li", { style: menuItemStyle }, "\uC548\uB4DC\uB85C\uC774\uB4DC"), /* @__PURE__ */ React4__default.default.createElement("li", { style: menuItemStyle }, "\uD0DC\uBE14\uB9BF")), /* @__PURE__ */ React4__default.default.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React4__default.default.createElement("h2", { style: h2Style }, "\uCD08\uAE30\uD654")), /* @__PURE__ */ React4__default.default.createElement("ul", null, /* @__PURE__ */ React4__default.default.createElement("li", { style: menuItemStyle }, /* @__PURE__ */ React4__default.default.createElement("button", { onClick: handleDeleteCustomCookie }, "\uCEE4\uC2A4\uD140(x-channel-) \uC0AD\uC81C")), /* @__PURE__ */ React4__default.default.createElement("li", { style: menuItemStyle }, /* @__PURE__ */ React4__default.default.createElement("button", { onClick: handleDeleteTokenCookie }, "\uD1A0\uD070 \uC0AD\uC81C"))))));
 };
 var menu_panel_default = MenuPanel;
 var globalLogs = [];
@@ -383,94 +510,6 @@ var ConsoleLogPanel = ({ onClose }) => {
   return /* @__PURE__ */ React4__default.default.createElement(React4__default.default.Fragment, null, /* @__PURE__ */ React4__default.default.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React4__default.default.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React4__default.default.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React4__default.default.createElement("h2", { style: h2Style }, "Console Logs"), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React4__default.default.createElement("div", { style: panelToolbarStyle }, /* @__PURE__ */ React4__default.default.createElement("div", null, segmentOptions.map((option) => /* @__PURE__ */ React4__default.default.createElement("button", { key: option, onClick: () => setFilter(option), disabled: filter === option }, option.charAt(0).toUpperCase() + option.slice(1)))), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: clearLogs, style: clearButtonStyle }, "Clear")), /* @__PURE__ */ React4__default.default.createElement("div", { style: logListContainerStyle, ref: logContainerRef }, filteredLogs.map((log) => /* @__PURE__ */ React4__default.default.createElement("div", { key: log.id, style: logItemStyle }, /* @__PURE__ */ React4__default.default.createElement("span", { style: logTimestampStyle }, log.timestamp), /* @__PURE__ */ React4__default.default.createElement(LogMessage, { entry: log }))))));
 };
 var console_log_panel_default = ConsoleLogPanel;
-var cookieClient = {
-  getCookie(name) {
-    if (typeof document === "undefined") {
-      return "";
-    }
-    const match = document.cookie.match(new RegExp(`(^|; *)${name}=([^;]*)`));
-    return match ? decodeURIComponent(match[2] || "") : "";
-  },
-  setCookie(name, value, options = {}) {
-    if (typeof document === "undefined") {
-      return;
-    }
-    let cookieString = `${name}=${encodeURIComponent(value)}`;
-    if (options.expires) {
-      let expiresDate;
-      if (typeof options.expires === "number") {
-        expiresDate = /* @__PURE__ */ new Date();
-        expiresDate.setDate(expiresDate.getDate() + options.expires);
-      } else {
-        expiresDate = options.expires;
-      }
-      cookieString += `; expires=${expiresDate.toUTCString()}`;
-    }
-    cookieString += `; path=${options.path || "/"}`;
-    if (options.domain) {
-      cookieString += `; domain=${options.domain}`;
-    }
-    if (options.secure) {
-      cookieString += "; secure";
-    }
-    document.cookie = cookieString;
-  },
-  deleteCookie(name, options = {}) {
-    cookieClient.setCookie(name, "", { ...options, expires: -1 });
-  }
-};
-var useStorage = (storageType) => {
-  const [items, setItems] = React4.useState([]);
-  const loadItems = React4.useCallback(() => {
-    const newItems = [];
-    if (storageType === "localStorage") {
-      for (let i = 0; i < localStorage.length; i++) {
-        const key = localStorage.key(i);
-        if (key) {
-          newItems.push({ key, value: localStorage.getItem(key) || "" });
-        }
-      }
-    } else {
-      const cookies = document.cookie.split(";");
-      cookies.forEach((cookie) => {
-        const parts = cookie.split("=");
-        const key = parts.shift()?.trim();
-        if (key) {
-          newItems.push({ key, value: decodeURIComponent(parts.join("=")) });
-        }
-      });
-    }
-    setItems(newItems);
-  }, [storageType]);
-  React4.useEffect(() => {
-    loadItems();
-  }, [loadItems]);
-  const setItem = React4.useCallback(
-    (key, value) => {
-      if (storageType === "localStorage") {
-        localStorage.setItem(key, value);
-      } else {
-        cookieClient.setCookie(key, value);
-      }
-      loadItems();
-    },
-    [storageType, loadItems]
-  );
-  const removeItem = React4.useCallback(
-    (key) => {
-      if (storageType === "localStorage") {
-        localStorage.removeItem(key);
-      } else {
-        cookieClient.deleteCookie(key);
-      }
-      loadItems();
-    },
-    [storageType, loadItems]
-  );
-  return { items, setItem, removeItem, loadItems };
-};
-
-// src/features/login-dsp/login-panel.tsx
 var LoginPanel = ({ onClose, onLogin }) => {
   const [selectedTypeId, setSelectedTypeId] = React4.useState(loginTypes[0]?.id || "");
   const [formData, setFormData] = React4.useState({});
@@ -647,6 +686,18 @@ var NetworkLog = ({ onClose }) => {
   ), /* @__PURE__ */ React4__default.default.createElement("label", null, /* @__PURE__ */ React4__default.default.createElement("input", { type: "checkbox", id: "hold-checkbox", checked: isHold, onChange: toggleHold }), "Hold"), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: clear }, "clear")), isHold && /* @__PURE__ */ React4__default.default.createElement("div", { style: holdButtonsContainerStyle }, /* @__PURE__ */ React4__default.default.createElement("button", { onClick: () => playAllRequests() }, "REQ Resolve"), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: () => playAllResponses() }, "RES Resolve")), /* @__PURE__ */ React4__default.default.createElement("div", { style: logListStyle }, filteredLogs.length === 0 ? /* @__PURE__ */ React4__default.default.createElement("p", null, "\uD45C\uC2DC\uD560 \uB85C\uADF8\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.") : /* @__PURE__ */ React4__default.default.createElement("div", null, filteredLogs.map((log, index) => /* @__PURE__ */ React4__default.default.createElement("details", { key: index }, /* @__PURE__ */ React4__default.default.createElement("summary", { style: logSummaryStyle }, renderLogSummary(log)), /* @__PURE__ */ React4__default.default.createElement("div", { style: logContentStyle }, renderLogContent(log)))))))));
 };
 var network_log_default = NetworkLog;
+var URL_MAP = {
+  FP_1: "/fp-input-step?ticketId=",
+  FP_2: "/fp-input-step?ticketId=",
+  FP_3: "/fp-input-step?ticketId=",
+  FP_4: "/fp-input-step?ticketId=",
+  CUST_1: "",
+  CUST_2: "",
+  CUST_3: "",
+  CUST_4: "",
+  CUST_5: "",
+  none: ""
+};
 var PageNavigationPanel = ({ onClose }) => {
   const [url, setUrl] = React4.useState("");
   const handleNavigate = () => {
@@ -654,7 +705,15 @@ var PageNavigationPanel = ({ onClose }) => {
       self.location.href = url;
     }
   };
-  return /* @__PURE__ */ React4__default.default.createElement(React4__default.default.Fragment, null, /* @__PURE__ */ React4__default.default.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React4__default.default.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React4__default.default.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React4__default.default.createElement("h2", { style: h2Style }, "\uD398\uC774\uC9C0 \uC774\uB3D9"), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React4__default.default.createElement("div", { style: pageNavigationContentStyle }, /* @__PURE__ */ React4__default.default.createElement(
+  const handleUrlTypeChange = (e) => {
+    const urlType = e.target.value;
+    if (urlType !== "none") {
+      setUrl(URL_MAP[urlType]);
+    } else {
+      setUrl("");
+    }
+  };
+  return /* @__PURE__ */ React4__default.default.createElement(React4__default.default.Fragment, null, /* @__PURE__ */ React4__default.default.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React4__default.default.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React4__default.default.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React4__default.default.createElement("h2", { style: h2Style }, "\uD398\uC774\uC9C0 \uC774\uB3D9"), /* @__PURE__ */ React4__default.default.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React4__default.default.createElement("div", { style: pageNavigationContentStyle }, /* @__PURE__ */ React4__default.default.createElement("select", { onChange: handleUrlTypeChange }, /* @__PURE__ */ React4__default.default.createElement("option", null, "\uC120\uD0DD"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "FP_1" }, "FP-\uC785\uB825\uB2E8\uACC4_\uC2DC\uC791\uD558\uAE30"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "FP_2" }, "FP-\uC785\uB825\uB2E8\uACC4_2"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "FP_3" }, "FP-\uC785\uB825\uB2E8\uACC4_3"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "FP_4" }, "FP-\uC785\uB825\uB2E8\uACC4_4"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "FP_5" }, "FP-\uC785\uB825\uB2E8\uACC4_5"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "CUST_1" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_1"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "CUST_2" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_2"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "CUST_3" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_3"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "CUST_4" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_4"), /* @__PURE__ */ React4__default.default.createElement("option", { value: "none" }, "\uC9C1\uC811\uC785\uB825")), /* @__PURE__ */ React4__default.default.createElement(
     "input",
     {
       type: "text",
@@ -871,7 +930,12 @@ var useEnvironment = () => {
 };
 
 // src/debug-tool.tsx
-var DebugTool = ({ onLogin, envOverride, menuItemsOverride }) => {
+var DebugTool = ({
+  onLogin,
+  envOverride,
+  menuItemsOverride,
+  serviceCode = "etc"
+}) => {
   React4.useEffect(() => {
     initializeConsoleLogOverride();
     return () => {
@@ -925,7 +989,8 @@ var DebugTool = ({ onLogin, envOverride, menuItemsOverride }) => {
       {
         menuItems: availableMenuItems,
         onMenuItemClick: handleMenuClick,
-        onClose: () => setMenuOpen(false)
+        onClose: () => setMenuOpen(false),
+        serviceCode
       }
     )
   );