@gisce/react-ooui 0.1.0

package/src/context/ContentRootContext.tsx

@@ -0,0 +1,422 @@
+import { FormView, GenerateReportOptions } from "@/types";
+import React, {
+  useContext,
+  useRef,
+  useState,
+  forwardRef,
+  useImperativeHandle,
+} from "react";
+import showErrorDialog from "@/ui/ActionErrorDialog";
+import { openBase64InNewTab, getMimeType } from "@/helpers/filesHelper";
+import { parseContext } from "@gisce/ooui";
+import ConnectionProvider from "@/ConnectionProvider";
+import { Modal, Spin } from "antd";
+import {
+  TabManagerContext,
+  TabManagerContextType,
+} from "@/context/TabManagerContext";
+import { FormModal } from "@/widgets/modals/FormModal";
+import { LocaleContext, LocaleContextType } from "@/context/LocaleContext";
+
+export type ContentRootContextType = {
+  processAction: ({
+    actionData,
+    fields,
+    values,
+    context,
+  }: {
+    actionData: any;
+    fields: any;
+    values: any;
+    context?: any;
+    onRefreshParentValues?: () => void;
+  }) => Promise<any>;
+  globalValues?: any;
+};
+
+type ActionModalOpts = {
+  model?: string;
+  domain?: any;
+  context: any;
+  formView?: FormView;
+  actionData?: any;
+};
+
+export const ContentRootContext = React.createContext<ContentRootContextType | null>(
+  null
+);
+
+type ContentRootProviderProps = {
+  children: React.ReactNode;
+  globalValues?: any;
+};
+
+const ContentRootProvider = (
+  props: ContentRootProviderProps,
+  ref: any
+): any => {
+  const { children, globalValues = {} } = props;
+  const reportInProgressInterval = useRef<any>();
+  const waitingForReport = useRef<boolean>();
+  const [reportGenerating, setReportGenerating] = useState<boolean>(false);
+  const tabManagerContext = useContext(
+    TabManagerContext
+  ) as TabManagerContextType;
+  const { openAction } = tabManagerContext || {};
+  const onRefreshParentValues = useRef<any>();
+  const { t } = useContext(LocaleContext) as LocaleContextType;
+
+  useImperativeHandle(ref, () => ({
+    openActionModal,
+  }));
+
+  // Action modal state
+  const [actionModalVisible, setActionModalVisible] = useState<boolean>(false);
+
+  const [actionModalOptions, setActionModalOptions] = useState<ActionModalOpts>(
+    {
+      context: {},
+    }
+  );
+
+  async function generateReport(options: GenerateReportOptions) {
+    const { reportData, fields, values, context = {} } = options;
+
+    const {
+      context: reportContext,
+      model,
+      datas = {},
+      report_name,
+      type,
+    } = reportData;
+
+    if (type !== "ir.actions.report.xml") {
+      showErrorDialog(`${type} action not supported`);
+      return;
+    }
+
+    const { ids, ...datasource } = datas || {};
+
+    let idsToExecute = ids;
+
+    const reportContextParsed =
+      typeof reportContext === "string"
+        ? parseContext({
+            context: reportContext,
+            fields,
+            values,
+          })
+        : reportContext;
+
+    if (!idsToExecute) {
+      const results = await ConnectionProvider.getHandler().searchAllIds({
+        params: [],
+        model: datasource.model || model,
+        totalItems: 1,
+        context: { ...context, ...reportContextParsed },
+      });
+
+      if (results.length === 0) {
+        showErrorDialog("Nothing to print");
+        return;
+      }
+
+      idsToExecute = results;
+      datas.id = results[0];
+    }
+
+    try {
+      const newReportId = await ConnectionProvider.getHandler().createReport({
+        model,
+        name: report_name,
+        datas,
+        ids: idsToExecute,
+        context: { ...context, ...reportContextParsed },
+      });
+
+      setReportGenerating(true);
+
+      waitingForReport.current = true;
+      reportInProgressInterval.current = setInterval(() => {
+        evaluateReportStatus(newReportId);
+      }, 1000);
+    } catch (err) {
+      waitingForReport.current = false;
+      clearInterval(reportInProgressInterval.current);
+      showErrorDialog(err);
+      setReportGenerating(false);
+    }
+  }
+
+  async function evaluateReportStatus(id: any) {
+    let reportState;
+    try {
+      reportState = await ConnectionProvider.getHandler().getReport({
+        id,
+      });
+      if (reportState.state && waitingForReport.current === true) {
+        waitingForReport.current = false;
+        clearInterval(reportInProgressInterval.current);
+        setReportGenerating(false);
+        const fileType: any = await getMimeType(reportState.result);
+        openBase64InNewTab(reportState.result, fileType.mime);
+      }
+    } catch (error) {
+      waitingForReport.current = false;
+      clearInterval(reportInProgressInterval.current);
+      setReportGenerating(false);
+      showErrorDialog(error.exception || error);
+    }
+  }
+
+  async function processAction({
+    actionData,
+    fields,
+    values,
+    context,
+    onRefreshParentValues: onRefreshParentValuesFn,
+  }: {
+    actionData: any;
+    fields: any;
+    values: any;
+    context?: any;
+    onRefreshParentValues?: any;
+  }) {
+    const { type } = actionData;
+    onRefreshParentValues.current = onRefreshParentValuesFn;
+
+    if (type === "ir.actions.report.xml") {
+      return await generateReport({
+        reportData: actionData,
+        fields,
+        values,
+        context,
+      });
+    } else if (type === "ir.actions.act_window") {
+      return await runAction({ actionData, fields, values, context });
+    } else {
+      showErrorDialog(`${type} action not supported`);
+      return {};
+    }
+  }
+
+  async function runAction({
+    actionData: _actionData,
+    fields = {},
+    values = {},
+    context = {},
+  }: {
+    actionData: any;
+    fields?: any;
+    values?: any;
+    context?: any;
+  }) {
+    let actionData = _actionData;
+
+    if (!_actionData.res_model) {
+      actionData = (
+        await ConnectionProvider.getHandler().readObjects({
+          model: "ir.actions.act_window",
+          ids: [parseInt(_actionData.id)],
+          context,
+        })
+      )[0];
+    }
+
+    const responseContext =
+      typeof actionData?.context === "string"
+        ? parseContext({
+            context: actionData.context,
+            fields,
+            values: { ...values, ...globalValues },
+          })
+        : actionData.context;
+
+    const mergedContext = {
+      ...responseContext,
+      ...context,
+    };
+
+    let parsedDomain = [];
+
+    if (actionData.domain) {
+      parsedDomain = await ConnectionProvider.getHandler().evalDomain({
+        domain: actionData.domain,
+        values: { ...values, ...globalValues },
+        context: mergedContext,
+      });
+    }
+
+    // -- Possible values for target property --
+    // * new ==> modal
+    // * current ==> new tab
+    // * undefined ==> new tab
+    if (actionData.target === "new") {
+      const formView = (await ConnectionProvider.getHandler().getView({
+        model: actionData.res_model,
+        type: "form",
+        id: actionData?.view_id?.[0] || undefined,
+        context,
+      })) as FormView;
+
+      openActionModal({
+        domain: parsedDomain,
+        model: actionData.res_model,
+        formView,
+        context: mergedContext,
+      });
+
+      return {};
+    } else {
+      let initialView;
+      const viewTypes = actionData.view_mode.split(",");
+      const views = [];
+
+      for (const viewType of viewTypes) {
+        const viewData = await ConnectionProvider.getHandler().getView({
+          model: actionData.res_model,
+          type: viewType,
+          context: mergedContext,
+        });
+        views.push([viewData.view_id, viewType]);
+      }
+
+      if (!actionData.view_id) {
+        const type = actionData.view_mode.split(",")[0];
+
+        const [retrievedViewId] = views.find(
+          ([_, viewType]) => viewType === type
+        )!;
+
+        initialView = { id: retrievedViewId, type };
+      } else {
+        initialView = {
+          id: actionData.view_id,
+          type: actionData.view_mode.split(",")[0],
+        };
+      }
+
+      openAction?.({
+        target: "current",
+        context: mergedContext,
+        domain: parsedDomain,
+        model: actionData.res_model,
+        views: views,
+        title: actionData.name,
+        initialView,
+        action_id: actionData.id,
+        action_type: actionData.type,
+      });
+
+      return { closeParent: true };
+    }
+  }
+
+  function openActionModal({
+    domain,
+    model,
+    formView,
+    context,
+    actionData,
+  }: {
+    domain: any;
+    model: string;
+    formView: FormView;
+    context: any;
+    actionData?: any;
+  }) {
+    if (actionModalVisible) {
+      openNewActionModal({ domain, model, formView, context, actionData });
+    } else {
+      setActionModalOptions({ domain, model, context, formView, actionData });
+      setActionModalVisible(true);
+    }
+  }
+
+  async function openNewActionModal({
+    domain,
+    model,
+    formView,
+    context,
+    actionData,
+  }: {
+    domain: any;
+    model: string;
+    formView: FormView;
+    context: any;
+    actionData?: any;
+  }) {
+    setActionModalOptions({
+      domain: undefined,
+      model: undefined,
+      context: {},
+      formView: undefined,
+      actionData: undefined,
+    });
+    setActionModalVisible(false);
+    await new Promise((resolve) => setTimeout(resolve, 300));
+    setActionModalOptions({ domain, model, context, formView, actionData });
+    setActionModalVisible(true);
+  }
+
+  async function onFormModalSucceed() {
+    onRefreshParentValues.current?.();
+    setActionModalVisible(false);
+    setActionModalOptions({
+      domain: undefined,
+      model: undefined,
+      context: {},
+      formView: undefined,
+      actionData: undefined,
+    });
+  }
+
+  return (
+    <>
+      <ContentRootContext.Provider
+        value={{
+          processAction,
+          globalValues,
+        }}
+      >
+        <>
+          {children}
+          <Modal
+            title={t("generatingReport")}
+            visible={reportGenerating}
+            footer={null}
+            closable={false}
+            centered
+          >
+            <Spin />
+          </Modal>
+          <FormModal
+            buttonModal
+            parentContext={actionModalOptions.context}
+            model={actionModalOptions.model!}
+            formView={actionModalOptions.formView}
+            visible={actionModalVisible}
+            onSubmitSucceed={onFormModalSucceed}
+            onCancel={() => {
+              onRefreshParentValues.current?.();
+              setActionModalVisible(false);
+              setActionModalOptions({
+                domain: undefined,
+                model: undefined,
+                context: {},
+                formView: undefined,
+                actionData: undefined,
+              });
+            }}
+            showFooter={false}
+            actionDomain={actionModalOptions.domain}
+            isMenuAction={actionModalOptions?.actionData !== undefined}
+            actionData={actionModalOptions?.actionData}
+          />
+        </>
+      </ContentRootContext.Provider>
+    </>
+  );
+};
+
+export default forwardRef(ContentRootProvider);

package/src/context/DashboardActionContext.tsx

@@ -0,0 +1,45 @@
+import { ShortcutApi } from "@/ui/FavouriteButton";
+import React, { useState } from "react";
+
+export type DashboardActionContextType = {
+  isLoading: boolean;
+  setIsLoading: (value: boolean) => void;
+  dashboardRef: any;
+  openAction: (action?: ShortcutApi) => void;
+  moveItemsEnabled: boolean;
+  setMoveItemsEnabled: (value: boolean) => void;
+};
+
+export const DashboardActionContext = React.createContext<DashboardActionContextType | null>(
+  null
+);
+
+type DashboardActionProviderProps = {
+  children: React.ReactNode;
+  dashboardRef: any;
+  openAction: (action?: ShortcutApi) => void;
+};
+
+const DashboardActionProvider = (props: DashboardActionProviderProps): any => {
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+  const [moveItemsEnabled, setMoveItemsEnabled] = useState<boolean>(false);
+
+  const { children, dashboardRef, openAction } = props;
+
+  return (
+    <DashboardActionContext.Provider
+      value={{
+        isLoading,
+        setIsLoading,
+        dashboardRef,
+        openAction,
+        moveItemsEnabled,
+        setMoveItemsEnabled,
+      }}
+    >
+      {children}
+    </DashboardActionContext.Provider>
+  );
+};
+
+export default DashboardActionProvider;

package/src/context/FormContext.tsx

@@ -0,0 +1,79 @@
+import React, { useRef, useState } from "react";
+
+export type FormContextType = {
+  activeId?: number;
+  activeModel: string;
+  setFieldValue: (field: string, value?: string) => void;
+  getFieldValue: (field: string) => string;
+  executeButtonAction: ({
+    type,
+    action,
+    context,
+  }: {
+    type: string;
+    action: string;
+    context?: any;
+  }) => Promise<void>;
+  getContext: () => Promise<any>;
+  getValues: () => Promise<any>;
+  getFields: () => Promise<any>;
+  setOriginalValue: (field: string, value: any) => void;
+  domain: any[];
+  submitForm?: (options?: {
+    callOnSubmitSucceed?: boolean;
+  }) => Promise<boolean>;
+  fetchValues?: () => void;
+  formHasChanges?: () => boolean;
+  elementHasLostFocus?: () => void;
+};
+
+export const FormContext = React.createContext<FormContextType | null>(null);
+
+type FormProviderProps = FormContextType & {
+  children: React.ReactNode;
+};
+
+const FormProvider = (props: FormProviderProps): any => {
+  const {
+    children,
+    activeId,
+    activeModel,
+    setFieldValue,
+    getFieldValue,
+    executeButtonAction,
+    getContext,
+    getValues,
+    setOriginalValue,
+    domain,
+    submitForm,
+    fetchValues,
+    formHasChanges,
+    elementHasLostFocus,
+    getFields,
+  } = props;
+
+  return (
+    <FormContext.Provider
+      value={{
+        domain,
+        getValues,
+        getFields,
+        activeId,
+        activeModel,
+        setFieldValue,
+        getFieldValue,
+        executeButtonAction,
+        getContext,
+        setOriginalValue,
+        submitForm,
+        fetchValues,
+        formHasChanges,
+        elementHasLostFocus,
+      }}
+    >
+      {children}
+    </FormContext.Provider>
+  );
+};
+
+export default FormProvider;

package/src/context/FormModalContext.tsx

@@ -0,0 +1,29 @@
+import React from "react";
+
+export type FormModalContextType = {
+  setTitle?: (title: string) => void;
+};
+
+export const FormModalContext = React.createContext<FormModalContextType | null>(
+  null
+);
+
+type FormModalProviderProps = FormModalContextType & {
+  children: React.ReactNode;
+};
+
+const FormModalProvider = (props: FormModalProviderProps): any => {
+  const { children, setTitle } = props;
+
+  return (
+    <FormModalContext.Provider
+      value={{
+        setTitle,
+      }}
+    >
+      {children}
+    </FormModalContext.Provider>
+  );
+};
+
+export default FormModalProvider;

package/src/context/LocaleContext.tsx

@@ -0,0 +1,50 @@
+import React from "react";
+import ca_ES from "@/locales/ca_ES";
+import en_US from "@/locales/en_US";
+import es_ES from "@/locales/es_ES";
+
+const localeStrings: any = {
+  ca_ES,
+  en_US,
+  es_ES,
+};
+
+export type LocaleContextType = {
+  lang: string;
+  t: (key: string) => string;
+};
+
+export const LocaleContext = React.createContext<LocaleContextType | null>(
+  null
+);
+
+type LocaleContextProps = {
+  children: React.ReactNode;
+  lang: string;
+};
+
+const LocaleContextProvider = (props: LocaleContextProps): any => {
+  const { children, lang } = props;
+
+  function t(key: string): string {
+    return tForLang(key, lang);
+  }
+
+  return (
+    <LocaleContext.Provider
+      value={{
+        lang,
+        t,
+      }}
+    >
+      {children}
+    </LocaleContext.Provider>
+  );
+};
+
+export const tForLang = (key: string, lang: string) => {
+  const translated = localeStrings[lang]?.[key];
+  return translated || key;
+};
+
+export default LocaleContextProvider;

package/src/context/One2manyContext.tsx

@@ -0,0 +1,46 @@
+import React, { useState } from "react";
+import { ViewModes } from "@/widgets/base/one2many/One2many";
+
+export type One2manyContextType = {
+  currentView: ViewModes;
+  setCurrentView: (view: ViewModes) => void;
+  itemIndex: number;
+  setItemIndex: (value: number) => void;
+  manualTriggerChange: boolean;
+  setManualTriggerChange: (value: boolean) => void;
+};
+
+export const One2manyContext = React.createContext<One2manyContextType | null>(
+  null
+);
+
+const One2manyProvider = ({
+  children,
+  initialView,
+}: {
+  children: React.ReactNode;
+  initialView: ViewModes;
+}): any => {
+  const [currentView, setCurrentView] = useState<ViewModes>(initialView);
+  const [itemIndex, setItemIndex] = useState<number>(0);
+  const [manualTriggerChange, setManualTriggerChange] = useState<boolean>(
+    false
+  );
+
+  return (
+    <One2manyContext.Provider
+      value={{
+        currentView,
+        setCurrentView,
+        itemIndex,
+        setItemIndex,
+        manualTriggerChange,
+        setManualTriggerChange,
+      }}
+    >
+      {children}
+    </One2manyContext.Provider>
+  );
+};
+
+export default One2manyProvider;