@dashadmin/dash-admin 1.3.73 → 1.3.74-srcfree.2

package/src/components/avatar/Avatar.tsx

@@ -1,71 +0,0 @@
-import * as React from 'react';
-import { IDashAutoAdminCustomFieldComponent } from 'dash-auto-admin';
-import { FileField, FileInput, useRecordContext } from 'react-admin';
-import { Box } from '@mui/material';
-import { WithRecord } from 'react-admin';
-import SingleImageUploader from './SingleImageUploader';
-import { useFormContext } from 'react-hook-form';
-import AvatarMui from '@mui/material/Avatar';
-
-export type AvatarComponent = IDashAutoAdminCustomFieldComponent;
-
-export const AvatarHandler: React.FC<AvatarComponent> = (props) => {
-	const { method, attribute } = props;
-	const record = useRecordContext();
-	const _attributeName = attribute.listAttribute || attribute.attribute;
-	const {
-		setValue,
-		formState: { errors },
-	} = useFormContext();
-
-	const onChange = (file: File) => {
-		setValue(attribute.attribute, file, { shouldDirty: true });
-	};
-    
-	return (
-		<>
-			<SingleImageUploader
-				classNamePrefix='dash-profile'
-				{...(method === "edit" && record && record[_attributeName]
-					? { currentUrl: record[_attributeName] }
-					: {})}
-				onChange={onChange}
-			/>
-			{errors[attribute.attribute] && (
-				<span style={{ color: 'red' }}>
-					{errors[attribute.attribute]?.message?.toString() || 'Error'}
-				</span>
-			)}
-		</>
-	);
-};
-
-export const AvatarDisplay: React.FC<AvatarComponent> = (props) => {
-	const { attribute } = props;
-	const record = useRecordContext();
-	const _attributeName = attribute.listAttribute || attribute.attribute;
-	const imageUrl = record?.[_attributeName];
-   
-	return (
-        <Box
-            sx={{
-                display: "flex",
-                alignItems: "center"
-            }}>
-            <AvatarMui src={imageUrl} alt="avatar" />
-        </Box>
-    );
-};
-
-const Avatar = ({ method, attribute,resourceConfig }: IDashAutoAdminCustomFieldComponent) => {
-	switch (method) {
-		case 'edit':
-        case 'create':
-			return <AvatarHandler attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-		case 'view':
-        case 'list':
-			return <AvatarDisplay  attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-	}
-};
-export default Avatar;
-

package/src/components/avatar/SingleImageUploader.tsx

@@ -1,107 +0,0 @@
-import { IconButton } from "@mui/material";
-import { FC, useState } from "react";
-import Edit from "@mui/icons-material/Edit";
-import Image from "@mui/icons-material/Image";
-import React from "react";
-
-export interface ISingleImageUploader {
-	classNamePrefix?: string;
-	currentUrl?: string;
-	onChange?: (file: File) => void;
-	/** Disable drag & drop, leaving only the click-to-browse button. */
-	disableDragAndDrop?: boolean;
-}
-
-const SingleImageUploader: FC<ISingleImageUploader> = (props) => {
-	// NOTE: currentUrl deliberately defaults to undefined, NOT to the string
-	// 'single-image-uploader' as it once did — that default was always truthy, so
-	// the `<Image />` placeholder branch below could never run and an uploader
-	// with no image rendered a broken <img> instead of the icon.
-	const {
-		classNamePrefix = 'default',
-		currentUrl,
-		onChange,
-		disableDragAndDrop = false,
-	} = props;
-
-	const [localFile, setLocalFile] = useState(null);
-	const [isDragging, setIsDragging] = useState(false);
-
-	/** Shared by the file input and the drop handler. */
-	const acceptFile = (file?: File) => {
-		// Guard: cancelling the file dialog fires change with an empty list.
-		if (!file) return;
-
-		// Dropping a non-image (a PDF, a folder) must not blank the current
-		// preview — ignore it and keep whatever is already there.
-		if (!file.type?.startsWith('image/')) return;
-
-		setLocalFile(URL.createObjectURL(file));
-		onChange?.(file);
-	};
-
-	const dragHandlers = disableDragAndDrop
-		? {}
-		: {
-			onDragEnter: (e: React.DragEvent) => {
-				e.preventDefault();
-				e.stopPropagation();
-				setIsDragging(true);
-			},
-			// Both dragOver AND dragEnter must preventDefault, or the browser
-			// navigates away to the dropped file instead of firing onDrop.
-			onDragOver: (e: React.DragEvent) => {
-				e.preventDefault();
-				e.stopPropagation();
-				setIsDragging(true);
-			},
-			onDragLeave: (e: React.DragEvent) => {
-				e.preventDefault();
-				e.stopPropagation();
-				// Ignore leaves fired by moving over a CHILD element — without
-				// this the highlight flickers as the pointer crosses the img.
-				if (e.currentTarget.contains(e.relatedTarget as Node)) return;
-				setIsDragging(false);
-			},
-			onDrop: (e: React.DragEvent) => {
-				e.preventDefault();
-				e.stopPropagation();
-				setIsDragging(false);
-				acceptFile(e.dataTransfer?.files?.[0]);
-			},
-		};
-
-	return (
-		<div
-			className={[
-				'single-image-uploader',
-				`${classNamePrefix}-img`,
-				isDragging ? 'is-dragging' : '',
-			].filter(Boolean).join(' ')}
-			{...dragHandlers}
-		>
-			{localFile || currentUrl ? (
-				<img src={localFile || currentUrl} alt='' />
-			) : (
-				<div className={`${classNamePrefix}-icon`}>
-					<Image />
-				</div>
-			)}
-			<IconButton
-				aria-label='upload image'
-				component='label'
-				className={`${classNamePrefix}-edit`}
-			>
-				<input
-					hidden
-					accept='image/*'
-					type='file'
-					onChange={e => acceptFile(e.target.files?.[0])}
-				/>
-				<Edit style={{ opacity: '0.6' }} />
-			</IconButton>
-		</div>
-	);
-};
-
-export default SingleImageUploader;

package/src/components/currency/Format.tsx

@@ -1,79 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { useRecordContext } from 'react-admin';
-import { TextField } from '@mui/material';
-import { useWatch } from 'react-hook-form';
-import numeral from 'numeral';
-import { IDashAutoAdminCustomFieldComponent } from 'dash-auto-admin';
-
-interface IData {
-	[key: string]: any;
-}
-
-const ComponentView: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-	method,
-	attribute,
-}) => {
-	const data: IData = useRecordContext();
-
-	return <></>;
-};
-
-const ComponentEdit: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-	method,
-	attribute,
-}) => {
-	const [rawText, setRawText] = useState('');
-	const [formattedNumber, setFormattedNumber] = useState('0');
-	const data: IData = useRecordContext();
-
-	const format = useWatch({ name: 'format' });
-	const symbol = useWatch({ name: 'symbol' });
-
-	const formatNumber = (value) => {
-		try {
-			setRawText(value);
-			const vall = !format ? value : numeral(value).format(format);
-			setFormattedNumber(symbol ? symbol + vall : vall);
-		} catch (error) {
-			console.log(error);
-			return 0;
-		}
-	};
-
-	useEffect(() => {
-		formatNumber(rawText);
-	}, [format, symbol]);
-
-	return (
-        <>
-            <TextField
-				label='Probar formateo'
-				value={rawText}
-				onChange={({ target: { value } }) => formatNumber(value)}
-			/>
-            <TextField
-				label='Valor formateado'
-				value={formattedNumber}
-				slotProps={{
-                    htmlInput: { readOnly: true }
-                }}
-			/>
-        </>
-    );
-};
-
-const FormatCurrency = ({
-	method,
-	attribute,
-	resourceConfig,
-}: IDashAutoAdminCustomFieldComponent) => {
-	switch (method) {
-		case 'edit':
-		case 'create':
-			return <ComponentEdit attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-		case 'view':
-			return <ComponentView attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-	}
-};
-
-export default FormatCurrency;

package/src/components/custom/Redirect.tsx

@@ -1,23 +0,0 @@
-import React, { useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
-
-export interface IRedirect {
-	path: string;
-    timer?: number
-}
-const Redirect: React.FC<IRedirect> = ({ path, timer }) => {
-	const navigate = useNavigate();
-	useEffect(() => {
-        if(timer) {
-          setTimeout(() => {
-                    navigate(path);
-                }, 10);
-        } else {
-        
-		navigate(path);
-        }
-	}, []);
-	return <></>;
-};
-
-export default Redirect;

package/src/components/error/Error.tsx

@@ -1,168 +0,0 @@
-import { ComponentType, ErrorInfo, Fragment, HtmlHTMLAttributes } from 'react';
-import { FallbackProps } from 'react-error-boundary';
-import { styled } from '@mui/material/styles';
-import PropTypes from 'prop-types';
-import {
-	Button,
-	Accordion,
-	AccordionDetails,
-	AccordionSummary,
-	Typography,
-} from '@mui/material';
-import ErrorIcon from '@mui/icons-material/Report';
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import History from '@mui/icons-material/History';
-import { useTranslate } from 'react-admin';
-import { useResetErrorBoundaryOnLocationChange } from 'react-admin';
-import { Title } from 'react-admin';
-
-export const Error = (
-	props: InternalErrorProps & {
-		errorComponent?: ComponentType<ErrorProps>;
-	},
-) => {
-	const {
-		error,
-		errorComponent: ErrorComponent,
-		errorInfo,
-		resetErrorBoundary,
-		className,
-		title,
-		...rest
-	} = props;
-
-	const translate = useTranslate();
-	useResetErrorBoundaryOnLocationChange(resetErrorBoundary);
-
-	if (ErrorComponent) {
-		return <ErrorComponent error={error} errorInfo={errorInfo} title={title} />;
-	}
-
-	return (
-		<Fragment>
-			{title && <Title title={title} />}
-			<Root className={className} {...rest}>
-				<h1 className={ErrorClasses.title} role='alert'>
-					<ErrorIcon className={ErrorClasses.icon} />
-					{translate('ra.page.error')}
-				</h1>
-				<div>{translate('ra.message.error')}</div>
-				{/* @ts-ignore */}
-				{process.env.NODE_ENV !== 'production' && (
-					<>
-						<Accordion className={ErrorClasses.panel}>
-							<AccordionSummary
-								expandIcon={<ExpandMoreIcon />}
-								className={ErrorClasses.panelSumary}
-							>
-								{translate(error.message, {
-									_: error.message,
-								})}
-							</AccordionSummary>
-							<AccordionDetails className={ErrorClasses.panelDetails}>
-								{/*
-                                    error message is repeated here to allow users to copy it. AccordionSummary doesn't support text selection.
-                                */}
-								<p>
-									{translate(error.message, {
-										_: error.message,
-									})}
-								</p>
-								<p>{errorInfo?.componentStack}</p>
-							</AccordionDetails>
-						</Accordion>
-					</>
-				)}
-				<div className={ErrorClasses.toolbar}>
-					<Button variant='contained' startIcon={<History />} onClick={goBack}>
-						{translate('ra.action.back')}
-					</Button>
-				</div>
-			</Root>
-		</Fragment>
-	);
-};
-
-Error.propTypes = {
-	className: PropTypes.string,
-	error: PropTypes.object.isRequired,
-	errorInfo: PropTypes.object,
-	title: PropTypes.string,
-};
-
-interface InternalErrorProps
-	extends Omit<HtmlHTMLAttributes<HTMLDivElement>, 'title'>,
-		FallbackProps,
-		ErrorProps {
-	className?: string;
-}
-
-export interface ErrorProps extends Pick<FallbackProps, 'error'> {
-	errorInfo?: ErrorInfo;
-	//title?: TitleComponent;
-	title?: any;
-}
-
-const PREFIX = 'RaError';
-
-export const ErrorClasses = {
-	container: `${PREFIX}-container`,
-	title: `${PREFIX}-title`,
-	icon: `${PREFIX}-icon`,
-	panel: `${PREFIX}-panel`,
-	panelSumary: `${PREFIX}-panelSumary`,
-	panelDetails: `${PREFIX}-panelDetails`,
-	toolbar: `${PREFIX}-toolbar`,
-	advice: `${PREFIX}-advice`,
-};
-
-const Root = styled('div', {
-	name: PREFIX,
-	overridesResolver: (props, styles) => styles.root,
-})(({ theme }) => ({
-	display: 'flex',
-	flexDirection: 'column',
-	alignItems: 'center',
-	justifyContent: 'center',
-	[theme.breakpoints.down('md')]: {
-		padding: '1em',
-	},
-	fontFamily: 'Roboto, sans-serif',
-	opacity: 0.5,
-
-	[`& .${ErrorClasses.title}`]: {
-		display: 'flex',
-		alignItems: 'center',
-	},
-
-	[`& .${ErrorClasses.icon}`]: {
-		width: '2em',
-		height: '2em',
-		marginRight: '0.5em',
-	},
-
-	[`& .${ErrorClasses.panel}`]: {
-		marginTop: '1em',
-		maxWidth: '60em',
-	},
-
-	[`& .${ErrorClasses.panelSumary}`]: {
-		userSelect: 'all',
-	},
-
-	[`& .${ErrorClasses.panelDetails}`]: {
-		whiteSpace: 'pre-wrap',
-	},
-
-	[`& .${ErrorClasses.toolbar}`]: {
-		marginTop: '2em',
-	},
-
-	[`& .${ErrorClasses.advice}`]: {
-		marginTop: '2em',
-	},
-}));
-
-function goBack() {
-	window.history.go(-1);
-}

package/src/components/geocoding/GeocodingField.tsx

@@ -1,167 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { TextInput, TextField as RATextField } from 'react-admin';
-import { useRecordContext } from 'react-admin';
-import PlacesAutocomplete, {
-	geocodeByAddress,
-} from 'react-places-autocomplete';
-import { useController } from 'react-hook-form';
-
-import { TextField as MUITextField } from '@mui/material';
-import { IDashAutoAdminCustomFieldComponent } from 'dash-auto-admin';
-
-const GeocodingFieldView: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-	method,
-	attribute,
-	resourceConfig,
-}) => {
-	const record = useRecordContext();
-	// return <>{record.geocoded_address}</>
-	return (
-		<RATextField
-			label={attribute.label}
-			source={attribute.attribute}
-			/* @ts-ignore */
-            options={attribute.fieldProps}
-		/>
-	);
-};
-
-const GeocodingFieldEdit: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-	method,
-	attribute,
-}) => {
-	const [address, setAddress] = useState('');
-	const record = useRecordContext();
-
-	const searchOptions = {
-		componentRestrictions: { country: 'CL' },
-		/* @ts-ignore */
-		location: new google.maps.LatLng(-34, 151),
-		radius: 2000,
-		types: ['address'],
-	};
-
-	/*const {field: { onChange, onBlur, name, value, ref } } = useController({
-        name: attribute.listAttribute,
-        // rules: { required: true },
-        defaultValue: "",
-    });*/
-
-	const addressFormField = useController({
-		name: attribute.attribute,
-		// rules: { required: true },
-		defaultValue: '',
-	});
-
-	const handleSelect = (address) => {
-		// clearErrors(name)
-		geocodeByAddress(address)
-			.then((results) => {
-				// if(!results[0].address_components[0].types.includes("street_number"))
-				//     setError(name, {type: 'custom', message: 'No es una direccion valida'});
-				// else
-				//     setInputError(false)
-				addressFormField.field.onChange(JSON.stringify(results[0]));
-				setAddress(results[0].formatted_address);
-			})
-			.catch((error) => console.error('Error', error));
-	};
-
-	//const addressFormField = useController({ name: attribute.attribute });
-	useEffect(() => {
-		record?.geocoded_address && setAddress(record.geocoded_address);
-	}, [record]);
-
-	return (
-		<PlacesAutocomplete
-			value={address}
-			onChange={(address) => setAddress(address)}
-			onSelect={(selected) => handleSelect(selected)}
-			searchOptions={searchOptions}
-		>
-			{({ getInputProps, suggestions, getSuggestionItemProps, loading }) => {
-				return (
-					<div className='form__item'>
-						<div className='form__item__icon'>
-							{/*<TextInput
-                        defaultValue={address}
-                        label={attribute.label}
-                        source={attribute.attribute}
-                        options={{...attribute.fieldProps}}
-                        {...getInputProps({})}
-                    />*/}
-
-							<MUITextField
-								//id={attribute.attribute}
-								label={attribute.label}
-								{...addressFormField.field}
-								{...getInputProps({
-									placeholder: attribute.label,
-									className: `input location-search-input`,
-								})}
-                                /* @ts-ignore */
-								options={{ ...attribute.fieldProps }}
-								autoComplete='off'
-								defaultValue={address}
-								variant='filled'
-							/>
-
-							{/*
-                    <input 
-                        name={attribute.attribute} 
-                       
-                        value={address} 
-                        {...getInputProps({
-                            placeholder: attribute.label,
-                            className: `input location-search-input`,
-                        })}
-                        autoComplete='off'
-                    />*/}
-						</div>
-						<div className='autocomplete-dropdown-container'>
-							{loading && <div>Cargando...</div>}
-							{suggestions.map((suggestion, key) => {
-								const className = suggestion.active
-									? 'suggestion-item--active'
-									: 'suggestion-item';
-								// inline style for demonstration purpose
-								const style = suggestion.active
-									? { backgroundColor: '#fafafa', cursor: 'pointer' }
-									: { backgroundColor: '#ffffff', cursor: 'pointer' };
-								return (
-									<div
-										{...getSuggestionItemProps(suggestion, {
-											className,
-											style,
-										})}
-										key={key}
-									>
-										<span>{suggestion.description}</span>
-									</div>
-								);
-							})}
-						</div>
-					</div>
-				);
-			}}
-		</PlacesAutocomplete>
-	);
-
-	// <TextInput label={attribute.label} source={attribute.attribute} options={attribute.fieldProps} />
-};
-
-const GeocodingField = ({
-	method,
-	attribute,
-	resourceConfig,
-}: IDashAutoAdminCustomFieldComponent) => {
-	switch (method) {
-		case 'edit':
-		case 'create':
-			return <GeocodingFieldEdit attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-		case 'view':
-			return <GeocodingFieldView attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-	}
-};
-
-export default GeocodingField;