impaktapps-ui-builder 1.0.0 → 1.0.1-alpha.1

package/page/App/components/publicConfig/Act21Service/base.ts

@@ -1,33 +0,0 @@
-import Axios from "axios"
-import { HTTP_REQUEST_PUBLIC_BASE_URL } from "./constant"
-import 'regenerator-runtime/runtime';
-
-
-const notNeedAuthAxios = Axios.create({
-  baseURL: HTTP_REQUEST_PUBLIC_BASE_URL,
-  timeout: 30000,
-  headers: {
-    "Content-Encoding": "gzip",
-    "Content-Type": "application/json",
-  },
-})
-
-const needAuthAxios = Axios.create({
-  baseURL: HTTP_REQUEST_PUBLIC_BASE_URL,
-  timeout: 30000,
-  headers: {
-    "Content-Encoding": "gzip",
-    "Content-Type": "application/json",
-  },
-})
-
-const actionRuntimeAxios = Axios.create({
-  baseURL: HTTP_REQUEST_PUBLIC_BASE_URL,
-  timeout: 600000,
-  headers: {
-    "Content-Encoding": "gzip",
-    "Content-Type": "application/json",
-  },
-})
-
-export { actionRuntimeAxios, notNeedAuthAxios, needAuthAxios }

package/page/App/components/publicConfig/Act21Service/constant.ts

@@ -1,21 +0,0 @@
-// TODO: isCloudVersion
-export const HTTP_REQUEST_PUBLIC_BASE_URL = "https://hyperform3-dev.act21.io/api"
-
-// export const BUILDER_REQUEST_PREFIX = "/builder/api/v1"
-// export const BUILDER_WS_REQUEST_PREFIX = "/builder-ws/api/v1"
-// export const CLOUD_REQUEST_PREFIX = "/supervisor/api/v1"
-// export const ACTION_REQUEST_PREFIX = "/action/api/v1"
-// export const DRIVE_REQUEST_PREFIX = "/drive/api/v1"
-// export const PUBLIC_DRIVE_REQUEST_PREFIX = "/drive/f"
-// export const AGENT_REQUEST_PREFIX = "/resource-manager/api/v1"
-// export const WORKFLOW_REQUEST_PREFIX = "/flow/api/v1"
-// export const DOMAIN_REQUEST_PREFIX = "/domain/api/v1"
-
-// export const MARKETPLACE_AUTH_REQUEST_PREFIX = "/marketplace/api/v1/auth"
-// export const MARKETPLACE_AUTH_PRODUCT_REQUEST_PREFIX =
-//   "/marketplace/api/v1/auth/products"
-// export const MARKETPLACE_PUBLIC_REQUEST_PREFIX =
-//   "/marketplace/api/v1/open/products"
-
-// export const MARKETPLACE_HASH_TAG_REQUEST_PREFIX =
-//   "/marketplace/api/v1/open/hashtags"

package/page/App/components/publicConfig/Act21Service/index.ts

@@ -1,106 +0,0 @@
-import axios, { AxiosRequestConfig, AxiosResponse } from "axios"
-import { actionRuntimeAxios, notNeedAuthAxios } from "./base"
-import 'regenerator-runtime/runtime';
-
-export interface RequestHandlerOptions {
-  teamIdentifier?: string
-  teamID?: string
-}
-
-const getURLWithPrefix = (
-  url: string | undefined,
-  prefix: string,
-) => {
-return prefix + url 
-}
-
-export const needAuthRequest = async <
-  ResponseData = unknown,
-  RequestData = unknown,
->(
-  requestConfig: AxiosRequestConfig<RequestData>,
-): Promise<AxiosResponse<ResponseData, RequestData>> => {
-  try {
-    return await notNeedAuthAxios.request({
-      ...requestConfig,
-    })
-  } catch (e) {
-    if (axios.isAxiosError(e) && e.response) {
-      throw e.response
-    }
-
-    throw e
-  }
-}
-
-export const notNeedAuthRequest = async <
-  ResponseData = unknown,
-  RequestData = unknown,
->(
-  requestConfig: AxiosRequestConfig<RequestData>,
-): Promise<AxiosResponse<ResponseData, RequestData>> => {
-  try {
-    return await notNeedAuthAxios.request({
-      ...requestConfig,
-    })
-  } catch (e) {
-    if (axios.isAxiosError(e) && e.response) {
-      throw e.response
-    }
-
-    throw e
-  }
-}
-
-
-
-
-export const actionBasicRequest = async <
-  ResponseData = unknown,
-  RequestData = unknown,
->(
-  requestConfig: AxiosRequestConfig<RequestData>,
-): Promise<AxiosResponse<ResponseData, RequestData>> => {
-  try {
-    return await actionRuntimeAxios.request({
-      ...requestConfig,
-    })
-  } catch (e) {
-    if (axios.isAxiosError(e) && e.response) {
-      throw e.response
-    }
-    throw e
-  }
-}
-
-export const builderRequest = async <
-  ResponseData = unknown,
-  RequestData = unknown,
->(
-  requestConfig: AxiosRequestConfig<RequestData>,
-) => {
-  const finalURL = getURLWithPrefix(
-    requestConfig.url,
-    "",
-  )
-
-  return await notNeedAuthAxios<ResponseData, RequestData>({
-    ...requestConfig,
-    url: finalURL,
-  })
-}
-
-export const directRequest = async <
-  ResponseData = unknown,
-  RequestData = unknown,
->(
-  requestConfig: AxiosRequestConfig<RequestData>,
-) => {
-  const finalURL = getURLWithPrefix(requestConfig.url, "",)
-
-  return await needAuthRequest<ResponseData, RequestData>({
-    ...requestConfig,
-    url: finalURL,
-  })
-}
-

package/page/App/components/publicConfig/action/getInitialContent.ts

@@ -1,43 +0,0 @@
-
-import { ActionContent, ActionType } from "@/redux/currentApp/action/interface"
-import { TransformerActionInitial } from "./transformerAction"
-import { RestAPIActionInitial } from "./restapiAction"
-import { GlobalDataActionContent } from "../../PublicTypes/action/globalData"
-export type RouterParams = { key: string, value: string }[]
-export interface RouterActionInitialType {
-  pageName: string,
-  params?:RouterParams
-}
-export const RouterActionInitial: RouterActionInitialType = {
-  pageName: "",
-}
-const GlobalDataActionInitial: GlobalDataActionContent = {
-  initialValue: "",
-}
-
-export function getInitialContent(actionType: ActionType): ActionContent {
-  switch (actionType) {
-    case "globalData":
-      return GlobalDataActionInitial;
-    case "restapi":
-      return RestAPIActionInitial
-    case "transformer":
-      return TransformerActionInitial
-    case "setRouter":
-      return RouterActionInitial
-    default:
-      return {} as ActionContent
-  }
-}
-
-// export function getInitialAgentContent(agent: Agent): BaseAiAgentActionContent {
-//   return {
-//     agentType: agent.agentType,
-//     model: agent.model,
-//     variables: agent.variables,
-//     input: "",
-//     modelConfig: {
-//       stream: false,
-//     },
-//   }
-// }

package/page/App/components/publicConfig/action/index.ts

@@ -1,45 +0,0 @@
-import { ACTION_RUN_TIME, ActionContent, ActionItem, IAdvancedConfig, IMockConfig } from "@/redux/currentApp/action/interface"
-export interface Transformer {
-  rawData: string
-  enable: boolean
-}
-
-export const INIT_ACTION_ADVANCED_CONFIG: IAdvancedConfig = {
-  runtime: ACTION_RUN_TIME.NONE,
-  pages: [],
-  delayWhenLoaded: "",
-  displayLoadingPage: false,
-  isPeriodically: false,
-  periodInterval: "",
-}
-
-export const INIT_ACTION_MOCK_CONFIG: IMockConfig = {
-  enabled: false,
-  enableForReleasedApp: false,
-  mockData: "",
-}
-
-export const TransformerInitial: Transformer = {
-  rawData: "",
-  enable: false,
-}
-
-export const TransformerInitialTrue: Transformer = {
-  rawData:
-    "// type your code here\n" +
-    "// example: return formatDataAsArray(data).filter(row => row.quantity > 20)\n" +
-    "return data",
-  enable: true,
-}
-
-export const actionItemInitial: Pick<
-  ActionItem<ActionContent>,
-  "transformer" | "triggerMode"
-> = {
-  transformer: TransformerInitial,
-  triggerMode: "manually",
-}
-
-export * from "./restapiAction"
-export * from "./transformerAction"
-

package/page/App/components/publicConfig/action/restapiAction.ts

@@ -1,17 +0,0 @@
-import { Params, RestAPIAction, RestAPIBodyContent, RestAPIRawBody } from "../../PublicTypes/action/restApi"
-
-
-export const RestAPIRawBodyInitial: RestAPIRawBody = {
-  type: "text",
-  content: "",
-}
-
-export const RestAPIActionInitial: RestAPIAction<RestAPIBodyContent> = {
-  url: "",
-  method: "GET",
-  urlParams: [{ key: "", value: "" } as Params],
-  headers: [{ key: "", value: "" } as Params],
-  cookies: [{ key: "", value: "" } as Params],
-  bodyType: "none",
-  body: null,
-}

package/page/App/components/publicConfig/action/transformerAction.ts

@@ -1,7 +0,0 @@
-import { TransformerAction } from "../../PublicTypes/action/transformerAction";
-
-
-export const TransformerActionInitial: TransformerAction = {
-  transformerString: `{{(function (){// Tip: assign your external references to variables instead of chaining off the curly brackets.
-return 5})()}}`,
-}

package/page/App/components/publicConfig/resource/restapi.ts

@@ -1,13 +0,0 @@
-import { RestApiAuth, RestApiResource } from "../../PublicTypes/resource";
-
-export const RestApiResourceInit: RestApiResource<RestApiAuth> = {
-  baseUrl: "",
-  urlParams: [ 
-  ],
-  headers: [
-  ],
-  cookies: [
-  ],
-  authContent: {},
-  body:{}
-}

package/page/App/components/scaleSquare/components/DragContainer/index.tsx

@@ -1,115 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
-import { FC } from "react";
-import { useDrag } from "react-dnd";
-import { useSelector, useStore } from "react-redux";
-// import { DropResultInfo } from "@/page/app/components/DotPanel/components/Canvas/interface";
-import {
-  sendMousePositionHandler,
-  sendShadowMessageHandler,
-} from "@/page/App/components/dotPanel/utils/sendBinaryMessage";
-import {
-  getIsIMPAKTEditMode,
-  getSelectedComponentDisplayNames,
-} from "@/redux/config/configSelector";
-import { getIsResizing } from "@/redux/currentApp/executionTree/executionSelector";
-import { endDragMultiNodes, startDragMultiNodes } from "@/utils/drag/drag";
-import {
-  DRAG_EFFECT,
-  DragContainerProps,
-  DragInfo,
-  //  DragInfo
-} from "./interface";
-import { dragContainerStyle } from "./style";
-// import { WidgetLayoutInfo } from "@/redux/currentApp/layoutInfo/layoutInfoState";
-type WidgetLayoutInfo = any;
-
-import { isCurrentNodeDisable } from "@/redux/currentApp/components/componentsSelector";
-import { DropResultInfo } from "../../../dotPanel/components/Canvas/interface";
-import { RootState } from "@/store";
-
-export const DragContainer: FC<DragContainerProps> = (props) => {
-  const {
-    children,
-    displayName,
-    canDrag = true,
-    columnNumber,
-    unitWidth,
-    parentNodeDisplayName,
-    isContainerWidget
-  } = props;
-  const isEditMode = useSelector(getIsIMPAKTEditMode);
-  const isResizingStateInGlobal = useSelector(getIsResizing);
-  const selectedComponents = useSelector(getSelectedComponentDisplayNames);
-  const store = useStore()
-  const [, dragRef] = useDrag<DragInfo, DropResultInfo,any>(
-    () => ({
-      type: "GRID",
-      canDrag: isEditMode && canDrag,
-      collect: (monitor) => {
-        return {
-          isDragging: monitor.isDragging(),
-        };
-      },
-      end: (draggedItem, monitor) => {
-        const dropResult: any = monitor.getDropResult();
-        sendShadowMessageHandler(-1, "", [], 0, 0, 0, 0, 0, 0, 0, 0);
-        const { draggedComponents } = draggedItem;
-
-        endDragMultiNodes(
-          draggedComponents,
-          !!dropResult?.isDropOnCanvas,
-          false,
-          store
-        );
-      },
-      item: () => {
-
-        const draggedSelectedComponents: WidgetLayoutInfo[] = [];
-        let currentSelectedComponents = selectedComponents;
-        if (!currentSelectedComponents.includes(displayName)) {
-          currentSelectedComponents = [displayName];
-        }
-        const LayoutKeys: WidgetLayoutInfo[] =[]
-          // Object.values(allWidgetLayoutInfo);
-        const draggedSelectedComponents2: WidgetLayoutInfo[] =
-          LayoutKeys.filter(
-            (node: WidgetLayoutInfo) =>
-              currentSelectedComponents.includes(node.displayName) ||
-              node.displayName === displayName
-          );
-        startDragMultiNodes(draggedSelectedComponents,store);
-        sendMousePositionHandler(parentNodeDisplayName, 0, 0, 0, 0, true);
-        const compType = draggedSelectedComponents2[0].widgetType;
-
-        return {
-          type:
-            compType !== "GridCONTAINER_WIDGET" && compType !== "CANVAS"
-              ? "Components"
-              : "undraggableComponents",
-          draggedComponents: draggedSelectedComponents2 || [],
-          dragEffect: DRAG_EFFECT.UPDATE,
-          draggedDisplayName: displayName,
-          columnNumberWhenDragged: columnNumber,
-          unitWWhenDragged: unitWidth,
-        };
-      },
-    }),
-    [
-      isEditMode,
-      isResizingStateInGlobal,
-      selectedComponents,
-      displayName,
-      unitWidth,
-      columnNumber,
-      canDrag,
-      parentNodeDisplayName,
-    ]
-  );
-  const isDisabled = isCurrentNodeDisable(displayName,store.getState() as RootState);
-  return (
-    <div css={dragContainerStyle(isContainerWidget,isEditMode)} ref={isDisabled ? null : dragRef}>
-      {children}
-    </div>
-  );
-};

package/page/App/components/scaleSquare/components/DragContainer/interface.ts

@@ -1,39 +0,0 @@
-import { ReactNode } from "react"
-// import { WidgetLayoutInfo } from "@/redux/currentApp/layoutInfo/layoutInfoState"
-type WidgetLayoutInfo = any;
-
-export interface DragContainerProps {
-  children: ReactNode
-  displayName: string
-  parentNodeDisplayName: string
-  canDrag: boolean
-  unitWidth: number
-  columnNumber: number
-  isContainerWidget:boolean
-}
-
-export enum DRAG_EFFECT {
-  ADD = "ADD",
-  UPDATE = "UPDATE",
-}
-
-export interface DragInfo {
-  type?:string
-  draggedComponents: WidgetLayoutInfo[]
-  dragEffect: DRAG_EFFECT
-  draggedDisplayName: string
-  alignTop?: boolean
-  dropResult?: {
-    shape?: {
-      x: number
-      y: number
-      w: number
-      previewH: number
-    }
-    canDrop: boolean
-    columnNumberWhenDrag: number
-    columnNumberWhenDrop: number
-  }
-  columnNumberWhenDragged: number
-  unitWWhenDragged: number
-}

package/page/App/components/scaleSquare/components/DragContainer/style.ts

@@ -1,10 +0,0 @@
-import { css } from "@emotion/react"
-
-export const dragContainerStyle =(isContainer,isEditMode)=>{ 
-  return css`
-  width: 100%;
-   height: 100%;
-   padiing-bottom:${(isContainer && isEditMode) ? 4:0}px
-`
-}
-//

package/page/App/components/scaleSquare/components/MoveBar/interface.ts

@@ -1,14 +0,0 @@
-// import { CollaboratorsInfo } from "@/redux/currentApp/collaborators/collaboratorsState"
-
-export interface MoveBarProps {
-  displayName: string
-  isError: boolean
-  maxWidth: number
-  widgetTop: number
-  widgetType: string
-  userList: any[]
-  columnNumber: number,
-  gridContainer?:boolean
-}
-
-export type BarPosition = "l" | "r" | "t" | "b" | "tl" | "tr" | "bl" | "br"

package/page/App/components/scaleSquare/components/MoveBar/moveBar.tsx

@@ -1,72 +0,0 @@
-import { FC, useEffect, useRef, useState } from "react";
-import { useSelector } from "react-redux";
-import useMeasure from "react-use-measure";
-import { SCROLL_CONTAINER_PADDING } from "@/page/App/components/dotPanel/constant/canvas";
-import {
-  //   MIN_MOVE_BAR_WIDTH,
-  MOVE_BAR_HEIGHT,
-  //   MOVE_BAR_SVG_WIDTH,
-} from "@/page/App/components/scaleSquare/constant/moveBar";
-import { useDisplayNameInMoveBarSelector } from "@/page/App/components/scaleSquare/utils/useGetDisplayNameInMoveBar";
-import { getIsLikeProductMode } from "@/redux/config/configSelector";
-import { MoveBarProps } from "./interface";
-import {
-  applyMoveBarWrapperStyle,
-  displayNameContainerStyle,
-  moveBarDisplayNameStyle,
-} from "./style";
-
-export const MoveBar: FC<MoveBarProps> = (props) => {
-  const {
-    displayName,
-    isError,
-    maxWidth,
-    widgetTop,
-    widgetType,
-    gridContainer,
-  } = props;
-
-  const [currentState, setCurrentState] = useState<string>("right");
-  const [containerRef, bounds] = useMeasure();
-  const containerWidthRef = useRef(0);
-  const isLikeProductionMode = useSelector(getIsLikeProductMode);
-  const displayNameInMoveBar = useDisplayNameInMoveBarSelector(
-    displayName,
-    widgetType
-  );
-
-  useEffect(() => {
-    if (bounds.width > containerWidthRef.current) {
-      currentState !== "right" && setCurrentState("right");
-    }
-    if (bounds.width < containerWidthRef.current) {
-      currentState !== "left" && setCurrentState("left");
-    }
-    containerWidthRef.current = bounds.width;
-  }, [bounds.width, currentState]);
-
-  const topPosition =
-    widgetTop + SCROLL_CONTAINER_PADDING >= MOVE_BAR_HEIGHT
-      ? gridContainer
-        ? -MOVE_BAR_HEIGHT + 10
-        : -MOVE_BAR_HEIGHT
-      : 0;
-  return (
-    <div
-      css={applyMoveBarWrapperStyle(
-        maxWidth,
-        10,
-        isError,
-        isLikeProductionMode,
-        topPosition
-      )}
-      id="moveBar"
-      ref={containerRef}
-    >
-      <div css={displayNameContainerStyle}>
-        {/* <DragPointIcon css={dragPointIconWrapperStyle} /> */}
-        <span css={moveBarDisplayNameStyle}>{displayNameInMoveBar}</span>
-      </div>
-    </div>
-  );
-};

package/page/App/components/scaleSquare/components/MoveBar/style.ts

@@ -1,78 +0,0 @@
-import { css } from "@emotion/react"
-import { MOVE_BAR_HEIGHT } from "@/page/App/components/scaleSquare/constant/moveBar"
-import { globalColor } from "@/utils/colorBuilder"
-export const warningStyle = css`
-  margin-left: 4px;
-`
-
-export const applyMoveBarWrapperStyle = (
-  maxWidth: number,
-  minWidth: number,
-  isError: boolean,
-  isLikeProductionMode: boolean,
-  topPosition: number,
-) => {
-  const borderRadiusStyle = css`
-    border-radius: 4px 4px 0 0;
-  `
-
-  const backgroundColorStyle = isError
-    ? globalColor(`red-03`)
-    : globalColor(`techPurple-03`)
-  return css`
-    height: ${MOVE_BAR_HEIGHT}px;
-    padding: 1px 4px 1px 0;
-    background-color: ${backgroundColorStyle};
-    ${borderRadiusStyle};
-    display: flex;
-    position: absolute;
-    top: ${topPosition}px;
-    left: 0;
-    align-items: center;
-    font-size: 12px;
-    color: #fff;
-    max-width: ${maxWidth}px;
-    min-width: ${minWidth}px;
-    visibility: ${!isLikeProductionMode ? "visible" : "hidden"};
-    z-index: 100;
-    cursor: move;
-  `
-}
-
-export const displayNameContainerStyle = css`
-  display: flex;
-  min-width: 12px;
-  flex-grow: 1;
-  align-items: center;
-`
-
-export const dragPointIconWrapperStyle = css`
-  width: 12px;
-  height: 12px;
-  flex: none;
-`
-
-export const moveBarDisplayNameStyle = css`
-  overflow: hidden;
-  text-overflow: ellipsis;
-  line-height: 16px;
-`
-
-export const docIconStyle = css`
-  height: 100%;
-  margin-left: 4px;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`
-
-export const docTipsWrapperStyle = css`
-  width: 320px;
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-  font-size: 14px;
-  color: ${globalColor("grayBlue-02")};
-  word-break: break-all;
-`

package/page/App/components/scaleSquare/components/PositionContainer/index.tsx

@@ -1,24 +0,0 @@
-import { FC, useMemo } from "react"
-import { useSelector } from "react-redux"
-import { getIsGridCanvas, getSelectedComponentDisplayNames } from "@/redux/config/configSelector"
-import { getDraggingComponentIDs } from "@/redux/currentApp/executionTree/executionSelector"
-import { PositionContainerProps } from "./interface"
-import { positionContainerStyle } from "./style"
-
-export const PositionContainer: FC<PositionContainerProps> = (props) => {
-  const { x, y, children, displayName } = props
-  const selectedComponents = useSelector(getSelectedComponentDisplayNames);
-  const draggingComponentNodes = useSelector(getDraggingComponentIDs)
-  const isGridCanvas = useSelector(getIsGridCanvas);
-  const isDragging = draggingComponentNodes.includes(displayName)
-  const isSelected = useMemo(() => {
-    return selectedComponents.some((currentDisplayName) => {
-      return displayName === currentDisplayName
-    })
-  }, [displayName, selectedComponents])
-  return (
-    <div css={!isGridCanvas &&positionContainerStyle(x, y, isDragging, isSelected)}>
-      {children}
-    </div>
-  )
-}

package/page/App/components/scaleSquare/components/PositionContainer/interface.ts

@@ -1,8 +0,0 @@
-import { ReactNode } from "react"
-
-export interface PositionContainerProps {
-  x: number
-  y: number
-  displayName: string
-  children: ReactNode
-}

package/page/App/components/scaleSquare/components/PositionContainer/style.ts

@@ -1,16 +0,0 @@
-import { css } from "@emotion/react"
-
-export const positionContainerStyle = (
-  x: number,
-  y: number,
-  isDragging: boolean,
-  isSelected: boolean,
-) => css`
-  position: absolute;
-  top: 0;
-  left: 0;
-  transform: translate(${x}px, ${y}px);
-  pointer-events: ${isDragging ? "none" : "auto"};
-  display: ${isDragging ? "none" : "block"};
-  z-index: ${isSelected ? 5 : 0};
-`