@onehat/ui 0.4.119 → 0.4.122

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@onehat/ui",
-	"version": "0.4.119",
+	"version": "0.4.122",
 	"description": "Base UI for OneHat apps",
 	"main": "src/index.js",
 	"type": "module",

package/src/Components/Container/Container.js

@@ -2,6 +2,7 @@ import { cloneElement, useState, useEffect, useRef, useCallback, } from 'react';
 import {
 	BoxNative,
 	HStack,
+	HStackNative,
 	VStack,
 } from '@project-components/Gluestack';
 import clsx from 'clsx';
@@ -681,7 +682,7 @@ function Container(props) {
 	return <VStack className="Container-all flex-1 min-w-0">
 				{northComponent}
 				{!getNorthIsCollapsed() && northSplitter}
-				<HStack
+				<HStackNative
 					className="Container-mid w-full flex-[100] min-w-0"
 					onLayout={(e) => {
 						// Measure available horizontal space for side panels.
@@ -707,7 +708,7 @@ function Container(props) {
 					</VStack>
 					{!getEastIsCollapsed() && eastSplitter}
 					{eastComponent}
-				</HStack>
+				</HStackNative>
 				{!getSouthIsCollapsed() && southSplitter}
 				{southComponent}
 			</VStack>;

package/src/Components/Form/Field/Combo/IntervalsCombo.js

@@ -1,12 +1,12 @@
 import ArrayCombo from './ArrayCombo.js';
 
 const data = [
-	['+1 day', 'Daily'], 
-	['+1 week', 'Weekly'], 
-	['+2 week', 'Bi-weekly'], 
-	['+1 month', 'Monthly'], 
-	['+3 month', 'Quarterly'], 
-	['+1 year', 'Yearly']
+	['1 day', 'Daily'], 
+	['1 week', 'Weekly'], 
+	// ['2 week', 'Bi-weekly'], // ambibuous, don't use
+	['1 month', 'Monthly'], 
+	['1 quarter', 'Quarterly'], 
+	['1 year', 'Yearly']
 ];
 
 export default function IntervalsCombo(props) {

package/src/Components/Form/Field/Combo/ReportQueueStatusesCombo.js

@@ -0,0 +1,33 @@
+/**
+ * COPYRIGHT NOTICE
+ * This file is categorized as "Custom Source Code"
+ * and is subject to the terms and conditions defined in the
+ * "LICENSE.txt" file, which is part of this source code package.
+ */
+
+import ArrayCombo from './ArrayCombo.js';
+import {
+	REPORT_QUEUE_STATUS__ALL,
+	REPORT_QUEUE_STATUS__COMPLETED,
+	REPORT_QUEUE_STATUS__FAILED,
+	REPORT_QUEUE_STATUS__IN_PROCESS,
+	REPORT_QUEUE_STATUS__PENDING,
+} from '../../../../Constants/ReportQueueStatuses.js';
+
+const data = [
+	[REPORT_QUEUE_STATUS__ALL, 'All'],
+	[REPORT_QUEUE_STATUS__PENDING, 'Only Pending'],
+	[REPORT_QUEUE_STATUS__IN_PROCESS, 'Only In Process'],
+	[REPORT_QUEUE_STATUS__FAILED, 'Only Failures'],
+	[REPORT_QUEUE_STATUS__COMPLETED, 'Only Completed'],
+];
+
+function ReportQueueStatusesCombo(props) {
+	return <ArrayCombo
+				data={data}
+				disableDirectEntry={true}
+				{...props}
+			/>;
+}
+
+export default ReportQueueStatusesCombo;

package/src/Components/Form/Field/Date.js

@@ -275,6 +275,7 @@ export const DateElement = forwardRef((props, ref) => {
 			if (limitWidth) {
 				width = 150;
 			}
+			height = 150;
 			break;
 		default:
 	}

package/src/Components/Form/Form.js

@@ -1040,6 +1040,7 @@ function Form(props) {
 							icon,
 							selectorId,
 							selectorSelectedField,
+							disableTitleSuffix = false,
 							...itemPropsToPass
 						} = item,
 						titleElement;
@@ -1076,7 +1077,7 @@ function Form(props) {
 										initialEditorMode={ancillaryInitialEditorMode}
 									/>;
 					if (title) {
-						if (record?.displayValue) {
+						if (record?.displayValue && !disableTitleSuffix) {
 							title += ' for ' + record.displayValue;
 						}
 						titleElement = <Text

package/src/Components/Grid/ReportsQueue.js

@@ -0,0 +1,277 @@
+
+import { useState, useEffect, } from 'react';
+import {
+	Box,
+	Text,
+} from '@project-components/Gluestack';
+import clsx from 'clsx';
+import { useSelector, useDispatch } from 'react-redux';
+import oneHatData from '@onehat/data';
+import {
+	setIsWaitModalShown,
+} from '../../Models/Slices/SystemSlice';
+import {
+	selectUser,
+} from '../../Models/Slices/AuthSlice.js';
+import {
+	REPORT_QUEUE_STATUS__ALL,
+} from '../../Constants/ReportQueueStatuses.js';
+import IconButton from '../Buttons/IconButton';
+import withAlert from '../../Components/Hoc/withAlert.js';
+import useForceUpdate from '../../Hooks/useForceUpdate.js';
+import getComponentFromType from '../../Functions/getComponentFromType.js';
+import Rotate from '../Icons/Rotate.js';
+import X from '../Icons/X.js';
+
+function ReportsQueue(props) {
+	const {
+			// withAlert
+			alert,
+			showInfo,
+		} = props,
+		dispatch = useDispatch(),
+		forceUpdate = useForceUpdate(),
+		user = useSelector(selectUser),
+		UtilQueuedReports = oneHatData.getRepository('UtilQueuedReports'),
+		onRequeueFailedJob = async (entity) => {
+			dispatch(setIsWaitModalShown(true));
+
+			try {
+				const result = await UtilQueuedReports._send('POST', 'UtilQueuedReports/requeueFailedJob', {
+					util_queued_report_id: entity.id,
+				});
+				const response = UtilQueuedReports._processServerResponse(result);
+				if (response.success) {
+
+					await entity.reload();
+					
+					forceUpdate();
+
+					showInfo('Job requeued successfully.');
+				}
+
+			} catch (error) {
+				alert('An error occurred while requeuing the job. Please try again.');
+			} finally {
+				dispatch(setIsWaitModalShown(false));
+			}
+		},
+		onCancel = async (entity) => {
+			dispatch(setIsWaitModalShown(true));
+
+			try {
+				const result = await UtilQueuedReports._send('POST', 'UtilQueuedReports/cancelPendingJob', {
+					util_queued_report_id: entity.id,
+				});
+				const response = UtilQueuedReports._processServerResponse(result);
+				if (response.success) {
+
+					await entity.reload();
+					
+					forceUpdate();
+
+					showInfo('Job cancelled successfully.');
+				}
+
+			} catch (error) {
+				alert('An error occurred while cancelling the job. Please try again.');
+			} finally {
+				dispatch(setIsWaitModalShown(false));
+			}
+		};
+
+	useEffect(() => {
+
+		setTimeout(() => {
+			UtilQueuedReports.reload();
+		}, 60 * 1000);
+		
+	}, [UtilQueuedReports]);
+	
+	const UtilQueuedReportsFilteredGridEditor = getComponentFromType('UtilQueuedReportsFilteredGridEditor');
+	
+	return <UtilQueuedReportsFilteredGridEditor
+				reference="ReportsQueue"
+				usePermissions={false}
+				Repository={UtilQueuedReports}
+				
+				title="Reports Queue"
+				className="w-full h-full"
+				searchAllText={false}
+				showClearFiltersButton={false}
+				customFilters={[
+					{
+						id: 'status',
+						title: 'Status',
+						tooltip: 'Select which status to display in the queue.',
+						field: 'status',
+						type: 'ReportQueueStatusesCombo',
+						value: REPORT_QUEUE_STATUS__ALL,
+						getRepoFilters: (value) => {
+							return [
+								{
+									name: 'status',
+									value,
+								},
+							];
+						},
+					},
+					{
+						id: 'showAllUsers',
+						title: 'All Users?',
+						tooltip: 'Should we include queued reports from ALL users, so you can see the overall queue status?',
+						field: 'showAllUsers',
+						type: 'Toggle',
+						value: false,
+						getRepoFilters: (value) => {
+							return [
+								{
+									name: 'showAllUsers',
+									value,
+								},
+							];
+						},
+					},
+				]}
+				columnsConfig={[
+					{
+						id: 'action',
+						header: 'Action',
+						w: 70,
+						isSortable: false,
+						isEditable: false,
+						isReorderable: false,
+						isResizable: false,
+						isHidable: false,
+						renderer: (entity, fieldName, cellProps, key) => {
+							const
+								isUser = entity.util_queued_reports__user_id === user?.id,
+								className = clsx(
+									cellProps.className,
+									'flex',
+									'items-center',
+									'justify-center',
+								);
+							let action,
+								icon,
+								tooltip;
+							if (entity.util_queued_reports__is_in_process && isUser) {
+								action = onCancel;
+								icon = X;
+								tooltip = 'Cancel this report';
+							} else if (entity.util_queued_reports__success === false && isUser) {
+								action = onRequeueFailedJob;
+								icon = Rotate;
+								tooltip = 'Requeue this failed report';
+							} else {
+								// no available action
+								return <Box {...cellProps} className={className} />;
+							}
+							return <IconButton
+										key={key}
+										{...cellProps}
+										className={className}
+										icon={icon}
+										_icon={{
+											size: 'xl',
+										}}
+										onPress={() => action(entity)}
+										tooltip={tooltip}
+									/>;
+						},
+					},
+					{
+						"id": "util_queued_reports__report_title",
+						"header": "Report", // MOD
+						"fieldName": "util_queued_reports__report_title",
+						"isSortable": false,
+						"isEditable": false,
+						"isReorderable": true,
+						"isResizable": true,
+						"w": 250 // MOD
+					},
+					{
+						"id": "util_queued_reports__report_preset_name",
+						"header": "Preset", // MOD
+						"fieldName": "util_queued_reports__report_preset_name",
+						"isSortable": false,
+						"isEditable": false,
+						"isReorderable": true,
+						"isResizable": true,
+						"w": 150
+					},
+					{
+						"id": "util_queued_reports__submitted",
+						"header": "Submitted",
+						"fieldName": "util_queued_reports__submitted",
+						"isSortable": true,
+						"isEditable": true,
+						"isReorderable": true,
+						"isResizable": true,
+						"w": 200
+					},
+					{
+						"id": "util_queued_reports__is_in_process",
+						"header": "In Process?",
+						"fieldName": "util_queued_reports__is_in_process",
+						"isSortable": true,
+						"isEditable": true,
+						"isReorderable": true,
+						"isResizable": true,
+						"w": 100
+					},
+					{
+						"id": "util_queued_reports__success",
+						"header": "Success",
+						"fieldName": "util_queued_reports__success",
+						"isSortable": true,
+						"isEditable": true,
+						"isReorderable": true,
+						"isResizable": true,
+						"w": 100
+					},
+					{
+						"id": "util_queued_reports__run_time",
+						"header": "Run Time",
+						"fieldName": "util_queued_reports__run_time",
+						"isSortable": true,
+						"isEditable": true,
+						"isReorderable": true,
+						"isResizable": true,
+						"w": 100
+					},
+					{
+						"id": "users__username",
+						"header": "User",
+						"fieldName": "users__username",
+						"isSortable": false,
+						"isEditable": false,
+						"isReorderable": false,
+						"isResizable": false,
+						"w": 100
+					},
+				]}
+				getRowProps={(item) => {
+					const rowProps = {
+						borderBottomWidth: 1,
+						borderBottomColor: 'trueGray.500',
+					};
+					if (item.util_queued_reports__is_in_process) {
+						rowProps.bg = '#f9eabb';
+					} else if (item.util_queued_reports__success === false) {
+						rowProps.bg = '#ffd1d1';
+					}
+					return rowProps;
+				}}
+				disableAdd={true}
+				disableEdit={true}
+				disableDelete={true}
+				disableDuplicate={true}
+				disableView={true}
+				disableCopy={true}
+
+				{...props}
+			/>;
+}
+
+export default withAlert(ReportsQueue);

package/src/Components/Hoc/withEditor.js

@@ -63,6 +63,7 @@ export default function withEditor(WrappedComponent, isTree = false) {
 				initialEditorMode = EDITOR_MODE__VIEW,
 				stayInEditModeOnSelectionChange = false,
 				inheritParentEditorMode = true,
+				ignoreGlobalStayInEditModeOnSelectionChange = false,
 
 				// withComponent
 				self,
@@ -863,8 +864,8 @@ export default function withEditor(WrappedComponent, isTree = false) {
 
 				let isIgnoreNextSelectionChange = getIsIgnoreNextSelectionChange(),
 					doStayInEditModeOnSelectionChange = stayInEditModeOnSelectionChange;
-				if (!_.isNil(UiGlobals.stayInEditModeOnSelectionChange)) {
-					// allow global override to for this property
+				if (!_.isNil(UiGlobals.stayInEditModeOnSelectionChange) && !ignoreGlobalStayInEditModeOnSelectionChange) {
+					// allow global override for this property
 					doStayInEditModeOnSelectionChange = UiGlobals.stayInEditModeOnSelectionChange;
 				}
 				if (doStayInEditModeOnSelectionChange) {

package/src/Components/Icons/Q.js

@@ -0,0 +1,12 @@
+import { createIcon } from "../Gluestack/icon";
+import Svg, { Path } from "react-native-svg"
+
+const SvgComponent = createIcon({
+	Root: Svg,
+	viewBox: '420 310 730 940',
+	path: <Path
+			d="M972.547 1227.359c-38.672 12.891-84.961 19.336-138.867 19.336-112.5 0-205.469-33.593-278.907-100.781-89.062-80.859-133.593-199.609-133.593-356.25 0-157.812 45.703-277.148 137.109-358.008 74.609-66.015 167.383-99.023 278.32-99.023 111.719 0 205.469 34.961 281.25 104.883 87.5 80.859 131.25 193.945 131.25 339.257 0 76.954-9.375 141.407-28.125 193.36-15.234 49.609-37.695 90.82-67.382 123.633l99.609 93.164-94.336 98.437-104.297-98.437c-31.64 19.14-58.984 32.617-82.031 40.429zM933.875 1071.5l-87.305-83.203 93.164-97.266 87.305 83.203c13.672-28.125 23.242-52.734 28.711-73.828 8.594-31.64 12.891-68.554 12.891-110.742 0-96.875-19.825-171.777-59.473-224.707-39.648-52.93-97.559-79.395-173.73-79.395-71.485 0-128.516 25.391-171.094 76.172-42.578 50.782-63.867 126.758-63.867 227.93 0 118.359 30.468 203.125 91.406 254.297 39.453 33.203 86.719 49.805 141.797 49.805 20.703 0 40.625-2.539 59.765-7.618 10.547-2.734 24.024-7.617 40.43-14.648z"
+		/>,
+});
+
+export default SvgComponent

package/src/Components/Report/Report.js

@@ -1,4 +1,4 @@
-import { cloneElement, isValidElement } from 'react';
+import { cloneElement, isValidElement, useState, } from 'react';
 import {
 	Box,
 	HStack,
@@ -9,7 +9,11 @@ import {
 	VStackNative,
 } from '@project-components/Gluestack';
 import clsx from 'clsx';
+import { useSelector, useDispatch } from 'react-redux';
 import { EDITOR_TYPE__PLAIN } from '../../Constants/Editor';
+import {
+	selectUser,
+} from '../../Models/Slices/AuthSlice.js';
 import {
 	UI_MODE_WEB,
 	CURRENT_MODE,
@@ -18,6 +22,7 @@ import {
 	REPORT_TYPES__EXCEL,
 	REPORT_TYPES__PDF,
 } from '../../Constants/ReportTypes.js';
+import oneHatData from '@onehat/data';
 import Form from '../Form/Form.js';
 import IconButton from '../Buttons/IconButton.js';
 import withComponent from '../Hoc/withComponent.js';
@@ -28,8 +33,10 @@ import ChartLine from '../Icons/ChartLine.js';
 import Calendar from '../Icons/Calendar.js';
 import Plus from '../Icons/Plus.js';
 import Pdf from '../Icons/Pdf.js';
+import Share from '../Icons/Share.js';
 import Excel from '../Icons/Excel.js';
 import getReport from '../../Functions/getReport.js';
+import * as yup from 'yup';
 import _ from 'lodash';
 
 function Report(props) {
@@ -41,7 +48,9 @@ function Report(props) {
 			description,
 			reportId,
 			disablePdf = false,
+			pdfButtonText = 'Download PDF',
 			disableExcel = false,
+			excelButtonText = 'Download Excel',
 			showReportHeaders = true,
 			isQuickReport = false,
 			isDisabled = false,
@@ -51,9 +60,41 @@ function Report(props) {
 			disabledMessage = 'Report is Disabled',
 			additionalData = {},
 			quickReportData = {},
+
+			// withAlert
 			alert,
+			showInfo,
+			showModal,
+			hideModal,
+
+			// withComponent
+			self,
 		} = props,
 		formProps = props._form || {},
+		hasFormItems = formProps?.items?.[0]?.items?.length,
+		showPresets = usePresets && hasFormItems,
+		user = useSelector(selectUser),
+		[isValid, setIsValid] = useState(!hasFormItems), // if there are no form items, consider the form valid by default; otherwise, start as invalid until the form says otherwise
+		getCurrentReportFormData = () => {
+			const
+				form = self?.children?.form,
+				formValues = form?.formGetValues?.();
+			if (!_.isPlainObject(formValues)) {
+				alert('Unable to get form data');
+				return {};
+			}
+			return formValues;
+		},
+		setCurrentReportFormData = (data) => {
+			const form = self?.children?.form;
+			if (!form || !_.isPlainObject(data)) {
+				alert('Unable to set form data');
+				return;
+			}
+			_.each(data, (value, key) => {
+				form.formSetValue(key, value);
+			});
+		},
 		footerProps = formProps.footerProps || {},
 		footerClassName = clsx(
 			footerProps.className,
@@ -77,6 +118,175 @@ function Report(props) {
 			} catch (error) {
 				alert(error?.message || 'Unable to download report. Please try again.');
 			}
+		},
+		manageReportSchedules = async (formData) => {
+			let defaultValues = {
+				report_schedules__additional_data: additionalData,
+			};
+			if (hasFormItems) {
+				// check to make sure there is at least one ReportPreset for this report, since the schedule needs to be based on a preset (which captures the form config)
+				// If not, show alert saying create preset first
+				const ReportPresets = self?.children?.reportPresetsComboEditor?.repository;
+				if (!ReportPresets) {
+					alert('Unable to access report presets. Please try again.');
+					return;
+				}
+				let reportPresets = ReportPresets.getEntities();
+				if (!reportPresets?.length) {
+					await ReportPresets.load();
+					reportPresets = ReportPresets.getEntities();
+				}
+				if (!reportPresets?.length) {
+					alert('Please create at least one report preset first, since schedules are based on presets.');
+					return;
+				}
+			} else {
+				// Form is empty, but the ReportSchedule needs a report_preset_id to work.
+				// Get or create one.
+				const ReportPresets = oneHatData.getRepository('ReportPresets');
+				const result = await ReportPresets._send('POST', 'ReportPresets/getOrCreate', {
+					reportId,
+				});
+				const response = ReportPresets._processServerResponse(result);
+				if (!response.success) {
+					showInfo('Failed to get or create report preset: ' + (response.message || 'Unknown error'));
+					return;
+				}
+				defaultValues.report_schedules__report_preset_id = response.root.id;
+			}
+			const ReportSchedulesGridEditor = getComponentFromType('ReportSchedulesGridEditor');
+			showModal({
+				title: 'Schedules for "' + title + '"',
+				body: <ReportSchedulesGridEditor
+							baseParams={{
+								'conditions[reportid]': reportId,
+							}}
+							_editor={{
+								hasFormItems,
+								reportId,
+							}}
+							defaultValues={defaultValues}
+						/>,
+				canClose: true,
+				whichModal: 'schedulesModal',
+				h: 800,
+				w: 1100,
+			});
+		},
+		getRepository = () => {
+			let repository;
+			try {
+				// There is no 'Reports' repository (bc there is no 'Reports' model), 
+				// so just get the first OneBuild repository; doesn't matter which one
+	
+				repository = oneHatData.getRepositoriesByType('onebuild', true); // true to get the first only
+
+			} catch (error) {
+				alert('Error getting repository: ' + (error?.message || error));
+				return null;
+			}
+			return repository;
+		},
+		addToQueue = async (formData) => {
+			const
+				repository = getRepository(),
+				data = {
+					report_id: reportId,
+					...formData,
+					...additionalData,
+				},
+				result = await repository._send('POST', 'Reports/addToQueue', data),
+				response = repository._processServerResponse(result);
+			if (!response.success) {
+				alert(response.message || 'Failed to add report to queue');
+				return;
+			}
+
+			showInfo('Report added to queue.');
+		},
+		selectReportPreset = (reportPresetId) => {
+			// Change the form settings based on the selected preset
+			const
+				form = self?.children?.form,
+				ReportPresets = self?.children?.reportPresetsComboEditor?.repository;
+			if (!form || !ReportPresets) {
+				return;
+			}
+			
+			const reportPreset = ReportPresets?.getById(reportPresetId);
+			if (!reportPreset) {
+				alert('Selected report preset not found');
+				return;
+			}
+
+			// apply the config to the form
+			const config = reportPreset.properties.report_presets__config.getParsedValue(); // get the actual JS object
+			setCurrentReportFormData(config);
+		},
+		shareReportPreset = (parent) => {
+
+			// show a Modal with UserSelector, excluding current user.
+			showModal({
+				title: 'Share Report Preset',
+				body: <Form
+						instructions="Please select which user to share with."
+						editorType={EDITOR_TYPE__PLAIN}
+						className="flex-1"
+						items={[
+							{
+								name: 'instructions',
+								type: 'DisplayField',
+								text: 'Please select which user to share with.',
+								className: 'mb-3',
+							},
+							{
+								type: 'Column',
+								flex: 1,
+								items: [
+									{
+										name: 'user_id',
+										type: 'UsersCombo',
+										label: 'User',
+										baseParams: {
+											'conditions[id <>]': user.id,
+										},
+									},
+								],
+							},
+						]}
+						validator={yup.object({
+							user_id: yup.number().integer().required(),
+						})}
+						onCancel={(e) => {
+							hideModal();
+						}}
+						onClose={(e) => {
+							hideModal();
+						}}
+						onSubmit={async (data, e) => {
+							const
+								ReportPresets = self?.children?.reportPresetsComboEditor?.repository,
+								reportPreset = parent.selection[0],
+								params = {
+									report_preset_id: reportPreset.id,
+									user_id: data.user_id,
+								},
+								result = await ReportPresets._send('POST', 'ReportPresets/share', params),
+								response = ReportPresets._processServerResponse(result);
+
+							// Close the modal
+							hideModal();
+
+							if (response.success) {
+								showInfo('Report preset shared successfully.');
+							}
+						}}
+					/>,
+				canClose: true,
+				whichModal: 'shareReportPresetModal',
+				h: 220,
+				w: 500,
+			});
 		};
 
 	const propsIcon = props._icon || {};
@@ -177,37 +387,54 @@ function Report(props) {
 	}
 
 	let footerItems = [];
-	if (usePresets) {
+	if (showPresets) { // if no form items, no need for ReportPresets!
 		footerItems.push({
 			...testProps('reportPresetsComboEditor'),
+			parent: self,
+			reference: 'reportPresetsComboEditor',
 			key: 'reportPresetsComboEditor',
 			type: 'ReportPresetsComboEditor',
 			tooltip: 'Report Presets',
-			placeholder: 'Report Presets',
-			disableEdit: true,
-			className: 'w-[100px]',
+			placeholder: 'Presets',
+			disableEdit: true, // too complicated to edit, just allow add/delete/share
+			className: 'w-[130px]',
 			baseParams: {
-				reportId,
+				'conditions[reportid]': reportId, // reportid is a generated field, so you can search on it, but change capitalization
+			},
+			onChangeValue: selectReportPreset,
+			_grid: {
+				canRecordBeAdded: () => isValid, // only allow creating a preset if the form is valid, since the preset will capture the current form config
+				onBeforeAdd: (addValues) => {
+					// add the current form values to ReportPresets.config when creating a new preset
+					return {
+						...addValues,
+						report_presets__config: {
+							...getCurrentReportFormData(),
+							report_id: reportId,
+						},
+					};
+				},
+				additionalToolbarButtons: [
+					{
+						...testProps('shareBtn'),
+						key: 'shareBtn',
+						text: 'Share Report Preset',
+						icon: Share,
+						getIsButtonDisabled: (selection) => !selection?.[0]?.id,
+						handler: shareReportPreset,
+					},
+				],
 			},
 		});
 	}
 	if (useScheduledReports) {
 		footerItems.push({
-			...testProps('scheduleReportBtn'),
-			key: 'scheduleReportBtn',
+			...testProps('manageReportSchedulesBtn'),
+			key: 'manageReportSchedulesBtn',
 			type: 'Button',
-			tooltip: 'Schedule Report',
+			tooltip: 'Manage delivery schedules for this report',
 			icon: Calendar,
-			onPress: (data) => scheduleReport({
-				reportId,
-				data: {
-					...data,
-					...additionalData,
-				},
-				reportType: REPORT_TYPES__EXCEL,
-				showReportHeaders,
-			}),
-			disableOnInvalid: true,
+			onPress: manageReportSchedules,
 		});
 	}
 	if (useQueue) {
@@ -215,17 +442,9 @@ function Report(props) {
 			...testProps('queueBtn'),
 			key: 'queueBtn',
 			type: 'Button',
-			tooltip: 'Add to Queue',
+			tooltip: 'Immediately add to Queue',
 			icon: Plus,
-			onPress: (data) => addToQueue({
-				reportId,
-				data: {
-					...data,
-					...additionalData,
-				},
-				reportType: REPORT_TYPES__EXCEL,
-				showReportHeaders,
-			}),
+			onPress: addToQueue,
 			disableOnInvalid: true,
 		});
 	}
@@ -234,8 +453,9 @@ function Report(props) {
 			...testProps('excelBtn'),
 			key: 'excelBtn',
 			type: 'Button',
-			text: 'Download Excel',
+			text: excelButtonText,
 			icon: Excel,
+			tooltip: excelButtonText !== 'Download Excel' ? 'Download Excel' : null,
 			onPress: (data) => downloadReport({
 				reportId,
 				data: {
@@ -253,8 +473,9 @@ function Report(props) {
 			...testProps('pdfBtn'),
 			key: 'pdfBtn',
 			type: 'Button',
-			text: 'Download PDF',
+			text: pdfButtonText,
 			icon: Pdf,
+			tooltip: pdfButtonText !== 'Download PDF' ? 'Download PDF' : null,
 			onPress: (data) => downloadReport({
 				reportId,
 				data: {
@@ -270,9 +491,17 @@ function Report(props) {
 	if (footerItems.length) {
 		footerItems = footerItems.map(item => {
 			const Component = getComponentFromType(item.type);
-			return <Component {...item} />;
+			const { key, ...componentProps } = item;
+			return <Component key={key} {...componentProps} />;
 		});
 	}
+	let additionalDataComponent = null;
+	if (!_.isEmpty(additionalData)) {
+		const ReportAdditionalData = getComponentFromType('ReportAdditionalData');
+		additionalDataComponent = <ReportAdditionalData
+									additionalData={additionalData}
+								/>;
+	}
 	return <VStackNative
 				{...testProps('Report-' + reportId)}
 				className={clsx(
@@ -298,9 +527,12 @@ function Report(props) {
 						<VStack className="flex-1">
 							<Text className="text-2xl max-w-full">{title}</Text>
 							<Text className="text-sm">{description}</Text>
+							{additionalDataComponent}
 						</VStack>
 					</HStack>
 					<Form
+						parent={self}
+						reference="form"
 						editorType={EDITOR_TYPE__PLAIN}
 						additionalFooterItems={footerItems}
 						{...formProps}
@@ -308,6 +540,9 @@ function Report(props) {
 							...footerProps,
 							className: footerClassName,
 						}}
+						onValidityChange={(isValid) => {
+							setIsValid(isValid);
+						}}
 					/>
 				</Box>
 				{isDisabled &&
@@ -353,4 +588,13 @@ function Report(props) {
 			</VStackNative>;
 }
 
-export default withComponent(withAlert(Report));
+function withAdditionalProps(WrappedComponent) {
+	return (props) => {
+		return <WrappedComponent
+					reference={props.reference || 'report'}
+					{...props}
+				/>;
+	};
+}
+
+export default withAdditionalProps(withComponent(withAlert(Report)));

package/src/Components/Screens/ReportsManager.js

@@ -7,7 +7,10 @@ import {
 } from '@project-components/Gluestack';
 import clsx from 'clsx';
 import ChartPie from '../Icons/ChartPie.js';
+import Q from '../Icons/Q.js';
+import getComponentFromType from '../../Functions/getComponentFromType.js';
 import ScreenHeader from '../Layout/ScreenHeader.js';
+import ReportsQueue from '../Grid/ReportsQueue.js';
 import TabBar from '../Tab/TabBar.js';
 import _ from 'lodash';
 
@@ -18,6 +21,7 @@ export default function ReportsManager(props) {
 			reports = [],
 			reportTabs,
 			initialReportTabIx = 0,
+			showQueueTab = false,
 			id,
 			self,
 			isActive = false,
@@ -65,6 +69,14 @@ export default function ReportsManager(props) {
 							</VStackNative>
 						</ScrollView>,
 		})) : [];
+
+	if (showQueueTab) {
+		tabBarTabs.push({
+			title: 'Queue',
+			icon: Q,
+			content: <ReportsQueue />,
+		});
+	}
 	
 	return <VStack
 				className="overflow-hidden flex-1 w-full"

package/src/Components/index.js

@@ -284,6 +284,7 @@ import PmCalcDebugViewer from './Viewer/PmCalcDebugViewer.js';
 import PmStatusesViewer from './Viewer/PmStatusesViewer.js';
 import RadioGroup from './Form/Field/RadioGroup/RadioGroup.js';
 import ReportPresetsComboEditor from './Form/Field/Combo/ReportPresetsComboEditor.js';
+import ReportQueueStatusesCombo from './Form/Field/Combo/ReportQueueStatusesCombo.js';
 // import Slider from './Form/Field/Slider.js'; // Currently, Slider is not compatible with the new React architecture. Temporarily remove it from index.js to prevent issues.
 import SquareButton from './Buttons/SquareButton.js';
 import TabPanel from './Panel/TabPanel.js';
@@ -585,6 +586,7 @@ const components = {
 	PmStatusesViewer,
 	RadioGroup,
 	ReportPresetsComboEditor,
+	ReportQueueStatusesCombo,
 	// Slider,
 	SquareButton,
 	TabPanel,

package/src/Constants/ReportQueueStatuses.js

@@ -0,0 +1,5 @@
+export const REPORT_QUEUE_STATUS__ALL = 'ALL';
+export const REPORT_QUEUE_STATUS__PENDING = 'PENDING';
+export const REPORT_QUEUE_STATUS__IN_PROCESS = 'IN_PROCESS';
+export const REPORT_QUEUE_STATUS__COMPLETED = 'COMPLETED';
+export const REPORT_QUEUE_STATUS__FAILED = 'FAILED';

package/src/PlatformImports/Web/Attachments.js

@@ -233,7 +233,7 @@ function AttachmentsElement(props) {
 
 		} = props,
 		styles = UiGlobals.styles,
-		model = _.isArray(selectorSelected) && selectorSelected[0] ? selectorSelected[0].repository?.name : selectorSelected?.repository?.name,
+		model = _.isArray(selectorSelected) && selectorSelected[0] ? selectorSelected[0].schema?.name : selectorSelected?.schema?.name,
 		modelidCalc = _.isArray(selectorSelected) ? _.map(selectorSelected, (entity) => entity[selectorSelectedField]) : selectorSelected?.[selectorSelectedField],
 		modelid = useRef(modelidCalc),
 		id = props.id || (model && modelid.current ? `attachments-${model}-${modelid.current}` : 'attachments'),
@@ -770,7 +770,7 @@ function AttachmentsElement(props) {
 						wasAlreadyLoaded = AttachmentDirectories.isLoaded,
 						currentConditions = AttachmentDirectories.getParamConditions() || {},
 						newConditions = {
-							'conditions[AttachmentDirectories.model]': selectorSelected.repository.name,
+							'conditions[AttachmentDirectories.model]': selectorSelected.schema?.name,
 							'conditions[AttachmentDirectories.modelid]': selectorSelected[selectorSelectedField],
 						};
 					let doReload = false;
@@ -1135,7 +1135,7 @@ function AttachmentsElement(props) {
 						maxFileSize={styles.ATTACHMENTS_MAX_FILESIZE}
 						autoClean={true}
 						uploadConfig={{
-							url: Attachments.api.baseURL + Attachments.schema.name + '/uploadAttachment',
+							url: Attachments.api.baseURL + Attachments.schema?.name + '/uploadAttachment',
 							method: 'POST',
 							headers: Attachments.headers,
 							autoUpload,