drf-react-by-schema 0.3.0 → 0.4.0

package/dist/context/APIWrapper.js

@@ -0,0 +1,341 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const utils_1 = require("../utils");
+const DialogJSONSchemaForm_1 = __importDefault(require("../components/DialogJSONSchemaForm"));
+const DialogActions_1 = __importDefault(require("../components/DialogActions"));
+const DRFReactBySchemaContext_1 = require("./DRFReactBySchemaContext");
+const api_1 = require("../api");
+const APIWrapperContext_1 = require("./APIWrapperContext");
+;
+function APIWrapper({ setLoading, handleLoading, setSnackBar, setDialog, children }) {
+    const { serverEndPoint } = DRFReactBySchemaContext_1.DRFReactBySchemaContext
+        ? react_1.default.useContext(DRFReactBySchemaContext_1.DRFReactBySchemaContext)
+        : { serverEndPoint: null };
+    if (!serverEndPoint) {
+        return (react_1.default.createElement(react_1.default.Fragment, null, children));
+    }
+    const [usuaria, setUsuaria] = (0, react_1.useState)(null);
+    const [optionsAC, setOptionsAC] = (0, react_1.useReducer)(utils_1.reducer, {});
+    const initialPageForm = {
+        id: '',
+        schema: null,
+        initialValues: null,
+        validationSchema: null
+    };
+    const [pageForm, setPageForm] = (0, react_1.useReducer)(utils_1.reducer, initialPageForm);
+    const editModel = (0, react_1.useRef)({});
+    const jsonSchemaFormRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        setUsuaria(null);
+        (0, api_1.isLoggedIn)(serverEndPoint).then(usuaria => {
+            setUsuaria(usuaria || { erro: 'token inválido' });
+        });
+    }, []);
+    (0, react_1.useEffect)(() => {
+        setPageForm(initialPageForm);
+    }, []);
+    const onTriggerSnackBar = ({ msg, severity = 'info' }) => {
+        setSnackBar({
+            open: true,
+            msg,
+            severity
+        });
+    };
+    const loadSinglePageData = ({ model, objId, optionsACModels, extraValidators = {} }) => __awaiter(this, void 0, void 0, function* () {
+        setLoading(true);
+        if (!objId || objId === 'novo') {
+            objId = (0, utils_1.getTmpId)();
+        }
+        const object = yield (0, api_1.getGenericModel)({
+            model,
+            serverEndPoint,
+            id: (0, utils_1.isTmpId)(objId) ? null : objId
+        });
+        if (object === false) {
+            setPageForm({ schema: false, id: '' });
+            console.log('Houve um erro ao tentar carregar os dados!');
+            return false;
+        }
+        setLoading(false);
+        populateOptionsAC(optionsACModels);
+        const values = populateInitialValues(Object.assign({ model, id: objId, extraValidators }, object));
+        return values;
+    });
+    const onSubmit = (model, id, data, event) => __awaiter(this, void 0, void 0, function* () {
+        setLoading(true);
+        const response = yield (0, api_1.updateDataBySchema)({
+            model,
+            modelObjectId: id,
+            serverEndPoint,
+            data,
+            schema: pageForm.schema
+        });
+        setLoading(false);
+        if (!['number', 'string'].includes(typeof response)) {
+            onTriggerSnackBar({
+                msg: 'Houve um problema ao salvar seus dados! Por favor, entre em contato',
+                severity: 'error'
+            });
+            console.log({
+                msg: 'Error saving model',
+                errors: response,
+                data
+            });
+            return false;
+        }
+        onTriggerSnackBar({
+            msg: (id)
+                ? 'Dados atualizados com sucesso!'
+                : 'Criado com sucesso!'
+        });
+        return response;
+    });
+    const populateOptionsAC = (optionsACModels) => {
+        for (const model of optionsACModels) {
+            (0, api_1.getAutoComplete)({ model, serverEndPoint }).then(options => {
+                setOptionsAC({ [model]: options });
+            });
+        }
+    };
+    ;
+    const populateInitialValues = (_a) => {
+        var { model, id, isEditModel, extraValidators } = _a, object = __rest(_a, ["model", "id", "isEditModel", "extraValidators"]);
+        const values = (0, utils_1.populateValues)(object);
+        const yupSchema = (0, utils_1.buildGenericYupValidationSchema)(Object.assign(Object.assign({}, object), { data: values, extraValidators }));
+        setPageForm({
+            model,
+            id,
+            schema: object.schema,
+            initialValues: values,
+            validationSchema: yupSchema
+        });
+        return values;
+    };
+    const onEditModel = ({ fieldKey, index, model, id, labelKey, setValue, getValues }) => {
+        setDialog({
+            open: true,
+            loading: true
+        });
+        (0, api_1.getJSONSchema)({ model, serverEndPoint, id }).then(data => {
+            const jsonSchemaSubmit = (e) => __awaiter(this, void 0, void 0, function* () {
+                jsonSchemaFormRef.current.onSubmit(e);
+                return true;
+            });
+            setDialog({
+                loading: false,
+                title: 'Editar',
+                Body: react_1.default.createElement(DialogJSONSchemaForm_1.default, { jsonSchemaFormRef: jsonSchemaFormRef, schema: data.serializer.schema, uiSchema: data.serializer.uiSchema, formData: data.formData, onSubmit: onEditModelSave }),
+                Actions: react_1.default.createElement(DialogActions_1.default, { setDialog: setDialog, handleSave: jsonSchemaSubmit })
+            });
+            editModel.current = {
+                fieldKey,
+                index,
+                model,
+                id,
+                labelKey,
+                setValue,
+                getValues
+            };
+        });
+    };
+    const onEditModelSave = ({ formData }) => __awaiter(this, void 0, void 0, function* () {
+        setDialog({ open: false });
+        setLoading(true);
+        const { fieldKey, index, model, id, labelKey, setValue, getValues } = editModel.current;
+        const newModelId = yield (0, api_1.createOrUpdateJSONSchema)({
+            model,
+            serverEndPoint,
+            id,
+            formData
+        });
+        if (newModelId.errors) {
+            console.log(newModelId.errors);
+            onTriggerSnackBar({
+                msg: 'Houve um problema ao salvar a alteração! Por favor, entre em contato.',
+                severity: 'error'
+            });
+            return;
+        }
+        onTriggerSnackBar({
+            msg: 'Alterações salvas com sucesso!',
+            severity: 'info'
+        });
+        const targetKey = (fieldKey && index >= 0)
+            ? `${fieldKey}.${index}.${model}`
+            : model;
+        const newValue = Object.assign(Object.assign(Object.assign({}, getValues(targetKey)), formData), { label: formData[labelKey] });
+        setValue(targetKey, newValue);
+        populateOptionsAC([model]);
+        setLoading(false);
+    });
+    const onDeleteModel = (model, id, onSuccess) => {
+        setDialog({
+            open: true,
+            loading: false,
+            title: 'Apagar',
+            Body: 'Tem certeza de que deseja apagar este item?',
+            Actions: react_1.default.createElement(DialogActions_1.default, { setDialog: setDialog, handleSave: (e) => {
+                    return onDeleteModelSave(model, id, onSuccess);
+                }, btnConfirm: "Sim, apagar" })
+        });
+    };
+    const onDeleteModelSave = (model, id, onSuccess) => __awaiter(this, void 0, void 0, function* () {
+        setDialog({ open: false });
+        setLoading(true);
+        const ret = yield (0, api_1.deleteData)(model, serverEndPoint, id);
+        if (ret !== false) {
+            onTriggerSnackBar({
+                msg: 'Apagado com com sucesso!',
+                severity: 'info'
+            });
+            if (onSuccess) {
+                onSuccess({});
+            }
+            return true;
+        }
+        setLoading(false);
+        onTriggerSnackBar({
+            msg: 'Houve um problema ao remover o item! Por favor, entre em contato.',
+            severity: 'error'
+        });
+        return false;
+    });
+    const onEditRelatedModelSave = ({ model, id, relatedModel, relatedModelId, newRow, schema, onlyAddExisting }) => __awaiter(this, void 0, void 0, function* () {
+        const updateUrl = `${model}/${id}/${relatedModel}`;
+        if (onlyAddExisting) {
+            const response = yield (0, api_1.addExistingRelatedModel)({
+                model,
+                id,
+                serverEndPoint,
+                data: {
+                    onlyAddExisting: {
+                        key: relatedModel,
+                        value: newRow.id_to_add
+                    }
+                }
+            });
+            if (Object.prototype.hasOwnProperty.call(response, 'errors')) {
+                console.log(response);
+                onTriggerSnackBar({
+                    msg: 'Houve um problema ao salvar a alteração! Por favor, entre em contato.',
+                    severity: 'error'
+                });
+                return false;
+            }
+            onTriggerSnackBar({
+                msg: 'Alterações salvas com sucesso!',
+                severity: 'info'
+            });
+            const object = yield (0, api_1.getGenericModel)({
+                model,
+                id,
+                serverEndPoint,
+                relatedModel,
+                relatedModelId: newRow.id_to_add
+            });
+            return object;
+        }
+        // This is important for related data
+        if (schema[model] && !newRow[model]) {
+            newRow[model] = id;
+        }
+        const response = yield (0, api_1.updateDataBySchema)({
+            model: relatedModel,
+            modelObjectId: newRow.id,
+            serverEndPoint,
+            data: newRow,
+            schema,
+            path: updateUrl
+        });
+        if (response && !Object.prototype.hasOwnProperty.call(response, 'errors')) {
+            onTriggerSnackBar({
+                msg: 'Alterações salvas com sucesso!',
+                severity: 'info'
+            });
+            return response;
+        }
+        onTriggerSnackBar({
+            msg: 'Não foi possível salvar os dados. Confira os erros.',
+            severity: 'error'
+        });
+        return false;
+    });
+    const onDeleteRelatedModel = ({ model, id, relatedModel, relatedModelId }) => __awaiter(this, void 0, void 0, function* () {
+        const deleteUrl = `${model}/${id}/${relatedModel}`;
+        const response = yield (0, api_1.deleteData)(deleteUrl, serverEndPoint, relatedModelId);
+        if (response) {
+            onTriggerSnackBar({
+                msg: 'Alterações salvas com sucesso!',
+                severity: 'info'
+            });
+            return response;
+        }
+        onTriggerSnackBar({
+            msg: 'Houve um problema ao remover o item! Por favor, entre em contato.',
+            severity: 'error'
+        });
+        return false;
+    });
+    return (react_1.default.createElement(APIWrapperContext_1.APIWrapperContext.Provider, { value: {
+            usuaria,
+            onSubmit,
+            loadSinglePageData,
+            handleLoading,
+            optionsACState: [optionsAC, setOptionsAC],
+            pageFormState: [pageForm, setPageForm],
+            onEditModel,
+            onDeleteModel,
+            onEditRelatedModelSave,
+            onDeleteRelatedModel,
+            onTriggerSnackBar,
+            setDialog
+        } }, children));
+}
+exports.default = react_1.default.memo(APIWrapper);

package/{src/context/APIWrapperContext.tsx → dist/context/APIWrapperContext.d.ts}

@@ -1,30 +1,22 @@
 import React from 'react';
+import { FieldValues, SubmitHandler } from 'react-hook-form';
 import { ItemSchemaColumnsType, Id, Item, SchemaType } from '../utils';
-
 export interface LoadSinglePageDataProps {
     model: string;
-    objId: Id;
+    objId?: Id;
     objTitleField?: string;
     optionsACModels: string[];
     basePath?: string;
     formPath?: string | null;
-    extraValidators: Item;
-};
-
-// export interface LoadingStateType {
-//     loading: boolean,
-//     setLoading: React.Dispatch<React.SetStateAction<boolean>>;
-// };
-
+    extraValidators?: Item;
+}
 export type OptionsACType = Record<string, Item[]>;
-
 export interface PageFormType {
     id: Id;
     schema: SchemaType | null;
     initialValues: Item | null;
     validationSchema: Item | null;
-};
-
+}
 export interface OnEditModelType {
     fieldKey: string;
     index: string;
@@ -33,8 +25,7 @@ export interface OnEditModelType {
     labelKey: string;
     setValue: (p: any) => void;
     getValues: (p: any) => any;
-};
-
+}
 export interface OnEditRelatedModelType {
     model: string;
     id: Id;
@@ -43,21 +34,18 @@ export interface OnEditRelatedModelType {
     newRow: Item;
     schema: SchemaType;
     onlyAddExisting: boolean;
-};
-
+}
 export interface OnDeleteRelatedModelType {
     model: string;
     id: Id;
     relatedModel: string;
     relatedModelId: Id;
-};
-
+}
 export interface SnackBarType {
     open?: boolean;
     msg?: string;
-    severity?: string
-};
-
+    severity?: string;
+}
 export interface DialogType {
     open: boolean;
     loading?: boolean;
@@ -65,20 +53,23 @@ export interface DialogType {
     Body?: React.ReactNode;
     Actions?: React.ReactNode;
 }
-
+export type DRFReactBySchemaSubmitHandler = (...args: [...[model: string, id: Id], ...Parameters<SubmitHandler<FieldValues>>]) => ReturnType<SubmitHandler<FieldValues>>;
 export interface APIWrapperContextType {
     usuaria: Item | null;
-    onSubmit: (model: string, id: Id, data: Item, e: React.SyntheticEvent<HTMLButtonElement, SubmitEvent>) => Promise<false | Id>;
-    loadSinglePageData: (p: LoadSinglePageDataProps) => boolean | Item;
+    onSubmit: DRFReactBySchemaSubmitHandler;
+    loadSinglePageData: (p: LoadSinglePageDataProps) => Promise<boolean | FieldValues>;
     handleLoading: (p: boolean) => void;
-    optionsACState: [{ [x: string]: any; }, React.Dispatch<OptionsACType>];
-    pageFormState: [{ [x: string]: any; }, React.Dispatch<PageFormType>];
+    optionsACState: [{
+        [x: string]: any;
+    }, React.Dispatch<OptionsACType>];
+    pageFormState: [{
+        [x: string]: any;
+    }, React.Dispatch<PageFormType>];
     onEditModel: (p: OnEditModelType) => void;
-    onDeleteModel: (model:string, id:Id, onSuccess:()=>void | null) => void;
+    onDeleteModel: (model: string, id: Id, onSuccess?: (e: React.BaseSyntheticEvent) => any) => void;
     onEditRelatedModelSave: (p: OnEditRelatedModelType) => Promise<boolean | Id | ItemSchemaColumnsType>;
     onDeleteRelatedModel: (p: OnDeleteRelatedModelType) => Promise<boolean>;
     onTriggerSnackBar: (p: SnackBarType) => void;
     setDialog: React.Dispatch<React.SetStateAction<DialogType>>;
-};
-
-export const APIWrapperContext = React.createContext<APIWrapperContextType | null>(null);
+}
+export declare const APIWrapperContext: React.Context<APIWrapperContextType | null>;

package/dist/context/APIWrapperContext.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.APIWrapperContext = void 0;
+const react_1 = __importDefault(require("react"));
+;
+;
+;
+;
+;
+;
+;
+exports.APIWrapperContext = react_1.default.createContext(null);

package/{src/context/DRFReactBySchemaContext.tsx → dist/context/DRFReactBySchemaContext.d.ts}

@@ -1,8 +1,5 @@
 import React from 'react';
 import { Theme } from '@mui/material/styles';
-
-import defaultTheme from '../styles/theme';
-
 export interface serverEndPointType {
     url: string;
     autocomplete?: string;
@@ -10,8 +7,8 @@ export interface serverEndPointType {
     JSONSchema?: string;
     apiTokenUrl: string;
     getToken?: string;
-    refreshToken?: string,
-    verifyToken?: string
+    refreshToken?: string;
+    verifyToken?: string;
 }
 export interface DRFReactBySchemaContextType {
     serverEndPoint: serverEndPointType | null;
@@ -19,15 +16,5 @@ export interface DRFReactBySchemaContextType {
     isInBatches?: boolean;
     firstBatchLength?: number;
 }
-
-export const DRFReactBySchemaContext = React.createContext<DRFReactBySchemaContextType>({
-    serverEndPoint: null,
-    theme: defaultTheme,
-    isInBatches: true,
-    firstBatchLength: 100
-});
-
-export const useTheme = () => {
-    const context = React.useContext(DRFReactBySchemaContext);
-    return context.theme;
-}
+export declare const DRFReactBySchemaContext: React.Context<DRFReactBySchemaContextType>;
+export declare const useTheme: () => Theme;

package/dist/context/DRFReactBySchemaContext.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTheme = exports.DRFReactBySchemaContext = void 0;
+const react_1 = __importDefault(require("react"));
+const theme_1 = __importDefault(require("../styles/theme"));
+exports.DRFReactBySchemaContext = react_1.default.createContext({
+    serverEndPoint: null,
+    theme: theme_1.default,
+    isInBatches: true,
+    firstBatchLength: 100
+});
+const useTheme = () => {
+    const context = react_1.default.useContext(exports.DRFReactBySchemaContext);
+    return context.theme;
+};
+exports.useTheme = useTheme;

package/dist/context/DRFReactBySchemaProvider.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { DRFReactBySchemaContextType } from './DRFReactBySchemaContext';
+interface DRFReactBySchemaProviderProps extends DRFReactBySchemaContextType {
+    children: React.ReactNode;
+}
+/**
+ *
+ *
+ * @param {*} props
+ * @returns {*}
+ */
+declare const DRFReactBySchemaProvider: ({ serverEndPoint, theme, isInBatches, firstBatchLength, children }: DRFReactBySchemaProviderProps) => JSX.Element;
+export default DRFReactBySchemaProvider;

package/dist/context/DRFReactBySchemaProvider.js

@@ -0,0 +1,53 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styles_1 = require("@mui/material/styles");
+const CssBaseline_1 = __importDefault(require("@mui/material/CssBaseline"));
+const theme_1 = __importDefault(require("../styles/theme"));
+const Overlays_1 = __importDefault(require("./Overlays"));
+const DRFReactBySchemaContext_1 = require("./DRFReactBySchemaContext");
+/**
+ *
+ *
+ * @param {*} props
+ * @returns {*}
+ */
+const DRFReactBySchemaProvider = ({ serverEndPoint, theme, isInBatches, firstBatchLength, children }) => {
+    if (serverEndPoint) {
+        const defaultKeys = [
+            'autocomplete',
+            'api',
+            ['JSONSchema', 'jsonschema'],
+            ['getToken', ''],
+            ['refreshToken', 'refresh'],
+            ['verifyToken', 'verify']
+        ];
+        for (const key of defaultKeys) {
+            const hybridKey = (typeof key === 'string')
+                ? key
+                : key[0];
+            const hybridUrl = (typeof key === 'string')
+                ? key
+                : key[1];
+            if (serverEndPoint[hybridKey]) {
+                continue;
+            }
+            serverEndPoint[hybridKey] = `${serverEndPoint.url}/${hybridUrl}`;
+        }
+    }
+    const mergedTheme = (theme)
+        ? Object.assign(Object.assign({}, theme_1.default), theme) : theme_1.default;
+    return (react_1.default.createElement(styles_1.ThemeProvider, { theme: mergedTheme },
+        react_1.default.createElement(CssBaseline_1.default, null),
+        react_1.default.createElement(DRFReactBySchemaContext_1.DRFReactBySchemaContext.Provider, { value: {
+                serverEndPoint,
+                theme,
+                isInBatches,
+                firstBatchLength
+            } },
+            react_1.default.createElement(Overlays_1.default, { children: children }))));
+};
+exports.default = DRFReactBySchemaProvider;

package/dist/context/Form.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { Id } from '../utils';
+interface FormProps {
+    model: string;
+    id: Id;
+    objTitleField?: string;
+    optionsACModels: string[];
+    cancelBtn?: (e: React.BaseSyntheticEvent) => any;
+    cancelBtnLabel?: string;
+    deleteBtnLabel?: string;
+    saveAndCreateNewBtnLabel?: string;
+    saveAndContinueBtnLabel?: string;
+    saveBtnLabel?: string;
+    onSuccess?: (e: React.BaseSyntheticEvent) => any;
+    borderBottom?: boolean;
+    saveAndContinue?: boolean;
+    formButtonsSx?: any;
+    children: React.ReactNode;
+}
+export default function Form({ model, id, objTitleField, optionsACModels, cancelBtn, cancelBtnLabel, deleteBtnLabel, saveAndCreateNewBtnLabel, saveAndContinueBtnLabel, saveBtnLabel, onSuccess, borderBottom, saveAndContinue, formButtonsSx, children }: FormProps): JSX.Element;
+export {};