File "utils.ts"

Full Path: /home/warrior1/public_html/plugins/woocommerce/packages/woocommerce-blocks/assets/js/blocks/attribute-filter/utils.ts
File size: 2.83 KB
MIME-type: text/x-java
Charset: utf-8

/**
 * External dependencies
 */
import { addQueryArgs, removeQueryArgs } from '@wordpress/url';
import { QueryArgs } from '@wordpress/url/build-types/get-query-args';
import {
	getUrlParameter,
	PREFIX_QUERY_ARG_FILTER_TYPE,
	PREFIX_QUERY_ARG_QUERY_TYPE,
} from '@woocommerce/utils';
import { AttributeObject } from '@woocommerce/types';

interface Param {
	attribute: string;
	operator: string;
	slug: Array< string >;
}

export function generateUniqueId() {
	return Math.floor( Math.random() * Date.now() );
}

export const parseTaxonomyToGenerateURL = ( taxonomy: string ) =>
	taxonomy.replace( 'pa_', '' );

export const formatParams = ( url: string, params: Array< Param > = [] ) => {
	const paramObject: Record< string, string > = {};

	params.forEach( ( param ) => {
		const { attribute, slug, operator } = param;

		// Custom filters are prefix with `pa_` so we need to remove this.
		const name = parseTaxonomyToGenerateURL( attribute );
		const values = slug.join( ',' );
		const queryType = `${ PREFIX_QUERY_ARG_QUERY_TYPE }${ name }`;
		const type = operator === 'in' ? 'or' : 'and';

		// The URL parameter requires the prefix filter_ with the attribute name.
		paramObject[ `${ PREFIX_QUERY_ARG_FILTER_TYPE }${ name }` ] = values;
		paramObject[ queryType ] = type;
	} );

	// Clean the URL before we add our new query parameters to it.
	const cleanUrl = removeQueryArgs( url, ...Object.keys( paramObject ) );

	return addQueryArgs( cleanUrl, paramObject );
};

export const areAllFiltersRemoved = ( {
	currentCheckedFilters,
	hasSetFilterDefaultsFromUrl,
}: {
	currentCheckedFilters: Array< string >;
	hasSetFilterDefaultsFromUrl: boolean;
} ) => hasSetFilterDefaultsFromUrl && currentCheckedFilters.length === 0;

export const getActiveFilters = (
	attributeObject: AttributeObject | undefined
) => {
	if ( attributeObject ) {
		const defaultAttributeParam = getUrlParameter(
			`filter_${ attributeObject.name }`
		);
		const defaultCheckedValue =
			typeof defaultAttributeParam === 'string'
				? defaultAttributeParam.split( ',' )
				: [];

		return defaultCheckedValue;
	}

	return [];
};

export const isQueryArgsEqual = (
	currentQueryArgs: QueryArgs,
	newQueryArgs: QueryArgs
) => {
	// The user can add same two filter blocks for the same attribute.
	// We removed the query type from the check to avoid refresh loop.
	const filteredNewQueryArgs = Object.entries( newQueryArgs ).reduce(
		( acc, [ key, value ] ) => {
			return key.includes( 'query_type' )
				? acc
				: {
						...acc,
						[ key ]: value,
				  };
		},
		{}
	);

	return Object.entries( filteredNewQueryArgs ).reduce(
		( isEqual, [ key, value ] ) =>
			currentQueryArgs[ key ] === value ? isEqual : false,
		true
	);
};

export const formatSlug = ( slug: string ) =>
	slug
		.trim()
		.replace( /\s/g, '-' )
		.replace( /_/g, '-' )
		.replace( /-+/g, '-' )
		.replace( /[^a-zA-Z0-9-]/g, '' );