fix: list sort preferences (#6731)

Fixes #6617

Sets preferences when list sort is set. Uses defaultSort when defined in
config and preferences are not set.

Author: JarrodMFlesch

packages/next/src/views/List/index.tsx

@@ -97,7 +97,7 @@ export const ListView: React.FC<AdminViewProps> = async ({
     const sort =
       query?.sort && typeof query.sort === 'string'
         ? query.sort
-        : listPreferences?.sort || undefined
+        : listPreferences?.sort || collectionConfig.defaultSort || undefined
 
     const data = await payload.find({
       collection: collectionSlug,

packages/ui/src/elements/SortColumn/index.tsx

@@ -1,6 +1,5 @@
 'use client'
 // TODO: abstract the `next/navigation` dependency out from this component
-import { useRouter } from 'next/navigation.js'
 import React, { useCallback } from 'react'
 
 export type SortColumnProps = {
@@ -13,6 +12,7 @@ export type SortColumnProps = {
 import type { FieldBase } from 'payload/types'
 
 import { Chevron } from '../../icons/Chevron/index.js'
+import { useListQuery } from '../../providers/ListQuery/index.js'
 import { useSearchParams } from '../../providers/SearchParams/index.js'
 import { useTranslation } from '../../providers/Translation/index.js'
 import './index.scss'
@@ -21,8 +21,8 @@ const baseClass = 'sort-column'
 
 export const SortColumn: React.FC<SortColumnProps> = (props) => {
   const { name, Label, disable = false, label } = props
-  const { searchParams, stringifyParams } = useSearchParams()
-  const router = useRouter()
+  const { searchParams } = useSearchParams()
+  const { refineListData } = useListQuery()
   const { t } = useTranslation()
 
   const { sort } = searchParams
@@ -38,16 +38,11 @@ export const SortColumn: React.FC<SortColumnProps> = (props) => {
 
   const setSort = useCallback(
     (newSort) => {
-      router.replace(
-        stringifyParams({
-          params: {
-            sort: newSort,
-          },
-          replace: true,
-        }),
-      )
+      refineListData({
+        sort: newSort,
+      })
     },
-    [router, stringifyParams],
+    [refineListData],
   )
 
   return (

packages/ui/src/providers/ListQuery/index.tsx

@@ -35,6 +35,7 @@ export type ListQueryContext = Handlers & {
   data: PaginatedDocs
   defaultLimit?: number
   defaultSort?: string
+  refineListData: (args: RefineOverrides) => void
 }
 
 const Context = createContext({} as ListQueryContext)
@@ -176,6 +177,7 @@ export const ListQueryProvider: React.FC<ListQueryProps> = ({
         handleSearchChange,
         handleSortChange,
         handleWhereChange,
+        refineListData,
       }}
     >
       {children}