Proyectos de Subversion LeadersLinked - SPA

import React, { useState } from 'react';
import { useSelector } from 'react-redux';
import { Search } from '@mui/icons-material';

import Widget from '@components/UI/Widget';
import Input from '@components/UI/inputs/Input';

export function withSearch(Component = <></>, items = []) {
  return function WithSearchComponent() {
    const [query, setQuery] = useState('');
    const labels = useSelector(({ intl }) => intl.labels);

    const handleInputChange = (e) => setQuery(e.target.value);

    return (
      <Widget styles={{ paddingTop: '1rem' }}>
        <Input
          onChange={handleInputChange}
          placeholder={labels.search}
          icon={<Search />}
          variant='search'
        />
        <Component query={query} capsules={items} />
      </Widget>
    );
  };
}