feature: wip get persons and map it

This commit is contained in:
Sammy Teillet 2023-04-20 13:34:55 +02:00
parent 7f2ec0c260
commit 887a7af5e2
No known key found for this signature in database
GPG Key ID: 687E513E74D28696

View File

@ -3,6 +3,8 @@ import WithTopBarContainer from '../../layout/containers/WithTopBarContainer';
import Table from '../../components/table/Table'; import Table from '../../components/table/Table';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import { peopleColumns } from './people-table'; import { peopleColumns } from './people-table';
import { gql, useQuery } from '@apollo/client';
import { Person } from './types';
import { defaultData } from './defaultData'; import { defaultData } from './defaultData';
const StyledPeopleContainer = styled.div` const StyledPeopleContainer = styled.div`
@ -10,16 +12,69 @@ const StyledPeopleContainer = styled.div`
width: 100%; width: 100%;
`; `;
const GET_PEOPLE = gql`
query GetPeople {
person {
id
phone
email
city
firstname
lastname
created_at
company {
company_name
company_domain
}
}
}
`;
type QueryResult = {
city: string;
company: {
__typename: string;
company_name: string;
company_domain: string;
};
created_at: string;
email: string;
firstname: string;
id: number;
lastname: string;
phone: string;
__typename: string;
};
function People() { function People() {
const { data } = useQuery<{ person: QueryResult[] }>(GET_PEOPLE);
const mydata: Person[] = data
? data.person.map((person) => ({
fullName: `${person.firstname} ${person.lastname}`,
creationDate: new Date(person.created_at),
pipe: { name: 'coucou', id: 1, icon: 'faUser' },
...person,
company: {
id: 1,
name: person.company.company_name,
domain: person.company.company_domain,
},
countryCode: 'FR',
}))
: defaultData;
return ( return (
<WithTopBarContainer title="People" icon={faUser}> <WithTopBarContainer title="People" icon={faUser}>
<StyledPeopleContainer> <StyledPeopleContainer>
<Table {mydata && (
data={defaultData} <Table
columns={peopleColumns} data={mydata}
viewName="All People" columns={peopleColumns}
viewIcon={faList} viewName="All People"
/> viewIcon={faList}
/>
)}
</StyledPeopleContainer> </StyledPeopleContainer>
</WithTopBarContainer> </WithTopBarContainer>
); );