How to change the date format?

[gianmnf]

Hello, in the project that i'm currently working, the date needs to be showed in the standard format like: 07/03/2021 - 12:57, but instead it is showing "x minutes ago". Is there some way to show like that? i've already tried using moment but all that it returns is false instead of a date.

And this is how i'm building the message object(i'm using messageList, so i generate those messages in a array): const objMsg = { type: 'text', text: oc.description, date: new Date(oc.dateTime), position: oc.driverId ? 'left' : 'right' }

[abdurrahmanekr]

Hi, you can use dateString ex:

{
    text: 'Message',
    dateString: '2021-07-29'
}

[gianmnf]

Worked fine, big thanks! Another problem i've had with the message list is this disabled horizontal scrollbar that appears on the bottom of the list when the list of messages is big, it scrolls fine, but this scrollbar sometimes appears, sometimes don't. i've already made changes to the style, disabling the overflow, the overflowX and also on the grid(material-ui) that contains the message list. i've used even override to disable the overflow but the scrollbar still appears. Here's my css and the code itself:

const useStyles = makeStyles({
  overrides: {
    overflow: 'hidden'
  },
  root: {
    flexGrow: 1,
    display: "flex",
    justifyContent: "center",
    marginTop: 18
  },
  grid: {
    display: 'flex',
    justifyContent: "end",
    overflow: 'hidden',
    height: '92%',
    width: '100%'
  },
  gridInput: {
    display: 'flex',
    justifyContent: 'center',
    position: 'absolute',
    bottom: 0,
    width: '97%'
  },
  messageList: {
    overflowX: 'hidden',
  },
})

<div className={classes.root}>
      <Box sx={{ m: 1, border: 2, borderRadius: 5, borderColor: '#757575', height: 550, width: 320, padding: 1, position: "relative", bgcolor: '#757575' }}>
        <Grid item xs={12} sm={12} className={classes.grid}>
          <MessageList
            lockable={false}
            dataSource={mapMessages()}
            toBottomHeight={0}
          />
        </Grid >
        <Components.Form onSubmit={handleSubmit}>
          <Grid item xs={12} sm={12} className={classes.gridInput}>
            <ThemeProvider theme={theme}>
              <Controls.Input
                name="description"
                label={formatMessage({ id: 'message' })}
                value={occurrence.description}
                onChange={changeOccurrence}
                style={{ marginLeft: 10 }}
                required
              />
            </ThemeProvider>
            <Components.ButtonIcon
              type="submit"
              color="primary"
              icon={Icons.Send}
              text={formatMessage({ id: 'send' })}
              style={{ marginTop: 10, paddingRight: 10 }}
            />
          </Grid>
        </Components.Form>
      </Box>
      <Components.Alert
        response={alert}
        snackbar={snackbar}
        setSnackbar={setOpenSnackbar}
      />
    </div>

[ch4rliedev]

Could you show how to use the date String to correctly display the date and time in messages? I couldn't understand it right