proposal: useSort
See original GitHub issueClear and concise description of the problem
Composable reactive sort array.
Suggested solution
// useSort/index.ts
import { computed } from '@vue/reactivity'
import type { MaybeRef } from '@vueuse/shared'
import { unref } from 'vue-demi'
export type UseSortCompareFn<T> = (a: T, b: T) => number
export type UseSortFn<T> = (arr: T[], compareFn: UseSortCompareFn<T>) => T[]
const defaultCompare: UseSortCompareFn<number> = (a, b) => a - b
export interface UseSortOptions<T> {
compareFn?: UseSortCompareFn<T>
}
export function useSort<T>(arr: MaybeRef<T[]>, sortFn: UseSortFn<T>, options: UseSortOptions<T> = {}) {
const { compareFn = defaultCompare } = options
return computed(() => sortFn(unref(arr), compareFn as UseSortCompareFn<T>))
}
// useQuickSort/index.ts
import type { MaybeRef } from '@vueuse/shared'
import type { UseSortCompareFn, UseSortOptions } from '../useSort'
import { useSort } from '../useSort'
export function quickSort<T>(arr: T[], compareFn: UseSortCompareFn<T>): T[] {
// sorted
if (arr.length <= 1) return arr
const pivot = arr[0]
const centerArr: T[] = [pivot]
const left: T[] = []
const right: T[] = []
for (let i = 1; i < arr.length; i++) {
const element = arr[i]
const compare = compareFn(element, pivot)
if (compare === 0)
centerArr.push(element)
else if (compare < 0)
left.push(element)
else
right.push(element)
}
return quickSort(left, compareFn).concat(centerArr, quickSort(right, compareFn))
}
export function useQuickSort<T>(arr: MaybeRef<T[]>, options: UseSortOptions<T> = {}) {
return useSort(arr, quickSort, options)
}
Alternative
No response
Additional context
No response
Validations
- Follow our Code of Conduct
- Read the Contributing Guidelines.
- Read the docs.
- Check that there isn’t already an issue that request the same feature to avoid creating a duplicate.
Issue Analytics
- State:
- Created a year ago
- Reactions:1
- Comments:5 (4 by maintainers)
Top Results From Across the Web
proposal: useSort · Issue #1464 · vueuse/vueuse · GitHub
Clear and concise description of the problem Composable reactive sort array. Suggested solution // useSort/index.ts import { computed } from ...
Read more >Build a Composable Sorting Control with Custom React Hooks
The React.useEffect built-in hook performs the actual sorting of the data array and updates the useSort hook's internal state value whenever any ...
Read more >Roles on Sort Titles - Mallard » Proposals »
For example, you can use sort titles to sort without leading articles such as “an” and “the”. Another type of informational title is...
Read more >how to use sort using abap objects - SAP Community
i am using the class cl_salv_table to display my ALV. now on my selection screen i have 3 radio buttons,according to the radiobutton...
Read more >Workshop Recording: Creating an Oustanding Proposal | In this ...
In this online workshop, participants explored best practices for how to craft a competitive grant proposal. Anyone considering applying for a grant...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Sure but the current implementation supports providing a custom algorithm in
useSort
as the second parameter. Seems unlikely that we would end up providing the 40+ different algorithms. I think providing the base function along with a few common sorting algorithms is the best option.This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.