META-INF.resources.js.components.rest.RESTEndpointDropdownMenu.tsx Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of com.liferay.frontend.data.set.admin.web

Liferay Frontend Data Set Admin Web

There is a newer version: 1.0.6

/**
 * SPDX-FileCopyrightText: (c) 2000 Liferay, Inc. https://liferay.com
 * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
 */

import ClayDropDown from '@clayui/drop-down';
import fuzzy from 'fuzzy';
import React, {useState} from 'react';

import {FUZZY_OPTIONS} from '../../utils/constants';

export default function RESTEndpointDropdownMenu({
	className,
	onItemClick,
	restEndpoints: initialRESTEndpoints,
}: {
	className?: string;
	onItemClick: Function;
	restEndpoints: Array;
}) {
	const [restEndpoints, setRESTEndpoints] = useState>(
		initialRESTEndpoints || []
	);
	const [query, setQuery] = useState('');

	const onSearch = (query: string) => {
		setQuery(query);

		const regexp = new RegExp(query, 'i');

		setRESTEndpoints(
			query
				? initialRESTEndpoints.filter((restEndpoint) => {
						return restEndpoint.match(regexp);
					}) || []
				: initialRESTEndpoints
		);
	};

	return (
		<>
			

			
				{(item: string) => {
					const fuzzymatch = fuzzy.match(query, item, FUZZY_OPTIONS);

					return (
						 onItemClick(item)}
							roleItem="option"
						>
							{fuzzymatch ? (
								
							) : (
								item
							)}
						
					);
				}}
			
		
	);
}