Software: Apache/2.4.41 (Ubuntu). PHP/8.0.30 

uname -a: Linux apirnd 5.4.0-204-generic #224-Ubuntu SMP Thu Dec 5 13:38:28 UTC 2024 x86_64 

uid=33(www-data) gid=33(www-data) groups=33(www-data) 

Safe-mode: OFF (not secure)

/var/www/html/wincloud_gateway/node_modules/strapi-plugin-upload/admin/src/components/EditForm/   drwxr-xr-x
Free 13.21 GB of 57.97 GB (22.8%)
                            Encoder    Tools    Proc.    FTP brute    Sec.    SQL    PHP-code    Update    Self remove    Logout    

Viewing file:     FileDetailsBox.js (2.56 KB)      -rw-r--r--

import React from 'react';
import PropTypes from 'prop-types';
import { dateFormats, dateToUtcTime } from 'strapi-helper-plugin';
import { get } from 'lodash';
import { useIntl } from 'react-intl';
import { Text, Flex } from '@buffetjs/core';

import { formatBytes, getTrad } from '../../utils';

import FileDetailsBoxWrapper from './FileDetailsBoxWrapper';

const FileDetailsBox = ({ file }) => {
  const { formatMessage } = useIntl();
  const fileSize = file.mime ? get(file, 'size', 0) : get(file, 'size', 0) / 1000;
  const sections = [
    {
      key: 0,
      rows: [
        { label: 'modal.file-details.size', value: formatBytes(fileSize, 0) },
        {
          label: 'modal.file-details.date',
          value: file.created_at ? dateToUtcTime(file.created_at).format(dateFormats.date) : '-',
        },
      ],
    },
    {
      key: 1,
      type: 'spacer',
    },
    {
      key: 2,
      rows: [
        {
          label: 'modal.file-details.dimensions',
          value: file.width ? `${file.width}×${file.height}` : '-',
        },
        {
          label: 'modal.file-details.extension',
          value: file.ext ? file.ext.replace('.', '') : '-',
          textTransform: 'uppercase',
        },
      ],
    },
  ];

  return (
    <FileDetailsBoxWrapper>
      {sections.map(({ key, rows, type }) => {
        if (type === 'spacer') {
          return (
            <section key={key}>
              <Text lineHeight="18px">&nbsp;</Text>
            </section>
          );
        }

        return (
          <Flex justifyContent="space-between" key={key}>
            {rows.map(rowItem => {
              return (
                <div key={rowItem.label} style={{ width: '50%' }}>
                  <Text color="grey" fontWeight="bold" textTransform="capitalize" lineHeight="18px">
                    {formatMessage({ id: getTrad(rowItem.label) })}
                  </Text>
                  <Text color="grey" textTransform={rowItem.textTransform || ''} lineHeight="18px">
                    {rowItem.value}
                  </Text>
                </div>
              );
            })}
          </Flex>
        );
      })}
    </FileDetailsBoxWrapper>
  );
};

FileDetailsBox.defaultProps = {
  file: {
    size: 0,
  },
};

FileDetailsBox.propTypes = {
  file: PropTypes.shape({
    mime: PropTypes.string,
    created_at: PropTypes.string,
    ext: PropTypes.string,
    height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
    size: PropTypes.number,
    width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
  }),
};

export default FileDetailsBox;