feat(bundle): reduce size (WH-1098) (#204)

* feat(bundle): reduce size (WH-1098) * feat(utils): add capitalize and debounce functions (WH-1098) * feat: use alias (WH-1098) * feat: use alias (WH-1098)
weka · Nov 18, 2024 · a40c777 · a40c777
1 parent a78e490
commit a40c777
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 8 deletions.
diff --git a/lib/components/Table/hooks/usePageSize.ts b/lib/components/Table/hooks/usePageSize.ts
@@ -1,7 +1,7 @@
 import { useEffect } from 'react'
+import Utils from 'utils'
 import { ExtendedTable } from '../types'
 import { ROWS_PER_PAGE_RATIO, ROW_HEIGHT } from '../tableConsts'
-import _ from 'lodash'
 
 function usePageSize<Data>({
   table,
@@ -27,7 +27,7 @@ function usePageSize<Data>({
       return
     }
 
-    const calcNumberOfRows = _.debounce(() => {
+    const calcNumberOfRows = Utils.debounce(() => {
       const tableHeight = tableRef.current?.clientHeight
       if (tableHeight) {
         table.setPageSize(tableHeight / (ROW_HEIGHT / ROWS_PER_PAGE_RATIO))

diff --git a/lib/components/TextEditor/components/TextViewerLite/hooks/useScrolledX.ts b/lib/components/TextEditor/components/TextViewerLite/hooks/useScrolledX.ts
@@ -1,11 +1,11 @@
-import { debounce } from 'lodash'
 import { useEffect, useState } from 'react'
+import Utils from 'utils'
 
 function useScrolledX({ element }: { element: HTMLDivElement | null }) {
   const [isScrolledX, setScrolledX] = useState<boolean>(false)
 
   useEffect(() => {
-    const handleScroll = debounce(() => {
+    const handleScroll = Utils.debounce(() => {
       if (element && element.scrollLeft > 0) {
         setScrolledX(true)
       } else {

diff --git a/lib/components/ToasterDialog/ToasterDialog.tsx b/lib/components/ToasterDialog/ToasterDialog.tsx
@@ -1,8 +1,7 @@
 import React, { useEffect } from 'react'
 import clsx from 'clsx'
-import { capitalize } from 'lodash'
 import { DIALOG_STATUSES, TOASTER_DIALOG } from 'consts'
-import { useDialog } from '../../context'
+import { useDialog } from 'context'
 import Utils from 'utils'
 import { Approve, Warning } from 'svgs'
 
@@ -40,7 +39,7 @@ function ToasterDialog() {
             })}
           >
             {status === DIALOG_STATUSES.SUCCESS ? <Approve /> : <Warning />}
-            {capitalize(status)}
+            {Utils.capitalize(status)}
           </div>
         ),
         body: message,

diff --git a/lib/utils.tsx b/lib/utils.tsx
@@ -389,6 +389,26 @@ const utils = {
       }
     })
     return isPast ? `${stringToShow} ago` : `in ${stringToShow}`
+  },
+
+  capitalize: (str: string) => {
+    const separator = ', '
+
+    return str
+      .split(separator)
+      .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+      .join(separator)
+  },
+
+  debounce: (callback: any, wait = 0) => {
+    let timer: ReturnType<typeof setTimeout> | -1 = -1
+
+    return (...args) => {
+      clearTimeout(timer)
+      timer = setTimeout(() => {
+        callback.apply(this, args)
+      }, wait)
+    }
   }
 }
 

diff --git a/package.json b/package.json
@@ -44,7 +44,6 @@
     "check-password-strength": "^2.0.7",
     "clsx": "^2.0.0",
     "copy-to-clipboard": "^3.3.3",
-    "lodash": "^4.17.21",
     "luxon": "^3.4.4",
     "react-ace": "^12.0.0",
     "react-router-dom": "^6.25.0",