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

package/src/components/selects/RASearchableSelectChips.tsx

@@ -1,308 +0,0 @@
-/**
- * ISearchableSelect for AutoAdmin for ReactAdmin
- * @author  Franisco Aranda <francisco.aranda@dash.cl> <faranda@gmail.com>
- * @author  Omar Muñoz <omar.munoz@dash.cl>
- */
-
-import {
-	Autocomplete,
-	Box,
-	Chip,
-	CircularProgress,
-	InputLabel,
-	TextField,
-} from '@mui/material';
-import React, { useEffect, useState } from 'react';
-import { useController } from 'react-hook-form';
-import { useGetList } from 'react-admin';
-import { IDashAutoAdminCustomFieldComponent } from 'dash-auto-admin';
-import { useRecordContext } from 'react-admin';
-import { Loading } from 'react-admin';
-import { isArray } from 'lodash';
-import { LoadingIndicator } from 'react-admin';
-
-interface ISearchableSelectChipsControl {
-	name?: string;
-	resource?: string;
-	selectLabel?: string;
-	title?: string;
-	renderText: (option: any, caller: string) => any;
-	transformData?: (val: any) => any; // onChange transformData from the search result item object to the field value (it usually needs to store the id)
-	defaultValues?: any;
-	isMultiple?: boolean;
-	//pagination?: boolean,
-	minSearch?: number;
-	searchResults?: number;
-	timerSearch?: number;
-	isEmpty?: boolean;
-	filter?: { [x: string]: any };
-	queryFilter?: string;
-	isOptionEqualToValue: (option: any, value: any) => boolean;
-	//_transformOptionEqualToValue?:  (option: any, value: any) => boolean
-	viewAttribute: string;
-	valueKeyId?: string;
-	useBaseAttributeName?: boolean;
-	useListAttributeForController?: boolean;
-	transformOption?: (
-		option: any,
-		parsedOptions: any[],
-		caller?: string,
-	) => boolean;
-}
-
-const getDescendantProp = (obj, desc) => {
-	var arr = desc.split('.');
-	while (arr.length && (obj = obj[arr.shift()]));
-	return obj;
-};
-
-export const SearchableSelectChipsControl: React.FC<
-	ISearchableSelectChipsControl & IDashAutoAdminCustomFieldComponent
-> = ({
-	method,
-	attribute,
-	isMultiple = false,
-	//pagination = true,
-	searchResults = 50,
-	minSearch = 3,
-	timerSearch = 500,
-	resource,
-	selectLabel,
-	renderText,
-	transformData = (val: any) => val,
-	queryFilter = 'q',
-	defaultValues = undefined,
-	isEmpty = false,
-	filter,
-	isOptionEqualToValue = undefined,
-	viewAttribute = null,
-	valueKeyId = 'id',
-	useBaseAttributeName = false,
-	useListAttributeForController = false,
-	transformOption,
-}) => {
-	// React Admin record
-	//console.log("useListAttributeForController", useListAttributeForController);
-	let attributeName = useListAttributeForController
-		? attribute.listAttribute
-		: attribute.attribute;
-	attributeName = useBaseAttributeName
-		? attributeName.split('.')[0]
-		: attributeName;
-	//console.log("attributeName", attributeName);
-	const record = useRecordContext();
-	const recordAttributeValue = useBaseAttributeName
-		? attributeName.split('.')[0]
-		: attributeName;
-	//console.log("RECORD VALUE", recordAttributeValue, record[recordAttributeValue]);
-	// sets the initial state of the select dropdown
-	const [open, setOpen] = useState(false);
-	// parsedOptions: stores the postprocessed list of elements returned from the search query
-	const [parsedOptions, setParsedOptions] = useState(null);
-	// q; the search query
-	const [q, setQ] = useState('');
-	// field, checks if the current record contains associated values to the attribute in which this control is associated
-	//console.log("USE CONTROLLER name", attributeName, attribute.attribute, record[recordAttributeValue]);
-	const _transformOption = (option: any, caller: string) => {
-		return typeof transformOption === 'function'
-			? transformOption(option, parsedOptions, caller)
-			: option;
-	};
-
-	const _processFieldValue = (value: any) => {
-		return value
-			? isMultiple && Array.isArray(value)
-				? value.map((valItem) =>
-						_transformOption(valItem, '_processFieldValue'),
-				  )
-				: _transformOption(value, '_processFieldValue')
-			: isMultiple
-			? []
-			: null;
-	};
-
-	const _defaultValues = defaultValues
-		? _processFieldValue(defaultValues)
-		: record && getDescendantProp(record, recordAttributeValue)
-		? _processFieldValue(getDescendantProp(record, recordAttributeValue))
-		: isMultiple
-		? []
-		: null;
-
-	const field = useController({ name: attributeName /*, defaultValue*/ });
-	// Includes, sends an array of the current selected items of the select, the backend sends those items in the first position of the list.
-	let _inc =
-		record && getDescendantProp(record, recordAttributeValue)
-			? getDescendantProp(record, recordAttributeValue)
-			: [];
-	_inc = isArray(_inc) ? _inc : [_inc[valueKeyId]];
-
-	const includes = _inc
-		.filter((element) => element)
-		.map((element) =>
-			element.hasOwnProperty(valueKeyId) ? element[valueKeyId] : element,
-		);
-
-	// React Admin useGetList, to perform the search
-
-	const {
-		data: resourceSearchResults,
-		total: totalSearchResults,
-		isLoading: isResourceSearchLoading,
-		error: isResourceSearchErrored,
-	} = useGetList(resource, {
-		meta: { removeSortFilters: true },
-		filter: { [queryFilter]: q, ...filter, includes: includes },
-	});
-
-	useEffect(() => {
-		if (resourceSearchResults /*&& !isResourceSearchLoading*/) {
-            const resultsArray = Array.isArray(resourceSearchResults) 
-      ? resourceSearchResults 
-      : Object.values(resourceSearchResults);
-    
-    const _parsedOptions = resultsArray.map((ele) => {
-      return { ...ele, key: "option" + ele.id };
-    });
-			setParsedOptions(_parsedOptions);
-			//updateFieldValue(_parsedOptions);
-		}
-		// on component unload, set parsedOptions to []
-	}, [resourceSearchResults /*, isResourceSearchLoading*/]);
-
-	// search timeout
-	const [timeOutSearch, setTimeOutSearch] = useState(undefined);
-	// search debounde
-	const debounce = (fn: Function, delay = 500) => {
-		clearTimeout(timeOutSearch);
-		setTimeOutSearch(
-			setTimeout(() => {
-				fn();
-			}, delay),
-		);
-	};
-
-	const updateFieldValue = (value) => {
-		const val = _processFieldValue(value);
-		//console.log("UPDATE FIELD VALUES", val)
-		field.field.onChange(val);
-	};
-
-	/* useEffect(() => {
-          if (field && field.field && parsedOptions) { 
-              updateFieldValue(record[recordAttributeValue]); 
-          }
-      }, [parsedOptions])*/
-
-	return (
-        <>
-            {parsedOptions ? (
-				<Autocomplete
-					key={'autocomplete-' + attribute.attribute}
-					multiple={isMultiple}
-					loading={isResourceSearchLoading /*&& open*/}
-					fullWidth
-					freeSolo={true}
-					options={parsedOptions}
-					open={open}
-					onOpen={() => setOpen(true)}
-					onClose={() => setOpen(false)}
-					defaultValue={_defaultValues}
-					isOptionEqualToValue={isOptionEqualToValue}
-					autoHighlight
-					getOptionLabel={(option: any) =>
-						renderText(_transformOption(option, 'optionlabel'), 'optionlabel')
-					}
-					renderOption={(props, option: any) => {
-						const { key, ...newProps } = props as any;
-						return (
-							<Box
-								key={option.key}
-								component='li'
-								sx={{ '& > img': { mr: 2, flexShrink: 0 } }}
-								{...newProps}
-							>
-								{renderText(_transformOption(option, 'option'), 'option')}
-							</Box>
-						);
-					}}
-					onChange={(event: any, rawValue) => {
-						setOpen(false);
-						updateFieldValue(rawValue);
-					}}
-					renderInput={(params) => {
-						return (
-                            <TextField
-								key={params.id}
-								{...params}
-								label={selectLabel}
-								variant='outlined'
-								onChange={(ev) => {
-									let searchValue = ev.target.value;
-									if (
-										searchValue &&
-										searchValue !== '' &&
-										searchValue.length >= minSearch
-									)
-										debounce(() => setQ(searchValue), timerSearch);
-								}}
-								slotProps={{
-                                    ...params.slotProps,
-
-                                    input: {
-                                        ...params.slotProps.input,
-                                        autoComplete: 'new-password',
-                                        endAdornment: (
-                                            <>
-                                                {isResourceSearchLoading ? (
-                                                    <CircularProgress color='inherit' size={20} />
-                                                ) : null}
-                                                {params.slotProps.input.endAdornment}
-                                            </>
-                                        ),
-                                    }
-                                }}
-							/>
-                        );
-					}}
-				/>
-			) : (
-				<LoadingIndicator />
-			)}
-
-            {!isMultiple && parsedOptions && _defaultValues && (
-				<>
-					<Chip
-						label={renderText(_transformOption(_defaultValues, 'chip'), 'chip')}
-					/>
-				</>
-			)}
-        </>
-    );
-};
-
-const RASearchableSelectChips: React.FC<
-	IDashAutoAdminCustomFieldComponent & ISearchableSelectChipsControl
-> = ({ method, attribute, ...props }) => {
-	switch (method) {
-		case 'edit':
-		case 'create':
-			return (
-				<SearchableSelectChipsControl
-					attribute={attribute}
-					method={method}
-					{...props}
-				/>
-			);
-		case 'view':
-			return (
-				<SearchableSelectChipsControl
-					attribute={attribute}
-					method={method}
-					{...props}
-				/>
-			);
-	}
-};
-
-export default RASearchableSelectChips;

package/src/components/selects/SearchableSelect.tsx

@@ -1,139 +0,0 @@
-import {
-	Autocomplete,
-	Box,
-	CircularProgress,
-	InputLabel,
-	TextField,
-} from '@mui/material';
-import React, { useEffect, useState } from 'react';
-import { useController, useWatch } from 'react-hook-form';
-import { useGetList } from 'react-admin';
-import TrendingUpRounded from '@mui/icons-material/TrendingUpRounded';
-
-const SearchableSelect: React.FC<any> = ({
-	name,
-	isMultiple = false,
-	resource,
-	selectLabel,
-	title,
-	renderText,
-	transformData,
-	defaultValues = undefined,
-	isEmpty = false,
-	filter = {},
-}) => {
-	const [open, setOpen] = useState(false);
-	const [settedInitialValues, setSettedInitialValues] = useState(false);
-	const [q, setQ] = useState('');
-	const field = useController({ name });
-
-	const {
-		data: resourceData,
-		total,
-		isLoading,
-		error,
-	} = useGetList(resource, {
-		pagination: { page: 1, perPage: 100 },
-		filter: { q, ...filter },
-	});
-
-	useEffect(() => {
-		if (resourceData && !settedInitialValues) {
-			if (defaultValues) {
-				field.field.onChange(defaultValues);
-			}
-			setSettedInitialValues(true);
-		}
-		return () => {
-			setSettedInitialValues(false);
-		};
-	}, [resourceData]);
-
-	//const productIds = useWatch({ name: 'product_ids' });
-
-	// const selectLabel = "Seleccionar Plantilla";
-
-	// if(resourceData && selectedDefault?.length > 0)
-	//     setSelectedDefault(defaultValues?.map(item => resourceData.find(template => template.id === item)));
-
-	// console.log(field.field.value);
-
-	return (
-        <>
-            <InputLabel>{title}</InputLabel>
-            {/*<SearchBar />*/}
-            {TrendingUpRounded && (
-				<Autocomplete
-					multiple={isMultiple}
-					loading={isLoading && open}
-					sx={{ width: 373 }}
-					options={
-						!resourceData ? [] : !defaultValues ? resourceData : resourceData
-					}
-					open={open}
-					onOpen={() => setOpen(true)}
-					onClose={() => setOpen(false)}
-					// defaultValue={field.field.value.map(item => resourceData.find(template => template.id === item))}
-
-					autoHighlight
-					{...(!isEmpty && { value: field.field.value })}
-					{...(isEmpty && { renderTags: (value, getTagProps) => <></> })}
-					getOptionLabel={(option: any) =>
-						renderText ? renderText(option) : option.name
-					}
-					renderOption={(props, option: any) => (
-						<Box
-							component='li'
-							sx={{ '& > img': { mr: 2, flexShrink: 0 } }}
-							{...props}
-						>
-							{renderText ? renderText(option) : option.name}
-						</Box>
-					)}
-					onChange={(event: any, rawValue) => {
-						let newValue = rawValue;
-						if (Array.isArray(rawValue)) {
-							if (isEmpty) newValue = [...rawValue, ...field.field.value];
-							newValue = [...new Map((newValue as any[]).map((v) => [v.id, v])).values()];
-						}
-
-						if (transformData) field.field.onChange(transformData(newValue));
-						else field.field.onChange(newValue);
-					}}
-					renderInput={(params) => (
-						<TextField
-							{...params}
-							label={selectLabel}
-							variant='outlined'
-							onChange={(ev) => {
-								// dont fire API if the user delete or not entered anything
-								if (ev.target.value !== '' || ev.target.value !== null) {
-									setQ(ev.target.value);
-								}
-							}}
-							onBlur={() => setQ('')}
-							slotProps={{
-                                ...params.slotProps,
-
-                                input: {
-                                    ...params.slotProps.input,
-                                    autoComplete: 'new-password',
-                                    endAdornment: (
-                                        <>
-                                            {isLoading ? (
-                                                <CircularProgress color='inherit' size={20} />
-                                            ) : null}
-                                            {params.slotProps.input.endAdornment}
-                                        </>
-                                    ),
-                                }
-                            }}
-						/>
-					)}
-				/>
-			)}
-        </>
-    );
-};
-
-export default SearchableSelect;

package/src/components/serviceAccount/ApiKeyRevealDialog.tsx

@@ -1,129 +0,0 @@
-import React, { useState } from "react";
-import Alert from "@mui/material/Alert";
-import Box from "@mui/material/Box";
-import IconButton from "@mui/material/IconButton";
-import Tooltip from "@mui/material/Tooltip";
-import Typography from "@mui/material/Typography";
-import ContentCopyIcon from "@mui/icons-material/ContentCopy";
-import CheckIcon from "@mui/icons-material/Check";
-import { useI18nBridge } from "../../contexts/I18nBridgeContext";
-
-export interface IApiKeyRevealContentProps {
-    /** The plaintext token, shown exactly once. */
-    token: string;
-    /** Name of the key, for context. */
-    name?: string | null;
-}
-
-/**
- * One-time reveal of a newly issued API key.
- *
- * The plaintext credential is never persisted in recoverable form - only a
- * short display prefix is stored - so this is the single moment the operator
- * can copy it.
- *
- * Designed to be passed as the `content` of the framework dialog via a
- * resource's `createSuccessDialog`, so it inherits the app's dialog chrome
- * rather than introducing a second dialog system:
- *
- *   createSuccessDialog: (data) => data?.plain_text_token
- *       ? { title: '...', content: <ApiKeyRevealContent token={data.plain_text_token} name={data.name} /> }
- *       : null,
- */
-export const ApiKeyRevealContent: React.FC<IApiKeyRevealContentProps> = ({ token, name }) => {
-    // DialogServiceProvider is mounted ABOVE <Admin> in DASHAppProviders, so
-    // dialog content renders outside React Admin's i18n context and
-    // useTranslate() would silently fall through to the English defaults.
-    // The bridge is the supported way to translate from out there - same
-    // pattern as AppMaterialMenu.
-    const { i18nProvider, locale } = useI18nBridge();
-    const [copied, setCopied] = useState(false);
-
-    const translate = React.useCallback(
-        (key: string, options?: any) => {
-            if (i18nProvider?.translate) {
-                try {
-                    return i18nProvider.translate(key, options);
-                } catch {
-                    return options?._ ?? key;
-                }
-            }
-            return options?._ ?? key;
-        },
-        // locale is a dependency so the text re-renders on a language switch.
-        [i18nProvider, locale]
-    );
-
-    const handleCopy = async () => {
-        try {
-            await navigator.clipboard.writeText(token);
-            setCopied(true);
-            setTimeout(() => setCopied(false), 2000);
-        } catch {
-            // Clipboard API unavailable (insecure context or denied permission).
-            // The value stays selectable so the operator can still copy it by
-            // hand - never leave them without a path to the secret.
-            setCopied(false);
-        }
-    };
-
-    return (
-        <Box>
-            <Alert severity="warning" sx={{ mb: 2 }}>
-                {translate("serviceAccount.reveal.warning", {
-                    _: "This is the only time this key will be shown. It cannot be recovered later — if you lose it, you will have to issue a new one.",
-                })}
-            </Alert>
-
-            {name ? (
-                <Typography variant="body2" sx={{ mb: 1 }}>
-                    {translate("serviceAccount.reveal.forKey", { _: "Key" })}: <strong>{name}</strong>
-                </Typography>
-            ) : null}
-
-            <Box
-                sx={{
-                    display: "flex",
-                    alignItems: "center",
-                    gap: 1,
-                    p: 1.5,
-                    borderRadius: 1,
-                    border: (theme) => `1px solid ${theme.palette.divider}`,
-                    bgcolor: (theme) =>
-                        theme.palette.mode === "dark" ? "rgba(255,255,255,0.04)" : "rgba(0,0,0,0.04)",
-                }}
-            >
-                <Box
-                    component="code"
-                    sx={{
-                        flex: 1,
-                        fontFamily: "monospace",
-                        fontSize: "0.875rem",
-                        wordBreak: "break-all",
-                        userSelect: "all",
-                    }}
-                >
-                    {token}
-                </Box>
-
-                <Tooltip
-                    title={
-                        copied
-                            ? translate("serviceAccount.reveal.copied", { _: "Copied" })
-                            : translate("serviceAccount.reveal.copy", { _: "Copy" })
-                    }
-                >
-                    <IconButton onClick={handleCopy} size="small" aria-label="copy api key">
-                        {copied ? (
-                            <CheckIcon color="success" fontSize="small" />
-                        ) : (
-                            <ContentCopyIcon fontSize="small" />
-                        )}
-                    </IconButton>
-                </Tooltip>
-            </Box>
-        </Box>
-    );
-};
-
-export default ApiKeyRevealContent;

package/src/components/serviceAccount/ServiceAccountStatusSwitch.tsx

@@ -1,99 +0,0 @@
-import React, { useState } from "react";
-import { useRecordContext, useNotify, useRefresh } from "react-admin";
-import { useAxios } from "dash-axios-hook";
-import Box from "@mui/material/Box";
-import Switch from "@mui/material/Switch";
-import FormControlLabel from "@mui/material/FormControlLabel";
-import CircularProgress from "@mui/material/CircularProgress";
-import { IDashAutoAdminCustomFieldComponent } from "dash-auto-admin";
-import { useI18nBridge } from "../../contexts/I18nBridgeContext";
-
-/**
- * Enable/disable switch for a service account API key.
- *
- * Deliberately NOT a form field. Status is changed through the dedicated
- * enable/disable endpoints rather than the update payload, for two reasons:
- *
- *  - The update contract rejects everything except role_ids, so submitting a
- *    status would 422.
- *  - Disabling must not rotate the credential. The endpoints flip a flag and
- *    leave the token untouched, so re-enabling restores the same key rather
- *    than forcing every integration to redeploy a new secret.
- *
- * The switch therefore acts immediately and refreshes, instead of waiting for
- * a form save that would never carry it.
- */
-const ServiceAccountStatusSwitch: React.FC<IDashAutoAdminCustomFieldComponent> = ({
-    resourceConfig,
-}) => {
-    const record = useRecordContext();
-    const notify = useNotify();
-    const refresh = useRefresh();
-    const axios = useAxios();
-    const { i18nProvider } = useI18nBridge();
-    const [loading, setLoading] = useState(false);
-
-    const translate = React.useCallback(
-        (key: string, fallback: string) => {
-            try {
-                return i18nProvider?.translate(key, { _: fallback }) ?? fallback;
-            } catch {
-                return fallback;
-            }
-        },
-        [i18nProvider]
-    );
-
-    if (!record) return null;
-
-    const isActive = record.status === "active";
-
-    const handleToggle = async () => {
-        setLoading(true);
-        try {
-            const action = isActive ? "disable" : "enable";
-
-            await axios.post(`${resourceConfig.model}/${record.id}/${action}`);
-
-            notify(
-                isActive
-                    ? translate("serviceAccount.notify.disabled", "API key disabled")
-                    : translate("serviceAccount.notify.enabled", "API key enabled"),
-                { type: "success" }
-            );
-
-            refresh();
-        } catch (error) {
-            console.error("ServiceAccountStatusSwitch: toggle failed", error);
-            notify(
-                translate("serviceAccount.notify.toggle_error", "Could not change the key status"),
-                { type: "error" }
-            );
-        } finally {
-            setLoading(false);
-        }
-    };
-
-    return (
-        <Box sx={{ display: "flex", alignItems: "center", gap: 1, my: 1 }}>
-            <FormControlLabel
-                control={
-                    <Switch
-                        checked={isActive}
-                        onChange={handleToggle}
-                        disabled={loading}
-                        color="success"
-                    />
-                }
-                label={
-                    isActive
-                        ? translate("serviceAccount.status.active", "Active")
-                        : translate("serviceAccount.status.disabled", "Disabled")
-                }
-            />
-            {loading ? <CircularProgress size={16} /> : null}
-        </Box>
-    );
-};
-
-export default ServiceAccountStatusSwitch;