Issue 27 - Componente de Calendário by DominMFD · Pull Request #302 · devhatt/pet-dex-frontend

DominMFD · 2024-09-08T13:24:11Z

Closes #27

Feature

Foi criado o componente de calendário

Visual evidences 🖼️

Calendario.pra.frente.mp4

Calenario.para.tras.mp4

https://github.com/use

r-attachments/assets/59105c54-daf3-445a-bf67-b395a605add0

Calendario.mobile.mp4

Checklist

Issue linked
Build working correctly
Tests created

Luiginicoletti

Mano maravilhoso, nem em toda minha vida eu conseguiria fazer isso na mão, parabens!

src/components/Button/index.scss

src/components/Calendar/components/DateSelectorComposer/components/MonthSelector/index.js

src/styles/colors.scss

src/components/Calendar/components/DateSelectorComposer/components/MonthSelector/index.js

src/components/Calendar/components/WeekDayComposer/utils/weekDays.js

src/components/Calendar/images/navButton.svg

juliaam

Tá quebrando o calendário em certos tamanhos, além disso, nesse mesmo problema, parece que os anos e os meses ficam andando muito rápido e isso buga a exibição, mas por print não parece

Seria legal também ter uma corzinha indicando o dia atual, mesmo que seja selecionado outro dia, isso resultará em uma navegação melhor

tipo assim:

Quando você clica nos dias finais do mês anterior, ele seleciona do mês atual, ele deveria selecionar o dia daquele mês passado e a exibição ser do mês atual

src/styles/colors.scss

src/layouts/components/SideMenu/index.scss

...dar/components/DateSelectorComposer/components/SelectorModal/components/ModalItem/index.scss

src/components/Calendar/components/DayComposer/index.js

src/layouts/components/SideMenu/index.scss

src/components/Calendar/index.js

muritadb

src/components/Calendar/components/DayComposer/components/DayButton/index.js

gustavogularte · 2024-10-08T01:27:47Z

Chega um momento que o scroll para de funcionar

Também acho que deveria ser possível selecionar os meses ou os anos clicando e não apenas no scroll até pq o scroll ta meio difícil de controlar e acaba indo de 3 em 3 ou mais

review.mp4

gustavogularte · 2024-10-08T02:21:32Z

src/components/Calendar/index.js

+    }
+
+    const totalDaysInMonth = dayjs(
+      `${this.year}-${this.month}-1`,


Não precisa do -1

gustavogularte · 2024-10-08T02:35:12Z

src/components/Calendar/index.js

+    this.year = year;
+
+    this.mountDayComposer();
+    this.firstDayInWeek = dayjs(`${this.year}-${this.month}-${this.day}`).day();


pq se chama firstDayInWeek sendo que ele não retorna o primeiro dia da semana e sim a posição que o dia selecionado está na semana?

gustavogularte · 2024-10-08T02:51:02Z

src/components/Calendar/index.js

+    }
+
+    const totalDaysInMonth = dayjs(
+      `${this.year}-${this.month}-1`,


Não precisa do -1

gustavogularte · 2024-10-08T03:05:17Z

src/components/Calendar/index.scss

+@use '~styles/base.scss';
+@use '~styles/colors.scss' as colors;
+@use '~styles/fonts.scss' as fonts;
+@use '~styles/breakpoints.scss' as breakpoints;


É preciso importar tudo isso mesmo não usando?

gustavogularte · 2024-10-08T03:08:38Z

src/components/Calendar/components/DateSelectorComposer/index.scss

@@ -0,0 +1,35 @@
+@use '~styles/base.scss';
+@use '~styles/colors.scss' as colors;
+@use '~styles/fonts.scss' as fonts;


É preciso importar tudo isso mesmo não usando?

DominMFD requested review from a team as code owners September 8, 2024 13:24

DominMFD requested review from Frompaje, JpBurgarelli, Luiginicoletti, PiluVitu and juliaam September 8, 2024 13:24

DominMFD self-assigned this Sep 8, 2024

gustavogularte and others added 22 commits September 8, 2024 10:30

chore: update branch

04b094b

chore: update branch

652302e

chore: update branch

9f2bc3a

chore: colors adjusted

44e4b10

chore: index.scss adjusted

0a8adab

chore: update main

301414d

fix: add color gray250

4cb88f1

chore: add lodash

f5816d2

refactor: init calendar refactor

7116331

feat: calendar content done

8dd27fc

feat: implements month selector

0ea029d

feat: implements date modal

d850b24

chore: implements year selector

1fc7b5f

chore: remove sliding

05c07d5

feat: add hover in date selector

67ceede

chore: init virtual scroll

6fb4f94

chore: complete virtual scroll

74828a6

fix: month selector array

5bc0720

chore: trying make central scroll

7835018

fix: align active item in center

8f267aa

chore: implements scroll snap

217d0aa

chore: year selector scroll

19b2854

DominMFD added 3 commits September 8, 2024 10:33

chore: implements scroll selectors

a4c87dc

fix: scroll fixes

03c18a8

fix: rerender fix

7369e00

DominMFD force-pushed the issue#27 branch from b8e03e6 to 7369e00 Compare September 8, 2024 13:33

Luiginicoletti suggested changes Sep 8, 2024

View reviewed changes

fix: adjust modal height

0c79f10

Frompaje suggested changes Sep 9, 2024

View reviewed changes

src/components/Calendar/components/DateSelectorComposer/components/MonthSelector/index.js Show resolved Hide resolved

src/components/Calendar/components/WeekDayComposer/utils/weekDays.js Outdated Show resolved Hide resolved

Frompaje suggested changes Sep 9, 2024

View reviewed changes

src/components/Calendar/images/navButton.svg Show resolved Hide resolved

fix: week days abbreviation fix

a7a3098

juliaam requested changes Sep 10, 2024

View reviewed changes

DominMFD added 7 commits September 10, 2024 22:23

fix: media query day composer fixed

3bf7c70

fix: bug mobile selector fixed

f149258

fix: object properties

8e68afe

fix: add bem

3759f75

fix: array fixed

eaaba8a

fix: css

924b63d

feat: actual day implemented

f64c702

juliaam approved these changes Sep 25, 2024

View reviewed changes

src/layouts/components/SideMenu/index.scss Show resolved Hide resolved

src/components/Calendar/index.js Show resolved Hide resolved

muritadb reviewed Sep 25, 2024

View reviewed changes

src/components/Calendar/components/DayComposer/components/DayButton/index.js Outdated Show resolved Hide resolved

PiluVitu requested a review from Luiginicoletti September 26, 2024 16:26

fix: organize setters and getters

621a929

DominMFD force-pushed the issue#27 branch from 78ec67a to 621a929 Compare October 1, 2024 13:34

Merge branch 'main' into issue#27

54abad3

gustavogularte reviewed Oct 8, 2024

View reviewed changes

src/components/Calendar/index.js

}

const totalDaysInMonth = dayjs(

`${this.year}-${this.month}-1`,

Copy link

Contributor

gustavogularte Oct 8, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Não precisa do -1

gustavogularte reviewed Oct 8, 2024

View reviewed changes

src/components/Calendar/index.js

}

const totalDaysInMonth = dayjs(

`${this.year}-${this.month}-1`,

Copy link

Contributor

gustavogularte Oct 8, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Não precisa do -1

gustavogularte reviewed Oct 8, 2024

View reviewed changes

Comments

Conversation

DominMFD commented Sep 8, 2024

Uh oh!

Luiginicoletti left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

juliaam left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

muritadb left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

gustavogularte commented Oct 8, 2024

Uh oh!

gustavogularte Oct 8, 2024

Choose a reason for hiding this comment

Uh oh!

gustavogularte Oct 8, 2024

Choose a reason for hiding this comment

Uh oh!

gustavogularte Oct 8, 2024

Choose a reason for hiding this comment

Uh oh!

gustavogularte Oct 8, 2024

Choose a reason for hiding this comment

Uh oh!

gustavogularte Oct 8, 2024

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants