@onehat/ui 0.3.134 → 0.3.136

package/package.json

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

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

@@ -6,7 +6,7 @@ import {
 } from 'native-base';
 import {
 	EDITOR_TYPE__WINDOWED,
-} from '@onehat/ui/src/Constants/Editor.js';
+} from '../../../../Constants/Editor.js';
 import withAlert from '../../../Hoc/withAlert.js';
 import withComponent from '../../../Hoc/withComponent.js';
 import withData from '../../../Hoc/withData.js';

package/src/Components/Hoc/Secondary/withSecondarySideEditor.js

@@ -1,6 +1,6 @@
 import {
 	EDITOR_TYPE__SIDE,
-} from '@onehat/ui/src/Constants/Editor.js';
+} from '../../../Constants/Editor.js';
 import Container from '../../Container/Container.js';
 import withSecondaryEditor from './withSecondaryEditor.js';
 import _ from 'lodash';

package/src/Components/Hoc/withPdfButton.js

@@ -11,7 +11,7 @@ import FormPanel from '../Panel/FormPanel.js';
 import inArray from '../../Functions/inArray.js';
 import Pdf from '../Icons/Pdf.js';
 import useAdjustedWindowSize from '../../Hooks/useAdjustedWindowSize.js';
-import { EDITOR_TYPE__PLAIN } from '@onehat/ui/src/Constants/Editor.js';
+import { EDITOR_TYPE__PLAIN } from '../../Constants/Editor.js';
 import UiGlobals from '../../UiGlobals.js';
 import _ from 'lodash';
 

package/src/PlatformImports/Web/Attachments.js

@@ -5,6 +5,7 @@ import {
 	Column,
 	Pressable,
 	Row,
+	Spinner,
 	Text,
 } from 'native-base';
 import {
@@ -18,8 +19,9 @@ import {
 	FILE_MODE_FILE,
 } from '../../Constants/File.js';
 import { Avatar, Dropzone, FileMosaic, FileCard, FileInputButton, } from "@files-ui/react";
-import IconButton from '@onehat/ui/src/Components/Buttons/IconButton.js';
-import Xmark from '@onehat/ui/src/Components/Icons/Xmark.js'
+import inArray from '../../Functions/inArray.js';
+import IconButton from '../../Components/Buttons/IconButton.js';
+import Xmark from '../../Components/Icons/Xmark.js'
 import withAlert from '../../Components/Hoc/withAlert.js';
 import withData from '../../Components/Hoc/withData.js';
 import _ from 'lodash';
@@ -49,7 +51,9 @@ function FileCardCustom(props) {
 			type: mimetype,
 			onDelete,
 			downloadUrl,
-		} = props;
+			uploadStatus,
+		} = props,
+		isDownloading = uploadStatus && inArray(uploadStatus, ['preparing', 'uploading', 'success']);
 	return <Pressable
 				px={3}
 				py={1}
@@ -62,8 +66,9 @@ function FileCardCustom(props) {
 					downloadWithFetch(downloadUrl);
 				}}
 			>
+				{isDownloading && <Spinner mr={2} />}
 				<Text>{filename}</Text>
-				<IconButton icon={Xmark} onPress={() => onDelete(id)} />
+				{onDelete && <IconButton ml={1} icon={Xmark} onPress={() => onDelete(id)} />}
 			</Pressable>;
 }
 	
@@ -95,6 +100,7 @@ function AttachmentsElement(props) {
 			Repository,
 
 			// withAlert
+			alert,
 			confirm,
 
 		} = props,
@@ -136,6 +142,10 @@ function AttachmentsElement(props) {
 			setShowAll(!showAll);
 		},
 		onDropzoneChange = (files) => {
+			if (!files.length) {
+				alert('No files accepted. Perhaps they were too large or the wrong file type?');
+				return;
+			}
 			setFiles(files);
 			_.each(files, (file) => {
 				file.extraUploadData = {
@@ -148,7 +158,8 @@ function AttachmentsElement(props) {
 			setIsUploading(true);
 		},
 		onUploadFinish = (files) => {
-			let isDoneUploading = true;
+			let isDoneUploading = true,
+				isError = false;
 
 			_.each(files, (file) => {
 				if (!file.xhr || file.xhr.status !== 200) {
@@ -158,8 +169,18 @@ function AttachmentsElement(props) {
 			});
 
 			if (isDoneUploading) {
-				setIsUploading(false);
-				Repository.reload();
+				_.each(files, (file) => {
+					if (file.uploadStatus === 'error') {
+						isError = true;
+						const msg = file.serverResponse?.payload || 'An error occurred';
+						alert(msg);
+						return false;
+					}
+				});
+				if (!isError) {
+					setIsUploading(false);
+					Repository.reload();
+				}
 			}
 		},
 		onFileDelete = (id) => {
@@ -278,7 +299,7 @@ function AttachmentsElement(props) {
 						{Repository.total <= COLLAPSED_MAX ? null :
 							<Button
 								onPress={toggleShowAll}
-								marginTop={4}
+								mt={4}
 								_text={{
 									color: 'trueGray.600',
 									fontStyle: 'italic',