Home / Function/ useSyncTableEditorStateFromLocalStorageWithUrl() — supabase Function Reference

useSyncTableEditorStateFromLocalStorageWithUrl() — supabase Function Reference

Architecture documentation for the useSyncTableEditorStateFromLocalStorageWithUrl() function in SupabaseGrid.utils.ts from the supabase codebase.

Function typescript ContentManagement MediaManagement calls 2

Entity Profile

Dependency Diagram

graph TD
  06fed184_bc03_4bd2_c7a0_f0014cc212db["useSyncTableEditorStateFromLocalStorageWithUrl()"]
  2ca7ebcd_0426_2b3e_eb58_c610c6f9902b["getLatestParams()"]
  06fed184_bc03_4bd2_c7a0_f0014cc212db -->|calls| 2ca7ebcd_0426_2b3e_eb58_c610c6f9902b
  78c58e43_3dab_ca8a_fc03_a42b9cf3adfe["saveTableEditorStateToLocalStorage()"]
  06fed184_bc03_4bd2_c7a0_f0014cc212db -->|calls| 78c58e43_3dab_ca8a_fc03_a42b9cf3adfe
  style 06fed184_bc03_4bd2_c7a0_f0014cc212db fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/studio/components/grid/SupabaseGrid.utils.ts lines 225–265

export function useSyncTableEditorStateFromLocalStorageWithUrl({
  projectRef,
  table,
}: {
  projectRef: string | undefined
  table: Entity | undefined
}) {
  // Warning: nuxt url state often fails to update to changes to URL
  const [, updateUrlParams] = useQueryStates(
    {
      sort: parseAsNativeArrayOf(parseAsString),
      filter: parseAsNativeArrayOf(parseAsString),
    },
    {
      history: 'replace',
    }
  )
  // Use nextjs useSearchParams to get the latest URL params
  const searchParams = useSearchParams()
  const urlParams = useMemo(() => {
    const sort = searchParams.getAll('sort')
    const filter = searchParams.getAll('filter')
    return { sort, filter }
  }, [searchParams])

  useEffect(() => {
    if (!projectRef || !table) {
      return
    }

    // `urlParams` from `useQueryStates` can be stale so always get the latest from the URL
    const latestUrlParams = getLatestParams()

    saveTableEditorStateToLocalStorage({
      projectRef,
      tableId: table.id,
      sorts: latestUrlParams.sort,
      filters: latestUrlParams.filter,
    })
  }, [urlParams, table, projectRef])
}

Domain

Subdomains

Calls

Source

Frequently Asked Questions

What does useSyncTableEditorStateFromLocalStorageWithUrl() do?
useSyncTableEditorStateFromLocalStorageWithUrl() is a function in the supabase codebase.
What does useSyncTableEditorStateFromLocalStorageWithUrl() call?
useSyncTableEditorStateFromLocalStorageWithUrl() calls 2 function(s): getLatestParams, saveTableEditorStateToLocalStorage.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free