XP Challenge

Informações importantes

Dedique-se ao teste com capricho, caso você não seja selecionado mas tenha um ótimo desempenho, seu perfil estará no topo da lista para futuras vagas na XP.

Objetivo do teste

Validar as habilidades técnicas do candidato(a) com relação as tecnologias que utilizamos em nosso dia a dia.
Criação de páginas baseadas no Figma e fidelidade ao layout proposto pela equipe de design.
Organização do projeto, pastas e arquivos.
Legibilidade do código: (Indentação, nomes de variáveis e funções claras e objetivas).
Raciocínio simples para resolver os problemas: (Não se perder na implementação e criar 200 linhas que poderiam ser 10).

Instruções

Crie uma conta gratuita no CodeSandbox
- Realize o fork desse projeto com seu GitHub.
Abra o figma para referencia link
- Realize o login no Figma ou crie uma conta para ter acesso as definições dos elementos no protótipo
Seu projeto deverá seguir o design proposto pelo Figma.
Crie um mock para simular as chamadas da API (o response de exemplo está abaixo)
- Você pode utilizar uma lib como MirageJS
- Ou utilizar algo simples como Promise e SetTimeout.
O seu projeto precisar obrigatoriamente conter:
- A página de Dashboard
- Header com menu e e avatar de perfil (não é necessario fazer login ou integrar com nenhuma api/banco de dados)
- Breadcrumbs
- Tabela com os dados do mock
- Filtro acima da tabela, pesquisa rápida para filtrar os resultados em memória
  - Employee (TextField) | Last Login (DateField) | Department (SelectField) | Status (SelectField)
- Chart relacionado aos dados da tabela
  - Alterar o título "Why do you create a startup?" por "Employees by department".
  - Alterar o subtítulo "Trends" por "Departments".
  - Contar quantos funcionários existem em cada departamento e apresentar no gráfico.

Dicas

Utilize bibliotecas para facilitar o seu trabalho e ganhar tempo;
A componentização dos itens é crucial para um bom desenvolvimento;

Mock


[
  {
    "avatar": "https://robohash.org/animieoshic.png?size=50x50&set=set1",
    "employee": "Maryellen State",
    "mail": "mstate0@cargocollective.com",
    "lastLogin": "2024-06-05T00:00:00Z",
    "department": "Sales",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/omnisetdoloribus.png?size=50x50&set=set1",
    "employee": "Brier Ormond",
    "mail": "bormond1@usnews.com",
    "lastLogin": "2024-02-04T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/esseexquia.png?size=50x50&set=set1",
    "employee": "Renado Sellick",
    "mail": "rsellick2@youtu.be",
    "lastLogin": "2023-11-05T00:00:00Z",
    "department": "Finance",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/consecteturducimusrerum.png?size=50x50&set=set1",
    "employee": "Andrej McGrath",
    "mail": "amcgrath3@hatena.ne.jp",
    "lastLogin": "2023-10-02T00:00:00Z",
    "department": "Human Resources",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/autquoperspiciatis.png?size=50x50&set=set1",
    "employee": "Drugi Drewery",
    "mail": "ddrewery4@vkontakte.ru",
    "lastLogin": "2023-12-18T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/enimmaioresdolores.png?size=50x50&set=set1",
    "employee": "Etty Hargrove",
    "mail": "ehargrove5@wunderground.com",
    "lastLogin": "2023-11-09T00:00:00Z",
    "department": "Human Resources",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/quosnostrumeligendi.png?size=50x50&set=set1",
    "employee": "Griselda Hurran",
    "mail": "ghurran6@archive.org",
    "lastLogin": "2023-11-11T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/fugiatdictaquaerat.png?size=50x50&set=set1",
    "employee": "Elysee Phil",
    "mail": "ephil7@youku.com",
    "lastLogin": "2023-12-23T00:00:00Z",
    "department": "Sales",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/praesentiumetcum.png?size=50x50&set=set1",
    "employee": "Milka Elsegood",
    "mail": "melsegood8@ucoz.com",
    "lastLogin": "2023-12-08T00:00:00Z",
    "department": "Marketing",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/facilisetdolor.png?size=50x50&set=set1",
    "employee": "Ulric Lambie",
    "mail": "ulambie9@imdb.com",
    "lastLogin": "2024-07-20T00:00:00Z",
    "department": "Sales",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/earumaccusamusplaceat.png?size=50x50&set=set1",
    "employee": "Arnie Phythean",
    "mail": "aphytheana@networkadvertising.org",
    "lastLogin": "2024-01-08T00:00:00Z",
    "department": "Finance",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/quaeratconsequaturnisi.png?size=50x50&set=set1",
    "employee": "Catie Wheater",
    "mail": "cwheaterb@woothemes.com",
    "lastLogin": "2024-03-12T00:00:00Z",
    "department": "IT",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/quaeestearum.png?size=50x50&set=set1",
    "employee": "Way Backshill",
    "mail": "wbackshillc@springer.com",
    "lastLogin": "2023-12-19T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/doloremqueminimaaspernatur.png?size=50x50&set=set1",
    "employee": "Ethelda Cumbers",
    "mail": "ecumbersd@columbia.edu",
    "lastLogin": "2023-12-30T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/deseruntullamet.png?size=50x50&set=set1",
    "employee": "Zedekiah Kerry",
    "mail": "zkerrye@nasa.gov",
    "lastLogin": "2024-06-22T00:00:00Z",
    "department": "IT",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/sitetquia.png?size=50x50&set=set1",
    "employee": "Bee Golightly",
    "mail": "bgolightlyf@thetimes.co.uk",
    "lastLogin": "2024-03-27T00:00:00Z",
    "department": "IT",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/sapienteidomnis.png?size=50x50&set=set1",
    "employee": "Wendye Ploughwright",
    "mail": "wploughwrightg@weather.com",
    "lastLogin": "2024-09-06T00:00:00Z",
    "department": "IT",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/eosutperspiciatis.png?size=50x50&set=set1",
    "employee": "Shaun Ferrierio",
    "mail": "sferrierioh@sbwire.com",
    "lastLogin": "2024-01-27T00:00:00Z",
    "department": "IT",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/repudiandaeaexplicabo.png?size=50x50&set=set1",
    "employee": "Calley Jancar",
    "mail": "cjancari@dyndns.org",
    "lastLogin": "2024-01-03T00:00:00Z",
    "department": "Sales",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/iustoquiset.png?size=50x50&set=set1",
    "employee": "Zachery Kagan",
    "mail": "zkaganj@cornell.edu",
    "lastLogin": "2023-11-02T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/etnecessitatibusautem.png?size=50x50&set=set1",
    "employee": "Hestia Voase",
    "mail": "hvoasek@rediff.com",
    "lastLogin": "2024-07-31T00:00:00Z",
    "department": "Marketing",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/atvelnon.png?size=50x50&set=set1",
    "employee": "Quintilla Gurnett",
    "mail": "qgurnettl@patch.com",
    "lastLogin": "2024-08-08T00:00:00Z",
    "department": "Operations",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/quibusdamplaceatut.png?size=50x50&set=set1",
    "employee": "Ester Rosenblatt",
    "mail": "erosenblattm@discuz.net",
    "lastLogin": "2023-09-23T00:00:00Z",
    "department": "Operations",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/deseruntsapienteet.png?size=50x50&set=set1",
    "employee": "Valeda Paulich",
    "mail": "vpaulichn@altervista.org",
    "lastLogin": "2024-04-18T00:00:00Z",
    "department": "Research and Development",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/beataedoloresnulla.png?size=50x50&set=set1",
    "employee": "Suzette Jope",
    "mail": "sjopeo@hao123.com",
    "lastLogin": "2023-12-29T00:00:00Z",
    "department": "IT",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/estatofficiis.png?size=50x50&set=set1",
    "employee": "Shepperd Obray",
    "mail": "sobrayp@blogtalkradio.com",
    "lastLogin": "2024-01-29T00:00:00Z",
    "department": "Operations",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/doloremetiure.png?size=50x50&set=set1",
    "employee": "Philippine Bernuzzi",
    "mail": "pbernuzziq@omniture.com",
    "lastLogin": "2024-07-23T00:00:00Z",
    "department": "Sales",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/inbeataelaboriosam.png?size=50x50&set=set1",
    "employee": "Onida Whitaker",
    "mail": "owhitakerr@google.ru",
    "lastLogin": "2024-03-28T00:00:00Z",
    "department": "Operations",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/enimdoloremrepudiandae.png?size=50x50&set=set1",
    "employee": "Nicki Calender",
    "mail": "ncalenders@slideshare.net",
    "lastLogin": "2024-03-05T00:00:00Z",
    "department": "Finance",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/sitaperiamaut.png?size=50x50&set=set1",
    "employee": "Nelli Sturr",
    "mail": "nsturrt@washingtonpost.com",
    "lastLogin": "2024-06-13T00:00:00Z",
    "department": "IT",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/eaquevelitodio.png?size=50x50&set=set1",
    "employee": "Sybila McNuff",
    "mail": "smcnuffu@scribd.com",
    "lastLogin": "2023-12-31T00:00:00Z",
    "department": "Marketing",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/dolorumestexcepturi.png?size=50x50&set=set1",
    "employee": "Adena Farrow",
    "mail": "afarrowv@4shared.com",
    "lastLogin": "2023-12-10T00:00:00Z",
    "department": "Research and Development",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/distinctioconsequaturullam.png?size=50x50&set=set1",
    "employee": "Penny Adenet",
    "mail": "padenetw@behance.net",
    "lastLogin": "2024-02-16T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/quiaautemdolore.png?size=50x50&set=set1",
    "employee": "Marlie Miere",
    "mail": "mmierex@moonfruit.com",
    "lastLogin": "2024-05-15T00:00:00Z",
    "department": "Operations",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/autemaliquidsaepe.png?size=50x50&set=set1",
    "employee": "Etty Arkwright",
    "mail": "earkwrighty@wufoo.com",
    "lastLogin": "2023-10-27T00:00:00Z",
    "department": "Operations",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/utaccusamusfugiat.png?size=50x50&set=set1",
    "employee": "Michell Plowman",
    "mail": "mplowmanz@pinterest.com",
    "lastLogin": "2024-07-14T00:00:00Z",
    "department": "Operations",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/blanditiisauterror.png?size=50x50&set=set1",
    "employee": "Aron Cutford",
    "mail": "acutford10@skyrock.com",
    "lastLogin": "2024-02-07T00:00:00Z",
    "department": "Research and Development",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/etquodconsequuntur.png?size=50x50&set=set1",
    "employee": "Thor Seery",
    "mail": "tseery11@hibu.com",
    "lastLogin": "2024-06-02T00:00:00Z",
    "department": "Human Resources",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/doloremqueestquo.png?size=50x50&set=set1",
    "employee": "Nelly Olivetti",
    "mail": "nolivetti12@illinois.edu",
    "lastLogin": "2024-02-08T00:00:00Z",
    "department": "Sales",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/nequeestfacilis.png?size=50x50&set=set1",
    "employee": "Anastasia Sarton",
    "mail": "asarton13@nba.com",
    "lastLogin": "2023-10-19T00:00:00Z",
    "department": "Human Resources",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/corporisnisisint.png?size=50x50&set=set1",
    "employee": "Christin Loan",
    "mail": "cloan14@independent.co.uk",
    "lastLogin": "2024-07-10T00:00:00Z",
    "department": "Human Resources",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/utevenietet.png?size=50x50&set=set1",
    "employee": "Sada Davall",
    "mail": "sdavall15@xrea.com",
    "lastLogin": "2023-10-25T00:00:00Z",
    "department": "Research and Development",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/iddignissimosfacere.png?size=50x50&set=set1",
    "employee": "Feliks Sibbs",
    "mail": "fsibbs16@liveinternet.ru",
    "lastLogin": "2023-11-01T00:00:00Z",
    "department": "Sales",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/nullaestab.png?size=50x50&set=set1",
    "employee": "Maxwell Radage",
    "mail": "mradage17@webeden.co.uk",
    "lastLogin": "2024-06-28T00:00:00Z",
    "department": "Research and Development",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/rationevelitvoluptatem.png?size=50x50&set=set1",
    "employee": "Leanor Biggs",
    "mail": "lbiggs18@istockphoto.com",
    "lastLogin": "2024-09-04T00:00:00Z",
    "department": "Research and Development",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/auttotamillum.png?size=50x50&set=set1",
    "employee": "Shela Hartshorne",
    "mail": "shartshorne19@netvibes.com",
    "lastLogin": "2024-06-18T00:00:00Z",
    "department": "Human Resources",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/explicaboplaceatvel.png?size=50x50&set=set1",
    "employee": "Allen Gowanson",
    "mail": "agowanson1a@woothemes.com",
    "lastLogin": "2024-03-17T00:00:00Z",
    "department": "Sales",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/quiaetofficia.png?size=50x50&set=set1",
    "employee": "Reinald Hoggan",
    "mail": "rhoggan1b@europa.eu",
    "lastLogin": "2024-06-02T00:00:00Z",
    "department": "Marketing",
    "isActive": true
  },
  {
    "avatar": "https://robohash.org/nequevoluptatibustenetur.png?size=50x50&set=set1",
    "employee": "Juanita Somerled",
    "mail": "jsomerled1c@nih.gov",
    "lastLogin": "2024-05-03T00:00:00Z",
    "department": "Operations",
    "isActive": false
  },
  {
    "avatar": "https://robohash.org/etbeataelibero.png?size=50x50&set=set1",
    "employee": "Eugen Romaint",
    "mail": "eromaint1d@patch.com",
    "lastLogin": "2024-04-19T00:00:00Z",
    "department": "Finance",
    "isActive": false
  }
]

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

Next.js Documentation - learn about Next.js features and API.
Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Name		Name	Last commit message	Last commit date
Latest commit History 2 Commits
.codesandbox		.codesandbox
.devcontainer		.devcontainer
app		app
public		public
.eslintrc.json		.eslintrc.json
.gitignore		.gitignore
README.md		README.md
next.config.js		next.config.js
package-lock.json		package-lock.json
package.json		package.json
pnpm-lock.yaml		pnpm-lock.yaml
postcss.config.js		postcss.config.js
tailwind.config.ts		tailwind.config.ts
tsconfig.json		tsconfig.json

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Repository files navigation

XP Challenge

Informações importantes

Objetivo do teste

Instruções

Dicas

Mock

Getting Started

Learn More

Deploy on Vercel

About

Uh oh!

Releases

Packages

Languages

wilsoncampoz/xp-coding-challenge

Folders and files

Latest commit

History

Repository files navigation

XP Challenge

Informações importantes

Objetivo do teste

Instruções

Dicas

Mock

Getting Started

Learn More

Deploy on Vercel

About

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Languages

Packages