Add Filters on Table views (#95)

* Add filter search logic

WIP Filter search

Implement filters

test: fix sorts tests

test: fix filter test

feature: search person and display firstname in results

feature: fix test for filter component

test: mock search filters

refactor: create a useSearch hook

refactor: move debounce in useSearch and reset status of filter selection

feature: debounce set filters

refactor: remove useless setSorts

feature: add where variable to people query

feature: strongly type Filters

feature: update WhereTemplate method

feature: implement filtering on full name

feature: type the useSearch hook

feature: use where reducer

refactor: create a type for readability

feature: use query and mapper from filters

feature: implement filter by company

feature: search filter results on filter select

feature: add loading and results to search results in filters

refactor: move render search results in a function

feature: display a LOADING when it loads

feature: split search input and search filter for different debounce

refactor: remove some warnings

refactor: remove some warnings

* Write test 1

* Write test 2

* test: useSearch is tested

* test: update names of default people data

* test: add a filter search

* Test 3

* Fix tests

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Sammy Teillet
2023-05-04 13:54:46 +02:00
committed by GitHub
parent 27d5edc031
commit 6a8a8f0728
33 changed files with 913 additions and 316 deletions

View File

@ -1,9 +1,9 @@
import * as React from 'react';
import styled from '@emotion/styled';
import { Opportunity } from '../../interfaces/company.interface';
type OwnProps = {
name: string;
picture?: string;
opportunity: Opportunity;
};
const StyledContainer = styled.span`
@ -20,11 +20,11 @@ const StyledContainer = styled.span`
}
`;
function PipeChip({ name, picture }: OwnProps) {
function PipeChip({ opportunity }: OwnProps) {
return (
<StyledContainer data-testid="company-chip">
{picture && <span>{picture}</span>}
<span>{name}</span>
<StyledContainer data-testid="company-chip" key={opportunity.id}>
{opportunity.icon && <span>{opportunity.icon}</span>}
<span>{opportunity.name}</span>
</StyledContainer>
);
}