@gisce/react-ooui 1.2.0-rc.3 → 1.2.0-rc.30

package/src/widgets/modals/ExportModal.tsx

@@ -13,13 +13,13 @@ export type ExportModalProps = {
   visible: boolean;
   locale: string;
   onClose: () => void;
-  selectedRegistersToExport?: number;
+  selectedRegistersToExport?: any[];
   totalRegisters: number;
   model: string;
   domain: any[];
   limit?: number;
-  treeFields?: any;
   context?: any;
+  visibleRegisters: number;
 };
 
 export const ExportModal = (props: ExportModalProps) => {
@@ -29,26 +29,40 @@ export const ExportModal = (props: ExportModalProps) => {
     onClose,
     model,
     context,
-    treeFields,
     selectedRegistersToExport,
     totalRegisters,
     domain,
     limit,
+    visibleRegisters,
   } = props;
   const fields = useRef<any>({});
 
   const onSucceed = useCallback(
     async (options: ExportOptions) => {
-      if (options.selectedKeys.length === 0) {
+      if (
+        options.selectedKeys === undefined ||
+        options.selectedKeys.length === 0
+      ) {
         showInfo(tForLang("selectAtLeastOneField", locale));
         return;
       }
 
+      let exportDomain = domain;
+
+      if (
+        options.registersAmount === "selected" &&
+        selectedRegistersToExport?.length !== 0
+      ) {
+        exportDomain = [
+          ["id", "in", selectedRegistersToExport?.map((r) => r.id)],
+        ];
+      }
+
       const { datas } = await ConnectionProvider.getHandler().exportData({
         model,
         fields: options.selectedKeys,
-        domain: options.registersAmount === "all" ? [] : domain,
-        limit: options.registersAmount === "all" ? undefined : limit,
+        domain: exportDomain,
+        limit: options.registersAmount === "all" ? 0 : limit,
         context,
         format: options.exportType,
       });
@@ -77,13 +91,18 @@ export const ExportModal = (props: ExportModalProps) => {
     async ({ key, title }: any) => {
       let fieldDefinition;
 
-      if (key.indexOf("/") === -1) {
+      const sanitizedKey =
+        key.split("/")[key.split("/").length - 1] === "id"
+          ? key.split("/").slice(0, -1).join("/")
+          : key;
+
+      if (sanitizedKey.indexOf("/") === -1) {
         fieldDefinition = fields.current["/"];
       } else {
-        fieldDefinition = fields.current[getParentKey(key)];
+        fieldDefinition = fields.current[getParentKey(sanitizedKey)];
       }
 
-      const optsForField = fieldDefinition[getChildKey(key)];
+      const optsForField = fieldDefinition[getChildKey(sanitizedKey)];
       const relation = optsForField.relation;
       const viewData = await ConnectionProvider.getHandler().getFields({
         model: relation,
@@ -91,12 +110,12 @@ export const ExportModal = (props: ExportModalProps) => {
         fields: [],
       });
 
-      fields.current[key] = viewData;
+      fields.current[sanitizedKey] = viewData;
 
       return convertToExportField({
         fields: viewData,
         parentTitle: title,
-        parentKey: key,
+        parentKey: sanitizedKey,
       });
     },
     [fields, model, context]
@@ -108,11 +127,17 @@ export const ExportModal = (props: ExportModalProps) => {
       locale={locale as Locale}
       onSucceed={onSucceed}
       onCancel={onClose}
-      selectedRegistersToExport={selectedRegistersToExport}
+      selectedRegistersToExport={
+        selectedRegistersToExport &&
+        selectedRegistersToExport.length &&
+        selectedRegistersToExport.length > 0
+          ? selectedRegistersToExport.length
+          : undefined
+      }
       totalRegisters={totalRegisters}
       onGetFieldChilds={onGetFieldChilds}
       onGetFields={onGetFields}
-      selectedKeys={treeFields ? Object.keys(treeFields) : undefined}
+      visibleRegisters={visibleRegisters}
     />
   );
 };
@@ -130,14 +155,27 @@ const convertToExportField = ({
 
   for (const key of Object.keys(fields)) {
     const valuesForField = fields[key];
+
+    if (valuesForField.relation && valuesForField.is_function === true) {
+      continue;
+    }
+
     const relationField =
       valuesForField.type === "many2one" ||
       valuesForField.type === "one2many" ||
       valuesForField.type === "many2many";
 
+    let newKey = `${parentKey ? parentKey + "/" : ""}${key}`;
+
+    if (relationField) {
+      newKey += "/id";
+    }
+
     exportFields.push({
-      key: `${parentKey ? parentKey + "/" : ""}${key}`,
-      title: `${parentTitle ? parentTitle + "/" : ""}${valuesForField.string}`,
+      key: newKey,
+      title: `${parentTitle ? parentTitle + " → " : ""}${
+        valuesForField.string
+      }`,
       tooltip: valuesForField.help,
       required: valuesForField.required,
       isLeaf: !relationField,

package/src/widgets/views/Dashboard/Dashboard.tsx

@@ -308,6 +308,10 @@ function Dashboard(props: DashboardProps, ref: any) {
             />
           );
         } else if (initialView !== undefined) {
+          const formattedInitialView =
+            initialView && Array.isArray(initialView.id)
+              ? { ...initialView, id: initialView.id[0] }
+              : initialView;
           childContent = (
             <ActionView
               action_id={actionId}
@@ -319,7 +323,7 @@ function Dashboard(props: DashboardProps, ref: any) {
               context={context}
               domain={domain}
               setCanWeClose={() => {}}
-              initialView={initialView}
+              initialView={formattedInitialView}
               limit={limit}
             />
           );

package/src/widgets/views/Form.tsx

@@ -15,6 +15,7 @@ import {
   Row,
   Alert,
   Spin,
+  message,
 } from "antd";
 import Measure from "react-measure";
 import { CheckOutlined, CloseOutlined } from "@ant-design/icons";
@@ -105,7 +106,7 @@ function Form(props: FormProps, ref: any) {
     defaultValues,
     forcedValues = {},
   } = props;
-  const { lang } = useContext(LocaleContext) as LocaleContextType;
+  const { t, lang } = useContext(LocaleContext) as LocaleContextType;
 
   const [isSubmitting, setIsSubmitting] = useState<boolean>(false);
   const [error, setError] = useState<string>();
@@ -126,7 +127,8 @@ function Form(props: FormProps, ref: any) {
   const responsiveBehaviour = containerWidth < WIDTH_BREAKPOINT;
 
   const formContext = useContext(FormContext) as FormContextType;
-  const { activeId: parentId } = formContext || {};
+  const { activeId: parentId, getPlainValues: getParentPlainValues } =
+    formContext || {};
 
   const actionViewContext = useContext(
     ActionViewContext
@@ -342,6 +344,7 @@ function Form(props: FormProps, ref: any) {
       await antForm.validateFields();
       return false;
     } catch (verror) {
+      message.error(t("fillRequiredFields"));
       return true;
     }
   }
@@ -398,13 +401,11 @@ function Form(props: FormProps, ref: any) {
     if (valuesProps) {
       values = valuesProps;
     } else {
-      ({
-        values,
-        defaultGetCalled: hasDefaultGetCalled,
-      } = await fetchValuesFromApi({
-        fields: _fields,
-        arch: _arch!,
-      }));
+      ({ values, defaultGetCalled: hasDefaultGetCalled } =
+        await fetchValuesFromApi({
+          fields: _fields,
+          arch: _arch!,
+        }));
     }
 
     if (actionDomain) {
@@ -455,15 +456,13 @@ function Form(props: FormProps, ref: any) {
 
   const getFormView = async (): Promise<FormView> => {
     if (getDataFromAction) {
-      const action = await ConnectionProvider.getHandler().getActionStringForModel(
-        model
-      );
-      const viewsForAction = await ConnectionProvider.getHandler().getViewsForAction(
-        {
+      const action =
+        await ConnectionProvider.getHandler().getActionStringForModel(model);
+      const viewsForAction =
+        await ConnectionProvider.getHandler().getViewsForAction({
           action,
           context: parentContext,
-        }
-      );
+        });
       return viewsForAction.views.get("form");
     }
 
@@ -640,6 +639,7 @@ function Form(props: FormProps, ref: any) {
       setIsSubmitting(false);
       setFormIsSaving?.(false);
       onSubmitError?.(err);
+      message.error(t("errorWhileSavingForm"));
       setError(err?.message ? err.message : err);
     } finally {
       formSubmitting.current = false;
@@ -695,7 +695,7 @@ function Form(props: FormProps, ref: any) {
       if (
         checkFieldsType({
           changedFields,
-          fields,
+          formOoui: formOoui!,
           types: [
             "text",
             "codeeditor",
@@ -756,6 +756,7 @@ function Form(props: FormProps, ref: any) {
           ...formOoui?.context,
         },
       },
+      parentValues: getParentPlainValues?.(),
       onChangeFieldActionArgs: onChangeFieldAction.args,
     });
 

package/src/widgets/views/Tree.tsx

@@ -16,6 +16,9 @@ import {
   LoadingOutlined,
 } from "@ant-design/icons";
 import { One2manyValue } from "../base/one2many/One2manyInput";
+import { Interweave } from "interweave";
+import { Many2oneTree } from "../base/many2one/Many2oneTree";
+import { ReferenceTree } from "../base/ReferenceTree";
 
 type Props = {
   total?: number;
@@ -51,18 +54,11 @@ const booleanComponentFn = (value: boolean): React.ReactElement => {
 };
 
 const many2OneComponentFn = (m2oField: any): React.ReactElement => {
-  if (!m2oField) {
-    return <></>;
-  }
-  return (
-    <Space>
-      <>{m2oField.value}</>
-      <Many2oneSuffix id={m2oField.id} model={m2oField.model} />
-    </Space>
-  );
+  return <Many2oneTree m2oField={m2oField} />;
 };
+
 const textComponentFn = (value: any): React.ReactElement => {
-  return <div style={{ whiteSpace: "pre-line" }}>{value}</div>;
+  return <Interweave content={value?.replace(/(?:\r\n|\r|\n)/g, "<br>")} />;
 };
 
 const one2ManyComponentFn = (value: One2manyValue): React.ReactElement => {
@@ -91,6 +87,10 @@ const imageComponent = (value: string): React.ReactElement => {
   );
 };
 
+const referenceComponent = (value: any): React.ReactElement => {
+  return <ReferenceTree value={value} />;
+};
+
 function Tree(props: Props): React.ReactElement {
   const {
     page = 1,
@@ -135,6 +135,7 @@ function Tree(props: Props): React.ReactElement {
       image: imageComponent,
       integer: numberComponent,
       float: numberComponent,
+      reference: referenceComponent,
     });
 
     setColumns(columns);
@@ -171,7 +172,9 @@ function Tree(props: Props): React.ReactElement {
         <Col span={12}>
           <Pagination
             total={total}
-            pageSize={internalLimit.current}
+            pageSize={
+              internalLimit.current === 0 ? total : internalLimit.current
+            }
             current={page}
             showSizeChanger={false}
             onChange={onRequestPageChange}

package/dist/ui/Fieldset.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-declare type Props = {
-    label: string;
-    children: any;
-};
-declare const Fieldset: (props: Props) => React.ReactElement;
-export default Fieldset;
-//# sourceMappingURL=Fieldset.d.ts.map

package/dist/ui/Fieldset.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Fieldset.d.ts","sourceRoot":"","sources":["Fieldset.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,aAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,GAAG,CAAC;CACf,CAAC;AAEF,QAAA,MAAM,QAAQ,UAAW,KAAK,KAAG,MAAM,YAqBtC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/src/ui/Fieldset.tsx

@@ -1,31 +0,0 @@
-import React from "react";
-
-type Props = {
-  label: string;
-  children: any;
-};
-
-const Fieldset = (props: Props): React.ReactElement => {
-  const { label, children } = props;
-
-  return (
-    // TODO: change in-line styles to TailWind classes
-    <fieldset className="p-2 border-gray-400 border border-solid  font-sans">
-      <legend
-        style={{
-          all: "initial",
-          marginLeft: "1em",
-          paddingLeft: "0.5em",
-          paddingRight: "0.5em",
-          fontFamily:
-            "system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji'",
-        }}
-      >
-        {label}
-      </legend>
-      {children}
-    </fieldset>
-  );
-};
-
-export default Fieldset;