fix custom dates to use ms since epoch

api/resolvers/growth.js

@@ -1,5 +1,4 @@
-import { timeUnitForRange } from '../../lib/time'
+import { timeUnitForRange, whenRange } from '../../lib/time'
-import { whenRange } from './item'
 
 const PLACEHOLDERS_NUM = 616
 

api/resolvers/item.js

@@ -18,7 +18,7 @@ import { advSchema, amountSchema, bountySchema, commentSchema, discussionSchema,
 import { sendUserNotification } from '../webPush'
 import { defaultCommentSort, isJob, deleteItemByAuthor, getDeleteCommand, hasDeleteCommand } from '../../lib/item'
 import { notifyItemParents, notifyUserSubscribers, notifyZapped } from '../../lib/push-notifications'
-import { datePivot, dayMonthYearToDate, whenToFrom } from '../../lib/time'
+import { datePivot, whenRange } from '../../lib/time'
 import { imageFeesInfo, uploadIdsFromText } from './image'
 
 export async function commentFilterClause (me, models) {
@@ -199,15 +199,6 @@ function whenClause (when, table) {
   return `"${table}".created_at <= $2 and "${table}".created_at >= $1`
 }
 
-export function whenRange (when, from, to = new Date()) {
-  switch (when) {
-    case 'custom':
-      return [dayMonthYearToDate(from), dayMonthYearToDate(to)]
-    default:
-      return [dayMonthYearToDate(whenToFrom(when)), new Date(to)]
-  }
-}
-
 const activeOrMine = (me) => {
   return me ? `("Item".status <> 'STOPPED' OR "Item"."userId" = ${me.id})` : '"Item".status <> \'STOPPED\''
 }

api/resolvers/referrals.js

@@ -1,7 +1,6 @@
 import { GraphQLError } from 'graphql'
 import { withClause, intervalClause } from './growth'
-import { whenRange } from './item'
+import { timeUnitForRange, whenRange } from '../../lib/time'
-import { timeUnitForRange } from '../../lib/time'
 
 export default {
   Query: {

api/resolvers/user.js

@@ -4,9 +4,10 @@ import { GraphQLError } from 'graphql'
 import { decodeCursor, LIMIT, nextCursorEncoded } from '../../lib/cursor'
 import { msatsToSats } from '../../lib/format'
 import { bioSchema, emailSchema, settingsSchema, ssValidate, userSchema } from '../../lib/validate'
-import { getItem, updateItem, filterClause, createItem, whereClause, muteClause, whenRange } from './item'
+import { getItem, updateItem, filterClause, createItem, whereClause, muteClause } from './item'
 import { ANON_USER_ID, DELETE_USER_ID, RESERVED_MAX_USER_ID } from '../../lib/constants'
 import { viewIntervalClause, intervalClause } from './growth'
+import { whenRange } from '../../lib/time'
 
 const contributors = new Set()
 

components/form.js

@@ -26,7 +26,7 @@ import 'react-datepicker/dist/react-datepicker.css'
 import useDebounceCallback, { debounce } from './use-debounce-callback'
 import { ImageUpload } from './image'
 import { AWS_S3_URL_REGEXP } from '../lib/constants'
-import { dayMonthYear, dayMonthYearToDate, whenToFrom } from '../lib/time'
+import { whenRange } from '../lib/time'
 import { useFeeButton } from './fee-button'
 import Thumb from '../svgs/thumb-up-fill.svg'
 
@@ -845,18 +845,13 @@ export function DatePicker ({ fromName, toName, noForm, onChange, when, from, to
   const [,, toHelpers] = noForm ? [{}, {}, {}] : useField({ ...props, name: toName })
   const { minDate, maxDate } = props
 
-  const [{ innerFrom, innerTo }, setRange] = useState({
+  const [[innerFrom, innerTo], setRange] = useState(whenRange(when, from, to))
-    innerFrom: from || whenToFrom(when),
-    innerTo: to || dayMonthYear(new Date())
-  })
 
   useEffect(() => {
-    const tfrom = from || whenToFrom(when)
+    setRange(whenRange(when, from, to))
-    const tto = to || dayMonthYear(new Date())
-    setRange({ innerFrom: tfrom, innerTo: tto })
     if (!noForm) {
-      fromHelpers.setValue(tfrom)
+      fromHelpers.setValue(new Date(to))
-      toHelpers.setValue(tto)
+      toHelpers.setValue(new Date(to))
     }
   }, [when, from, to])
 
@@ -870,9 +865,7 @@ export function DatePicker ({ fromName, toName, noForm, onChange, when, from, to
   }, [])
 
   const innerOnChange = ([from, to], e) => {
-    from = dayMonthYear(from)
+    setRange(whenRange(when, from, to))
-    to = to ? dayMonthYear(to) : undefined
-    setRange({ innerFrom: from, innerTo: to })
     if (!noForm) {
       fromHelpers.setValue(from)
       toHelpers.setValue(to)
@@ -887,9 +880,9 @@ export function DatePicker ({ fromName, toName, noForm, onChange, when, from, to
       const dates = dateStrings.map(s => new Date(s))
       let [from, to] = dates
       if (from) {
-        if (minDate) from = new Date(Math.max(from, minDate))
+        if (minDate) from = new Date(Math.max(from.getTime(), minDate.getTime()))
         try {
-          if (maxDate) to = new Date(Math.min(to, maxDate))
+          if (maxDate) to = new Date(Math.min(to.getTime(), maxDate.getTime()))
 
           // if end date isn't valid, set it to the start date
           if (!(to instanceof Date && !isNaN(to)) || to < from) to = from
@@ -908,9 +901,9 @@ export function DatePicker ({ fromName, toName, noForm, onChange, when, from, to
       maxDate={new Date()}
       minDate={new Date('2021-05-01')}
       {...props}
-      selected={dayMonthYearToDate(innerFrom)}
+      selected={new Date(innerFrom)}
-      startDate={dayMonthYearToDate(innerFrom)}
+      startDate={new Date(innerFrom)}
-      endDate={innerTo ? dayMonthYearToDate(innerTo) : undefined}
+      endDate={innerTo ? new Date(innerTo) : undefined}
       dateFormat={dateFormat}
       onChangeRaw={onChangeRawHandler}
       onChange={innerOnChange}

components/search.js

@@ -4,7 +4,7 @@ import SearchIcon from '../svgs/search-line.svg'
 import { useEffect, useRef, useState } from 'react'
 import { Form, Input, Select, DatePicker, SubmitButton } from './form'
 import { useRouter } from 'next/router'
-import { dayMonthYear, whenToFrom } from '../lib/time'
+import { whenToFrom } from '../lib/time'
 
 export default function Search ({ sub }) {
   const router = useRouter()
@@ -103,7 +103,7 @@ export default function Search ({ sub }) {
                       <Select
                         groupClassName='mb-0 mx-2'
                         onChange={(formik, e) => {
-                          const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: dayMonthYear(new Date()) } : {}
+                          const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: Date.now() } : {}
                           search({ ...formik?.values, when: e.target.value, ...range })
                         }}
                         name='when'
@@ -119,7 +119,7 @@ export default function Search ({ sub }) {
                     toName='to'
                     className='p-0 px-2 mb-2'
                     onChange={(formik, [from, to], e) => {
-                      search({ ...formik?.values, from, to })
+                      search({ ...formik?.values, from: from.getTime(), to: to.getTime() })
                     }}
                     from={router.query.from}
                     to={router.query.to}

components/top-header.js

@@ -1,7 +1,7 @@
 import { useRouter } from 'next/router'
 import { Form, Select, DatePicker } from './form'
 import { ITEM_SORTS, USER_SORTS, WHENS } from '../lib/constants'
-import { dayMonthYear, whenToFrom } from '../lib/time'
+import { whenToFrom } from '../lib/time'
 
 export default function TopHeader ({ sub, cat }) {
   const router = useRouter()
@@ -71,7 +71,7 @@ export default function TopHeader ({ sub, cat }) {
                 <Select
                   groupClassName='mb-0 mx-2'
                   onChange={(formik, e) => {
-                    const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: dayMonthYear(new Date()) } : {}
+                    const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: Date.now() } : {}
                     top({ ...formik?.values, when: e.target.value, ...range })
                   }}
                   name='when'
@@ -88,7 +88,7 @@ export default function TopHeader ({ sub, cat }) {
               toName='to'
               className='p-0 px-2 my-2'
               onChange={(formik, [from, to], e) => {
-                top({ ...formik?.values, from, to })
+                top({ ...formik?.values, from: from.getTime(), to: to.getTime() })
               }}
               from={router.query.from}
               to={router.query.to}

components/usage-header.js

@@ -1,7 +1,7 @@
 import { useRouter } from 'next/router'
 import { Select, DatePicker } from './form'
 import { WHENS } from '../lib/constants'
-import { dayMonthYear, whenToFrom } from '../lib/time'
+import { whenToFrom } from '../lib/time'
 
 export function UsageHeader () {
   const router = useRouter()
@@ -33,7 +33,7 @@ export function UsageHeader () {
           value={when}
           noForm
           onChange={(formik, e) => {
-            const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: dayMonthYear(new Date()) } : {}
+            const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: Date.now() } : {}
             select({ when: e.target.value, ...range })
           }}
         />
@@ -45,7 +45,7 @@ export function UsageHeader () {
           toName='to'
           className='p-0 px-2 mb-0'
           onChange={(formik, [from, to], e) => {
-            select({ when, from, to })
+            select({ when, from: from.getTime(), to: to.getTime() })
           }}
           from={router.query.from}
           to={router.query.to}

lib/time.js

@@ -61,9 +61,18 @@ export function timeLeft (timeStamp) {
   }
 }
 
+export function whenRange (when, from, to = Date.now()) {
+  switch (when) {
+    case 'custom':
+      return [new Date(Number(from)), new Date(Number(to))]
+    default:
+      return [new Date(whenToFrom(when)), new Date(Number(to))]
+  }
+}
+
 export function timeUnitForRange ([from, to]) {
-  const date1 = new Date(from)
+  const date1 = new Date(Number(from))
-  const date2 = new Date(to)
+  const date2 = new Date(Number(to))
   const diffTime = Math.abs(date2 - date1)
   const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24))
 
@@ -85,15 +94,15 @@ export function timeUnitForRange ([from, to]) {
 export const whenToFrom = (when) => {
   switch (when) {
     case 'day':
-      return dayMonthYear(new Date(), { hours: -24 })
+      return datePivot(new Date(), { days: -1 }).getTime()
     case 'week':
-      return dayMonthYear(datePivot(new Date(), { days: -7 }))
+      return datePivot(new Date(), { days: -7 }).getTime()
     case 'month':
-      return dayMonthYear(datePivot(new Date(), { days: -30 }))
+      return datePivot(new Date(), { days: -30 }).getTime()
     case 'year':
-      return dayMonthYear(datePivot(new Date(), { days: -365 }))
+      return datePivot(new Date(), { days: -365 }).getTime()
     default:
-      return dayMonthYear(new Date('2021-05-01'))
+      return new Date('2021-05-01').getTime()
   }
 }
 

pages/[name]/[type].js

@@ -7,7 +7,7 @@ import { COMMENT_TYPE_QUERY, ITEM_SORTS, ITEM_TYPES, WHENS } from '../../lib/con
 import PageLoading from '../../components/page-loading'
 import { UserLayout } from '.'
 import { Form, Select, DatePicker } from '../../components/form'
-import { dayMonthYear, whenToFrom } from '../../lib/time'
+import { whenToFrom } from '../../lib/time'
 
 const staticVariables = { sort: 'user' }
 const variablesFunc = vars => ({
@@ -96,7 +96,7 @@ function UserItemsHeader ({ type, name }) {
             items={WHENS}
             overrideValue={when}
             onChange={(formik, e) => {
-              const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: dayMonthYear(new Date()) } : {}
+              const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: Date.now() } : {}
               select({ ...formik?.values, when: e.target.value, ...range })
             }}
           />
@@ -106,7 +106,7 @@ function UserItemsHeader ({ type, name }) {
             fromName='from' toName='to'
             className='p-0 px-2 mb-2'
             onChange={(formik, [from, to], e) => {
-              select({ ...formik?.values, from, to })
+              select({ ...formik?.values, from: from.getTime(), to: to.getTime() })
             }}
             from={router.query.from}
             to={router.query.to}

pages/referrals/[when].js

@@ -10,7 +10,7 @@ import PageLoading from '../../components/page-loading'
 import { WHENS } from '../../lib/constants'
 import dynamic from 'next/dynamic'
 import { numWithUnits } from '../../lib/format'
-import { dayMonthYear, whenToFrom } from '../../lib/time'
+import { whenToFrom } from '../../lib/time'
 
 const WhenComposedChart = dynamic(() => import('../../components/charts').then(mod => mod.WhenComposedChart), {
   loading: () => <div>Loading...</div>
@@ -71,7 +71,7 @@ export default function Referrals ({ ssrData }) {
             value={router.query.when || 'day'}
             noForm
             onChange={(formik, e) => {
-              const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: dayMonthYear(new Date()) } : {}
+              const range = e.target.value === 'custom' ? { from: whenToFrom(when), to: Date.now() } : {}
               select({ when: e.target.value, ...range })
             }}
           />
@@ -83,7 +83,7 @@ export default function Referrals ({ ssrData }) {
             toName='to'
             className='p-0 px-2 mb-2'
             onChange={(formik, [from, to], e) => {
-              select({ when, from, to })
+              select({ when, from: from.getTime(), to: to.getTime() })
             }}
             from={router.query.from}
             to={router.query.to}