Skip to content

Conversation

@matheusps
Copy link
Contributor

Summary

This PR addresses three bugs across the codebase:

  1. Pagination useMemo Missing Dependency: The useMemo hook in the Pagination component calculating firstPosition and lastPosition was missing size from its dependency array, leading to incorrect pagination labels when size changed.
  2. Filter Provider useEffect Missing Dependencies: The useEffect hook in FilterProvider had an empty dependency array, preventing proper synchronization between selectStore and filterStore if they changed after initial mount.
  3. flattenObject Drops Null Values: The flattenObject utility incorrectly dropped null values due to typeof null === 'object', causing data loss when flattening objects containing null.

Examples

Bug 1: Pagination useMemo Missing Dependency

--- a/packages/shoreline/src/components/pagination/pagination.tsx
+++ b/packages/shoreline/src/components/pagination/pagination.tsx
@@ -41,7 +41,7 @@ export const Pagination = forwardRef<HTMLDivElement, PaginationProps>(
       const lastPosition = Math.min(page * size, total)
 
       return { firstPosition, lastPosition }
-    }, [page, total])
+    }, [page, total, size])
 
     const isSinglePage = total <= size
     const paginationLabel = isSinglePage

Bug 2: Filter Provider useEffect Missing Dependencies

--- a/packages/shoreline/src/components/filter/filter-provider.tsx
+++ b/packages/shoreline/src/components/filter/filter-provider.tsx
@@ -45,9 +45,12 @@ export function FilterProvider(props: FilterProviderProps) {
     defaultValue,
   })
 
-  useEffect(function syncState() {
-    selectStore.setValue(filterStore.getState().value)
-  }, [])
+  useEffect(
+    function syncState() {
+      selectStore.setValue(filterStore.getState().value)
+    },
+    [selectStore, filterStore]
+  )
 
   const searchable = !!searchValue || !!setSearchValue || !!defaultSearchValue

Bug 3: flattenObject Drops Null Values

--- a/packages/utils/src/flatten-object.ts
+++ b/packages/utils/src/flatten-object.ts
@@ -8,7 +8,11 @@ export function flattenObject<T extends AnyObject>(
   const result: Dict = {}
 
   for (const i in object) {
-    if (typeof object[i] === 'object' && !Array.isArray(object[i])) {
+    if (
+      typeof object[i] === 'object' &&
+      object[i] !== null &&
+      !Array.isArray(object[i])
+    ) {
       const temp = flattenObject(object[i], joinString, defaultString)
 
       for (const j in temp) {

A new test case was added for flattenObject to ensure null values are preserved:

  it('should preserve null values', () => {
    const result = flattenObject({
      a: {
        b: null,
        c: 'value',
      },
    })

    const expectation = {
      'a-b': null,
      'a-c': 'value',
    }

    expect(result).toStrictEqual(expectation)
  })

Open in Cursor Open in Web

Co-authored-by: matheus.procopio <matheus.procopio@vtex.com>
@cursor
Copy link

cursor bot commented Dec 21, 2025

Cursor Agent can help with this pull request. Just @cursor in comments and I'll start working on changes in this branch.
Learn more about Cursor Agents

@vercel
Copy link
Contributor

vercel bot commented Dec 21, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Review Updated (UTC)
shoreline-docs Ignored Ignored Dec 21, 2025 2:26pm

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: No status

Development

Successfully merging this pull request may close these issues.

3 participants