feat: add isExpired to session utils

packages/analytics-util-session/example/index.html

@@ -64,21 +64,21 @@ <h2>Session utils demo</h2>
  <p id='info'>
  Use the buttons below to see the sessions in action.
  </p>
- <h3>Persisted session</h3>
- <button id="get-persisted">Get Persisted Session</button>
- <button id="set-persisted">Update Persisted Session</button>
- <button id="extend-persisted">Extend Persisted Session</button>
- <button id="remove-persisted">Clear Persisted Session</button>
+ <h3>Persisted session (in cookie). Shared across tabs</h3>
+ <button id="set-persisted">New Session</button>
+ <button id="get-persisted">Get Session</button>
+ <button id="extend-persisted">Extend Session</button>
+ <button id="remove-persisted">Clear Session</button>
  <pre id="data-persisted"></pre>
  <hr/>
- <h3>Tab session</h3>
- <button id="get">Get Session</button>
- <button id="set">Update Session</button>
- <pre id="data"></pre>
+ <h3>Tab session (in session storage). Refresh on new tab opens</h3>
+ <button id='get-tab-session'>Get Tab Session</button>
+ <button id='set-tab-session'>New Tab Session</button>
+ <pre id="data-tab"></pre>
  <hr/>
- <h3>Page session</h3>
+ <h3>Page session (in global storage). Refresh on page routing</h3>
  <button id="get-page">Get Page Session</button>
- <button id="set-page">Update Page Session</button>
+ <button id="set-page">New Page Session</button>
  <pre id="data-page"></pre>
  </div>
 
@@ -94,16 +94,22 @@ <h3>Page session</h3>
  getPageSession, 
  setPageSession 
  } = utilSessions
+
+ function getSessionCookie() {
+ const name = '__session'
+ const val = decodeURIComponent((('; ' + document.cookie).split('; ' + name + '=')[1] || '').split(';')[0])
+ return (val) ? JSON.parse(val) : {}
+ // return decodeURIComponent((('; ' + document.cookie).split('; ' + name + '=')[1] || '').split(';')[0])
+ }
 
-  /* Page */
+ /* Page */
  const getButtonPersisted = document.querySelector('#get-persisted')
  const updateButtonPersisted = document.querySelector('#set-persisted')
  const removeButtonPersisted = document.querySelector('#remove-persisted')
  const extendButtonPersisted = document.querySelector('#extend-persisted')
  const dataNodePersisted = document.querySelector('#data-persisted')
  const SESSION_LENGTH_IN_MINUTES = 1
  const initialPersistedData = getSession(SESSION_LENGTH_IN_MINUTES)
- console.log('initialPersistedData', initialPersistedData)
  setPersistedData(initialPersistedData)
 
  function setPersistedData(d) {
@@ -112,11 +118,11 @@ <h3>Page session</h3>
 
  getButtonPersisted.addEventListener('click', () => {
  const data = getSession(SESSION_LENGTH_IN_MINUTES)
- console.log(data)
+ console.log('getSession', data)
  setPersistedData(data)
  })
  updateButtonPersisted.addEventListener('click', () => {
- const newData = setSession(SESSION_LENGTH_IN_MINUTES)
+ const newData = setSession(SESSION_LENGTH_IN_MINUTES, { customAttribute: 'bar' })
  console.log(newData)
  setPersistedData(newData)
  })
@@ -129,9 +135,11 @@ <h3>Page session</h3>
  setPersistedData(d)
  })
 
- const getButton = document.querySelector('#get')
- const updateButton = document.querySelector('#set')
- const dataNode = document.querySelector('#data')
+ const getButton = document.querySelector('#get-tab-session')
+ const updateButton = document.querySelector('#set-tab-session')
+ const dataNode = document.querySelector('#data-tab')
+
+ /* Set initial ui */
  const initialData = getTabSession()
  setData(initialData)
 
@@ -146,7 +154,7 @@ <h3>Page session</h3>
  })
  updateButton.addEventListener('click', () => {
  const newData = setTabSession()
- console.log(newData)
+ console.log('newData tabSession', newData)
  setData(newData)
  })
 
@@ -168,7 +176,7 @@ <h3>Page session</h3>
  })
  updateButtonPage.addEventListener('click', () => {
  const newData = setPageSession()
- console.log(newData)
+ console.log('newData pageSession', newData)
  setPageData(newData)
  })
 

packages/analytics-util-session/src/index.js

@@ -6,6 +6,7 @@ import { set, get } from '@analytics/global-storage-utils'
 
 const PREFIX = '__'
 const SESSION = 'session'
+const KEY = PREFIX + SESSION
 const PAGE = 'page'
 const KEYS = ['id', 'createdAt', 'created']
 const TIMEOUT = 30
@@ -24,45 +25,46 @@ export function sessionData() {
  }
 }
 
+const storageMechanism = {
+ session: [ getSessionItem, setSessionItem ],
+ page: [ get, set ]
+}
+
 function logic(kind, isSetter) {
- const storageMechanism = {
- session: [ getSessionItem, setSessionItem ],
- page: [ get, set ]
- }
  const [ getter, setter ] = storageMechanism[kind]
  const data = sessionData()
  let isNew = false
  let info = {}
 
  for (let i = 0; i < KEYS.length; i++) {
  const key = KEYS[i]
- // e.g. __page__session__createdAt
+ // e.g. __page__session__createdAt, __session__session__createdAt, 
  const k = PREFIX + kind + PREFIX + SESSION + PREFIX + key
  const currentVal = getter(k)
  // Triple ! sets !!!false | !!!null | !!!undefined to true
  isNew = isSetter || !!!currentVal
- const value = (currentVal && !isSetter) ? currentVal : setter(k, data[key])
+ if (isSetter || !isSetter && !currentVal) setter(k, data[key])
+ const value = (currentVal && !isSetter) ? currentVal : data[key]
  const finValue = (key !== 'created') ? value : Number(value)
  info[key] = finValue
  }
-
  return addContext(info, isNew)
 }
 
 function addContext(obj, isNew) {
  const now = Date.now()
  obj.elapsed = now - obj.created
- if (obj.expires) obj.remaining = Math.abs(obj.expires - now)
+ if (obj.expires) {
+ obj.remaining = Math.max(obj.expires - now, 0)
+ /* Expire session */
+ obj.isExpired = obj.remaining === 0
+ }
  obj.isNew = isNew
  return obj
 }
 
-function getName() {
- return PREFIX + SESSION
-}
-
-export function getSession(minutes = TIMEOUT, persistedOnly) {
- const cookieData = getCookie(getName())
+export function getSession(minutes = TIMEOUT, persistedOnly) {
+ const cookieData = getCookie(KEY)
  const data = (cookieData) ? JSON.parse(cookieData) : setSession(minutes)
  return persistedOnly ? data : addContext(data, !!!cookieData)
 }
@@ -81,16 +83,17 @@ export function setSession(minutes = TIMEOUT, extra, extend) {
  const [ expiresIso, expiresUnix ] = getDate(timeExpire + (exp * 1e3))
  data.expires = expiresUnix
  data.expiresAt = expiresIso
+ data.duration = (exp * 1e3)
  if (extra) {
  data = Object.assign(data, extra)
  }
- setCookie(getName(), JSON.stringify(data), exp)
+ setCookie(KEY, JSON.stringify(data), exp)
  return addContext(data, !extend)
 }
 
 export const extendSession = (minutes = TIMEOUT, extra) => setSession((minutes || 1), extra, true)
 
-export const removeSession = () => removeCookie(getName())
+export const removeSession = () => removeCookie(KEY)
 
 export const getTabSession = logic.bind(null, SESSION)
 export const setTabSession = logic.bind(null, SESSION, true)