You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
tailchat/server/admin/app/ra/components/FilesizeField.tsx

48 lines
1.1 KiB
TypeScript

import React from 'react';
import filesize from 'filesize';
import {
NumberFieldProps,
sanitizeFieldRestProps,
useRecordContext,
useTranslate,
} from 'react-admin';
import get from 'lodash/get';
import { Typography } from '@mui/material';
export const FilesizeField: React.FC<NumberFieldProps> = React.memo((props) => {
const { className, emptyText, source, locales, options, textAlign, ...rest } =
props;
const record = useRecordContext(props);
const translate = useTranslate();
if (!record) {
return null;
}
const value = get(record, source!);
if (value == null) {
return emptyText ? (
<Typography
component="span"
variant="body2"
className={className}
{...sanitizeFieldRestProps(rest)}
>
{emptyText && translate(emptyText, { _: emptyText })}
</Typography>
) : null;
}
return (
<Typography
component="span"
variant="body2"
className={className}
{...sanitizeFieldRestProps(rest)}
>
{filesize(value)}
</Typography>
);
});
FilesizeField.displayName = 'FilesizeField';