diff --git a/package-lock.json b/package-lock.json index e9390b3..2ac1c61 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,6 +18,7 @@ "dayjs": "^1.11.3", "react": "^18.1.0", "react-dom": "^18.1.0", + "react-pdf": "^5.7.2", "react-router-dom": "^6.3.0", "react-scripts": "5.0.1", "web-vitals": "^2.1.4" @@ -9983,6 +9984,14 @@ "sourcemap-codec": "^1.4.8" } }, + "node_modules/make-cancellable-promise": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/make-cancellable-promise/-/make-cancellable-promise-1.1.0.tgz", + "integrity": "sha512-X5Opjm2xcZsOLuJ+Bnhb4t5yfu4ehlA3OKEYLtqUchgVzL/QaqW373ZUVxVHKwvJ38cmYuR4rAHD2yUvAIkTPA==", + "funding": { + "url": "https://github.com/wojtekmaj/make-cancellable-promise?sponsor=1" + } + }, "node_modules/make-dir": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz", @@ -10005,6 +10014,14 @@ "semver": "bin/semver.js" } }, + "node_modules/make-event-props": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/make-event-props/-/make-event-props-1.3.0.tgz", + "integrity": "sha512-oWiDZMcVB1/A487251hEWza1xzgCzl6MXxe9aF24l5Bt9N9UEbqTqKumEfuuLhmlhRZYnc+suVvW4vUs8bwO7Q==", + "funding": { + "url": "https://github.com/wojtekmaj/make-event-props?sponsor=1" + } + }, "node_modules/makeerror": { "version": "1.0.12", "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.12.tgz", @@ -10037,11 +10054,24 @@ "node": ">= 4.0.0" } }, + "node_modules/merge-class-names": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/merge-class-names/-/merge-class-names-1.4.2.tgz", + "integrity": "sha512-bOl98VzwCGi25Gcn3xKxnR5p/WrhWFQB59MS/aGENcmUc6iSm96yrFDF0XSNurX9qN4LbJm0R9kfvsQ17i8zCw==", + "funding": { + "url": "https://github.com/wojtekmaj/merge-class-names?sponsor=1" + } + }, "node_modules/merge-descriptors": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz", "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E=" }, + "node_modules/merge-refs": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/merge-refs/-/merge-refs-1.0.0.tgz", + "integrity": "sha512-WZ4S5wqD9FCR9hxkLgvcHJCBxzXzy3VVE6p8W2OzxRzB+hLRlcadGE2bW9xp2KSzk10rvp4y+pwwKO6JQVguMg==" + }, "node_modules/merge-stream": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz", @@ -10697,6 +10727,19 @@ "node": ">=8" } }, + "node_modules/pdfjs-dist": { + "version": "2.12.313", + "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.12.313.tgz", + "integrity": "sha512-1x6iXO4Qnv6Eb+YFdN5JdUzt4pAkxSp3aLAYPX93eQCyg/m7QFzXVWJHJVtoW48CI8HCXju4dSkhQZwoheL5mA==", + "peerDependencies": { + "worker-loader": "^3.0.8" + }, + "peerDependenciesMeta": { + "worker-loader": { + "optional": true + } + } + }, "node_modules/performance-now": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", @@ -12283,6 +12326,30 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, + "node_modules/react-pdf": { + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/react-pdf/-/react-pdf-5.7.2.tgz", + "integrity": "sha512-hdDwvf007V0i2rPCqQVS1fa70CXut17SN3laJYlRHzuqcu8sLLjEoeXihty6c0Ev5g1mw31b8OT8EwRw1s8C4g==", + "dependencies": { + "@babel/runtime": "^7.0.0", + "file-loader": "^6.0.0", + "make-cancellable-promise": "^1.0.0", + "make-event-props": "^1.1.0", + "merge-class-names": "^1.1.1", + "merge-refs": "^1.0.0", + "pdfjs-dist": "2.12.313", + "prop-types": "^15.6.2", + "tiny-invariant": "^1.0.0", + "tiny-warning": "^1.0.0" + }, + "funding": { + "url": "https://github.com/wojtekmaj/react-pdf?sponsor=1" + }, + "peerDependencies": { + "react": "^16.3.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.3.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -13897,6 +13964,16 @@ "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz", "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==" }, + "node_modules/tiny-invariant": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.2.0.tgz", + "integrity": "sha512-1Uhn/aqw5C6RI4KejVeTg6mIS7IqxnLJ8Mv2tV5rTc0qWobay7pDUz6Wi392Cnc8ak1H0F2cjoRzb2/AW4+Fvg==" + }, + "node_modules/tiny-warning": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", + "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" + }, "node_modules/tmpl": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.5.tgz", @@ -22232,6 +22309,11 @@ "sourcemap-codec": "^1.4.8" } }, + "make-cancellable-promise": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/make-cancellable-promise/-/make-cancellable-promise-1.1.0.tgz", + "integrity": "sha512-X5Opjm2xcZsOLuJ+Bnhb4t5yfu4ehlA3OKEYLtqUchgVzL/QaqW373ZUVxVHKwvJ38cmYuR4rAHD2yUvAIkTPA==" + }, "make-dir": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz", @@ -22247,6 +22329,11 @@ } } }, + "make-event-props": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/make-event-props/-/make-event-props-1.3.0.tgz", + "integrity": "sha512-oWiDZMcVB1/A487251hEWza1xzgCzl6MXxe9aF24l5Bt9N9UEbqTqKumEfuuLhmlhRZYnc+suVvW4vUs8bwO7Q==" + }, "makeerror": { "version": "1.0.12", "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.12.tgz", @@ -22273,11 +22360,21 @@ "fs-monkey": "1.0.3" } }, + "merge-class-names": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/merge-class-names/-/merge-class-names-1.4.2.tgz", + "integrity": "sha512-bOl98VzwCGi25Gcn3xKxnR5p/WrhWFQB59MS/aGENcmUc6iSm96yrFDF0XSNurX9qN4LbJm0R9kfvsQ17i8zCw==" + }, "merge-descriptors": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz", "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E=" }, + "merge-refs": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/merge-refs/-/merge-refs-1.0.0.tgz", + "integrity": "sha512-WZ4S5wqD9FCR9hxkLgvcHJCBxzXzy3VVE6p8W2OzxRzB+hLRlcadGE2bW9xp2KSzk10rvp4y+pwwKO6JQVguMg==" + }, "merge-stream": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz", @@ -22740,6 +22837,12 @@ "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==" }, + "pdfjs-dist": { + "version": "2.12.313", + "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.12.313.tgz", + "integrity": "sha512-1x6iXO4Qnv6Eb+YFdN5JdUzt4pAkxSp3aLAYPX93eQCyg/m7QFzXVWJHJVtoW48CI8HCXju4dSkhQZwoheL5mA==", + "requires": {} + }, "performance-now": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", @@ -23747,6 +23850,23 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, + "react-pdf": { + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/react-pdf/-/react-pdf-5.7.2.tgz", + "integrity": "sha512-hdDwvf007V0i2rPCqQVS1fa70CXut17SN3laJYlRHzuqcu8sLLjEoeXihty6c0Ev5g1mw31b8OT8EwRw1s8C4g==", + "requires": { + "@babel/runtime": "^7.0.0", + "file-loader": "^6.0.0", + "make-cancellable-promise": "^1.0.0", + "make-event-props": "^1.1.0", + "merge-class-names": "^1.1.1", + "merge-refs": "^1.0.0", + "pdfjs-dist": "2.12.313", + "prop-types": "^15.6.2", + "tiny-invariant": "^1.0.0", + "tiny-warning": "^1.0.0" + } + }, "react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -24949,6 +25069,16 @@ "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz", "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==" }, + "tiny-invariant": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.2.0.tgz", + "integrity": "sha512-1Uhn/aqw5C6RI4KejVeTg6mIS7IqxnLJ8Mv2tV5rTc0qWobay7pDUz6Wi392Cnc8ak1H0F2cjoRzb2/AW4+Fvg==" + }, + "tiny-warning": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", + "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" + }, "tmpl": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.5.tgz", diff --git a/package.json b/package.json index 3dc29fd..d631cbd 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "dayjs": "^1.11.3", "react": "^18.1.0", "react-dom": "^18.1.0", + "react-pdf": "^5.7.2", "react-router-dom": "^6.3.0", "react-scripts": "5.0.1", "web-vitals": "^2.1.4" diff --git a/src/AuthenticatedApp.js b/src/AuthenticatedApp.js index 6c8c02a..de87f12 100644 --- a/src/AuthenticatedApp.js +++ b/src/AuthenticatedApp.js @@ -84,7 +84,8 @@ const container = { const mobileContainer = { ...container, - flexDirection: 'column-reverse', + flexDirection: 'column', + justifyContent: 'start', }; const menuOptions = activePath => [ diff --git a/src/screens/Calendar/calendario-academico.pdf b/src/screens/Calendar/calendario-academico.pdf new file mode 100644 index 0000000..2ec5d41 Binary files /dev/null and b/src/screens/Calendar/calendario-academico.pdf differ diff --git a/src/screens/Calendar/index.js b/src/screens/Calendar/index.js index 4045409..e6f2757 100644 --- a/src/screens/Calendar/index.js +++ b/src/screens/Calendar/index.js @@ -1,8 +1,66 @@ +import { Stack, Skeleton } from '@mui/material'; +import { Document, Page } from 'react-pdf/dist/esm/entry.webpack'; import { useDocumentTitle } from '../../hooks/useDocumentTitle'; +import useLayoutType from '../../hooks/useLayoutType'; + +import calendarPdf from './calendario-academico.pdf'; function Calendar() { useDocumentTitle('Calendário'); - return

Calendário Acadêmico

; + const layoutType = useLayoutType(); + const { innerWidth, innerHeight } = window; + + if (layoutType === 'desktop') { + return ( + + Falha ao carregar o arquivo.

} + loading={} + options={{ workerSrc: '/pdf.worker.js' }} + file={calendarPdf} + > + Carregando página...

} + scale={(1.5 * innerHeight) / 1400} + pageNumber={1} + /> +
+ + Baixar Calendário Acadêmico + +
+ ); + } else if (layoutType === 'mobile') { + return ( + + Falha ao carregar o arquivo.

} + loading={ + + } + options={{ workerSrc: '/pdf.worker.js' }} + file={calendarPdf} + > + Carregando página...

} + scale={innerHeight / (innerHeight + innerWidth)} + pageNumber={1} + /> +
+ + Baixar Calendário Acadêmico + +
+ ); + } } export default Calendar;