seat-editor 3.2.3 → 3.2.5

package/dist/features/panel/select-tool.jsx

@@ -6,7 +6,7 @@ import SeatSquare from "./table-seat-square";
 import UploadTool from "./upload-tool";
 import TextTool from "./text-tool";
 import SelectedGroup from "./selected-group";
-const SelectToolForm = ({ title = "Title", action, responseMapping }) => {
+const SelectToolForm = ({ title = "Title", action }) => {
     const components = useAppSelector((state) => state.board.components);
     const selectedComponent = useAppSelector((state) => state.panel.selectedComponent);
     const extraComponents = useAppSelector((state) => state.board.extraComponents);
@@ -47,7 +47,7 @@ const SelectToolForm = ({ title = "Title", action, responseMapping }) => {
                 return <SeatSquare />;
             case "image-table":
             case "background":
-                return (<UploadTool action={action} responseMapping={responseMapping} name={selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape} defaultValue={selectedComponent} type={(selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape) === "background"
+                return (<UploadTool action={action} name={selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape} defaultValue={selectedComponent} type={(selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.shape) === "background"
                         ? "background"
                         : "component"}/>);
             case "text":

package/dist/features/panel/upload-tool.d.ts

@@ -3,14 +3,8 @@ import { PropertiesProps } from "@/dto/table";
 interface UploadToolProps {
     name: string;
     type?: "component" | "background" | "assets";
-    action?: (file: UploadFile<File>, type: string, defaultValue: PropertiesProps) => Promise<PropertiesProps>;
-    responseMapping?: {
-        status: string;
-        message: string;
-        data: string;
-        src: string;
-    };
+    action?: (file: UploadFile<File>, type: string, defaultValue: PropertiesProps) => Promise<string>;
     defaultValue?: PropertiesProps;
 }
-declare const UploadTool: ({ name, type, action, responseMapping, defaultValue, }: UploadToolProps) => import("react").JSX.Element;
+declare const UploadTool: ({ name, type, action, defaultValue }: UploadToolProps) => import("react").JSX.Element;
 export default UploadTool;

package/dist/features/panel/upload-tool.jsx

@@ -10,19 +10,21 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { useState, useEffect } from "react";
 import { Upload, Image, Button } from "antd";
-import { InboxOutlined } from "@ant-design/icons";
+import { InboxOutlined, LoadingOutlined } from "@ant-design/icons";
 import { useAppDispatch } from "../../hooks/use-redux";
 import SectionLabel from "../../components/form-tools/label";
 import SectionShape from "../../components/form-tools/shape";
 const { Dragger } = Upload;
-const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
+const UploadTool = ({ name, type, action, defaultValue }) => {
     var _a, _b;
     const [defaultSrc, setDefaultSrc] = useState(null);
     const [isEdit, setIsEdit] = useState(false);
+    const [loading, setLoading] = useState(false);
     useEffect(() => {
         if (defaultValue) {
             setDefaultSrc(defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.src);
             setIsEdit(true);
+            setLoading(false);
         }
     }, [defaultValue]);
     const dispatch = useAppDispatch();
@@ -44,7 +46,7 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
         maxCount: 1,
         showUploadList: false,
         onChange: (info) => __awaiter(void 0, void 0, void 0, function* () {
-            console.log({ info });
+            setLoading(true);
             if (info.file) {
                 const file = info.file;
                 const img = new window.Image();
@@ -52,7 +54,20 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
                 try {
                     // ⬇️ IF ada custom action (upload ke server)
                     if (action) {
-                        yield action(file, type, defaultValue);
+                        const src = yield action(file, type, defaultValue);
+                        if (isEdit) {
+                            dispatch({
+                                type: "board/updateComponent",
+                                payload: Object.assign({}, defaultFormatValue(widthWorkspace, heightWorkspace, src, Number(defaultValue.id))),
+                            });
+                            dispatch({
+                                type: "panel/setSelectedComponent",
+                                payload: Object.assign({}, defaultFormatValue(widthWorkspace, heightWorkspace, src, Number(defaultValue.id))),
+                            });
+                            setDefaultSrc(src);
+                            dispatch({ type: "board/setFlagChange", payload: true });
+                            dispatch({ type: "board/setUpdateBy", payload: "global" });
+                        }
                     }
                     // ⬇️ IF local upload
                     else {
@@ -64,16 +79,16 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
                             const height = img.height * scale;
                             if (isEdit) {
                                 dispatch({
-                                    type: type === "component"
-                                        ? "board/updateComponent"
-                                        : "board/updateExtraComponent",
+                                    type: "board/updateComponent",
                                     payload: Object.assign({}, defaultFormatValue(width, height, img.src, Number(defaultValue.id))),
                                 });
                                 dispatch({
                                     type: "panel/setSelectedComponent",
-                                    payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse, Number(defaultValue.id))),
+                                    payload: Object.assign({}, defaultFormatValue(width, height, srcFromResponse || img.src, Number(defaultValue.id))),
                                 });
                                 setDefaultSrc(img.src);
+                                dispatch({ type: "board/setFlagChange", payload: true });
+                                dispatch({ type: "board/setUpdateBy", payload: "global" });
                             }
                             else {
                                 dispatch({
@@ -83,7 +98,9 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
                                     payload: Object.assign({}, defaultFormatValue(width, height, img.src)),
                                 });
                             }
+                            setDefaultSrc(img.src);
                             dispatch({ type: "board/setFlagChange", payload: true });
+                            dispatch({ type: "board/setUpdateBy", payload: "global" });
                             // message.success(`${info.file.name} uploaded successfully.`);
                         };
                         // Set img src AFTER onload
@@ -108,16 +125,20 @@ const UploadTool = ({ name, type, action, responseMapping, defaultValue, }) => {
             Edit
           </Button>
         </>) : (<Dragger beforeUpload={() => false} {...propsUpload}>
-          <p className="ant-upload-drag-icon">
-            <InboxOutlined />
-          </p>
-          <p className="ant-upload-text">
-            Click or drag file to this area to upload
-          </p>
-          <p className="ant-upload-hint">
-            Support for a single or bulk upload. Strictly prohibited from
-            uploading company data or other banned files.
-          </p>
+          {loading ? (<div className="w-full flex flex-col items-center gap-2 max-h-[200px]">
+              <LoadingOutlined />
+            </div>) : (<>
+              <p className="ant-upload-drag-icon">
+                <InboxOutlined />
+              </p>
+              <p className="ant-upload-text">
+                Click or drag file to this area to upload
+              </p>
+              <p className="ant-upload-hint">
+                Support for a single or bulk upload. Strictly prohibited from
+                uploading company data or other banned files.
+              </p>
+            </>)}
         </Dragger>)}
 
       <SectionShape allowChangeShape={type === "component"}/>

package/dist/features/panel/utils.js

@@ -37,7 +37,7 @@ export const getSeatPosition = (shape, props) => {
     return (props === null || props === void 0 ? void 0 : props.seatPositions) || { top: 0, bottom: 0, left: 0, right: 0 };
 };
 export const adjustHeightWidthForSeatShape = (shape, props) => {
-    if (shape.includes("circle")) {
+    if (shape === null || shape === void 0 ? void 0 : shape.includes("circle")) {
         const sizeDefault = Math.min(props.width, props.height);
         return Object.assign(Object.assign({}, props), { height: sizeDefault, width: sizeDefault });
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "seat-editor",
-  "version": "3.2.3",
+  "version": "3.2.5",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",