@webitel/ui-datalist 1.1.58 → 1.1.59

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webitel/ui-datalist",
-	"version": "1.1.58",
+	"version": "1.1.59",
 	"description": "Toolkit for building data lists in webitel ui system",
 	"scripts": {
 		"build:types": "vue-tsc -b tsconfig.build.json",

package/src/modules/card/composables/useCardAnyFieldEditedWatcher.ts

@@ -1,6 +1,10 @@
-import { ref, watch } from 'vue';
+import { type Ref, ref, watch } from 'vue';
 
-export const useCardAnyFieldEditedWatcher = ({ value }) => {
+export const useCardAnyFieldEditedWatcher = ({
+	value,
+}: {
+	value: Ref<object>;
+}) => {
 	const isAnyFieldEdited = ref(false);
 
 	let prevValue: object;

package/src/modules/card/composables/useCardComponent.ts

@@ -10,7 +10,10 @@ import { useCardSaveAction } from './useCardSaveAction';
 import { useCardValidation } from './useCardValidation';
 import { useItemCardSaveText } from './useItemCardSaveText';
 
-export const useCardComponent = <CardEntity>({
+export const useCardComponent = <
+	// biome-ignore lint/suspicious/noExplicitAny: matches RegleSchema's own state constraint
+	CardEntity extends Record<string, any>,
+>({
 	useCardStore,
 	onLoadErrorHandler,
 	manualSetup = false,

package/src/modules/card/composables/useCardSaveAction.ts

@@ -8,6 +8,8 @@ export const useCardSaveAction = <CardEntity>({
 	saveItem: (data: CardEntity) => Promise<unknown /* coz doesnt matter */>;
 }) => {
 	const save = async () => {
+		if (!validate) return;
+
 		const { valid, data } = await validate();
 		if (!valid) return;
 

package/src/modules/card/composables/useCardValidation.ts

@@ -1,7 +1,12 @@
+import type { RegleShortcutDefinition } from '@regle/core';
 import type { RegleSchema } from '@regle/schemas';
 import { computed, type Ref } from 'vue';
 
-export const useCardValidation = <TState, TSchema = {}>({
+export const useCardValidation = <
+	// biome-ignore lint/suspicious/noExplicitAny: matches RegleSchema's own state constraint
+	TState extends Record<string, any>,
+	TSchema extends RegleShortcutDefinition = {},
+>({
 	validationSchema,
 }: {
 	validationSchema: Ref<RegleSchema<TState, TSchema>>;

package/src/modules/card/composables/useNestedCardComponent.ts

@@ -22,7 +22,10 @@ import { useCardRouting } from './useCardRouting';
  * });
  * ```
  */
-export const useNestedCardComponent = <CardEntity>({
+export const useNestedCardComponent = <
+	// biome-ignore lint/suspicious/noExplicitAny: matches RegleSchema's own state constraint
+	CardEntity extends Record<string, any>,
+>({
 	useCardStore,
 	onLoadErrorHandler,
 	routeParamName,

package/src/modules/filter-presets/api/PresetQuery.ts

@@ -12,6 +12,7 @@ import applyTransform, {
 	snakeToCamel,
 	starToSearch,
 } from '@webitel/ui-sdk/api/transformers/index';
+import type { Id } from '@webitel/ui-sdk/api/types/ApiModule';
 import {
 	type EngineCreatePresetQueryRequest,
 	type EnginePresetQuery,
@@ -39,13 +40,17 @@ type GetPresetListRequestConfig = {
 	};
 };
 
-const getPresetList = async (params, config?: GetPresetListRequestConfig) => {
+const getPresetList = async (
+	params?: unknown,
+	config?: GetPresetListRequestConfig,
+) => {
 	const useStarToSearch = config?.transformers?.useStarToSearch ?? true;
 
 	const { page, size, search, sort, fields, presetNamespace, id } =
 		applyTransform(params, [
 			merge(getDefaultGetParams()),
-			(params) => (useStarToSearch ? starToSearch('search')(params) : params),
+			(params: object) =>
+				useStarToSearch ? starToSearch('search')(params) : params,
 		]);
 	try {
 		const response = await service.searchPresetQuery(
@@ -79,9 +84,9 @@ const getPresetList = async (params, config?: GetPresetListRequestConfig) => {
 	}
 };
 
-const getPreset = async ({ id }) => {
+const getPreset = async ({ id }: { id?: Id | null }) => {
 	try {
-		const response = await service.readPresetQuery(id);
+		const response = await service.readPresetQuery(Number(id));
 		return applyTransform(response.data, [
 			snakeToCamel(),
 		]);
@@ -101,7 +106,12 @@ const addPreset = async ({
 }): Promise<EnginePresetQuery> => {
 	const item = applyTransform(preset, [
 		camelToSnake(),
-		(item) => {
+		(item: {
+			preset: {
+				namespace: string;
+			};
+			section: string;
+		}) => {
 			item.preset.namespace = namespace;
 			item.section = namespace;
 			return item;
@@ -119,10 +129,23 @@ const addPreset = async ({
 	}
 };
 
-const updatePreset = async ({ item: itemInstance, id, namespace }) => {
+const updatePreset = async ({
+	item: itemInstance,
+	id,
+	namespace,
+}: {
+	item: EngineCreatePresetQueryRequest;
+	id: number;
+	namespace: string;
+}) => {
 	const item = applyTransform(itemInstance, [
 		camelToSnake(),
-		(item) => {
+		(item: {
+			preset: {
+				namespace: string;
+			};
+			section: string;
+		}) => {
 			item.preset.namespace = namespace;
 			item.section = namespace;
 			return item;
@@ -140,9 +163,9 @@ const updatePreset = async ({ item: itemInstance, id, namespace }) => {
 	}
 };
 
-const deletePreset = async ({ id }) => {
+const deletePreset = async ({ id }: { id?: Id | null }) => {
 	try {
-		const response = await service.deletePresetQuery(id);
+		const response = await service.deletePresetQuery(Number(id));
 		return applyTransform(response.data, []);
 	} catch (err) {
 		throw applyTransform(err, [

package/src/modules/filter-presets/components/apply-preset/apply-preset-action.vue

@@ -81,6 +81,7 @@ import {
 import { useEventBus } from '@webitel/ui-sdk/composables';
 import { IconAction } from '@webitel/ui-sdk/enums';
 import { useTableEmpty } from '@webitel/ui-sdk/modules/TableComponentModule/composables/useTableEmpty';
+import type { AxiosError } from 'axios';
 import { type StoreGeneric, storeToRefs } from 'pinia';
 import { computed, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
@@ -88,6 +89,7 @@ import { EnginePresetQuery } from 'webitel-sdk';
 
 import { AnyFilterConfig } from '../../../filters/modules/filterConfig/classes/FilterConfig';
 import PresetQueryAPI from '../../api/PresetQuery';
+import type { PresetSnapshot } from '../../types/PresetSnapshot';
 import PresetPreview from './preset-preview.vue';
 
 const props = defineProps<{
@@ -206,14 +208,22 @@ const applySelectedPreset = () => {
 	showPresetsList.value = false;
 };
 
-const updatePreset = async ({ preset, onSuccess, onFailure }) => {
+const updatePreset = async ({
+	preset,
+	onSuccess,
+	onFailure,
+}: {
+	preset: EnginePresetQuery;
+	onSuccess: () => void;
+	onFailure: (err: AxiosError) => void;
+}) => {
 	try {
 		await PresetQueryAPI.update({
 			item: {
 				...preset,
 			},
-			id: preset.id,
-			namespace: preset.preset?.namespace,
+			id: Number(preset.id),
+			namespace: (preset.preset as PresetSnapshot | undefined)?.namespace ?? '',
 		});
 		eventBus?.$emit('notification', {
 			type: 'success',
@@ -224,7 +234,7 @@ const updatePreset = async ({ preset, onSuccess, onFailure }) => {
 		onSuccess();
 		return loadDataList();
 	} catch (err) {
-		onFailure(err);
+		onFailure(err as AxiosError);
 		throw err;
 	}
 };
@@ -233,7 +243,7 @@ const deletePreset = async (preset: EnginePresetQuery) => {
 	await deleteEls([
 		preset,
 	]);
-	eventBus.$emit('notification', {
+	eventBus?.$emit('notification', {
 		type: 'success',
 		text: t('systemNotifications.success.delete', {
 			entity: t('webitelUI.filters.presets.preset'),

package/src/modules/filter-presets/components/apply-preset/preset-preview.vue

@@ -91,6 +91,7 @@ import { EnginePresetQuery } from 'webitel-sdk';
 
 import { createFiltersManager } from '../../../filters';
 import { AnyFilterConfig } from '../../../filters/modules/filterConfig/classes/FilterConfig';
+import type { PresetSnapshot } from '../../types/PresetSnapshot';
 import PresetDescriptionField from '../_shared/input-fields/preset-description-field.vue';
 import PresetNameField from '../_shared/input-fields/preset-name-field.vue';
 import PresetFiltersPreview from '../_shared/preset-filters-preview.vue';
@@ -123,7 +124,9 @@ const emit = defineEmits<{
 const filtersManager = computed(() => {
 	const filtersManager = createFiltersManager();
 
-	const snapshot = props.preset?.preset?.['filtersManager.toString'];
+	const snapshot = (props.preset?.preset as PresetSnapshot | undefined)?.[
+		'filtersManager.toString'
+	];
 	if (snapshot) {
 		filtersManager.fromString(snapshot);
 	}
@@ -147,8 +150,8 @@ const editDraft = ref({
 
 const fillDraft = () => {
 	editDraft.value = {
-		name: props.preset.name,
-		description: props.preset.description,
+		name: props.preset.name ?? '',
+		description: props.preset.description ?? '',
 	};
 };
 
@@ -170,7 +173,7 @@ const v$ = useVuelidate(
 );
 v$.value.$touch();
 
-const startEdit = ({ open: openExpansion }) => {
+const startEdit = ({ open: openExpansion }: { open: () => void }) => {
 	openExpansion();
 	editMode.value = true;
 };

package/src/modules/filter-presets/components/save-preset/save-preset-action.vue

@@ -107,7 +107,7 @@ const presetToOverwriteWith: Ref<EnginePresetQuery | null> = ref(null);
 
 const handlePresetSubmit = async (
 	preset: EnginePresetQuery,
-	{ onCompleted }: SubmitConfig,
+	{ onCompleted }: SubmitConfig = {},
 ) => {
 	try {
 		await addPreset({
@@ -124,7 +124,15 @@ const handlePresetSubmit = async (
 
 		showSaveForm.value = false;
 	} catch (err) {
-		if (err?.status === 409) {
+		if (
+			(
+				err as
+					| {
+							status?: number;
+					  }
+					| undefined
+			)?.status === 409
+		) {
 			presetToOverwriteWith.value = preset;
 		}
 		throw err;
@@ -139,7 +147,7 @@ const handlePresetOverwriteConfirmation = async ({
 	try {
 		const { items } = await getPresetList(
 			{
-				search: presetToOverwriteWith.value.name,
+				search: presetToOverwriteWith.value?.name,
 				presetNamespace: props.namespace,
 			},
 			{

package/src/modules/filter-presets/types/PresetSnapshot.ts

@@ -0,0 +1,6 @@
+/** payload stored in `EnginePresetQuery.preset`, typed as `object` by the SDK */
+export interface PresetSnapshot {
+	/** serialized `FiltersManager`, see `IFiltersManager.toString()` */
+	'filtersManager.toString'?: string;
+	namespace?: string;
+}

package/src/modules/filters/classes/Filter.ts

@@ -47,7 +47,7 @@ export interface IFilter {
 
 export class Filter implements IFilter {
 	readonly name: FilterName;
-	label: FilterLabel;
+	label?: FilterLabel;
 	value: FilterValue;
 
 	constructor(

package/src/modules/filters/classes/FiltersManager.ts

@@ -181,17 +181,20 @@ class FiltersManager implements IFiltersManager {
 		const filtersData = this.getFiltersList({
 			include,
 			exclude,
-		}).reduce((acc, { name, label, value }) => {
-			if (isEmpty(value) && value == null) return acc;
+		}).reduce<Record<string, FilterValue | FilterLabel>>(
+			(acc, { name, label, value }) => {
+				if (isEmpty(value) && value == null) return acc;
 
-			acc[filterValueToSnapshotKey(name)] = value;
+				acc[filterValueToSnapshotKey(name)] = value;
 
-			if (label) {
-				acc[filterLabelToSnapshotKey(name)] = label;
-			}
+				if (label) {
+					acc[filterLabelToSnapshotKey(name)] = label;
+				}
 
-			return acc;
-		}, {});
+				return acc;
+			},
+			{},
+		);
 
 		return JSON.stringify(filtersData);
 	}
@@ -203,9 +206,9 @@ class FiltersManager implements IFiltersManager {
     first, make transition object from snapshot,
     because filter should bw always added with value
      */
-		const filtersData: {
-			FilterName: FilterData;
-		} = Object.entries(snapshot).reduce(
+		const filtersData: Record<FilterName, Partial<FilterData>> = Object.entries(
+			snapshot as Record<string, unknown>,
+		).reduce(
 			(filtersAcc, [snapshotKey, snapshotValue]) => {
 				const name = filterNameFromSnapshotKey(snapshotKey);
 				const valueProp = filterValuePropFromSnapshotKey(snapshotKey);
@@ -215,19 +218,23 @@ class FiltersManager implements IFiltersManager {
 					return filtersAcc;
 				}
 
-				if (filtersAcc[name]) {
-					filtersAcc[name][valueProp] = snapshotValue;
+				if (valueProp === 'label') {
+					const label = snapshotValue as FilterLabel;
+					filtersAcc[name] = {
+						...filtersAcc[name],
+						label,
+					};
 				} else {
+					const value = snapshotValue as FilterValue;
 					filtersAcc[name] = {
-						[valueProp]: snapshotValue,
+						...filtersAcc[name],
+						value,
 					};
 				}
 
 				return filtersAcc;
 			},
-			{} as {
-				FilterName: FilterData;
-			},
+			{} as Record<FilterName, Partial<FilterData>>,
 		);
 
 		Object.entries(filtersData).forEach(([name, filterData]) => {
@@ -238,6 +245,7 @@ class FiltersManager implements IFiltersManager {
 				});
 			} else {
 				this.addFilter({
+					value: null,
 					...filterData,
 					name,
 				});

package/src/modules/filters/components/config/dynamic-view/dynamic-filter-config-form.vue

@@ -25,7 +25,7 @@
       }"
     >
       <dynamic-filter-config-form-value-input
-        v-if="filterName"
+        v-if="filterName && selectedFilterConfig"
         :key="filterName"
         :model-value="filterValue"
         :filter-config="selectedFilterConfig"
@@ -131,7 +131,7 @@ const filterConfigOptions = computed(() => {
 		];
 	}
 
-	return props.filterConfigs;
+	return props.filterConfigs ?? [];
 });
 
 const selectedFilterConfig = computed(() => {
@@ -144,11 +144,11 @@ const selectedFilterConfig = computed(() => {
 	});
 });
 
-const onValueChange = (v) => {
+const onValueChange = (v: unknown) => {
 	filterValue.value = v;
 };
 
-const onValueInvalidChange = (v) => {
+const onValueInvalidChange = (v: boolean) => {
 	invalid.value = v;
 };
 
@@ -156,8 +156,8 @@ const valueInputLabelText = computed(() => {
 	return t('webitelUI.filters.filterValue');
 });
 
-const onLabelValueUpdate = (val: string) => {
-	filterLabel.value = val;
+const onLabelValueUpdate = (val?: string) => {
+	filterLabel.value = val ?? '';
 };
 
 const onFilterNameUpdate = (val: string) => {
@@ -174,13 +174,14 @@ const submit = () => {
 	});
 };
 
-if (props.filter) {
+const editedFilter = props.filter;
+if (editedFilter) {
 	watch(
-		props.filter,
+		editedFilter,
 		() => {
-			filterName.value = props.filter.name;
-			filterValue.value = deepcopy(props.filter.value);
-			filterLabel.value = props.filter.label;
+			filterName.value = editedFilter.name;
+			filterValue.value = deepcopy(editedFilter.value);
+			filterLabel.value = editedFilter.label ?? '';
 		},
 		{
 			immediate: true,

package/src/modules/filters/components/config/dynamic-view/dynamic-filter-config-view.vue

@@ -33,7 +33,9 @@ interface Props {
 
 const props = defineProps<Props>();
 
-const popover = ref(null);
+const popover = ref<{
+	hide: () => void;
+} | null>(null);
 
 const hidePopover = () => {
 	popover.value?.hide();

package/src/modules/filters/components/config/static-view/static-filter-field.vue

@@ -16,6 +16,7 @@
 import { isEmpty } from '@webitel/ui-sdk/scripts';
 import { computed } from 'vue';
 
+import type { FilterValue } from '../../../classes/Filter';
 import { StaticFilterEmits, StaticFilterProps } from '../../types/Filter.types';
 
 /* Author @Lera24
@@ -29,8 +30,9 @@ const emit = defineEmits<StaticFilterEmits>();
 
 const filterValue = computed(() => props.filter?.value);
 
-const onValueChange = (value) => {
+const onValueChange = (value: FilterValue) => {
 	if (isEmpty(value) && typeof value !== 'boolean') {
+		if (!props.filter) return;
 		return emit('delete:filter', props.filter);
 	}
 

package/src/modules/filters/components/dynamic-filter-add-action.vue

@@ -55,7 +55,14 @@ const emit = defineEmits<{
 	];
 }>();
 
-const submit = (payload: FilterInitParams, { hide }) => {
+const submit = (
+	payload: FilterInitParams,
+	{
+		hide,
+	}: {
+		hide: () => void;
+	},
+) => {
 	emit('add:filter', payload);
 	hide();
 };

package/src/modules/filters/components/preview/dynamic-filter-preview.vue

@@ -89,7 +89,10 @@ const emit = defineEmits<DynamicFilterEmits>();
 
 const localValue = ref();
 
-const showChipPopover = (event, showPopoverCb: (event) => void) => {
+const showChipPopover = (
+	event: Event,
+	showPopoverCb: (event: Event) => void,
+) => {
 	if (!localValue.value) {
 		fillLocalValue();
 	}
@@ -152,7 +155,14 @@ const isRenderPreview = computed(
 	() => localValue.value === false || localValue.value,
 );
 
-const submit = (filter: FilterInitParams, { hide }) => {
+const submit = (
+	filter: FilterInitParams,
+	{
+		hide,
+	}: {
+		hide: () => void;
+	},
+) => {
 	emit('update:filter', filter);
 	hide();
 };

package/src/modules/filters/components/search-bar/dynamic-filter-search.vue

@@ -52,7 +52,7 @@ const { t } = useI18n();
 
 const localSearchValue = ref('');
 
-const hasFilter = (filterName = searchMode.value) => {
+const hasFilter = (filterName = searchMode.value ?? '') => {
 	return props.filtersManager.filters.has(filterName);
 };
 const addFilter = (filterInitParams: FilterInitParams) => {
@@ -80,7 +80,7 @@ const hasSearchModes = computed(() => {
 
 const currentSearchName = computed(() => {
 	if (hasSearchModes.value) {
-		return searchMode.value;
+		return searchMode.value ?? defaultSearchName;
 	}
 
 	return defaultSearchName;
@@ -96,7 +96,7 @@ const inputValue = (value: string) => {
 			});
 		}
 		if (hasSearchModes.value) {
-			searchMode.value = props.searchModeOptions[0].value;
+			searchMode.value = props.searchModeOptions?.[0]?.value;
 		}
 	}
 };
@@ -117,25 +117,26 @@ const handleSearch = (value = localSearchValue.value) => {
 	}
 };
 
-const updateSearchMode = (
-	nextSearchMode: DynamicFilterSearchSearchModeOption,
-) => {
+const updateSearchMode = (nextSearchMode: string | object) => {
 	if (hasFilter(currentSearchName.value)) {
 		deleteFilter({
 			name: currentSearchName.value,
 		});
 	}
 	localSearchValue.value = '';
-	searchMode.value = nextSearchMode.value;
+	searchMode.value =
+		typeof nextSearchMode === 'string'
+			? nextSearchMode
+			: (nextSearchMode as DynamicFilterSearchSearchModeOption).value;
 };
 
 const initialize = () => {
 	if (!hasSearchModes.value) return;
 
 	if (!searchMode.value) {
-		searchMode.value = props.searchModeOptions[0].value;
+		searchMode.value = props.searchModeOptions?.[0]?.value;
 	}
-	restoreLocalSearchValue(searchMode.value);
+	restoreLocalSearchValue(searchMode.value ?? defaultSearchName);
 };
 /**
  * @description

package/src/modules/filters/components/table-filters-panel.vue

@@ -10,7 +10,7 @@
           :filter-config="filterConfig"
           @add:filter="emit('filter:add', $event)"
           @update:filter="emit('filter:update', $event)"
-          @delete:filter="emit('filter:delete', filter)"
+          @delete:filter="filter && emit('filter:delete', filter)"
         />
       </div>
 
@@ -36,8 +36,9 @@
     <template #actions>
       <template v-if="enablePresets">
         <apply-preset-action
+          v-if="presetStore"
           :filter-configs="filterConfigs"
-          :namespace="props.presetNamespace"
+          :namespace="props.presetNamespace ?? ''"
           :presets-store="presetStore"
           @apply="emit('preset:apply', $event)"
         />
@@ -46,7 +47,7 @@
           :filter-configs="filterConfigs"
           :filters-included="filtersIncluded"
           :filters-manager="props.filtersManager"
-          :namespace="props.presetNamespace"
+          :namespace="props.presetNamespace ?? ''"
         />
       </template>
 

package/src/modules/filters/components/types/Filter.types.ts

@@ -27,7 +27,10 @@ export interface FilterProps {
 	filterConfig: AnyFilterConfig;
 }
 
-export interface StaticFilterProps extends FilterProps {}
+/** the static view lists every config, so the filter is absent until applied */
+export interface StaticFilterProps extends Omit<FilterProps, 'filter'> {
+	filter?: IFilter;
+}
 
 export interface DynamicFilterProps extends FilterProps {
 	readonly?: boolean;

package/src/modules/filters/composables/useFilterConfigsToolkit.ts

@@ -32,10 +32,11 @@ export type FilterConfigToolkit = {
 			filter: IFilter;
 		}>
 	>;
+	/** every config is listed, so `filter` is absent until a value is applied */
 	staticViewFilterToFilterConfigMappings: ComputedRef<
 		Array<{
 			filterConfig: BaseFilterConfig;
-			filter: IFilter;
+			filter?: IFilter;
 		}>
 	>;
 };

package/src/modules/filters/createTableFiltersStore.ts

@@ -11,7 +11,7 @@ import {
 } from './classes/FiltersManager';
 
 export const tableFiltersStoreBody = (
-	namespace,
+	namespace: string,
 	config?: {
 		filtersManagerConfig?: FiltersManagerConfig;
 	},

package/src/modules/filters/modules/filterConfig/classes/FilterConfig.ts

@@ -31,8 +31,11 @@ export type FilterConfigSearchMethodParams = [
 	/**
 	 * @description
 	 * any request-related data
+	 *
+	 * `any`, not `unknown`, so each filter narrows it in its own `searchRecords`
 	 */
-	unknown,
+	// biome-ignore lint/suspicious/noExplicitAny: see above
+	any,
 	/**
 	 * @description
 	 * filter-related data