@ouroboros/mouth-mui 1.0.2 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ouroboros/mouth-mui",
-	"version": "1.0.2",
+	"version": "1.2.0",
 	"description": "Components for use with the Mouth service",
 	"main": "src/index.js",
 	"types": "src/index.d.ts",
@@ -26,6 +26,7 @@
 		"url": "https://github.com/ouroboroscoding/mouth-mui/issues"
 	},
 	"devDependencies": {
+		"@ouroboros/body": "^1.0.2",
 		"@types/node": "^18.14.0",
 		"@types/react": "^18.0.28",
 		"@types/uuid": "^9.0.0",
@@ -39,17 +40,17 @@
 		"@ouroboros/define-mui": "^1.0.3",
 		"@ouroboros/react-radiobuttons-mui": "^1.0.0",
 		"@ouroboros/subscribe": "^1.2.0",
-		"@ouroboros/tools": "^0.4.1",
+		"@ouroboros/tools": "^0.5.1",
 		"prop-types": "^15.8.1"
 	},
 	"peerDependencies": {
 		"@emotion/react": "^11.8.2",
 		"@emotion/styled": "^11.8.1",
 		"@mui/material": "^5.5.1",
-		"@ouroboros/body": "^1.0.0",
-		"@ouroboros/brain-mui": "^1.0.0",
-		"@ouroboros/mouth": "^1.0.0",
+		"@ouroboros/body": "^1.0.2",
+		"@ouroboros/brain-react": "^1.0.0",
+		"@ouroboros/mouth": "^1.1.0",
 		"react": "^17.0.2",
 		"react-dom": "^17.0.2"
 	}
-}
+}

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

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-19
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { responseErrorStruct } from '@ouroboros/body';
 export type LocalesProps = {
     mobile: boolean;
@@ -24,7 +24,7 @@ export type LocalesProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Locales(props: LocalesProps): JSX.Element;
+declare function Locales(props: LocalesProps): React.JSX.Element;
 declare namespace Locales {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

package/src/components/pages/Locales.js

@@ -7,7 +7,7 @@
  * @created 2023-01-19
  */
 // Ouroboros modules
-import { Myself } from '@ouroboros/brain-mui';
+import { useRights } from '@ouroboros/brain-react';
 import clone from '@ouroboros/clone';
 import { Tree } from '@ouroboros/define';
 import { Form, Results } from '@ouroboros/define-mui';
@@ -41,7 +41,7 @@ export default function Locales(props) {
     const [create, createSet] = useState(false);
     const [records, recordsSet] = useState([]);
     // Hooks
-    const rights = Myself.useRights('mouth_locale');
+    const rights = useRights('mouth_locale');
     // User / archived change effect
     useEffect(() => {
         // If we have read rights
@@ -61,7 +61,7 @@ export default function Locales(props) {
         // Create a new Promise and return it
         return new Promise((resolve, reject) => {
             // Create the new locale
-            mouth.create('locale').then((data) => {
+            mouth.create('locale', locale).then((data) => {
                 // If we were successful
                 if (data) {
                     // Notify the parent

package/src/components/pages/Locales.tsx

@@ -8,7 +8,7 @@
  */
 
 // Ouroboros modules
-import { Myself } from '@ouroboros/brain-mui';
+import { useRights } from '@ouroboros/brain-react';
 import clone from '@ouroboros/clone';
 import { Tree } from '@ouroboros/define'
 import { Form, Results } from '@ouroboros/define-mui';
@@ -57,7 +57,7 @@ export default function Locales(props: LocalesProps) {
 	const [records, recordsSet] = useState<any[]>([]);
 
 	// Hooks
-	const rights = Myself.useRights('mouth_locale');
+	const rights = useRights('mouth_locale');
 
 	// User / archived change effect
 	useEffect(() => {
@@ -83,7 +83,7 @@ export default function Locales(props: LocalesProps) {
 		return new Promise((resolve, reject) => {
 
 			// Create the new locale
-			mouth.create('locale').then((data: string) => {
+			mouth.create('locale', locale).then((data: string) => {
 
 				// If we were successful
 				if(data) {

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

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-20
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { responseErrorStruct } from '@ouroboros/body';
 import { templateStruct } from './Template';
 export interface CreateProps {
@@ -25,7 +25,7 @@ export interface CreateProps {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Create(props: CreateProps): JSX.Element;
+declare function Create(props: CreateProps): React.JSX.Element;
 declare namespace Create {
     var propTypes: {
         onCancel: PropTypes.Requireable<(...args: any[]) => any>;

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

@@ -45,7 +45,7 @@ export default function Create(props) {
     // Called when record changes
     function change(field, value) {
         // Set the new record
-        recordSet(o => {
+        recordSet((o) => {
             const oRecord = clone(o);
             oRecord[field] = value;
             return oRecord;
@@ -54,12 +54,12 @@ export default function Create(props) {
     // Called to create the template
     function create() {
         // Create the data in the system
-        mouth.create('template', record).then(data => {
+        mouth.create('template', record).then((data) => {
             // Add the ID to the record
             record._id = data;
             // Let the parent know
             props.onCreated(clone(record));
-        }, error => {
+        }, (error) => {
             if (error.code === errors.body.DB_DUPLICATE) {
                 refName.current?.error('Duplicate');
             }

package/src/components/pages/Templates/Create.tsx

@@ -64,7 +64,7 @@ export default function Create(props: CreateProps) {
 	function change(field: string, value: any) {
 
 		// Set the new record
-		recordSet(o => {
+		recordSet((o: templateStruct) => {
 			const oRecord = clone(o);
 			oRecord[field] = value;
 			return oRecord;
@@ -75,14 +75,14 @@ export default function Create(props: CreateProps) {
 	function create() {
 
 		// Create the data in the system
-		mouth.create('template', record).then(data => {
+		mouth.create('template', record).then((data: string) => {
 
 			// Add the ID to the record
 			record._id = data;
 
 			// Let the parent know
 			props.onCreated(clone(record));
-		}, error => {
+		}, (error: responseErrorStruct) => {
 			if(error.code === errors.body.DB_DUPLICATE) {
 				refName.current?.error('Duplicate');
 			} else {

package/src/components/pages/Templates/Template/Content/Create/Email.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../../';
 export type EmailProps = {
     errors: Record<string, any>;
@@ -24,7 +24,7 @@ export type EmailProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Email(props: EmailProps): JSX.Element;
+declare function Email(props: EmailProps): React.JSX.Element;
 declare namespace Email {
     var propTypes: {
         errors: PropTypes.Validator<object>;

package/src/components/pages/Templates/Template/Content/Create/SMS.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../../';
 export type SMSProps = {
     errors: Record<string, any>;
@@ -24,7 +24,7 @@ export type SMSProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function SMS(props: SMSProps): JSX.Element;
+declare function SMS(props: SMSProps): React.JSX.Element;
 declare namespace SMS {
     var propTypes: {
         errors: PropTypes.Validator<object>;

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

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../../';
 import { responseErrorStruct } from '@ouroboros/body';
 export type TemplateContentCreateProps = {
@@ -27,7 +27,7 @@ export type TemplateContentCreateProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Create(props: TemplateContentCreateProps): JSX.Element;
+declare function Create(props: TemplateContentCreateProps): React.JSX.Element;
 declare namespace Create {
     var propTypes: {
         locales: PropTypes.Validator<{

package/src/components/pages/Templates/Template/Content/Preview/Email.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../..';
 export type EmailProps = {
     mobile: boolean;
@@ -23,7 +23,7 @@ export type EmailProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Email(props: EmailProps): JSX.Element;
+declare function Email(props: EmailProps): React.JSX.Element;
 declare namespace Email {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

package/src/components/pages/Templates/Template/Content/Preview/SMS.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-23
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 export type SMSProps = {
     mobile: boolean;
     value: string;
@@ -22,7 +22,7 @@ export type SMSProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function SMS(props: SMSProps): JSX.Element;
+declare function SMS(props: SMSProps): React.JSX.Element;
 declare namespace SMS {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

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

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-23
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../..';
 import { responseErrorStruct } from '@ouroboros/body';
 export type PreviewProps = {
@@ -26,7 +26,7 @@ export type PreviewProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Preview(props: PreviewProps): JSX.Element;
+declare function Preview(props: PreviewProps): React.JSX.Element;
 declare namespace Preview {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

package/src/components/pages/Templates/Template/Content/Update/Email.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-23
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../../';
 export type EmailProps = {
     errors: Record<string, any>;
@@ -24,7 +24,7 @@ export type EmailProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Email(props: EmailProps): JSX.Element;
+declare function Email(props: EmailProps): React.JSX.Element;
 declare namespace Email {
     var propTypes: {
         errors: PropTypes.Validator<object>;

package/src/components/pages/Templates/Template/Content/Update/SMS.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-23
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../../';
 export type SMSProps = {
     errors: Record<string, any>;
@@ -24,7 +24,7 @@ export type SMSProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function SMS(props: SMSProps): JSX.Element;
+declare function SMS(props: SMSProps): React.JSX.Element;
 declare namespace SMS {
     var propTypes: {
         errors: PropTypes.Validator<object>;

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

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { responseErrorStruct } from '@ouroboros/body';
 import { contentStruct } from '../..';
 export type updateStruct = Omit<contentStruct, 'type'>;
@@ -27,7 +27,7 @@ export type UpdateProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Update(props: UpdateProps): JSX.Element;
+declare function Update(props: UpdateProps): React.JSX.Element;
 declare namespace Update {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

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

@@ -39,7 +39,7 @@ export default function Update(props) {
     // Called to create the new content record
     function update() {
         // Send the record data to the server
-        mouth.update(`template/${props.value.type}`, record).then(data => {
+        mouth.update(`template/${props.value.type}`, record).then(() => {
             props.onUpdated({ type: props.value.type, ...record });
         }, (error) => {
             if (error.code === errors.body.DATA_FIELDS) {

package/src/components/pages/Templates/Template/Content/Update/index.tsx

@@ -58,7 +58,7 @@ export default function Update(props: UpdateProps) {
 	function update() {
 
 		// Send the record data to the server
-		mouth.update(`template/${props.value.type}`, record).then(data => {
+		mouth.update(`template/${props.value.type}`, record).then(() => {
 			props.onUpdated({type: props.value.type, ...record});
 		}, (error: responseErrorStruct) => {
 			if(error.code === errors.body.DATA_FIELDS) {

package/src/components/pages/Templates/Template/Content/View/Email.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../../';
 export type EmailProps = {
     mobile: boolean;
@@ -23,7 +23,7 @@ export type EmailProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Email(props: EmailProps): JSX.Element;
+declare function Email(props: EmailProps): React.JSX.Element;
 declare namespace Email {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

package/src/components/pages/Templates/Template/Content/View/SMS.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { contentStruct } from '../../';
 export type SMSProps = {
     mobile: boolean;
@@ -23,7 +23,7 @@ export type SMSProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function SMS(props: SMSProps): JSX.Element;
+declare function SMS(props: SMSProps): React.JSX.Element;
 declare namespace SMS {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

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

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-22
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { responseErrorStruct } from '@ouroboros/body';
 import { contentStruct } from '../..';
 export type ViewProps = {
@@ -25,7 +25,7 @@ export type ViewProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function View(props: ViewProps): JSX.Element;
+declare function View(props: ViewProps): React.JSX.Element;
 declare namespace View {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

package/src/components/pages/Templates/Template/Variables.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-20
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 export type VariablesProps = {
     onChange: (variables: Record<string, string>) => void;
     value: Record<string, string>;
@@ -22,7 +22,7 @@ export type VariablesProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Variables(props: VariablesProps): JSX.Element;
+declare function Variables(props: VariablesProps): React.JSX.Element;
 declare namespace Variables {
     var propTypes: {
         onChange: PropTypes.Validator<(...args: any[]) => any>;

package/src/components/pages/Templates/Template/Variables.js

@@ -68,7 +68,7 @@ export default function Variables(props) {
     // Render
     return (React.createElement(Box, null,
         React.createElement(Grid, { container: true, spacing: 1 },
-            omap(props.value, (v, k) => React.createElement(React.Fragment, null,
+            omap(props.value, (v, k) => React.createElement(React.Fragment, { key: k },
                 React.createElement(Grid, { item: true, xs: 5 }, k),
                 React.createElement(Grid, { item: true, xs: 5 }, v),
                 React.createElement(Grid, { item: true, xs: 2 },

package/src/components/pages/Templates/Template/Variables.tsx

@@ -93,7 +93,7 @@ export default function Variables(props: VariablesProps) {
 		<Box>
 			<Grid container spacing={1}>
 				{omap(props.value, (v,k) =>
-					<React.Fragment>
+					<React.Fragment key={k}>
 						<Grid item xs={5}>{k}</Grid>
 						<Grid item xs={5}>{v}</Grid>
 						<Grid item xs={2}>

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

@@ -6,10 +6,10 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-20
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { responseErrorStruct } from '@ouroboros/body';
-import { rightsStruct } from '@ouroboros/brain-mui';
+import { rightsStruct } from '@ouroboros/brain-react';
 export type contentStruct = {
     _id?: string;
     _created?: number;
@@ -52,7 +52,7 @@ export type TemplateProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Template(props: TemplateProps): JSX.Element;
+declare function Template(props: TemplateProps): React.JSX.Element;
 declare namespace Template {
     var propTypes: {
         locales: PropTypes.Validator<{

package/src/components/pages/Templates/Template/index.tsx

@@ -38,7 +38,7 @@ import Variables from './Variables';
 
 // Types
 import { responseErrorStruct } from '@ouroboros/body';
-import { rightsStruct } from '@ouroboros/brain-mui';
+import { rightsStruct } from '@ouroboros/brain-react';
 export type contentStruct = {
 	_id?: string,
 	_created?: number,

package/src/components/pages/Templates/index.d.ts

@@ -6,8 +6,8 @@
  * @author Chris Nasr <chris@ouroboroscoding.com>
  * @created 2023-01-19
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { responseErrorStruct } from '@ouroboros/body';
 export type TemplatesProps = {
     mobile: boolean;
@@ -24,7 +24,7 @@ export type TemplatesProps = {
  * @param Object props Properties passed to the component
  * @returns React.Component
  */
-declare function Templates(props: TemplatesProps): JSX.Element;
+declare function Templates(props: TemplatesProps): React.JSX.Element;
 declare namespace Templates {
     var propTypes: {
         mobile: PropTypes.Validator<boolean>;

package/src/components/pages/Templates/index.js

@@ -7,7 +7,7 @@
  * @created 2023-01-19
  */
 // Ouroboros modules
-import { Myself } from '@ouroboros/brain-mui';
+import { useRights } from '@ouroboros/brain-react';
 import clone from '@ouroboros/clone';
 import mouth from '@ouroboros/mouth';
 import { afindi } from '@ouroboros/tools';
@@ -37,13 +37,13 @@ export default function Templates(props) {
     const [locales, localesSet] = useState({});
     const [templates, templatesSet] = useState([]);
     // Hooks
-    const rightsContent = Myself.useRights('mouth_content');
-    const rightsTemplate = Myself.useRights('mouth_template');
+    const rightsContent = useRights('mouth_content');
+    const rightsTemplate = useRights('mouth_template');
     // User / archived change effect
     useEffect(() => {
         // If we have template read permissions
         if (rightsTemplate.read) {
-            mouth.read('locale').then(data => {
+            mouth.read('locales').then((data) => {
                 const oLocales = {};
                 for (const o of data) {
                     oLocales[o._id] = o.name;

package/src/components/pages/Templates/index.tsx

@@ -8,7 +8,7 @@
  */
 
 // Ouroboros modules
-import { Myself } from '@ouroboros/brain-mui';
+import { useRights } from '@ouroboros/brain-react';
 import clone from '@ouroboros/clone';
 import mouth from '@ouroboros/mouth';
 import { afindi } from '@ouroboros/tools';
@@ -52,15 +52,15 @@ export default function Templates(props: TemplatesProps) {
 	const [templates, templatesSet] = useState<templateStruct[]>([]);
 
 	// Hooks
-	const rightsContent = Myself.useRights('mouth_content');
-	const rightsTemplate = Myself.useRights('mouth_template');
+	const rightsContent = useRights('mouth_content');
+	const rightsTemplate = useRights('mouth_template');
 
 	// User / archived change effect
 	useEffect(() => {
 
 		// If we have template read permissions
 		if(rightsTemplate.read) {
-			mouth.read('locale').then(data => {
+			mouth.read('locales').then((data: Record<string, any>[]) => {
 				const oLocales: Record<string, string> = {};
 				for(const o of data) {
 					oLocales[o._id] = o.name;