scottk/twenty
1
0
Fork 0
mirror of https://github.com/lingble/twenty.git synced 2025-11-02 21:57:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #43 from twentyhq/sammy/t-103-i-see-company-chip-designed-with-picture

Browse Source 
Sammy/t 103 i see company chip designed with picture
This commit is contained in:
Sammy Teillet
2023-04-19 11:49:38 +02:00
committed by GitHub
parent 5560476ea0 ddebb35865
commit bb40c1b40a
3 changed files with 16 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
front/src/components/table/CellLink.tsx
View File

@@ -10,17 +10,20 @@ type OwnProps = {
const StyledContainer = styled.span` const StyledContainer = styled.span`
background-color: ${(props) => props.theme.tertiaryBackground}; background-color: ${(props) => props.theme.tertiaryBackground};
border-radius: 4px; border-radius: ${(props) => props.theme.spacing(1)};
color: ${(props) => props.theme.text80}; color: ${(props) => props.theme.text80};
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
padding: 4px 8px 4px 4px; padding: ${(props) => props.theme.spacing(1)};
gap: 4px; gap: ${(props) => props.theme.spacing(1)};
:hover {
filter: brightness(95%);
}
img { img {
height: 1rem; height: 14px;
width: 1rem; width: 14px;
border-radius: 0.5rem;
object-fit: cover; object-fit: cover;
} }
`; `;

2
front/src/interfaces/company.interface.ts
View File

@@ -1,5 +1,5 @@
export interface Company { export interface Company {
id: number; id: number;
name: string; name: string;
logo: string; domain: string;
} }

12
front/src/pages/people/People.tsx
View File

@@ -48,7 +48,7 @@ const defaultData: Array<Person> = [
fullName: 'Alexandre Prot', fullName: 'Alexandre Prot',
picture: personPlaceholder, picture: personPlaceholder,
email: 'alexandre@qonto.com', email: 'alexandre@qonto.com',
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' }, company: { id: 1, name: 'Qonto', domain: 'qonto.com' },
phone: '06 12 34 56 78', phone: '06 12 34 56 78',
creationDate: new Date('Feb 23, 2018'), creationDate: new Date('Feb 23, 2018'),
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' }, pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
@@ -59,7 +59,7 @@ const defaultData: Array<Person> = [
fullName: 'Alexandre Prot', fullName: 'Alexandre Prot',
picture: personPlaceholder, picture: personPlaceholder,
email: 'alexandre@qonto.com', email: 'alexandre@qonto.com',
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' }, company: { id: 2, name: 'LinkedIn', domain: 'linkedin.com' },
phone: '06 12 34 56 78', phone: '06 12 34 56 78',
creationDate: new Date('Feb 23, 2018'), creationDate: new Date('Feb 23, 2018'),
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' }, pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
@@ -70,7 +70,7 @@ const defaultData: Array<Person> = [
fullName: 'Alexandre Prot', fullName: 'Alexandre Prot',
picture: personPlaceholder, picture: personPlaceholder,
email: 'alexandre@qonto.com', email: 'alexandre@qonto.com',
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' }, company: { id: 1, name: 'Qonto', domain: 'qonto.com' },
phone: '06 12 34 56 78', phone: '06 12 34 56 78',
creationDate: new Date('Feb 23, 2018'), creationDate: new Date('Feb 23, 2018'),
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' }, pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
@@ -81,7 +81,7 @@ const defaultData: Array<Person> = [
fullName: 'Alexandre Prot', fullName: 'Alexandre Prot',
picture: personPlaceholder, picture: personPlaceholder,
email: 'alexandre@qonto.com', email: 'alexandre@qonto.com',
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' }, company: { id: 1, name: 'Slack', domain: 'slack.com' },
phone: '06 12 34 56 78', phone: '06 12 34 56 78',
creationDate: new Date('Feb 23, 2018'), creationDate: new Date('Feb 23, 2018'),
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' }, pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
@@ -92,7 +92,7 @@ const defaultData: Array<Person> = [
fullName: 'Alexandre Prot', fullName: 'Alexandre Prot',
picture: personPlaceholder, picture: personPlaceholder,
email: 'alexandre@qonto.com', email: 'alexandre@qonto.com',
company: { id: 1, name: 'Qonto', logo: 'https://qonto.eu/logo.png' }, company: { id: 2, name: 'Facebook', domain: 'facebook.com' },
phone: '06 12 34 56 78', phone: '06 12 34 56 78',
creationDate: new Date('Feb 23, 2018'), creationDate: new Date('Feb 23, 2018'),
pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' }, pipe: { id: 1, name: 'Sales Pipeline', icon: 'faUser' },
@@ -133,7 +133,7 @@ const columns = [
cell: (props) => ( cell: (props) => (
<CellLink <CellLink
name={props.row.original.company.name} name={props.row.original.company.name}
picture={props.row.original.company.logo} picture={`https://www.google.com/s2/favicons?domain=${props.row.original.company.domain}&sz=256`}
href="#" href="#"
/> />
), ),