adding service icon next to suggestions

This commit is contained in:
Sachin-chaurasiya 2021-08-11 15:28:57 +05:30
parent e51510e845
commit 578bee04ca

View File

@ -20,6 +20,7 @@ import React, { useEffect, useRef, useState } from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { getSuggestions } from '../../axiosAPIs/miscAPI'; import { getSuggestions } from '../../axiosAPIs/miscAPI';
import { getDatasetDetailsPath } from '../../constants/constants'; import { getDatasetDetailsPath } from '../../constants/constants';
import { serviceTypeLogo } from '../../utils/ServiceUtils';
type SuggestionProp = { type SuggestionProp = {
searchText: string; searchText: string;
@ -31,6 +32,7 @@ type Option = {
table_id: string; table_id: string;
fqdn: string; fqdn: string;
table_name: string; table_name: string;
service_type: string;
}; };
}; };
const Suggestions = ({ searchText, isOpen, setIsOpen }: SuggestionProp) => { const Suggestions = ({ searchText, isOpen, setIsOpen }: SuggestionProp) => {
@ -72,17 +74,26 @@ const Suggestions = ({ searchText, isOpen, setIsOpen }: SuggestionProp) => {
{options.map((item: Option) => { {options.map((item: Option) => {
const fqdn = item['_source'].fqdn; const fqdn = item['_source'].fqdn;
const name = item['_source'].table_name; const name = item['_source'].table_name;
const serviceType = item['_source']['service_type'];
return ( return (
<Link <div
className="tw-text-gray-700 tw-block tw-px-4 tw-py-2 tw-text-sm className="tw-flex tw-items-center hover:tw-bg-gray-200"
hover:tw-bg-gray-200" key={fqdn}>
data-testid="data-name" <Link
key={fqdn} className="tw-block tw-px-4 tw-pr-2 tw-py-2 tw-text-sm
to={getDatasetDetailsPath(fqdn)} "
onClick={() => setIsOpen(false)}> data-testid="data-name"
{name} to={getDatasetDetailsPath(fqdn)}
</Link> onClick={() => setIsOpen(false)}>
{name}
</Link>
<img
alt={serviceType}
className="tw-inline tw-h-4 tw-w-4"
src={serviceTypeLogo(serviceType)}
/>
</div>
); );
})} })}
</div> </div>