Reorganise functions, Use custom Format Date/Relative Time over dayjs

2020-03-06 14:14:17 +01:00
parent 46488146d0
commit adf2563eb8
11 changed files with 128 additions and 72 deletions
--- a/src/utils/functions.js
+++ b/src/utils/functions.js
@@ -43,16 +43,93 @@ export const lettersToSpan = string => {


 /*
-** Check if element is in viewport
+** Format date from an input date
 */
-export const isInViewport = element => {
-    const bounding = element.getBoundingClientRect()
-    return (
-        bounding.top >= 0 &&
-        bounding.left >= 0 &&
-        bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
-        bounding.right <= (window.innerWidth || document.documentElement.clientWidth)
-    )
+export const formatDate = (originDate, format) => {
+    let output
+    const date = new Date(originDate)
+
+    // Date
+    const day = new Intl.DateTimeFormat('default', { day: 'numeric' }).format(date)
+    const day2 = new Intl.DateTimeFormat('default', { day: '2-digit' }).format(date)
+    const mthSh = new Intl.DateTimeFormat('default', { month: 'short' }).format(date)
+    const mthNb = new Intl.DateTimeFormat('default', { month: '2-digit' }).format(date)
+    const year = new Intl.DateTimeFormat('default', { year: 'numeric' }).format(date)
+    const ord = ['th', 'st', 'nd', 'rd'][(day > 3 && day < 21) || day % 10 > 3 ? 0 : day % 10]
+
+    // Full format (MMM Do, YYYY)
+    if (format === 'FULL') {
+        output = `${mthSh} ${day + ord}, ${year}`
+    }
+
+    // Fulltime format (YYYY-MM-DDThh:mm:ss)
+    else if (format === 'DATETIME') {
+        output = date.toISOString()
+    }
+
+    return output
+}
+
+
+/*
+** Relative time from an input date
+*/
+export const relativeTime = (originDate, limit = 0) => {
+    const date = new Date(originDate)
+    const diff = Number(new Date()) - date
+
+    // Define units in milliseconds
+    const mn = 60 * 1000
+    const hr = mn * 60
+    const day = hr * 24
+    const mth = day * 30
+    const yr = day * 365
+
+    // Variables
+    let amount
+    let unit
+    let output
+
+    // Difference is seconds
+    if (diff < mn) {
+        amount = Math.round(diff / 1000)
+        unit = 'second'
+    }
+    // Difference is minutes
+    else if (diff < hr) {
+        amount = Math.round(diff / mn)
+        unit = 'minute'
+    }
+    // Difference is hours
+    else if (diff < day) {
+        amount = Math.round(diff / hr)
+        unit = 'hour'
+    }
+    // Difference is days
+    else if (diff < mth) {
+        amount = Math.round(diff / day)
+        unit = 'day'
+    }
+    // Difference is months
+    else if (diff < yr) {
+        amount = Math.round(diff / mth)
+        unit = 'month'
+    }
+    // Difference is years
+    else if (diff > yr) {
+        amount = Math.round(diff / yr)
+        unit = 'year'
+    }
+
+    // Define the output
+    output = `${amount} ${amount > 1 ? `${unit}s` : unit} ago`
+
+    // Detect if the difference is over the limit
+    if (diff > limit) {
+        output = formatDate(date, 'FULL')
+    }
+
+    return output
 }