[web] Fix hardcode 'You' with i18 translation (also add locale for moment js)

[Musicminion]

Description

Hello, I am Musicminion, Overleaf’s volunteer translator for Chinese. When I was using and translating Overleaf I found that the project owner in your Project page was not translated. So I checked related code, it seems that phrase You is hard coded, as shown in the pic.

I am not sure if this is by design, so I make a pr. And I have signed contributor Agreement with name Musicminion.

In the meantime, it seems that you use moment.js to show time, however, you didn't set locale for moment.js, so, as shown above, the relative modify time is also untranslated in English.

I try to add locale setting for moment.js with the following code, but this commit is not contained in this pr, if you are interested, I can add this commit too!

// services/web/frontend/js/utils/dates.js
import moment from 'moment'
import { useTranslation } from 'react-i18next'
import 'moment/min/locales';

export function formatDate(date, format) {
  if (!date) return 'N/A'
  if (format == null) {
    format = 'Do MMM YYYY, h:mm a'
  }
  const { i18n } = useTranslation();
  moment.locale(i18n.language);
  return moment(date).format(format)
}

export function fromNowDate(date) {
  const { i18n } = useTranslation();
  moment.locale(i18n.language);
  return moment(date).fromNow()
}

After fix, the effect is shown below, it can show the relative time correctly.

I have run image build for this pr with my own server, it works well too.

Thanks for your time of this pr!

Related issues / Pull Requests

Contributor Agreement

• I confirm I have signed the Contributor License Agreement

[aeaton-overleaf]

Thank you for this contribution! React only allows the useTranslation hook to be used inside a React component or hook, so this needed a slightly different approach, but this has now been implemented in 08c784f

We'll look into adding the Moment locales separately.

[Musicminion]

Thanks, already see effect in overkeaf.com!