diff --git a/package-lock.json b/package-lock.json
index 519c034..e9390b3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,6 +15,7 @@
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.2.0",
"@testing-library/user-event": "^13.5.0",
+ "dayjs": "^1.11.3",
"react": "^18.1.0",
"react-dom": "^18.1.0",
"react-router-dom": "^6.3.0",
@@ -6010,6 +6011,11 @@
"node": ">=10"
}
},
+ "node_modules/dayjs": {
+ "version": "1.11.3",
+ "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.3.tgz",
+ "integrity": "sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A=="
+ },
"node_modules/debug": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
@@ -19307,6 +19313,11 @@
"whatwg-url": "^8.0.0"
}
},
+ "dayjs": {
+ "version": "1.11.3",
+ "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.3.tgz",
+ "integrity": "sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A=="
+ },
"debug": {
"version": "4.3.4",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
diff --git a/package.json b/package.json
index e8952a9..3dc29fd 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.2.0",
"@testing-library/user-event": "^13.5.0",
+ "dayjs": "^1.11.3",
"react": "^18.1.0",
"react-dom": "^18.1.0",
"react-router-dom": "^6.3.0",
diff --git a/src/components/AssignmentCard.js b/src/components/AssignmentCard.js
index a0addf9..c8443a1 100644
--- a/src/components/AssignmentCard.js
+++ b/src/components/AssignmentCard.js
@@ -7,6 +7,9 @@ import {
Tooltip,
Divider,
} from '@mui/material';
+import dayjs from 'dayjs';
+
+import { capitalizeFirstLetter } from '../utils/capitalizeFirstLetter';
function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
switch (layoutType) {
@@ -57,7 +60,10 @@ function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
variant="p"
component="div"
>
- Data de entrega: {dueDate}
+ Data de entrega: {' '}
+ {capitalizeFirstLetter(
+ dayjs(dueDate).format('dddd, DD/MM | HH:mm[h]')
+ )}
Valor:
@@ -115,7 +121,10 @@ function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
variant="p"
component="div"
>
- Data de entrega: {dueDate}
+ Data de entrega:
+ {capitalizeFirstLetter(
+ dayjs(dueDate).format('dddd, DD/MM | HH:mm[h]')
+ )}
Valor:
diff --git a/src/context/user.js b/src/context/user.js
index dcd8b84..4a97767 100644
--- a/src/context/user.js
+++ b/src/context/user.js
@@ -81,7 +81,7 @@ const getClassrooms = userId =>
});
const getAssignments = userId =>
- sleep(3000).then(() => {
+ sleep(4000).then(() => {
console.log('userId: ' + userId);
return {
data: [
@@ -89,7 +89,7 @@ const getAssignments = userId =>
id: '5435',
title:
'Prova 1 - Armazenamento de Dados. Python em CD. Armazenamento AnalĂtico',
- dueDate: '2022-07-01',
+ dueDate: '2022-07-01 23:59',
scores: [
{
classroomId: '321',
@@ -115,7 +115,7 @@ const getAssignments = userId =>
{
id: '1234',
title: 'Trabalho NoSQL',
- dueDate: '2022-06-29',
+ dueDate: '2022-06-29 22:00',
scores: [
{
classroomId: '666',
@@ -141,7 +141,7 @@ const getAssignments = userId =>
{
id: '1234',
title: 'Atividade 2 - Estudo de caso Sapiens Informática',
- dueDate: '2022-06-25',
+ dueDate: '2022-06-25 23:59',
scores: [
{
classroomId: '123',
@@ -172,7 +172,7 @@ const getAssignments = userId =>
id: '3671',
title:
'AA08 - Atividade de Aprendizagem 08 - Componentes de rateio de custos',
- dueDate: '2022-07-23',
+ dueDate: '2022-07-23 10:00',
scores: [
{
classroomId: '765',
diff --git a/src/index.js b/src/index.js
index b0b79d3..ce197a4 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,5 +1,7 @@
import React from 'react';
import ReactDOM from 'react-dom/client';
+import 'dayjs/locale/pt-br'; // carregar sob demanda
+import dayjs from 'dayjs';
import { BrowserRouter } from 'react-router-dom';
import { createTheme } from '@mui/material';
@@ -11,6 +13,8 @@ import AppProviders from './context';
import './index.css';
+dayjs.locale('pt-br');
+
const theme = createTheme({
palette: {
primary: {
diff --git a/src/utils/capitalizeFirstLetter.js b/src/utils/capitalizeFirstLetter.js
new file mode 100644
index 0000000..5a3d62d
--- /dev/null
+++ b/src/utils/capitalizeFirstLetter.js
@@ -0,0 +1,5 @@
+const capitalizeFirstLetter = string => {
+ return string.charAt(0).toUpperCase() + string.slice(1);
+};
+
+export { capitalizeFirstLetter };