Extract createLocalId into a util

We extracted createLocalId into a method outside of the new page. Now, it can be used as a fallback when fetching the local ID if that local ID doesn't exist yet

pages/new/index.tsx

@@ -1,9 +1,8 @@
 import React, { useEffect, useState } from 'react'
-import { getCookie, setCookie } from 'cookies-next'
+import { getCookie } from 'cookies-next'
 import { get, set } from 'local-storage'
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
 import { useRouter } from 'next/router'
-import { v4 as uuidv4 } from 'uuid'
 import clonedeep from 'lodash.clonedeep'
 
 import ErrorSection from '~components/ErrorSection'
@@ -14,6 +13,7 @@ import api from '~utils/api'
 import fetchLatestVersion from '~utils/fetchLatestVersion'
 import { accountCookie, setHeaders } from '~utils/userToken'
 import { appState, initialAppState } from '~utils/appState'
+import { createLocalId } from '~utils/localId'
 import { groupWeaponKeys } from '~utils/groupWeaponKeys'
 
 import type { AxiosError } from 'axios'
@@ -173,20 +173,7 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex
   setHeaders(req, res)
 
   // If there is no account entry in cookies, create a UUID and store it
-  if (!accountCookie(req, res)) {
+  createLocalId(req, res)
-    const uuid = uuidv4()
-    const expiresAt = new Date()
-    expiresAt.setDate(expiresAt.getDate() + 60)
-
-    const cookieObj = {
-      userId: uuid,
-      username: undefined,
-      token: undefined,
-    }
-
-    const options = req && res ? { req, res } : {}
-    setCookie('account', cookieObj, { path: '/', expires: expiresAt, ...options })
-  }
 
   // Fetch latest version
   const version = await fetchLatestVersion()

utils/localId.tsx

@@ -1,9 +1,44 @@
 import { accountCookie } from './userToken'
+import { v4 as uuidv4 } from 'uuid'
+import { setCookie } from 'cookies-next'
+import type { NextApiRequest, NextApiResponse } from 'next'
 
-export function getLocalId() {
+export const createLocalId = (
-  const cookie = accountCookie()
+  req: NextApiRequest | undefined = undefined,
-  const parsed = JSON.parse(cookie as string)
+  res: NextApiResponse | undefined = undefined
-  if (parsed && !parsed.token) {
+) => {
-    return { local_id: parsed.userId }
+  // If there is no account entry in cookies, create a UUID and store it
-  } else return {}
+  if (!accountCookie(req, res)) {
+    const uuid = uuidv4()
+    const expiresAt = new Date()
+    expiresAt.setDate(expiresAt.getDate() + 60)
+
+    const cookieObj = {
+      userId: uuid,
+      username: undefined,
+      token: undefined,
+    }
+
+    const options = req && res ? { req, res } : {}
+    setCookie('account', cookieObj, {
+      path: '/',
+      expires: expiresAt,
+      ...options,
+    })
+
+    return uuid
+  }
+}
+
+export const getLocalId = () => {
+  const cookie = accountCookie()
+  if (cookie) {
+    const parsed = JSON.parse(cookie as string)
+    if (parsed && !parsed.token)
+      // Return the existing account cookie
+      return parsed.userId
+  } else {
+    // Create a new account cookie and return
+    return createLocalId()
+  }
 }