71 lines
1.9 KiB
TypeScript
71 lines
1.9 KiB
TypeScript
import * as React from "bloatless-react";
|
|
|
|
import {
|
|
StringEntryObject,
|
|
collectObjectValuesForKey,
|
|
localeCompare,
|
|
} from "../../Model/Utility/utility";
|
|
|
|
export function PropertyValueList<T>(
|
|
propertyKey: string,
|
|
stringEntryObjectConverter: (object: T) => StringEntryObject,
|
|
objects: React.ListState<T> | React.MapState<T>,
|
|
viewBuilder: (
|
|
keys: React.ListState<string>,
|
|
sortedKeys: React.State<string[]>
|
|
) => HTMLElement
|
|
) {
|
|
const propertyValues: React.ListState<string> = new React.ListState();
|
|
const sortedPropertyValues: React.State<string[]> = createSortedPropertyValueState(propertyValues)
|
|
objects.subscribe(() => {
|
|
collectPropertyValuesToState(
|
|
propertyKey,
|
|
stringEntryObjectConverter,
|
|
objects,
|
|
propertyValues
|
|
);
|
|
});
|
|
|
|
return viewBuilder(propertyValues, sortedPropertyValues);
|
|
}
|
|
|
|
export function collectPropertyValuesToState<T>(
|
|
propertyKey: string,
|
|
stringEntryObjectConverter: (object: T) => StringEntryObject,
|
|
objects: React.ListState<T> | React.MapState<T>,
|
|
propertyValues: React.ListState<string>
|
|
) {
|
|
const values: string[] = collectObjectValuesForKey(
|
|
propertyKey,
|
|
stringEntryObjectConverter,
|
|
[...objects.value.values()]
|
|
);
|
|
for (const existingValue of values) {
|
|
if (propertyValues.value.has(existingValue)) continue;
|
|
propertyValues.add(existingValue);
|
|
}
|
|
|
|
for (const displayedValue of propertyValues.value.values()) {
|
|
if (values.includes(displayedValue) == false) {
|
|
propertyValues.remove(displayedValue);
|
|
}
|
|
}
|
|
}
|
|
|
|
export function createSortedPropertyValueState(
|
|
propertyValues: React.ListState<string>
|
|
): React.State<string[]> {
|
|
return React.createProxyState([propertyValues], () =>
|
|
[...propertyValues.value.values()].sort(localeCompare)
|
|
);
|
|
}
|
|
|
|
export function createPropertyValueIndexState(
|
|
sortedKeys: React.State<string[]>,
|
|
key: string
|
|
): React.State<number> {
|
|
return React.createProxyState([sortedKeys], () =>
|
|
sortedKeys.value.indexOf(key)
|
|
);
|
|
}
|