@ouroboros/mouth-mui 2.1.1 → 2.1.3

package/README.md

@@ -1,15 +1,85 @@
 # @ouroboros/mouth-mui
+[![npm version](https://img.shields.io/npm/v/@ouroboros/mouth-mui.svg)](https://www.npmjs.com/package/@ouroboros/mouth-mui) ![Custom License](https://img.shields.io/npm/l/@ouroboros/mouth-mui.svg)
 
-[![npm version](https://img.shields.io/npm/v/@ouroboros/mouth-mui.svg)](https://www.npmjs.com/package/@ouroboros/mouth-mui)
+Material-UI Components for interacting with the
+[mouth2_oc](https://pypi.org/project/mouth2_oc/) service. It uses
+[@ouroboros/mouth](https://npmjs.com/package/@ouroboros/mouth) to handle the
+actual connections.
 
-Shared Material-UI Components for interacting with the mouth service created by
-Ouroboros Coding Inc.
-
-This code comes without documentation as it's not meant to be used by anyone
-outside of Ouroboros Coding Inc. Please see LICENSE for further information.
+See [Releases](https://github.com/ouroboroscoding/mouth-mui/blob/main/releases.md)
+for changes from release to release.
 
 ## Installation
-npm
-```bash
-npm install @ouroboros/mouth-mui
-```
+```console
+foo@bar:~$ npm install @ouroboros/mouth-mui
+```
+
+## Using mouth-mui
+If you're using react with material-ui, this library provides components for
+creating and editing locales and templates.
+
+### Components
+- [Locales](#locales)
+- [Templates](#templates)
+
+### Locales
+`Locales` is used to setup allowable locales on the system, as well as to make
+it easier to look up what locales can be chosen. It handles all C.R.U.D.
+operations.
+
+```jsx
+import { Locales } from '@ouroboros/mouth-mui';
+import React from 'react';
+import { addError, addMessage } from 'your_module';
+function MyLocalesPage(props) {
+  return <Locales
+    onError={addError}
+    onSuccess={(type) => {
+      /* type includes [
+        'create', 'delete', 'update',
+      ] */
+      addMessage(`${type} successful!`)
+    }}
+  />
+}
+```
+
+| Prop | Type | Optional | Description |
+| ---- | ---- | -------- | ----------- |
+| onError | <nobr>`error => void`</nobr> | yes | Callback for when an error occurs. `error` is a `responseErrorStruct` from [@ouroboros/body](https://www.npmjs.com/package/@ouroboros/body). |
+| onSuccess | <nobr>`type => void`</nobr> | yes | Callback for when any of the following `type`s happen: 'create', 'delete', and 'update'. |
+
+[ [top](#ouroborosmouth-mui) / [components](#components) ]
+
+### Templates
+`Templates` is used to setup named templates with individual versions per locale
+and method (content). For example, you could make a template with both email
+content and sms content so that depending on the user's preference you have
+both. Or you could have an email with both English and Spanish content. Or you
+could have all instances and have multiple locales setup for both email and sms.
+The component handles creating and updating for all these variations.
+
+```jsx
+import { Templates } from '@ouroboros/mouth-mui';
+import React from 'react';
+import { addError, addMessage } from 'your_module';
+function MyTemplatesPage(props) {
+  return <Templates
+    onError={addError}
+    onSuccess={(type) => {
+      /* type includes [
+        'template_create', 'template_update',
+        'content_create', 'content_update'
+      ] */
+      addMessage(`${type} successful!`)
+    }}
+  />
+}
+```
+
+| Prop | Type | Optional | Description |
+| ---- | ---- | -------- | ----------- |
+| onError | <nobr>`error => void`</nobr> | yes | Callback for when an error occurs. `error` is a `responseErrorStruct` from [@ouroboros/body](https://www.npmjs.com/package/@ouroboros/body). |
+| onSuccess | <nobr>`type => void`</nobr> | yes | Callback for when any of the following `type`s happen: 'template_create', 'template_update', 'content_create','content_update'. |
+
+[ [top](#ouroborosmouth-mui) / [components](#components) ]

package/lib/components/pages/Locales.d.ts

@@ -26,8 +26,8 @@ export type LocalesProps = {
 declare function Locales({ onError, onSuccess }: LocalesProps): React.JSX.Element;
 declare namespace Locales {
     var propTypes: {
-        onError: PropTypes.Validator<(...args: any[]) => any>;
-        onSuccess: PropTypes.Validator<(...args: any[]) => any>;
+        onError: PropTypes.Requireable<(...args: any[]) => any>;
+        onSuccess: PropTypes.Requireable<(...args: any[]) => any>;
     };
 }
 export default Locales;

package/lib/components/pages/Locales.js

@@ -54,7 +54,7 @@ export default function Locales({ onError, onSuccess }) {
     useEffect(() => {
         // If we have read rights
         if (rights.read) {
-            mouth.read('locales').then(recordsSet);
+            mouth.read('locales').then((res) => recordsSet(res.data));
         }
         else {
             recordsSet([]);
@@ -69,11 +69,31 @@ export default function Locales({ onError, onSuccess }) {
         // Create a new Promise and return it
         return new Promise((resolve, reject) => {
             // Create the new locale
-            mouth.create('locale', locale).then((data) => {
+            mouth.create('locale', locale).then((res) => {
+                // If we failed
+                if (res.error) {
+                    if (res.error.code === errors.body.DB_NO_RECORD) {
+                        return reject([['_id', 'Already in use']]);
+                    }
+                    else if (res.error.code === errors.body.DATA_FIELDS) {
+                        return reject(res.error.msg);
+                    }
+                    else {
+                        if (onError) {
+                            onError(res.error);
+                            return reject([]);
+                        }
+                        else {
+                            throw new Error(JSON.stringify(res.error));
+                        }
+                    }
+                }
                 // If we were successful
-                if (data) {
+                if (res.data) {
                     // Notify the parent
-                    onSuccess('create');
+                    if (onSuccess) {
+                        onSuccess('create');
+                    }
                     // Close the create form
                     createSet(false);
                     // Clone the records, add the new one to the start, and set
@@ -84,33 +104,29 @@ export default function Locales({ onError, onSuccess }) {
                     locales.set(lRecords);
                 }
                 // Resolve with the form
-                resolve(data ? true : false);
-            }, (error) => {
-                if (error.code === errors.body.DB_NO_RECORD) {
-                    reject([['_id', 'Already in use']]);
-                }
-                else if (error.code === errors.body.DATA_FIELDS) {
-                    reject(error.msg);
-                }
-                else {
-                    if (onError) {
-                        onError(error);
-                    }
-                    else {
-                        throw new Error(JSON.stringify(error));
-                    }
-                }
+                resolve(res.data ? true : false);
             });
         });
     }
     // Called when the delete button on a locale was clicked
     function deleteClick(key) {
         // Delete the existing locale
-        mouth.delete('locale', { _id: key }).then((data) => {
+        mouth.delete('locale', { _id: key }).then((res) => {
+            // If we failed
+            if (res.error) {
+                if (onError) {
+                    return onError(res.error);
+                }
+                else {
+                    throw new Error(JSON.stringify(res.error));
+                }
+            }
             // If it was successful
-            if (data) {
+            if (res.data) {
                 // Notify the parent
-                onSuccess('delete');
+                if (onSuccess) {
+                    onSuccess('delete');
+                }
                 // Look for the record
                 const i = afindi(records, '_id', key);
                 // If it exists
@@ -124,13 +140,6 @@ export default function Locales({ onError, onSuccess }) {
                     locales.set(lRecords);
                 }
             }
-        }, (error) => {
-            if (onError) {
-                onError(error);
-            }
-            else {
-                throw new Error(JSON.stringify(error));
-            }
         });
     }
     // Called when an update form is submitted
@@ -140,11 +149,28 @@ export default function Locales({ onError, onSuccess }) {
         // Create a new Promise and return it
         return new Promise((resolve, reject) => {
             // Update the locale on the server
-            mouth.update('locale', locale).then((data) => {
+            mouth.update('locale', locale).then((res) => {
+                // If we failed
+                if (res.error) {
+                    if (res.error.code === errors.body.DATA_FIELDS) {
+                        return reject(res.error.msg);
+                    }
+                    else {
+                        if (onError) {
+                            onError(res.error);
+                            return reject([]);
+                        }
+                        else {
+                            throw new Error(JSON.stringify(res.error));
+                        }
+                    }
+                }
                 // If we were successful
-                if (data) {
+                if (res.data) {
                     // Notify the parent
-                    onSuccess('update');
+                    if (onSuccess) {
+                        onSuccess('update');
+                    }
                     // Look for the record
                     const i = afindi(records, '_id', key);
                     // If it exists
@@ -159,19 +185,7 @@ export default function Locales({ onError, onSuccess }) {
                     }
                 }
                 // Resolve with the Form
-                resolve(data);
-            }, (error) => {
-                if (error.code === errors.body.DATA_FIELDS) {
-                    reject(error.msg);
-                }
-                else {
-                    if (onError) {
-                        onError(error);
-                    }
-                    else {
-                        throw new Error(JSON.stringify(error));
-                    }
-                }
+                resolve(res.data);
             });
         });
     }
@@ -192,6 +206,6 @@ export default function Locales({ onError, onSuccess }) {
 }
 // Valid props
 Locales.propTypes = {
-    onError: PropTypes.func.isRequired,
-    onSuccess: PropTypes.func.isRequired
+    onError: PropTypes.func,
+    onSuccess: PropTypes.func
 };

package/lib/components/pages/Templates/Create.d.ts

@@ -13,7 +13,7 @@ import { templateStruct } from './Template';
 export interface CreateProps {
     onCancel?: () => void;
     onCreated: (template: templateStruct) => void;
-    onError: (error: responseErrorStruct) => void;
+    onError?: (error: responseErrorStruct) => void;
 }
 /**
  * Create
@@ -30,7 +30,7 @@ declare namespace Create {
     var propTypes: {
         onCancel: PropTypes.Requireable<(...args: any[]) => any>;
         onCreated: PropTypes.Validator<(...args: any[]) => any>;
-        onError: PropTypes.Validator<(...args: any[]) => any>;
+        onError: PropTypes.Requireable<(...args: any[]) => any>;
     };
 }
 export default Create;

package/lib/components/pages/Templates/Create.js

@@ -51,23 +51,26 @@ export default function Create({ onCancel, onCreated, onError }) {
     // Called to create the template
     function create() {
         // Create the data in the system
-        mouth.create('template', record).then((data) => {
-            // Add the ID to the record
-            record._id = data;
-            // Let the parent know
-            onCreated({ ...record });
-        }, (error) => {
-            if (error.code === errors.body.DB_DUPLICATE) {
-                refName.current?.error('Duplicate');
-            }
-            else {
-                if (onError) {
-                    onError(error);
+        mouth.create('template', record).then((res) => {
+            // If we failed
+            if (res.error) {
+                if (res.error.code === errors.body.DB_DUPLICATE) {
+                    refName.current?.error('Duplicate');
                 }
                 else {
-                    throw new Error(JSON.stringify(error));
+                    if (onError) {
+                        onError(res.error);
+                        return;
+                    }
+                    else {
+                        throw new Error(JSON.stringify(res.error));
+                    }
                 }
             }
+            // Add the ID to the record
+            record._id = res.data;
+            // Let the parent know
+            onCreated({ ...record });
         });
     }
     // Render
@@ -91,5 +94,5 @@ export default function Create({ onCancel, onCreated, onError }) {
 Create.propTypes = {
     onCancel: PropTypes.func,
     onCreated: PropTypes.func.isRequired,
-    onError: PropTypes.func.isRequired,
+    onError: PropTypes.func,
 };

package/lib/components/pages/Templates/Template/Content/Create/index.d.ts

@@ -13,7 +13,7 @@ import { responseErrorStruct } from '@ouroboros/body';
 export type TemplateContentCreateProps = {
     locales: Record<string, string>;
     onCreated: (content: contentStruct) => void;
-    onError: (error: responseErrorStruct) => void;
+    onError?: (error: responseErrorStruct) => void;
     template: string;
 };
 /**

package/lib/components/pages/Templates/Template/Content/Create/index.js

@@ -50,43 +50,52 @@ export default function Create({ locales, onCreated, onError, template }) {
     // Called to create the new content record
     function create() {
         // Send the record data to the server
-        mouth.create(`template/${type}`, record).then((data) => {
-            // Add the type and ID
-            const oRecord = { ...record, type, _id: data };
-            // Tell the parent about the new record
-            onCreated(oRecord);
-        }, (error) => {
-            if (error.code === errors.body.DATA_FIELDS) {
-                fieldErrorsSet(errorTree(error.msg));
-            }
-            else if (error.code === errors.body.DB_DUPLICATE) {
-                fieldErrorsSet({ locale: 'Already used' });
-            }
-            else if (error.code === errors.TEMPLATE_CONTENT_ERROR) {
-                const oLines = { templates: [], variables: [] };
-                for (const l of error.msg) {
-                    if (l[0] === 'template') {
-                        oLines.templates.push(l[1]);
+        mouth.create(`template/${type}`, record).then((res) => {
+            // If we failed
+            if (res.error) {
+                if (res.error.code === errors.body.DATA_FIELDS) {
+                    fieldErrorsSet(errorTree(res.error.msg));
+                }
+                else if (res.error.code === errors.body.DB_DUPLICATE) {
+                    fieldErrorsSet({ locale: 'Already used' });
+                }
+                else if (res.error.code === errors.TEMPLATE_CONTENT_ERROR) {
+                    const oLines = { templates: [], variables: [] };
+                    for (const l of res.error.msg) {
+                        if (l[0] === 'template') {
+                            oLines.templates.push(l[1]);
+                        }
+                        else if (l[0] === 'variable') {
+                            oLines.variables.push(l[1]);
+                        }
                     }
-                    else if (l[0] === 'variable') {
-                        oLines.variables.push(l[1]);
+                    const lLines = [];
+                    if (oLines.templates.length) {
+                        lLines.push('The following templates are invalid: ' + oLines.templates.join(', '));
+                    }
+                    if (oLines.variables.length) {
+                        lLines.push('The following variables are invalid: ' + oLines.variables.join(', '));
+                    }
+                    // Show the errors
+                    if (onError) {
+                        onError({ code: 0, msg: lLines.join('\n') });
+                    }
+                    else {
+                        throw new Error(JSON.stringify(res.error));
                     }
                 }
-                const lLines = [];
-                if (oLines.templates.length) {
-                    lLines.push('The following templates are invalid: ' + oLines.templates.join(', '));
-                }
-                if (oLines.variables.length) {
-                    lLines.push('The following variables are invalid: ' + oLines.variables.join(', '));
+                else if (onError) {
+                    onError(res.error);
                 }
-                // Show the errors
-                if (onError) {
-                    onError({ code: 0, msg: lLines.join('\n') });
+                else {
+                    throw new Error(JSON.stringify(res.error));
                 }
+                return;
             }
-            else {
-                onError(error);
-            }
+            // Add the type and ID
+            const oRecord = { ...record, type, _id: res.data };
+            // Tell the parent about the new record
+            onCreated(oRecord);
         });
     }
     // Called when any fields in the record are changed
@@ -156,9 +165,12 @@ export default function Create({ locales, onCreated, onError, template }) {
                         if (error.code === errors.body.DATA_FIELDS) {
                             fieldErrorsSet(errorTree(error.msg));
                         }
-                        else {
+                        else if (onError) {
                             onError(error);
                         }
+                        else {
+                            throw new Error(JSON.stringify(error));
+                        }
                         previewSet(false);
                     }, value: { ...record, type } }))));
 }

package/lib/components/pages/Templates/Template/Content/Preview/index.d.ts

@@ -12,7 +12,7 @@ import { contentStruct } from '../..';
 import { responseErrorStruct } from '@ouroboros/body';
 export type PreviewProps = {
     onClose: () => void;
-    onError: (error: responseErrorStruct) => void;
+    onError?: (error: responseErrorStruct) => void;
     value: contentStruct;
 };
 /**
@@ -29,7 +29,7 @@ declare function Preview({ onClose, onError, value }: PreviewProps): React.JSX.E
 declare namespace Preview {
     var propTypes: {
         onClose: PropTypes.Validator<(...args: any[]) => any>;
-        onError: PropTypes.Validator<(...args: any[]) => any>;
+        onError: PropTypes.Requireable<(...args: any[]) => any>;
         value: PropTypes.Requireable<PropTypes.InferProps<{
             locale: PropTypes.Validator<string>;
             template: PropTypes.Requireable<string>;

package/lib/components/pages/Templates/Template/Content/Preview/index.js

@@ -33,7 +33,20 @@ export default function Preview({ onClose, onError, value }) {
     const [preview, previewSet] = useState(false);
     // Value effect
     useEffect(() => {
-        mouth.create(`template/${value.type}/generate`, value).then(previewSet, onError);
+        mouth.create(`template/${value.type}/generate`, value).then((res) => {
+            // If we failed
+            if (res.error) {
+                if (onError) {
+                    onError(res.error);
+                    return;
+                }
+                else {
+                    throw new Error(JSON.stringify(res.error));
+                }
+            }
+            // Set the preview
+            previewSet(res.data);
+        });
     }, [value, onError]);
     // Render
     return (React.createElement(Dialog, { fullWidth: true, maxWidth: "lg", onClose: onClose, open: true, "aria-labelledby": "template-content-preview-title" },
@@ -51,7 +64,7 @@ export default function Preview({ onClose, onError, value }) {
 // Valid props
 Preview.propTypes = {
     onClose: PropTypes.func.isRequired,
-    onError: PropTypes.func.isRequired,
+    onError: PropTypes.func,
     value: PropTypes.shape({
         locale: PropTypes.string.isRequired,
         template: PropTypes.string,

package/lib/components/pages/Templates/Template/Content/Update/index.d.ts

@@ -12,7 +12,7 @@ import { responseErrorStruct } from '@ouroboros/body';
 import { contentStruct } from '../..';
 export type updateStruct = Omit<contentStruct, 'type'>;
 export type UpdateProps = {
-    onError: (error: responseErrorStruct) => void;
+    onError?: (error: responseErrorStruct) => void;
     onUpdated: (content: contentStruct) => void;
     value: contentStruct;
 };

package/lib/components/pages/Templates/Template/Content/Update/index.js

@@ -38,37 +38,44 @@ export default function Update({ onError, onUpdated, value }) {
     // Called to create the new content record
     function update() {
         // Send the record data to the server
-        mouth.update(`template/${value.type}`, record).then(() => {
-            onUpdated({ type: value.type, ...record });
-        }, (error) => {
-            if (error.code === errors.body.DATA_FIELDS) {
-                fieldErrorsSet(errorTree(error.msg));
-            }
-            else if (error.code === errors.TEMPLATE_CONTENT_ERROR) {
-                const oLines = { templates: [], variables: [] };
-                for (const l of error.msg) {
-                    if (l[0] === 'template') {
-                        oLines.templates.push(l[1]);
+        mouth.update(`template/${value.type}`, record).then((res) => {
+            // If we failed
+            if (res.error) {
+                if (res.error.code === errors.body.DATA_FIELDS) {
+                    fieldErrorsSet(errorTree(res.error.msg));
+                }
+                else if (res.error.code === errors.TEMPLATE_CONTENT_ERROR) {
+                    const oLines = { templates: [], variables: [] };
+                    for (const l of res.error.msg) {
+                        if (l[0] === 'template') {
+                            oLines.templates.push(l[1]);
+                        }
+                        else if (l[0] === 'variable') {
+                            oLines.variables.push(l[1]);
+                        }
                     }
-                    else if (l[0] === 'variable') {
-                        oLines.variables.push(l[1]);
+                    const lLines = [];
+                    if (oLines.templates.length) {
+                        lLines.push('The following templates are invalid: ' + oLines.templates.join(', '));
+                    }
+                    if (oLines.variables.length) {
+                        lLines.push('The following variables are invalid: ' + oLines.variables.join(', '));
+                    }
+                    // Show the errors
+                    if (onError) {
+                        onError({ code: 0, msg: lLines.join('\n') });
                     }
                 }
-                const lLines = [];
-                if (oLines.templates.length) {
-                    lLines.push('The following templates are invalid: ' + oLines.templates.join(', '));
-                }
-                if (oLines.variables.length) {
-                    lLines.push('The following variables are invalid: ' + oLines.variables.join(', '));
+                else if (onError) {
+                    onError(res.error);
                 }
-                // Show the errors
-                if (onError) {
-                    onError({ code: 0, msg: lLines.join('\n') });
+                else {
+                    throw new Error(JSON.stringify(res.error));
                 }
+                return;
             }
-            else {
-                onError(error);
-            }
+            // Let the parent know it was updated
+            onUpdated({ type: value.type, ...record });
         });
     }
     // Called when any fields in the record are changed
@@ -94,9 +101,12 @@ export default function Update({ onError, onUpdated, value }) {
                         if (error.code === errors.body.DATA_FIELDS) {
                             fieldErrorsSet(errorTree(error.msg));
                         }
-                        else {
+                        else if (onError) {
                             onError(error);
                         }
+                        else {
+                            throw new Error(JSON.stringify(error));
+                        }
                         previewSet(false);
                     }, value: { ...record, type: value.type } }))));
 }

package/lib/components/pages/Templates/Template/Content/View/index.d.ts

@@ -11,7 +11,7 @@ import React from 'react';
 import { responseErrorStruct } from '@ouroboros/body';
 import { contentStruct } from '../..';
 export type ViewProps = {
-    onError: (error: responseErrorStruct) => void;
+    onError?: (error: responseErrorStruct) => void;
     value: contentStruct;
 };
 /**
@@ -27,7 +27,7 @@ export type ViewProps = {
 declare function View({ onError, value }: ViewProps): React.JSX.Element;
 declare namespace View {
     var propTypes: {
-        onError: PropTypes.Validator<(...args: any[]) => any>;
+        onError: PropTypes.Requireable<(...args: any[]) => any>;
         value: PropTypes.Requireable<PropTypes.InferProps<{
             _id: PropTypes.Validator<string>;
             type: PropTypes.Validator<string>;

package/lib/components/pages/Templates/Template/Content/View/index.js

@@ -41,7 +41,7 @@ export default function View({ onError, value }) {
 }
 // Valid props
 View.propTypes = {
-    onError: PropTypes.func.isRequired,
+    onError: PropTypes.func,
     value: PropTypes.shape({
         _id: PropTypes.string.isRequired,
         type: PropTypes.oneOf(['email', 'sms']).isRequired

package/lib/components/pages/Templates/Template/index.d.ts

@@ -33,7 +33,7 @@ export type typeOption = 'email' | 'sms';
 export type TemplateProps = {
     locales: Record<string, string>;
     onChange: (template: templateStruct) => void;
-    onError: (error: responseErrorStruct) => void;
+    onError?: (error: responseErrorStruct) => void;
     onContent: (type: string) => void;
     rights: {
         template: idStruct;
@@ -58,7 +58,7 @@ declare namespace Template {
             [x: string]: string | null | undefined;
         }>;
         onChange: PropTypes.Validator<(...args: any[]) => any>;
-        onError: PropTypes.Validator<(...args: any[]) => any>;
+        onError: PropTypes.Requireable<(...args: any[]) => any>;
         onContent: PropTypes.Validator<(...args: any[]) => any>;
         rights: PropTypes.Requireable<Required<PropTypes.InferProps<{
             template: PropTypes.Validator<Required<PropTypes.InferProps<{