Release/4.0.8

illacloud · Dec 15, 2023 · 767d902 · 767d902
2 parents 9acfdf5 + f802a32
commit 767d902
Show file tree

Hide file tree

Showing 36 changed files with 250 additions and 179 deletions.
diff --git a/README.md b/README.md
@@ -30,14 +30,11 @@ English | <a href="https://github.com/illacloud/illa-builder/blob/main/README-CN
   <a href="./CONTRIBUTING.md"><img src="https://badgen.net/badge/PRs/Welcome/green?icon=storybook" height=18></a>
 </p>
 
-
 [![License](https://img.shields.io/badge/license-Apache%202-4EB1BA.svg?style=socialflat-square&)](https://www.apache.org/licenses/LICENSE-2.0.html)
-[![Formatting (pre-commit)](https://github.com/ros-planning/moveit2/actions/workflows/format.yaml/badge.svg?branch=main)](https://github.com/illacloud/illa-builder/actions/workflows/format.yaml?query=branch%3Amain)
-[![CI (Rolling and Humble)](https://github.com/ros-planning/moveit2/actions/workflows/ci.yaml/badge.svg?branch=main)](https://github.com/illacloud/illa-builder/actions/workflows/ci.yaml?query=branch%3Amain)
-[![Code Coverage](https://codecov.io/gh/ros-planning/moveit2/branch/main/graph/badge.svg?token=W7uHKcY0ly)](https://codecov.io/gh/illacloud/illa-builder)
-[![Stars](https://img.shields.io/github/stars/ros-planning/moveit2.svg?style=flat)](https://github.com/illacloud/illa-builder/stars)
-[![Issues](https://img.shields.io/github/issues/ros-planning/moveit2.svg?style=flat)](https://github.com/illacloud/illa-builder/issues)
-[![Forks](https://img.shields.io/github/forks/ros-planning/moveit2.svg?style=flat)](https://github.com/illacloud/illa-builder/forks)
+[![CI (Rolling and Humble)](https://github.com/illacloud/illa-builder/actions/workflows/build-docker.yml/badge.svg?query=branch%3Amain)](https://github.com/illacloud/illa-builder/actions/workflows/build-docker.yml?query=branch%3Amain)
+[![Stars](https://img.shields.io/github/stars/illacloud/illa-builder.svg?style=flat)](https://github.com/illacloud/illa-builder/stars)
+[![Issues](https://img.shields.io/github/issues/illacloud/illa-builder.svg?style=flat)](https://github.com/illacloud/illa-builder/issues)
+[![Forks](https://img.shields.io/github/forks/illacloud/illa-builder.svg?style=flat)](https://github.com/illacloud/illa-builder/forks)
 [![PR:s Welcome](https://img.shields.io/badge/PR:s-welcome-brightgreen.svg)](https://github.com/illacloud/illa-builder/pulls)
 [![First Contributors](https://img.shields.io/badge/first-contributors-brightgreen.svg)](https://github.com/illacloud/illa-builder/pulls)
 ![GitHub repo size](https://img.shields.io/github/repo-size/illacloud/illa-builder)

diff --git a/apps/builder/package.json b/apps/builder/package.json
@@ -5,7 +5,7 @@
   "private": true,
   "author": "ILLA Cloud <[email protected]>",
   "license": "Apache-2.0",
-  "version": "4.0.7",
+  "version": "4.0.8",
   "scripts": {
     "dev": "vite --strictPort --force",
     "build-cloud": "NODE_OPTIONS=--max-old-space-size=12288  vite build --mode cloud",

diff --git a/apps/builder/src/assets/chat/avatarPadding.svg b/apps/builder/src/assets/chat/avatarPadding.svg
diff --git a/apps/builder/src/hooks/utils/fixedComponents.ts b/apps/builder/src/hooks/utils/fixedComponents.ts
@@ -41,19 +41,40 @@ const fixedMenuComponent = (component: ComponentTreeNode) => {
 }
 
 const fixedListComponent = (component: ComponentTreeNode) => {
+  let fixedEnablePagination = true
+  if (component.props) {
+    fixedEnablePagination =
+      component.props.enablePagination !== undefined
+        ? component.props.enablePagination
+        : component.props.overflowMethod === "PAGINATION"
+  }
   return {
     ...component,
     props: {
       ...component.props,
-      enablePagination:
-        component.props && component.props.overflowMethod === "PAGINATION"
-          ? true
-          : false,
+      enablePagination: fixedEnablePagination,
       backgroundColor: "#ffffffbf",
     },
   }
 }
 
+const fixedDataGridComponent = (component: ComponentTreeNode) => {
+  let fixedEnablePagination = true
+  if (component.props) {
+    fixedEnablePagination =
+      component.props.enablePagination !== undefined
+        ? component.props.enablePagination
+        : component.props.overflowMethod === "PAGINATION"
+  }
+  return {
+    ...component,
+    props: {
+      ...component.props,
+      enablePagination: fixedEnablePagination,
+    },
+  }
+}
+
 export const fixedComponentsToNewComponents = (
   componentsTree: ComponentTreeNode,
 ) => {
@@ -70,6 +91,8 @@ export const fixedComponentsToNewComponents = (
           }
           case "LIST_WIDGET":
             return fixedListComponent(component)
+          case "DATA_GRID_WIDGET":
+            return fixedDataGridComponent(component)
           default: {
             return fixedComponentsToNewComponents(component)
           }

diff --git a/apps/builder/src/page/App/components/DotPanel/components/Canvas/style.ts b/apps/builder/src/page/App/components/DotPanel/components/Canvas/style.ts
@@ -52,7 +52,7 @@ export const outerComponentCanvasContainerWithJsonStyle = (
   width: 100%;
   padding: ${padding}px;
   position: relative;
-  overflow: auto;
+  overflow: hidden auto;
 `
 
 export const componentCanvasContainerStyle = css`

diff --git a/...src/page/App/components/InspectPanel/PanelSetters/InputSetter/MeasureCheckInput/index.tsx b/...src/page/App/components/InspectPanel/PanelSetters/InputSetter/MeasureCheckInput/index.tsx
@@ -34,10 +34,10 @@ const MeasureCheckInput: FC<MeasureCheckInputSetterProps> = (props) => {
         if (decimalArr) currentValue = decimalArr.join("") + "px"
       }
       handleUpdateMultiAttrDSL?.({
-        borderWidth: currentValue,
+        [attrName]: currentValue,
       })
     },
-    [handleUpdateMultiAttrDSL],
+    [attrName, handleUpdateMultiAttrDSL],
   )
 
   return (

diff --git a/...lder/src/page/App/components/InspectPanel/PanelSetters/InputSetter/PaddingInput/index.tsx b/...lder/src/page/App/components/InspectPanel/PanelSetters/InputSetter/PaddingInput/index.tsx
@@ -1,6 +1,6 @@
 import PartialIcon from "@assets/rightPagePanel/partial.svg?react"
+import { get } from "lodash"
 import { FC, FocusEventHandler, useRef } from "react"
-import { useTranslation } from "react-i18next"
 import { useDispatch } from "react-redux"
 import { Input, RadioGroup } from "@illa-design/react"
 import AllIcon from "@/assets/rightPagePanel/all.svg?react"
@@ -61,12 +61,12 @@ const options = [
 export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
   props,
 ) => {
-  const { t } = useTranslation()
   const dispatch = useDispatch()
-  const { handleUpdateMultiAttrDSL, componentNode } = props
+  const { handleUpdateMultiAttrDSL, componentNode, attrName, labelName } = props
+
   const paddingValue = {
-    mode: componentNode?.props?.padding?.mode ?? PADDING_MODE.ALL,
-    size: componentNode?.props?.padding?.size ?? "0",
+    mode: get(componentNode, `props.${attrName}.mode`, PADDING_MODE.ALL),
+    size: get(componentNode, `props.${attrName}.size`, "0"),
   }
 
   const values = paddingValue.size.split(" ")
@@ -76,7 +76,7 @@ export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
 
   const handleChangeAllValue = (allValue: string) => {
     handleUpdateMultiAttrDSL?.({
-      padding: {
+      [attrName]: {
         mode: PADDING_MODE.ALL,
         size: allValue,
       },
@@ -85,7 +85,7 @@ export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
 
   const handleBlurAllValue: FocusEventHandler<HTMLInputElement> = (e) => {
     handleUpdateMultiAttrDSL?.({
-      padding: {
+      [attrName]: {
         mode: PADDING_MODE.ALL,
         size: formatValue(e.target.value ?? ""),
       },
@@ -98,7 +98,7 @@ export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
       values[index] = partialValue
       if (partialValue !== "" && !/^[0-9]+$/.test(partialValue)) return
       handleUpdateMultiAttrDSL?.({
-        padding: {
+        [attrName]: {
           mode: PADDING_MODE.PARTIAL,
           size: values.join(" "),
         },
@@ -117,7 +117,7 @@ export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
         }
 
         handleUpdateMultiAttrDSL?.({
-          padding: {
+          [attrName]: {
             size: result,
             mode: mode,
           },
@@ -135,7 +135,7 @@ export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
         }
 
         handleUpdateMultiAttrDSL?.({
-          padding: {
+          [attrName]: {
             size: result,
             mode: mode,
           },
@@ -155,7 +155,7 @@ export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
       const value = formatPartialValue(e.target.value)
       values[index] = value
       handleUpdateMultiAttrDSL?.({
-        padding: {
+        [attrName]: {
           mode: PADDING_MODE.PARTIAL,
           size: values.join(" "),
         },
@@ -167,7 +167,7 @@ export const DirectionPaddingSetter: FC<DirectionPaddingSetterProps> = (
   return (
     <>
       <div css={setterContainerStyle}>
-        <PanelLabel labelName={t("editor.inspect.setter_group.padding")} />
+        <PanelLabel labelName={labelName} />
         <RadioGroup
           type="button"
           options={options}

diff --git a/apps/builder/src/widgetLibrary/ChatWidget/components/messageItem.tsx b/apps/builder/src/widgetLibrary/ChatWidget/components/messageItem.tsx
@@ -23,6 +23,7 @@ export const MessageItem: FC<IMessageItem> = (props) => {
     showAvatar,
     showName,
     showSendTime,
+    avatarPadding,
   } = props
   const {
     message: content = "",
@@ -36,7 +37,6 @@ export const MessageItem: FC<IMessageItem> = (props) => {
   } = message
 
   const isOwnMessage = !!currentSenderId && senderId === currentSenderId
-
   return (
     <>
       <Message
@@ -46,7 +46,7 @@ export const MessageItem: FC<IMessageItem> = (props) => {
           position: "single",
         }}
         avatarPosition={isOwnMessage ? "tr" : "tl"}
-        css={messageContentStyle(isOwnMessage)}
+        css={messageContentStyle(isOwnMessage, avatarPadding)}
       >
         {showAvatar && <Avatar src={senderAvatar} />}
         <Message.Header>

diff --git a/apps/builder/src/widgetLibrary/ChatWidget/interface.ts b/apps/builder/src/widgetLibrary/ChatWidget/interface.ts
@@ -48,6 +48,7 @@ export interface BaseChatProps extends BaseWidgetProps {
   showSendTime?: boolean
   showFooter?: boolean
   backgroundColor?: string
+  avatarPadding?: string
   handleOnReply?: (message: MessageContent | undefined) => void
   handleOnDelete?: (message: MessageContent | undefined) => void
 }

diff --git a/apps/builder/src/widgetLibrary/ChatWidget/panelConfig.tsx b/apps/builder/src/widgetLibrary/ChatWidget/panelConfig.tsx
@@ -1,3 +1,4 @@
+import AvatarPaddingIcon from "@/assets/chat/avatarPadding.svg?react"
 import RadioIcon from "@/assets/radius-icon.svg?react"
 import i18n from "@/i18n/config"
 import { PanelConfig } from "@/page/App/components/InspectPanel/interface"
@@ -9,7 +10,7 @@ const baseWidgetName = "chat"
 export const CHAT_PANEL_CONFIG: PanelConfig[] = [
   {
     id: `${baseWidgetName}-data`,
-    groupName: i18n.t("editor.inspect.setter_group.MESSAGE"), //TODO,
+    groupName: i18n.t("editor.inspect.setter_group.MESSAGE"),
     children: [
       {
         id: `${baseWidgetName}-data-source`,
@@ -296,6 +297,15 @@ export const CHAT_PANEL_CONFIG: PanelConfig[] = [
             useCustomLayout: true,
             defaultValue: "small",
           },
+          {
+            id: `${baseWidgetName}-style-avatar-padding`,
+            labelName: i18n.t("editor.inspect.setter_group.padding"),
+            attrName: "avatarPadding",
+            icon: <AvatarPaddingIcon />,
+            setterType: "MEASURE_CHECK_INPUT_SETTER",
+            useCustomLayout: true,
+            defaultValue: "32px",
+          },
         ],
       },
     ],

diff --git a/apps/builder/src/widgetLibrary/ChatWidget/style.ts b/apps/builder/src/widgetLibrary/ChatWidget/style.ts
@@ -60,36 +60,42 @@ export const messageHeaderTimeStyle = css`
   line-height: 20px;
   color: ${getColor("grayBlue", "03")};
 `
-export const messageContentStyle = (isOwn: boolean) => css`
-  .cs-message__content-wrapper {
-    margin-top: 12px;
-    width: 100%;
-  }
-  .cs-message__footer {
-    margin: 0;
-  }
-  .cs-message__content {
-    height: auto;
-    width: auto;
-    border-radius: 0;
-    padding: 0;
-    background-color: transparent !important;
-  }
-  .cs-message__avatar {
-    margin: ${isOwn ? "12px 40px 0 16px" : "12px 16px 0 40px"} !important;
-    width: 32px;
-    .cs-avatar {
-      height: 32px;
+export const messageContentStyle = (isOwn: boolean, avatarPadding?: string) => {
+  const finalAvatarPadding = !avatarPadding ? "32px" : avatarPadding
+
+  return css`
+    .cs-message__content-wrapper {
+      margin-top: 12px;
+      width: 100%;
+    }
+    .cs-message__footer {
+      margin: 0;
+    }
+    .cs-message__content {
+      height: auto;
+      width: auto;
+      border-radius: 0;
+      padding: 0;
+      background-color: transparent !important;
+    }
+    .cs-message__avatar {
+      margin: ${isOwn
+        ? `12px ${finalAvatarPadding} 0 16px`
+        : `12px 16px 0 ${finalAvatarPadding}`} !important;
       width: 32px;
-      min-height: 32px;
-      min-width: 32px;
+      .cs-avatar {
+        height: 32px;
+        width: 32px;
+        min-height: 32px;
+        min-width: 32px;
+      }
     }
-  }
-  .cs-message__custom-content {
-    padding-bottom: 8px;
-    display: flex;
-  }
-`
+    .cs-message__custom-content {
+      padding-bottom: 8px;
+      display: flex;
+    }
+  `
+}
 
 export const messageFooterStyle = (isOwn: boolean) => css`
   flex-direction: ${isOwn ? "row-reverse" : "row"};

diff --git a/apps/builder/src/widgetLibrary/ChatWidget/widgetConfig.tsx b/apps/builder/src/widgetLibrary/ChatWidget/widgetConfig.tsx
@@ -89,5 +89,6 @@ export const CHAT_WIDGET_CONFIG: WidgetConfig = {
     replyMessage: emptyMessage,
     radius: "4px",
     shadow: "small",
+    avatarPadding: "32px",
   },
 }
diff --git a/apps/builder/src/widgetLibrary/ContainerWidget/panelConfig.tsx b/apps/builder/src/widgetLibrary/ContainerWidget/panelConfig.tsx
@@ -175,7 +175,7 @@ export const CONTAINER_PANEL_CONFIG: PanelConfig[] = [
       {
         id: `${baseWidgetName}-styles-padding`,
         setterType: "PADDING_INPUT_SETTER",
-        labelName: i18n.t("editor.inspect.setter_label.style"),
+        labelName: i18n.t("editor.inspect.setter_group.padding"),
         attrName: "padding",
         useCustomLayout: true,
       },

diff --git a/apps/builder/src/widgetLibrary/DataGridWidget/dataGrid.tsx b/apps/builder/src/widgetLibrary/DataGridWidget/dataGrid.tsx
@@ -41,7 +41,6 @@ export const DataGridWidget: FC<BaseDataGridProps> = (props) => {
     displayName,
     rowSelection,
     rowSelectionMode,
-    overFlow,
     pageSize,
     page,
     pageSizeOptions,
@@ -62,6 +61,7 @@ export const DataGridWidget: FC<BaseDataGridProps> = (props) => {
     updateComponentRuntimeProps,
     deleteComponentRuntimeProps,
     columns,
+    enablePagination,
   } = props
 
   const rawData = dataSourceMode === "dynamic" ? dataSourceJS : dataSource
@@ -229,6 +229,8 @@ export const DataGridWidget: FC<BaseDataGridProps> = (props) => {
             } else {
               if (primaryKey in row) {
                 return get(row, primaryKey)
+              } else {
+                return ""
               }
             }
           }}
@@ -291,7 +293,7 @@ export const DataGridWidget: FC<BaseDataGridProps> = (props) => {
                 ]
               : []
           }
-          pagination={overFlow === "pagination"}
+          pagination={enablePagination}
           pageSizeOptions={isArray(pageSizeOptions) ? pageSizeOptions : []}
           autoPageSize={pageSize === undefined}
           paginationModel={
@@ -346,7 +348,7 @@ export const DataGridWidget: FC<BaseDataGridProps> = (props) => {
           columns={(renderColumns as GridColDef[]) ?? []}
           paginationMode={enableServerSidePagination ? "server" : "client"}
           rowCount={
-            totalRowCount !== undefined
+            totalRowCount !== undefined && enableServerSidePagination
               ? Math.ceil(totalRowCount / (pageSize ?? 1))
               : undefined
           }