Making date-time component relative time a bit fuzzy around "now", so it does not create future references to past events if the client's clock is a bit off.

Author: krulis-martin

src/components/Assignments/Assignment/AssignmentDetails/AssignmentDetails.js

@@ -99,7 +99,7 @@ const AssignmentDetails = ({
                   </Explanation>
                 </th>
                 <td>
-                  <DateTime unixts={createdAt} showRelative />
+                  <DateTime unixTs={createdAt} showRelative />
                 </td>
               </tr>
             )}
@@ -113,7 +113,7 @@ const AssignmentDetails = ({
                   <FormattedMessage id="app.assignment.visibleFrom" defaultMessage="Visible from" />:
                 </th>
                 <td>
-                  <DateTime unixts={visibleFrom} showRelative />
+                  <DateTime unixTs={visibleFrom} showRelative />
                 </td>
               </tr>
             )}
@@ -155,11 +155,11 @@ const AssignmentDetails = ({
                 )}
               </th>
               <td>
-                <DateTime unixts={firstDeadline} isDeadline showRelative />
+                <DateTime unixTs={firstDeadline} isDeadline showRelative />
                 {allowSecondDeadline && (
                   <>
                     <br />
-                    <DateTime unixts={secondDeadline} isDeadline showRelative />
+                    <DateTime unixTs={secondDeadline} isDeadline showRelative />
                   </>
                 )}
               </td>

src/components/Assignments/Assignment/AssignmentSync/AssignmentSync.js

@@ -25,8 +25,8 @@ const AssignmentSync = ({ syncInfo, exerciseSync }) => {
               id="app.assignment.syncRequired"
               defaultMessage="Exercise was updated at <strong>{exerciseUpdated}</strong>, but the assignment was synchronized with the exercise at <strong>{assignmentUpdated}</strong>!"
               values={{
-                exerciseUpdated: <DateTime unixts={syncInfo.updatedAt.exercise} emptyPlaceholder="??" />,
-                assignmentUpdated: <DateTime unixts={syncInfo.updatedAt.assignment} emptyPlaceholder="??" />,
+                exerciseUpdated: <DateTime unixTs={syncInfo.updatedAt.exercise} emptyPlaceholder="??" />,
+                assignmentUpdated: <DateTime unixTs={syncInfo.updatedAt.assignment} emptyPlaceholder="??" />,
                 strong: contents => <strong>{contents}</strong>,
               }}
             />

src/components/Assignments/Assignment/AssignmentSyncIcon/AssignmentSyncIcon.js

@@ -25,8 +25,8 @@ const AssignmentSyncIcon = ({ id, syncInfo, ...props }) => {
                 id="app.assignment.syncRequired"
                 defaultMessage="Exercise was updated at <strong>{exerciseUpdated}</strong>, but the assignment was synchronized with the exercise at <strong>{assignmentUpdated}</strong>!"
                 values={{
-                  exerciseUpdated: <DateTime unixts={syncInfo.updatedAt.exercise} emptyPlaceholder="??" />,
-                  assignmentUpdated: <DateTime unixts={syncInfo.updatedAt.assignment} emptyPlaceholder="??" />,
+                  exerciseUpdated: <DateTime unixTs={syncInfo.updatedAt.exercise} emptyPlaceholder="??" />,
+                  assignmentUpdated: <DateTime unixTs={syncInfo.updatedAt.assignment} emptyPlaceholder="??" />,
                   strong: contents => <strong>{contents}</strong>,
                 }}
               />

src/components/Assignments/Assignment/AssignmentTableRow/AssignmentTableRow.js

@@ -128,12 +128,12 @@ const AssignmentTableRow = ({
       </td>
     )}
     <td className="text-nowrap">
-      <DateTime unixts={firstDeadline} isDeadline />
+      <DateTime unixTs={firstDeadline} isDeadline />
     </td>
 
     {showSecondDeadline && (
       <td className="text-nowrap">
-        <DateTime unixts={allowSecondDeadline ? secondDeadline : null} isDeadline />
+        <DateTime unixTs={allowSecondDeadline ? secondDeadline : null} isDeadline />
       </td>
     )}
 

src/components/Assignments/ShadowAssignment/ShadowAssignmentDetail/ShadowAssignmentDetail.js

@@ -48,7 +48,7 @@ const ShadowAssignmentDetail = ({
             <FormattedMessage id="generic.createdAt" defaultMessage="Created at" />:
           </th>
           <td>
-            <DateTime unixts={createdAt} />
+            <DateTime unixTs={createdAt} />
           </td>
         </tr>
 
@@ -66,7 +66,7 @@ const ShadowAssignmentDetail = ({
             </Explanation>
           </th>
           <td>
-            <DateTime unixts={deadline} isDeadline />
+            <DateTime unixTs={deadline} isDeadline />
           </td>
         </tr>
 

src/components/Assignments/ShadowAssignment/ShadowAssignmentsTable/ShadowAssignmentsTableRow.js

@@ -48,11 +48,11 @@ const ShadowAssignmentsTableRow = ({
     </td>
 
     <td className="text-nowrap">
-      <DateTime unixts={createdAt} />
+      <DateTime unixTs={createdAt} />
     </td>
 
     <td className="text-nowrap">
-      <DateTime unixts={deadline} isDeadline />
+      <DateTime unixTs={deadline} isDeadline />
     </td>
 
     <td className="text-center">

src/components/Assignments/ShadowAssignmentPointsDetail/ShadowAssignmentPointsDetail.js

@@ -43,7 +43,7 @@ const ShadowAssignmentPointsDetail = ({ points = null, awardedAt = null, authorI
             <th>
               <FormattedMessage id="app.shadowAssignmentPointsDetail.awardedAt" defaultMessage="Awarded at" />:
             </th>
-            <td>{awardedAt !== null ? <DateTime unixts={awardedAt} showRelative /> : <span>&mdash;</span>}</td>
+            <td>{awardedAt !== null ? <DateTime unixTs={awardedAt} showRelative /> : <span>&mdash;</span>}</td>
           </tr>
         )}
 

src/components/Assignments/ShadowAssignmentPointsTable/ShadowAssignmentPointsTable.js

@@ -197,7 +197,7 @@ class ShadowAssignmentPointsTable extends Component {
                       />
                     </td>
                     <td className="text-center text-nowrap">{points !== null ? points : <span>&mdash;</span>}</td>
-                    <td>{awardedAt && <DateTime unixts={awardedAt} showRelative />}</td>
+                    <td>{awardedAt && <DateTime unixTs={awardedAt} showRelative />}</td>
                     <td>{safeGet(studentPoints, [student.id, 'note'], null)}</td>
                     <td className="shrink-col text-nowrap text-end">
                       {points === null ? (

src/components/Assignments/SolutionsTable/SolutionsTableRow.js

@@ -89,7 +89,7 @@ const SolutionsTableRow = ({
         </td>
 
         <td className="text-nowrap align-middle">
-          <DateTime unixts={createdAt} showOverlay overlayTooltipId={`datetime-${id}`} />
+          <DateTime unixTs={createdAt} showOverlay overlayTooltipId={`datetime-${id}`} />
         </td>
 
         <td className="text-center text-nowrap align-middle">

src/components/AsyncJobs/AsyncJobsList/AsyncJobsList.js

@@ -63,10 +63,10 @@ const AsyncJobsList = ({ asyncJobs, abort = null, links: { ASSIGNMENT_DETAIL_URI
                   )}
                 </td>
                 <td className="small text-nowrap align-baseline">
-                  <DateTime unixts={job.createdAt} showDate={false} showSeconds showOverlay />
+                  <DateTime unixTs={job.createdAt} showDate={false} showSeconds showOverlay />
                 </td>
                 <td className="small text-nowrap align-baseline">
-                  <DateTime unixts={job.scheduledAt} emptyPlaceholder="-" />
+                  <DateTime unixTs={job.scheduledAt} emptyPlaceholder="-" />
                 </td>
                 <td className="small text-nowrap align-baseline">
                   {job.startedAt ? (
@@ -78,7 +78,7 @@ const AsyncJobsList = ({ asyncJobs, abort = null, links: { ASSIGNMENT_DETAIL_URI
                             <FormattedMessage id="app.asyncJobs.list.processInfo" defaultMessage="Processing info" />
                           </Popover.Header>
                           <Popover.Body>
-                            <DateTime unixts={job.startedAt} showSeconds showRelative />
+                            <DateTime unixTs={job.startedAt} showSeconds showRelative />
                             <br />
                             <FormattedMessage id="app.asyncJobs.list.worker" defaultMessage="Worker" />:{' '}
                             <code>{job.workerId}</code>
@@ -89,7 +89,7 @@ const AsyncJobsList = ({ asyncJobs, abort = null, links: { ASSIGNMENT_DETAIL_URI
                       }>
                       {
                         <span>
-                          <DateTime unixts={job.startedAt} showDate={false} showSeconds />
+                          <DateTime unixTs={job.startedAt} showDate={false} showSeconds />
                         </span>
                       }
                     </OverlayTrigger>
@@ -98,7 +98,7 @@ const AsyncJobsList = ({ asyncJobs, abort = null, links: { ASSIGNMENT_DETAIL_URI
                   )}
                 </td>
                 <td className="small text-nowrap align-baseline">
-                  <DateTime unixts={job.finishedAt} emptyPlaceholder="-" showDate={false} showSeconds showOverlay />
+                  <DateTime unixTs={job.finishedAt} emptyPlaceholder="-" showDate={false} showSeconds showOverlay />
                 </td>
                 <td className="align-baseline">
                   {job.arguments && Object.keys(job.arguments).length > 0 ? (