@dao42/d42paas-front 0.7.36 → 0.7.38

package/dist/DaoPaaS.es.js

@@ -41931,6 +41931,196 @@ register$2(LevaInputs.BOOLEAN, boolean$6);
 register$2(LevaInputs.INTERVAL, interval);
 register$2(LevaInputs.VECTOR3D, vector3d);
 register$2(LevaInputs.VECTOR2D, vector2d);
+const clearCache = () => {
+  var _a2, _b2;
+  localStorage.clear();
+  indexedDB.deleteDatabase("daopaas").onsuccess = () => {
+  };
+  (_b2 = (_a2 = useOT.getState()) == null ? void 0 : _a2.socket) == null ? void 0 : _b2.emit("clearCache");
+};
+const adminClearCache = () => {
+  var _a2, _b2;
+  localStorage.clear();
+  indexedDB.deleteDatabase("daopaas").onsuccess = () => {
+  };
+  (_b2 = (_a2 = useOT.getState()) == null ? void 0 : _a2.socket) == null ? void 0 : _b2.emit("adminClearCache");
+};
+const guiStore = create$5((set2) => ({
+  showGUI: false,
+  setShowGUI: (arg) => set2(() => ({
+    showGUI: arg
+  }))
+}));
+var CRDTKeyToVal;
+(function(CRDTKeyToVal2) {
+  CRDTKeyToVal2["editor"] = "\u7F16\u8F91\u5668";
+  CRDTKeyToVal2["file"] = "\u6587\u4EF6";
+  CRDTKeyToVal2["terminal"] = "\u7EC8\u7AEF";
+  CRDTKeyToVal2["console"] = "\u8FD0\u884C\u6846";
+  CRDTKeyToVal2["media"] = "\u5F71\u97F3";
+})(CRDTKeyToVal || (CRDTKeyToVal = {}));
+var DefaultContext = {
+  color: void 0,
+  size: void 0,
+  className: void 0,
+  style: void 0,
+  attr: void 0
+};
+var IconContext = React.createContext && React.createContext(DefaultContext);
+var __assign$b = globalThis && globalThis.__assign || function() {
+  __assign$b = Object.assign || function(t2) {
+    for (var s2, i = 1, n2 = arguments.length; i < n2; i++) {
+      s2 = arguments[i];
+      for (var p2 in s2)
+        if (Object.prototype.hasOwnProperty.call(s2, p2))
+          t2[p2] = s2[p2];
+    }
+    return t2;
+  };
+  return __assign$b.apply(this, arguments);
+};
+var __rest = globalThis && globalThis.__rest || function(s2, e2) {
+  var t2 = {};
+  for (var p2 in s2)
+    if (Object.prototype.hasOwnProperty.call(s2, p2) && e2.indexOf(p2) < 0)
+      t2[p2] = s2[p2];
+  if (s2 != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p2 = Object.getOwnPropertySymbols(s2); i < p2.length; i++) {
+      if (e2.indexOf(p2[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s2, p2[i]))
+        t2[p2[i]] = s2[p2[i]];
+    }
+  return t2;
+};
+function Tree2Element(tree2) {
+  return tree2 && tree2.map(function(node2, i) {
+    return React.createElement(node2.tag, __assign$b({
+      key: i
+    }, node2.attr), Tree2Element(node2.child));
+  });
+}
+function GenIcon(data) {
+  return function(props2) {
+    return React.createElement(IconBase, __assign$b({
+      attr: __assign$b({}, data.attr)
+    }, props2), Tree2Element(data.child));
+  };
+}
+function IconBase(props2) {
+  var elem = function(conf2) {
+    var attr = props2.attr, size2 = props2.size, title = props2.title, svgProps = __rest(props2, ["attr", "size", "title"]);
+    var computedSize = size2 || conf2.size || "1em";
+    var className;
+    if (conf2.className)
+      className = conf2.className;
+    if (props2.className)
+      className = (className ? className + " " : "") + props2.className;
+    return React.createElement("svg", __assign$b({
+      stroke: "currentColor",
+      fill: "currentColor",
+      strokeWidth: "0"
+    }, conf2.attr, attr, svgProps, {
+      className,
+      style: __assign$b(__assign$b({
+        color: props2.color || conf2.color
+      }, conf2.style), props2.style),
+      height: computedSize,
+      width: computedSize,
+      xmlns: "http://www.w3.org/2000/svg"
+    }), title && React.createElement("title", null, title), props2.children);
+  };
+  return IconContext !== void 0 ? React.createElement(IconContext.Consumer, null, function(conf2) {
+    return elem(conf2);
+  }) : elem(DefaultContext);
+}
+function MdOutlinePersonOutline(props2) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "fill": "none", "d": "M0 0h24v24H0V0z" } }, { "tag": "path", "attr": { "d": "M12 5.9a2.1 2.1 0 110 4.2 2.1 2.1 0 010-4.2m0 9c2.97 0 6.1 1.46 6.1 2.1v1.1H5.9V17c0-.64 3.13-2.1 6.1-2.1M12 4C9.79 4 8 5.79 8 8s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 9c-2.67 0-8 1.34-8 4v3h16v-3c0-2.66-5.33-4-8-4z" } }] })(props2);
+}
+const DrawerComponent = ({
+  drawerOpen,
+  setDrawerOpen,
+  replayList,
+  option
+}) => {
+  const [filterVal, setFilterVal] = react.exports.useState("");
+  react.exports.useEffect(() => {
+  }, [replayList]);
+  return /* @__PURE__ */ jsxs(Drawer$1, {
+    size: "lg",
+    placement: "right",
+    open: drawerOpen,
+    onClose: () => setDrawerOpen(false),
+    children: [/* @__PURE__ */ jsxs(Drawer$1.Header, {
+      children: [/* @__PURE__ */ jsx(Drawer$1.Title, {
+        children: !option ? "\u56DE\u653E\u5217\u8868" : option.title ? option.title : ""
+      }), /* @__PURE__ */ jsx(Drawer$1.Actions, {
+        children: /* @__PURE__ */ jsxs(InputGroup$1, {
+          children: [/* @__PURE__ */ jsx(InputGroup$1.Addon, {
+            children: /* @__PURE__ */ jsx(MdOutlinePersonOutline, {
+              size: "1.5em"
+            })
+          }), /* @__PURE__ */ jsx(Input$1, {
+            onChange: (evt) => {
+              setFilterVal(evt);
+            }
+          })]
+        })
+      })]
+    }), /* @__PURE__ */ jsx(Drawer$1.Body, {
+      children: replayList ? /* @__PURE__ */ jsx("div", {
+        children: /* @__PURE__ */ jsx("ul", {
+          role: "list",
+          className: "marker:text-sky-400 list-disc pl-5 space-y-3 text-gray-400",
+          children: filterVal ? replayList.filter((item) => userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid).username.indexOf(filterVal) >= 0).map((item, index2) => {
+            var _a2, _b2;
+            return /* @__PURE__ */ jsxs("li", {
+              className: "hover:ring-sky-500 cursor-pointer",
+              onClick: () => {
+                setDrawerOpen(false);
+                replay({
+                  timestamp: item.timestamp
+                });
+              },
+              children: [CRDTKeyToVal[item.event], /* @__PURE__ */ jsx("span", {
+                className: "mx-4",
+                style: {
+                  color: (_a2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _a2.color
+                },
+                children: (_b2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _b2.username
+              }), /* @__PURE__ */ jsxs("span", {
+                children: ["\u3010", dayjs(Number(item.timestamp)).format("YYYY-DD-MM   hh:mm:ss"), "\u3011"]
+              })]
+            }, index2);
+          }) : replayList.map((item, index2) => {
+            var _a2, _b2;
+            return /* @__PURE__ */ jsxs("li", {
+              className: "hover:ring-sky-500 cursor-pointer",
+              onClick: () => {
+                setDrawerOpen(false);
+                replay({
+                  userId: item.userInfo.uuid,
+                  timestamp: item.timestamp
+                });
+              },
+              children: [CRDTKeyToVal[item.event], /* @__PURE__ */ jsx("span", {
+                className: "mx-4",
+                style: {
+                  color: (_a2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _a2.color
+                },
+                children: (_b2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _b2.username
+              }), /* @__PURE__ */ jsxs("span", {
+                children: ["\u3010", dayjs(Number(item.timestamp)).format("YYYY-DD-MM   hh:mm:ss"), "\u3011"]
+              })]
+            }, index2);
+          })
+        })
+      }) : /* @__PURE__ */ jsx(Placeholder$2.Paragraph, {
+        style: {
+          marginTop: 30
+        }
+      })
+    })]
+  });
+};
 /**
  * @license
  * Copyright 2019 Google LLC
@@ -44188,196 +44378,6 @@ __decorate$1z([
 NinjaKeys = __decorate$1z([
   n$2("ninja-keys")
 ], NinjaKeys);
-const clearCache = () => {
-  var _a2, _b2;
-  localStorage.clear();
-  indexedDB.deleteDatabase("daopaas").onsuccess = () => {
-  };
-  (_b2 = (_a2 = useOT.getState()) == null ? void 0 : _a2.socket) == null ? void 0 : _b2.emit("clearCache");
-};
-const adminClearCache = () => {
-  var _a2, _b2;
-  localStorage.clear();
-  indexedDB.deleteDatabase("daopaas").onsuccess = () => {
-  };
-  (_b2 = (_a2 = useOT.getState()) == null ? void 0 : _a2.socket) == null ? void 0 : _b2.emit("adminClearCache");
-};
-const guiStore = create$5((set2) => ({
-  showGUI: false,
-  setShowGUI: (arg) => set2(() => ({
-    showGUI: arg
-  }))
-}));
-var CRDTKeyToVal;
-(function(CRDTKeyToVal2) {
-  CRDTKeyToVal2["editor"] = "\u7F16\u8F91\u5668";
-  CRDTKeyToVal2["file"] = "\u6587\u4EF6";
-  CRDTKeyToVal2["terminal"] = "\u7EC8\u7AEF";
-  CRDTKeyToVal2["console"] = "\u8FD0\u884C\u6846";
-  CRDTKeyToVal2["media"] = "\u5F71\u97F3";
-})(CRDTKeyToVal || (CRDTKeyToVal = {}));
-var DefaultContext = {
-  color: void 0,
-  size: void 0,
-  className: void 0,
-  style: void 0,
-  attr: void 0
-};
-var IconContext = React.createContext && React.createContext(DefaultContext);
-var __assign$b = globalThis && globalThis.__assign || function() {
-  __assign$b = Object.assign || function(t2) {
-    for (var s2, i = 1, n2 = arguments.length; i < n2; i++) {
-      s2 = arguments[i];
-      for (var p2 in s2)
-        if (Object.prototype.hasOwnProperty.call(s2, p2))
-          t2[p2] = s2[p2];
-    }
-    return t2;
-  };
-  return __assign$b.apply(this, arguments);
-};
-var __rest = globalThis && globalThis.__rest || function(s2, e2) {
-  var t2 = {};
-  for (var p2 in s2)
-    if (Object.prototype.hasOwnProperty.call(s2, p2) && e2.indexOf(p2) < 0)
-      t2[p2] = s2[p2];
-  if (s2 != null && typeof Object.getOwnPropertySymbols === "function")
-    for (var i = 0, p2 = Object.getOwnPropertySymbols(s2); i < p2.length; i++) {
-      if (e2.indexOf(p2[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s2, p2[i]))
-        t2[p2[i]] = s2[p2[i]];
-    }
-  return t2;
-};
-function Tree2Element(tree2) {
-  return tree2 && tree2.map(function(node2, i) {
-    return React.createElement(node2.tag, __assign$b({
-      key: i
-    }, node2.attr), Tree2Element(node2.child));
-  });
-}
-function GenIcon(data) {
-  return function(props2) {
-    return React.createElement(IconBase, __assign$b({
-      attr: __assign$b({}, data.attr)
-    }, props2), Tree2Element(data.child));
-  };
-}
-function IconBase(props2) {
-  var elem = function(conf2) {
-    var attr = props2.attr, size2 = props2.size, title = props2.title, svgProps = __rest(props2, ["attr", "size", "title"]);
-    var computedSize = size2 || conf2.size || "1em";
-    var className;
-    if (conf2.className)
-      className = conf2.className;
-    if (props2.className)
-      className = (className ? className + " " : "") + props2.className;
-    return React.createElement("svg", __assign$b({
-      stroke: "currentColor",
-      fill: "currentColor",
-      strokeWidth: "0"
-    }, conf2.attr, attr, svgProps, {
-      className,
-      style: __assign$b(__assign$b({
-        color: props2.color || conf2.color
-      }, conf2.style), props2.style),
-      height: computedSize,
-      width: computedSize,
-      xmlns: "http://www.w3.org/2000/svg"
-    }), title && React.createElement("title", null, title), props2.children);
-  };
-  return IconContext !== void 0 ? React.createElement(IconContext.Consumer, null, function(conf2) {
-    return elem(conf2);
-  }) : elem(DefaultContext);
-}
-function MdOutlinePersonOutline(props2) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "fill": "none", "d": "M0 0h24v24H0V0z" } }, { "tag": "path", "attr": { "d": "M12 5.9a2.1 2.1 0 110 4.2 2.1 2.1 0 010-4.2m0 9c2.97 0 6.1 1.46 6.1 2.1v1.1H5.9V17c0-.64 3.13-2.1 6.1-2.1M12 4C9.79 4 8 5.79 8 8s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 9c-2.67 0-8 1.34-8 4v3h16v-3c0-2.66-5.33-4-8-4z" } }] })(props2);
-}
-const DrawerComponent = ({
-  drawerOpen,
-  setDrawerOpen,
-  replayList,
-  option
-}) => {
-  const [filterVal, setFilterVal] = react.exports.useState("");
-  react.exports.useEffect(() => {
-  }, [replayList]);
-  return /* @__PURE__ */ jsxs(Drawer$1, {
-    size: "lg",
-    placement: "right",
-    open: drawerOpen,
-    onClose: () => setDrawerOpen(false),
-    children: [/* @__PURE__ */ jsxs(Drawer$1.Header, {
-      children: [/* @__PURE__ */ jsx(Drawer$1.Title, {
-        children: !option ? "\u56DE\u653E\u5217\u8868" : option.title ? option.title : ""
-      }), /* @__PURE__ */ jsx(Drawer$1.Actions, {
-        children: /* @__PURE__ */ jsxs(InputGroup$1, {
-          children: [/* @__PURE__ */ jsx(InputGroup$1.Addon, {
-            children: /* @__PURE__ */ jsx(MdOutlinePersonOutline, {
-              size: "1.5em"
-            })
-          }), /* @__PURE__ */ jsx(Input$1, {
-            onChange: (evt) => {
-              setFilterVal(evt);
-            }
-          })]
-        })
-      })]
-    }), /* @__PURE__ */ jsx(Drawer$1.Body, {
-      children: replayList ? /* @__PURE__ */ jsx("div", {
-        children: /* @__PURE__ */ jsx("ul", {
-          role: "list",
-          className: "marker:text-sky-400 list-disc pl-5 space-y-3 text-gray-400",
-          children: filterVal ? replayList.filter((item) => userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid).username.indexOf(filterVal) >= 0).map((item, index2) => {
-            var _a2, _b2;
-            return /* @__PURE__ */ jsxs("li", {
-              className: "hover:ring-sky-500 cursor-pointer",
-              onClick: () => {
-                setDrawerOpen(false);
-                replay({
-                  timestamp: item.timestamp
-                });
-              },
-              children: [CRDTKeyToVal[item.event], /* @__PURE__ */ jsx("span", {
-                className: "mx-4",
-                style: {
-                  color: (_a2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _a2.color
-                },
-                children: (_b2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _b2.username
-              }), /* @__PURE__ */ jsxs("span", {
-                children: ["\u3010", dayjs(Number(item.timestamp)).format("YYYY-DD-MM   hh:mm:ss"), "\u3011"]
-              })]
-            }, index2);
-          }) : replayList.map((item, index2) => {
-            var _a2, _b2;
-            return /* @__PURE__ */ jsxs("li", {
-              className: "hover:ring-sky-500 cursor-pointer",
-              onClick: () => {
-                setDrawerOpen(false);
-                replay({
-                  userId: item.userInfo.uuid,
-                  timestamp: item.timestamp
-                });
-              },
-              children: [CRDTKeyToVal[item.event], /* @__PURE__ */ jsx("span", {
-                className: "mx-4",
-                style: {
-                  color: (_a2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _a2.color
-                },
-                children: (_b2 = userListStore.getState().userList.find((user) => user.uuid === item.userInfo.uuid)) == null ? void 0 : _b2.username
-              }), /* @__PURE__ */ jsxs("span", {
-                children: ["\u3010", dayjs(Number(item.timestamp)).format("YYYY-DD-MM   hh:mm:ss"), "\u3011"]
-              })]
-            }, index2);
-          })
-        })
-      }) : /* @__PURE__ */ jsx(Placeholder$2.Paragraph, {
-        style: {
-          marginTop: 30
-        }
-      })
-    })]
-  });
-};
 const CmdKey = () => {
   const ninjaKeys = react.exports.useRef(null);
   const actions = [
@@ -44751,12 +44751,20 @@ class DaoPaaS {
     userListStore.subscribe((next2, pre) => {
       this.trigger(lodash$2.exports.pick(pre, ["userList"]), lodash$2.exports.pick(next2, ["userList"]));
     });
+    shadowUserStore.subscribe((next2, pre) => {
+      this.trigger({
+        followingUser: pre.shadowUser
+      }, {
+        followingUser: pre.shadowUser
+      });
+    });
   }
   trigger(_d2, data) {
     if (_d2 === "error") {
       this.on(data, _d2);
       return;
     }
+    console.log(data);
     this.on(data);
   }
   clearIDB(callback) {
@@ -48432,6 +48440,20 @@ AwaitingWithBuffer.prototype.resend = function(client2) {
   client2.sendOperation(client2.revision, this.outstanding);
 };
 const FROZEN_CONTROL_COMPONENTS = ["editor", "file", "terminal"];
+newStyled.div`
+  position: absolute;
+  right: 0;
+  top: -1.5rem;
+  padding: 0 2rem;
+  background: ${(props2) => props2.shadowUser.color}5c;
+  border: 1px solid ${(props2) => props2.shadowUser.color};
+  border-radius: 5px 5px 0 0;
+
+  span {
+    font-size: 12px;
+    color: #fff;
+  }
+`;
 const FollowLayoutWrapper = newStyled.div`
   width: 100%;
   height: 100%;
@@ -48459,7 +48481,7 @@ const FollowLayout = ({
   const isPass = asyncType === name && (shadowUser == null ? void 0 : shadowUser.uuid) && !IsMe(shadowUser);
   return /* @__PURE__ */ jsxs(FollowLayoutWrapper, {
     user: shadowUser,
-    className: `${className} follow-layout`,
+    className: `follow-layout`,
     isPass,
     onClick: () => {
       if (!(shadowUser == null ? void 0 : shadowUser.uuid))
@@ -229354,12 +229376,44 @@ const Index = (props2) => {
   react.exports.useEffect(() => {
     setUrl(playgroundInfo.url);
   }, [playgroundInfo]);
+  dockerState.subscribe((state2) => state2, (pre, next2) => {
+  });
+  oTStore.subscribe((state2) => state2, (pre, next2) => {
+  });
+  ErrorMsgState.subscribe((state2) => state2, (next2, pre) => {
+    Toast.message({
+      type: "error",
+      content: next2.message.content,
+      placement: "topCenter"
+    });
+  });
+  userListStore.subscribe((next2, pre) => {
+  });
+  shadowUserStore.subscribe((next2, pre) => {
+    if (next2.shadowUser.userId) {
+      Toast.message({
+        type: "success",
+        content: `\u6B63\u5728\u8DDF\u968F${next2.shadowUser.username}`,
+        placement: "topCenter"
+      });
+    } else {
+      Toast.message({
+        type: "success",
+        content: `\u5DF2\u9000\u51FA\u8DDF\u968F\u6A21\u5F0F`,
+        placement: "topCenter"
+      });
+    }
+  });
   react.exports.useEffect(() => {
     props2.playgroundId && (socket2 == null ? void 0 : socket2.emit("playgroundInfo", JSON.stringify({
       messageId: "1",
       playgroundId: props2.playgroundId
     })));
   }, [props2.playgroundId]);
+  react.exports.useEffect(() => {
+    var _a2;
+    (_a2 = useOT.getState().socket) == null ? void 0 : _a2.emit("active");
+  }, []);
   return /* @__PURE__ */ jsx(Fragment, {
     children: /* @__PURE__ */ jsxs(MainLayout, {
       className: "flex flex-col",
@@ -229475,7 +229529,7 @@ const HeaderComponent = () => {
       children: userListStore.getState().userList.map((item, index2) => {
         return /* @__PURE__ */ jsx("div", {
           onClick: () => {
-            shadowUserStore.getState().switchShadowUser(item);
+            shadowUserStore.getState().switchShadowUser(item.userId);
             console.log(shadowUserStore.getState().shadowUser);
           },
           className: "-ml-2.5 z-0 avatar-hover",