tech-feat: upgrade uid to v11.0.0-0 and update packages to use uuid v7

packages/botonic-cli/package.json

@@ -38,7 +38,7 @@
     "qs": "^6.11.2",
     "tar": "^6.2.0",
     "tslib": "^2.6.2",
-    "uuid": "^8.3.2",
+    "uuid": "^11.0.0-0",
     "zip-a-folder": "3.1.7"
   },
   "devDependencies": {

packages/botonic-cli/src/analytics/credentials-handler.ts

@@ -1,5 +1,5 @@
 import { join, resolve } from 'path'
-import { v4 as uuidv4 } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import {
   BOT_CREDS_FILENAME,
@@ -36,7 +36,7 @@ export class CredentialsHandler {
   }
 
   generateId(): string {
-    return uuidv4()
+    return uuidv7()
   }
 
   createDirIfNotExists(): void {

packages/botonic-plugin-dialogflow/package.json

@@ -19,7 +19,7 @@
     "@botonic/core": "^0.30.0",
     "axios": "^1.7.2",
     "jsrsasign": "^10.9.0",
-    "uuid": "^8.3.2"
+    "uuid": "^11.0.0-0"
   },
   "devDependencies": {
     "@types/jsrsasign": "^10.5.12",

packages/botonic-plugin-dialogflow/src/index.ts

@@ -1,7 +1,7 @@
 import type { Plugin, PluginPreRequest } from '@botonic/core'
 import axios, { AxiosResponse } from 'axios'
 import jsrsasign from 'jsrsasign'
-import { v4 as uuidv4 } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import { Credentials, Options } from './types'
 
@@ -12,7 +12,7 @@ export default class BotonicPluginDialogflow implements Plugin {
   defaultQueryData: Options['queryData']
   constructor(options: Options) {
     const { credentials, queryData } = options
-    this.sessionId = uuidv4()
+    this.sessionId = uuidv7()
     this.creds = credentials
     this.defaultQueryData = queryData || {}
   }

packages/botonic-plugin-flow-builder/package.json

@@ -16,7 +16,7 @@
   "dependencies": {
     "@botonic/react": "^0.30.0",
     "axios": "^1.7.2",
-    "uuid": "^9.0.1"
+    "uuid": "^11.0.0-0"
   },
   "repository": {
     "type": "git",

packages/botonic-plugin-flow-builder/src/index.ts

@@ -1,6 +1,6 @@
 import { Plugin, PluginPreRequest, Session } from '@botonic/core'
 import { ActionRequest } from '@botonic/react'
-import { v4 as uuid } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import { FlowBuilderApi } from './api'
 import {
@@ -144,7 +144,7 @@ export default class BotonicPluginFlowBuilder implements Plugin {
   async getStartContents(locale: string): Promise<FlowContent[]> {
     const resolvedLocale = this.cmsApi.getResolvedLocale(locale)
     const startNode = this.cmsApi.getStartNode()
-    this.currentRequest.session.flow_thread_id = uuid()
+    this.currentRequest.session.flow_thread_id = uuidv7()
     return await this.getContentsByNode(startNode, resolvedLocale)
   }
 

packages/botonic-plugin-flow-builder/src/tracking.ts

@@ -1,5 +1,5 @@
 import { ActionRequest } from '@botonic/react'
-import { v4 as uuid } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import { FlowContent } from './content-fields'
 import { HtNodeWithContent } from './content-fields/hubtype-fields'
@@ -60,7 +60,7 @@ function getContentEventArgs(
     isMeaningful: boolean
   }
 ) {
-  const flowThreadId = request.session.flow_thread_id ?? uuid()
+  const flowThreadId = request.session.flow_thread_id ?? uuidv7()
   request.session.flow_thread_id = flowThreadId
 
   return {

packages/botonic-react/package.json

@@ -32,7 +32,7 @@
     "react-textarea-autosize": "^8.5.3",
     "styled-components": "^5.3.0",
     "ua-parser-js": "^1.0.39",
-    "uuid": "^8.3.2"
+    "uuid": "^11.0.0-0"
   },
   "devDependencies": {
     "@babel/plugin-transform-runtime": "^7.23.9",

packages/botonic-react/src/components/message/index.jsx

@@ -1,6 +1,6 @@
 import { INPUT, isBrowser } from '@botonic/core'
 import React, { useContext, useEffect, useState } from 'react'
-import { v4 as uuidv4 } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import { COLORS, WEBCHAT } from '../../constants'
 import { RequestContext, WebchatContext } from '../../contexts'
@@ -49,7 +49,7 @@ export const Message = props => {
   const { webchatState, addMessage, updateReplies, getThemeProperty } =
     useContext(WebchatContext)
   const [state, setState] = useState({
-    id: props.id || uuidv4(),
+    id: props.id || uuidv7(),
   })
 
   const [disabled, setDisabled] = useState(false)

packages/botonic-react/src/components/message/message-feedback.tsx

@@ -1,5 +1,5 @@
 import React, { useContext, useEffect, useState } from 'react'
-import { v4 as uuid } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import ThumbsDown from '../../assets/thumbs-down.svg'
 import ThumbsUp from '../../assets/thumbs-up.svg'
@@ -70,7 +70,7 @@ export const MessageFeedback = ({
       knowledgebaseInferenceId: inferenceId,
       feedbackBotInteractionId: botInteractionId,
       feedbackTargetId: messageId,
-      feedbackGroupId: uuid(),
+      feedbackGroupId: uuidv7(),
       possibleOptions: [FeedbackOption.ThumbsDown, FeedbackOption.ThumbsUp],
       possibleValues: [0, 1],
       option: isUseful ? FeedbackOption.ThumbsUp : FeedbackOption.ThumbsDown,

packages/botonic-react/src/util/webchat.js

@@ -1,6 +1,6 @@
 import merge from 'lodash.merge'
 import UAParser from 'ua-parser-js'
-import { v4 as uuidv4 } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import { WEBCHAT } from '../constants'
 import { getProperty } from './objects'
@@ -31,7 +31,7 @@ export const createUser = () => {
   let name = `${ua.os.name} ${ua.browser.name}`
   if (ua.device && ua.device.type) name = `${ua.device.type} ${name}`
   return {
-    id: uuidv4(),
+    id: uuidv7(),
     name,
   }
 }

packages/botonic-react/src/webchat/input-panel/index.tsx

@@ -1,6 +1,6 @@
 import { INPUT } from '@botonic/core'
 import React, { useContext } from 'react'
-import { v4 as uuidv4 } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import { WEBCHAT } from '../../constants'
 import { WebchatContext } from '../../contexts'
@@ -62,7 +62,7 @@ export const InputPanel = ({
 
   const sendChatEvent = async chatEvent => {
     const chatEventInput = {
-      id: uuidv4(),
+      id: uuidv7(),
       type: INPUT.CHAT_EVENT,
       data: chatEvent,
     }

packages/botonic-react/src/webchat/webchat.jsx

@@ -13,7 +13,7 @@ import React, {
   useState,
 } from 'react'
 import styled, { StyleSheetManager } from 'styled-components'
-import { v4 as uuidv4 } from 'uuid'
+import { v7 as uuidv7 } from 'uuid'
 
 import { Audio, Document, Image, Text, Video } from '../components'
 import { Handoff } from '../components/handoff'
@@ -467,7 +467,7 @@ export const Webchat = forwardRef((props, ref) => {
     if (!input || Object.keys(input).length == 0) return
     if (isText(input) && (!input.data || !input.data.trim())) return // in case trim() doesn't work in a browser we can use !/\S/.test(input.data)
     if (isText(input) && checkBlockInput(input)) return
-    if (!input.id) input.id = uuidv4()
+    if (!input.id) input.id = uuidv7()
     const messageComponent = messageComponentFromInput(input)
     if (messageComponent) addMessageComponent(messageComponent)
     if (isMedia(input)) input.data = await readDataURL(input.data)