I have a model which looks like below :
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Support\Facades\Lang;
use DateTimeInterface;
class ChatMessageActivity extends Model
{
/**
* @return array|mixed
*/
protected function getReplacements()
{
return is_array($this->parameters) ? $this->parameters : [];
}
public function message()
{
return $this->belongsTo(ChatMessage::class, 'message_id', 'id');
}
public function serializeDate(DateTimeInterface $date)
{
return $date->translatedFormat('d F Y');
}
}
And what I have in my view file is :
import React, {Component} from 'react';
import {Divider, List} from "antd";
import {utcDateCalendarTime} from "support/utils/common";
import {FormattedMessage} from "react-intl";
import {isEmpty} from "lodash";
class ActivityCell extends Component {
getTimestamp() {
const {message} = this.props;
return (
<span className="font-weight-semi-bold">
{utcDateCalendarTime(message.created_at)}
</span>
);
}
render() {
const {message} = this.props;
const activity = message.activity;
if (isEmpty(activity) || !activity.body) {
return <List.Item/>;
}
return (
<Divider className="font-weight-normal"
dashed={true}>
<small>
<FormattedMessage
id="chat.activity_body"
defaultMessage="{user} {body} {time}"
values={{
time : this.getTimestamp(),
body : activity.body,
user : this.getUserName(),
}}/>
</small>
</Divider>
);
}
}
export default ActivityCell;
Not changes the language of date in this case. But what is quite interesting is when I use utcDateCalendarTime() like below translation is sucesfull without any problem :
import React, {Component} from 'react';
import {Tag} from "antd";
import Widget from "components/Widget";
import {FormattedMessage, injectIntl} from "react-intl";
import AsyncTable from "components/AsyncTable";
import {route} from "support/Services/Api";
import Auth from "support/Auth";
import {formatUTCDate, pipe, sortDate,utcDateCalendarTime} from "support/utils/common";
import {connect} from "react-redux";
import {mapValues, values} from "lodash";
class RecordsTable extends Component {
columns = () => {
const {accounts} = this.props;
return [
{
title : (
<FormattedMessage
defaultMessage="Amount"
id="common.amount"/>
),
dataIndex : 'formatted_value_price',
render : (text, record) => (
<span>
{record.type === 'receive' ?
<span className="cp-text-success">
{text}
</span> :
<span className="cp-text-danger">
{text}
</span>
}
</span>
)
},
{
title : (
<FormattedMessage
defaultMessage="Date"
id="widget.marketplace_earnings_chart.date"/>
),
dataIndex : 'created_at',
sorter : (a, b) => sortDate(a.created_at, b.created_at),
render : text => (
<div style={{whiteSpace : 'nowrap'}}>
{utcDateCalendarTime(text)}
</div>
),
};
export default pipe(
injectIntl,
connect(
mapStateToProps
)
)(RecordsTable);
Can Anyone please explain me why I am getting the date in translated form when I use render(), however when I use any function of getTime() or getTimeStamp() it doesn't work. What happens when we use the utcDateCalendarTime() inside of the function? Something happens and localisation(translation) not occurs. i really dig deep and still did not find any information related to this issue. Date format from datebase is exactly the same.