Helper hook to extract key or key-value pairs from an array of objects.

use-pluck.ts

import { useMemo } from 'react';

export type UsePluckKeys<T, K extends keyof T> = T[K][];

export type UsePluckKeyValues<T, K extends keyof T, V extends keyof T> = Record<T[K] & PropertyKey, T[V]>;

export type UsePluck<T, K extends keyof T, V extends keyof T> = UsePluckKeys<T, K> | UsePluckKeyValues<T, K, V>;

export function usePluck<T, K extends keyof T>(options: T[], key: K): UsePluckKeys<T, K>;

export function usePluck<T, K extends keyof T, V extends keyof T>(
    options: T[],
    key: K,
    value: V,
): UsePluckKeyValues<T, K, V>;

export function usePluck<T, K extends keyof T, V extends keyof T>(options: T[], key: K, value?: V) {
    return useMemo<UsePluck<T, K, V>>(() => {
        if (value === undefined) {
            return options.map(option => option[key]) as UsePluckKeys<T, K>;
        }

        return Object.fromEntries(options.map(option => [option[key], option[value]])) as UsePluckKeyValues<T, K, V>;
    }, [options, key, value]);
}