<commit_before>import * as React from 'react'
import PropTypes from 'prop-types'

import { User, Group, Lock, HardDrive } from 'iconoir-react'
import { Typography } from '@material-ui/core'

import { StatusCircle } from 'client/components/Status'
import Multiple from 'client/components/Tables/Vms/multiple'
import { rowStyles } from 'client/components/Tables/styles'

import * as Helper from 'client/models/Helper'

const Row = ({ value, ...props }) => {
  const classes = rowStyles()
  const {
    ID, NAME, UNAME, GNAME, STATE,
    IPS, STIME, ETIME, HOSTNAME, LOCK
  } = value

  const time = Helper.timeFromMilliseconds(+ETIME || +STIME)
  const timeAgo = `${+ETIME ? 'done' : 'started'} ${time.toRelative()}`

  return (
    <div {...props}>
      <div>
        <StatusCircle color={STATE?.color} tooltip={STATE?.name} />
      </div>
      <div className={classes.main}>
        <Typography className={classes.title} component='span'>
          {NAME}
          {LOCK && <Lock size={20} />}
        </Typography>
        <div className={classes.caption}>
          <span title={time.toFormat('ff')}>
            {`#${ID} ${timeAgo}`}
          </span>
          <span title={`Owner: ${UNAME}`}>
            <User size={16} />
            <span>{` ${UNAME}`}</span>
          </span>
          <span title={`Group: ${GNAME}`}>
            <Group size={16} />
            <span>{` ${GNAME}`}</span>
          </span>
          <span title={`Hostname: ${HOSTNAME}`}>
            <HardDrive size={16} />
            <span>{` ${HOSTNAME}`}</span>
          </span>
        </div>
      </div>
      <div className={classes.secondary}>
        {<Multiple tags={IPS.split(',')} />}
      </div>
    </div>
  )<commit_msg>F OpenNebula/one#5422: Fix minor in vm row<commit_after>import * as React from 'react'
import PropTypes from 'prop-types'

import { User, Group, Lock, HardDrive } from 'iconoir-react'
import { Typography } from '@material-ui/core'

import { StatusCircle } from 'client/components/Status'
import Multiple from 'client/components/Tables/Vms/multiple'
import { rowStyles } from 'client/components/Tables/styles'

import * as Helper from 'client/models/Helper'

const Row = ({ value, ...props }) => {
  const classes = rowStyles()
  const {
    ID, NAME, UNAME, GNAME, STATE,
    IPS, STIME, ETIME, HOSTNAME, LOCK
  } = value

  const time = Helper.timeFromMilliseconds(+ETIME || +STIME)
  const timeAgo = `${+ETIME ? 'done' : 'started'} ${time.toRelative()}`

  return (
    <div {...props}>
      <div>
        <StatusCircle color={STATE?.color} tooltip={STATE?.name} />
      </div>
      <div className={classes.main}>
        <Typography className={classes.title} component='span'>
          {NAME}
          {LOCK && <Lock size={20} />}
        </Typography>
        <div className={classes.caption}>
          <span title={time.toFormat('ff')}>
            {`#${ID} ${timeAgo}`}
          </span>
          <span title={`Owner: ${UNAME}`}>
            <User size={16} />
            <span>{` ${UNAME}`}</span>
          </span>
          <span title={`Group: ${GNAME}`}>
            <Group size={16} />
            <span>{` ${GNAME}`}</span>
          </span>
          <span title={`Hostname: ${HOSTNAME}`}>
            <HardDrive size={16} />
            <span>{` ${HOSTNAME}`}</span>
          </span>
        </div>
      </div>
      <div className={classes.secondary}>
        {!!IPS?.length && <Multiple tags={IPS.split(',')} />}
      </div>
    </div>
  )
{'fraction_non_alphanumeric': 0.18434633027522937, 'fraction_numerical': 0.005733944954128441, 'mean_word_length': 2.39067055393586, 'pattern_counts': {'":': 0, '<': 67, '<?xml version=': 0, '>': 69, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2363641', 'n_tokens_mistral': 1123, 'n_tokens_neox': 1115, 'n_words': 253}