diff --git a/.eslintrc.json b/.eslintrc.json index bffb357a..4de216d1 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,3 +1,24 @@ { - "extends": "next/core-web-vitals" + "env": { + "browser": true, + "es2021": true + }, + "extends": [ + "plugin:@typescript-eslint/recommended", + "next", + "next/core-web-vitals", + "prettier" + ], + "parser": "@typescript-eslint/parser", + "parserOptions": { + "ecmaFeatures": { + "jsx": true + }, + "ecmaVersion": 12, + "sourceType": "module" + }, + "rules": { + "@typescript-eslint/no-explicit-any": "off" + }, + "plugins": ["@typescript-eslint"] } diff --git a/.github/dependabot.yml b/.github/dependabot.yml index 807c8521..c71e63e4 100644 --- a/.github/dependabot.yml +++ b/.github/dependabot.yml @@ -1,15 +1,15 @@ version: 2 updates: - - package-ecosystem: 'npm' - directory: '/' + - package-ecosystem: "npm" + directory: "/" target-branch: main schedule: - interval: 'weekly' + interval: "weekly" open-pull-requests-limit: 20 commit-message: - prefix: 'deps' - + prefix: "deps" + - package-ecosystem: "github-actions" directory: "/" schedule: - interval: "weekly" \ No newline at end of file + interval: "weekly" diff --git a/.prettierrc.js b/.prettierrc.js new file mode 100644 index 00000000..cc760e48 --- /dev/null +++ b/.prettierrc.js @@ -0,0 +1,7 @@ +module.exports = { + printWidth: 80, + semi: true, + singleQuote: true, + tabWidth: 2, + useTabs: false, +}; diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 00000000..31414458 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,28 @@ +{ + "version": "0.2.0", + "configurations": [ + { + "name": "Next.js: debug server-side", + "type": "node-terminal", + "request": "launch", + "command": "yarn run dev" + }, + { + "name": "Next.js: debug client-side", + "type": "chrome", + "request": "launch", + "url": "http://localhost:3000" + }, + { + "name": "Next.js: debug full stack", + "type": "node-terminal", + "request": "launch", + "command": "yarn run dev", + "serverReadyAction": { + "pattern": "started server on .+, url: (https?://.+)", + "uriFormat": "%s", + "action": "debugWithChrome" + } + } + ] +} diff --git a/audit-ci.jsonc b/audit-ci.jsonc index 09dffc4f..7f0f7425 100644 --- a/audit-ci.jsonc +++ b/audit-ci.jsonc @@ -1,16 +1,16 @@ { - // audit-ci supports reading JSON, JSONC, and JSON5 config files. - // Add a $schema property to enable JSON schema validation. - "$schema": "https://github.com/IBM/audit-ci/raw/main/docs/schema.json", - // You only need one of ["low", "moderate", "high", "critical"]. - "low": true, - "allowlist": [ - { - "GHSA-9c47-m6qq-7p4h|eslint-plugin-import>tsconfig-paths>json5": { - "active": true, // This field is optional and defaults to true. - "expiry": "", // There's no need to set an expiry date because we are unaffected. - "notes": "Transitive development-only dependency for linting doesn't impact the security of this application in production or for developers." - } + // audit-ci supports reading JSON, JSONC, and JSON5 config files. + // Add a $schema property to enable JSON schema validation. + "$schema": "https://github.com/IBM/audit-ci/raw/main/docs/schema.json", + // You only need one of ["low", "moderate", "high", "critical"]. + "low": true, + "allowlist": [ + { + "GHSA-9c47-m6qq-7p4h|eslint-plugin-import>tsconfig-paths>json5": { + "active": true, // This field is optional and defaults to true. + "expiry": "", // There's no need to set an expiry date because we are unaffected. + "notes": "Transitive development-only dependency for linting doesn't impact the security of this application in production or for developers." } - ] - } + } + ] +} diff --git a/package.json b/package.json index e858481a..6ccae485 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "aws-amplify": "^5.1.4", "axios": "^1.4.0", "cookie": "^0.5.0", - "eslint": "8.35.0", + "eslint": "^8.40.0", "eslint-config-next": "13.2.3", "next": "13.2.3", "prop-types": ">=15.7.0", @@ -39,11 +39,17 @@ "yup": "0.32.11" }, "devDependencies": { - "@types/axios": "^0.14.0", "@types/cookie": "^0.5.1", "@types/node": "^18.16.3", "@types/react": "^18.2.1", "@types/react-dom": "^18.2.2", - "@types/react-google-recaptcha": "^2.1.5" + "@types/react-google-recaptcha": "^2.1.5", + "@typescript-eslint/eslint-plugin": "^5.59.5", + "@typescript-eslint/parser": "^5.59.5", + "eslint-config-prettier": "^8.8.0", + "eslint-import-resolver-typescript": "^3.5.5", + "eslint-plugin-import": "^2.26.0", + "eslint-plugin-prettier": "^4.2.1", + "prettier": ">=2.0.0" } } diff --git a/public/assets/forma.png.REMOVED.git-id b/public/assets/forma.png.REMOVED.git-id index ea83b860..64b491da 100644 --- a/public/assets/forma.png.REMOVED.git-id +++ b/public/assets/forma.png.REMOVED.git-id @@ -1 +1 @@ -d37a2f5aa588ebc67f5d8f8349f1ee83bef65bd0 \ No newline at end of file +b99d6dbb23d221d570860372d59978f77b3a739f \ No newline at end of file diff --git a/public/assets/glass.png b/public/assets/glass.png index 2fe34da9..d9a2191e 100644 Binary files a/public/assets/glass.png and b/public/assets/glass.png differ diff --git a/public/assets/ladingChica.png.REMOVED.git-id b/public/assets/ladingChica.png.REMOVED.git-id deleted file mode 100644 index 0f8c61de..00000000 --- a/public/assets/ladingChica.png.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -ca6b2899d58b0e0412c91dbe9f234760f4f91a49 \ No newline at end of file diff --git a/public/assets/ladingChica2.png.REMOVED.git-id b/public/assets/ladingChica2.png.REMOVED.git-id deleted file mode 100644 index 9e054ff5..00000000 --- a/public/assets/ladingChica2.png.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -fc90b4e3f45ef88f6f7713390b5ee061fd2e7275 \ No newline at end of file diff --git a/public/assets/ladingHome.svg.REMOVED.git-id b/public/assets/ladingHome.svg.REMOVED.git-id deleted file mode 100644 index eb7a2e04..00000000 --- a/public/assets/ladingHome.svg.REMOVED.git-id +++ /dev/null @@ -1 +0,0 @@ -b57210e2cf14b085b5a4e929a80a8e36c3c4ebe8 \ No newline at end of file diff --git a/public/assets/landingChica.png.REMOVED.git-id b/public/assets/landingChica.png.REMOVED.git-id new file mode 100644 index 00000000..0d3b2ea4 --- /dev/null +++ b/public/assets/landingChica.png.REMOVED.git-id @@ -0,0 +1 @@ +b3cad6e88de4ad1b321245cc7e08d84a40d54288 \ No newline at end of file diff --git a/public/assets/landingChica2.png.REMOVED.git-id b/public/assets/landingChica2.png.REMOVED.git-id new file mode 100644 index 00000000..0b60f464 --- /dev/null +++ b/public/assets/landingChica2.png.REMOVED.git-id @@ -0,0 +1 @@ +44e98e12f0d9ae1c0096cf29dcfdb37d0d2b4b76 \ No newline at end of file diff --git a/public/assets/landingChico.png.REMOVED.git-id b/public/assets/landingChico.png.REMOVED.git-id new file mode 100644 index 00000000..1d6eeb5c --- /dev/null +++ b/public/assets/landingChico.png.REMOVED.git-id @@ -0,0 +1 @@ +19338c622e8ace9bc92af8c3af7523f6d9221472 \ No newline at end of file diff --git a/public/assets/landingHome.svg.REMOVED.git-id b/public/assets/landingHome.svg.REMOVED.git-id new file mode 100644 index 00000000..25547c32 --- /dev/null +++ b/public/assets/landingHome.svg.REMOVED.git-id @@ -0,0 +1 @@ +954dcd5318fbeb1aa77932a90e26b0846e80ceed \ No newline at end of file diff --git a/public/assets/logoCuentaUnica.png b/public/assets/logoCuentaUnica.png index 727b12af..8183a0a5 100644 Binary files a/public/assets/logoCuentaUnica.png and b/public/assets/logoCuentaUnica.png differ diff --git a/public/assets/logoDedo.png b/public/assets/logoDedo.png index 00a1dd0e..be6a13dc 100644 Binary files a/public/assets/logoDedo.png and b/public/assets/logoDedo.png differ diff --git a/public/assets/logoGOB.png b/public/assets/logoGOB.png index a33c1a51..78679fa3 100644 Binary files a/public/assets/logoGOB.png and b/public/assets/logoGOB.png differ diff --git a/public/assets/logoOGTIC.png b/public/assets/logoOGTIC.png index fc0f91bf..d9ffe15c 100644 Binary files a/public/assets/logoOGTIC.png and b/public/assets/logoOGTIC.png differ diff --git a/public/assets/smile.png b/public/assets/smile.png index f7c99024..e99ad82a 100644 Binary files a/public/assets/smile.png and b/public/assets/smile.png differ diff --git a/public/assets/sun.png b/public/assets/sun.png index 8090d6b7..27a185d7 100644 Binary files a/public/assets/sun.png and b/public/assets/sun.png differ diff --git a/src/components/biometric/displayText.ts b/src/components/biometric/displayText.ts index 2d7cce2c..2f507e98 100644 --- a/src/components/biometric/displayText.ts +++ b/src/components/biometric/displayText.ts @@ -1,125 +1,128 @@ export type HintDisplayText = { - hintMoveFaceFrontOfCameraText?: string; - hintTooManyFacesText?: string; - hintFaceDetectedText?: string; - hintCanNotIdentifyText?: string; - hintTooCloseText?: string; - hintTooFarText?: string; - hintHoldFacePositionCountdownText?: string; - hintConnectingText?: string; - hintVerifyingText?: string; - hintIlluminationTooBrightText?: string; - hintIlluminationTooDarkText?: string; - hintIlluminationNormalText?: string; - hintHoldFaceForFreshnessText?: string; - }; - - export type CameraDisplayText = { - cameraMinSpecificationsHeadingText?: string; - cameraMinSpecificationsMessageText?: string; - cameraNotFoundHeadingText?: string; - cameraNotFoundMessageText?: string; - retryCameraPermissionsText?: string; - }; - - export type InstructionDisplayText = { - instructionsHeaderHeadingText?: string; - instructionsHeaderBodyText?: string; - instructionsBeginCheckText?: string; - photosensitivyWarningHeadingText?: string; - photosensitivyWarningBodyText?: string; - photosensitivyWarningInfoText?: string; - instructionListHeadingText?: string; - goodFitCaptionText?: string; - goodFitAltText?: string; - tooFarCaptionText?: string; - tooFarAltText?: string; - instructionListStepOneText?: string; - instructionListStepTwoText?: string; - instructionListStepThreeText?: string; - instructionListStepFourText?: string; - }; - - export type StreamDisplayText = { - recordingIndicatorText?: string; - cancelLivenessCheckText?: string; - }; - - export const defaultErrorDisplayText = { - timeoutHeaderText: 'Se acabó el tiempo', - timeoutMessageText: - "La cara no llenó el óvalo dentro del límite de tiempo. Vuelva a intentarlo y llene completamente el óvalo con la cara en 7 segundos.", - faceDistanceHeaderText: 'Comprobación fallida durante la cuenta atrás', - faceDistanceMessageText: - 'Evite acercarse durante la cuenta regresiva y asegúrese de que solo una cara esté frente a la cámara.', - clientHeaderText: 'Error del cliente', - clientMessageText: 'Verificación fallida debido a un problema con el cliente', - serverHeaderText: 'Problema del servidor', - serverMessageText: 'No se puede completar la verificación debido a un problema con el servidor', - landscapeHeaderText: 'Orientación horizontal no compatible', - landscapeMessageText: - 'Gire su dispositivo a la orientación vertical (retrato).', - portraitMessageText: - 'Asegúrese de que su dispositivo permanezca en orientación vertical (retrato) durante la verificación.', - tryAgainText: 'Intentar otra vez', - }; - - export type ErrorDisplayTextFoo = typeof defaultErrorDisplayText; - export type ErrorDisplayText = Partial; - - export const defaultLivenessDisplayText: Required = { - instructionsHeaderHeadingText: 'Liveness check', - instructionsHeaderBodyText: - 'You will go through a face verification process to prove that you are a real person.', - instructionsBeginCheckText: 'Begin check', - photosensitivyWarningHeadingText: 'Photosensitivity warning', - photosensitivyWarningBodyText: - 'This check displays colored lights. Use caution if you are photosensitive.', - photosensitivyWarningInfoText: - 'A small percentage of individuals may experience epileptic seizures when exposed to colored lights. Use caution if you, or anyone in your family, have an epileptic condition.', - instructionListHeadingText: 'Follow the instructions to complete the check:', - goodFitCaptionText: 'Good fit', - goodFitAltText: - "Ilustration of a person's face, perfectly fitting inside of an oval.", - tooFarCaptionText: 'Too far', - tooFarAltText: - "Illustration of a person's face inside of an oval; there is a gap between the perimeter of the face and the boundaries of the oval.", - instructionListStepOneText: - 'When an oval appears, fill the oval with your face within 7 seconds.', - instructionListStepTwoText: "Maximize your screen's brightness.", - instructionListStepThreeText: - 'Make sure your face is not covered with sunglasses or a mask.', - instructionListStepFourText: - 'Move to a well-lit place that is not in direct sunlight.', - cameraMinSpecificationsHeadingText: - 'Camera does not meet minimum specifications', - cameraMinSpecificationsMessageText: - 'Camera must support at least 320*240 resolution and 15 frames per second.', - cameraNotFoundHeadingText: 'Camera not accessible.', - cameraNotFoundMessageText: - 'Verifique que la cámara esté conectada y que los permisos de la cámara estén habilitados en la configuración antes de volver a intentarlo.', - retryCameraPermissionsText: 'Procesar de nuevo', - cancelLivenessCheckText: 'Cancelar comprobación de vitalidad', - recordingIndicatorText: 'Grabación', - hintMoveFaceFrontOfCameraText: 'Mover la cara frente a la cámara', - hintTooManyFacesText: 'Asegúrese de que solo una cara esté frente a la cámara', - hintFaceDetectedText: 'Cara detectada', - hintCanNotIdentifyText: 'Mover la cara frente a la cámara', - hintTooCloseText: 'Muévete mas atrás', - hintTooFarText: 'Muévete mas cerca', - hintHoldFacePositionCountdownText: 'Mantener la posición de la cara durante la cuenta regresiva', - hintConnectingText: 'Conectando...', - hintVerifyingText: 'Verificando...', - hintIlluminationTooBrightText: 'Mover al área de atenuación', - hintIlluminationTooDarkText: 'Mover a un área más brillante', - hintIlluminationNormalText: 'Condiciones de iluminación normales', - hintHoldFaceForFreshnessText: 'Quédate quieto', - ...defaultErrorDisplayText, - }; - - export interface LivenessDisplayText - extends HintDisplayText, - CameraDisplayText, - InstructionDisplayText, - ErrorDisplayText, - StreamDisplayText {} \ No newline at end of file + hintMoveFaceFrontOfCameraText?: string; + hintTooManyFacesText?: string; + hintFaceDetectedText?: string; + hintCanNotIdentifyText?: string; + hintTooCloseText?: string; + hintTooFarText?: string; + hintHoldFacePositionCountdownText?: string; + hintConnectingText?: string; + hintVerifyingText?: string; + hintIlluminationTooBrightText?: string; + hintIlluminationTooDarkText?: string; + hintIlluminationNormalText?: string; + hintHoldFaceForFreshnessText?: string; +}; + +export type CameraDisplayText = { + cameraMinSpecificationsHeadingText?: string; + cameraMinSpecificationsMessageText?: string; + cameraNotFoundHeadingText?: string; + cameraNotFoundMessageText?: string; + retryCameraPermissionsText?: string; +}; + +export type InstructionDisplayText = { + instructionsHeaderHeadingText?: string; + instructionsHeaderBodyText?: string; + instructionsBeginCheckText?: string; + photosensitivyWarningHeadingText?: string; + photosensitivyWarningBodyText?: string; + photosensitivyWarningInfoText?: string; + instructionListHeadingText?: string; + goodFitCaptionText?: string; + goodFitAltText?: string; + tooFarCaptionText?: string; + tooFarAltText?: string; + instructionListStepOneText?: string; + instructionListStepTwoText?: string; + instructionListStepThreeText?: string; + instructionListStepFourText?: string; +}; + +export type StreamDisplayText = { + recordingIndicatorText?: string; + cancelLivenessCheckText?: string; +}; + +export const defaultErrorDisplayText = { + timeoutHeaderText: 'Se acabó el tiempo', + timeoutMessageText: + 'La cara no llenó el óvalo dentro del límite de tiempo. Vuelva a intentarlo y llene completamente el óvalo con la cara en 7 segundos.', + faceDistanceHeaderText: 'Comprobación fallida durante la cuenta atrás', + faceDistanceMessageText: + 'Evite acercarse durante la cuenta regresiva y asegúrese de que solo una cara esté frente a la cámara.', + clientHeaderText: 'Error del cliente', + clientMessageText: 'Verificación fallida debido a un problema con el cliente', + serverHeaderText: 'Problema del servidor', + serverMessageText: + 'No se puede completar la verificación debido a un problema con el servidor', + landscapeHeaderText: 'Orientación horizontal no compatible', + landscapeMessageText: + 'Gire su dispositivo a la orientación vertical (retrato).', + portraitMessageText: + 'Asegúrese de que su dispositivo permanezca en orientación vertical (retrato) durante la verificación.', + tryAgainText: 'Intentar otra vez', +}; + +export type ErrorDisplayTextFoo = typeof defaultErrorDisplayText; +export type ErrorDisplayText = Partial; + +export const defaultLivenessDisplayText: Required = { + instructionsHeaderHeadingText: 'Liveness check', + instructionsHeaderBodyText: + 'You will go through a face verification process to prove that you are a real person.', + instructionsBeginCheckText: 'Begin check', + photosensitivyWarningHeadingText: 'Photosensitivity warning', + photosensitivyWarningBodyText: + 'This check displays colored lights. Use caution if you are photosensitive.', + photosensitivyWarningInfoText: + 'A small percentage of individuals may experience epileptic seizures when exposed to colored lights. Use caution if you, or anyone in your family, have an epileptic condition.', + instructionListHeadingText: 'Follow the instructions to complete the check:', + goodFitCaptionText: 'Good fit', + goodFitAltText: + "Ilustration of a person's face, perfectly fitting inside of an oval.", + tooFarCaptionText: 'Too far', + tooFarAltText: + "Illustration of a person's face inside of an oval; there is a gap between the perimeter of the face and the boundaries of the oval.", + instructionListStepOneText: + 'When an oval appears, fill the oval with your face within 7 seconds.', + instructionListStepTwoText: "Maximize your screen's brightness.", + instructionListStepThreeText: + 'Make sure your face is not covered with sunglasses or a mask.', + instructionListStepFourText: + 'Move to a well-lit place that is not in direct sunlight.', + cameraMinSpecificationsHeadingText: + 'Camera does not meet minimum specifications', + cameraMinSpecificationsMessageText: + 'Camera must support at least 320*240 resolution and 15 frames per second.', + cameraNotFoundHeadingText: 'Camera not accessible.', + cameraNotFoundMessageText: + 'Verifique que la cámara esté conectada y que los permisos de la cámara estén habilitados en la configuración antes de volver a intentarlo.', + retryCameraPermissionsText: 'Procesar de nuevo', + cancelLivenessCheckText: 'Cancelar comprobación de vitalidad', + recordingIndicatorText: 'Grabación', + hintMoveFaceFrontOfCameraText: 'Mover la cara frente a la cámara', + hintTooManyFacesText: + 'Asegúrese de que solo una cara esté frente a la cámara', + hintFaceDetectedText: 'Cara detectada', + hintCanNotIdentifyText: 'Mover la cara frente a la cámara', + hintTooCloseText: 'Muévete mas atrás', + hintTooFarText: 'Muévete mas cerca', + hintHoldFacePositionCountdownText: + 'Mantener la posición de la cara durante la cuenta regresiva', + hintConnectingText: 'Conectando...', + hintVerifyingText: 'Verificando...', + hintIlluminationTooBrightText: 'Mover al área de atenuación', + hintIlluminationTooDarkText: 'Mover a un área más brillante', + hintIlluminationNormalText: 'Condiciones de iluminación normales', + hintHoldFaceForFreshnessText: 'Quédate quieto', + ...defaultErrorDisplayText, +}; + +export interface LivenessDisplayText + extends HintDisplayText, + CameraDisplayText, + InstructionDisplayText, + ErrorDisplayText, + StreamDisplayText {} diff --git a/src/components/biometric/face-liveness-detector.tsx b/src/components/biometric/face-liveness-detector.tsx index 34ca948d..d4a1ef5c 100644 --- a/src/components/biometric/face-liveness-detector.tsx +++ b/src/components/biometric/face-liveness-detector.tsx @@ -1,21 +1,18 @@ -import { FaceLivenessDetector } from "@aws-amplify/ui-react-liveness"; -import { ThemeProvider } from "@aws-amplify/ui-react"; -import React from "react"; -import { LoadingProgress } from "../elements/loading"; -import { AlertErrorMessage } from "../elements/alert"; -import { View, Heading, Alert, Card, Text } from '@aws-amplify/ui-react'; -import { defaultLivenessDisplayText } from './displayText' +import { FaceLivenessDetector } from '@aws-amplify/ui-react-liveness'; +import { Loader, ThemeProvider } from '@aws-amplify/ui-react'; +import { useState, useEffect } from 'react'; +import { defaultLivenessDisplayText } from './displayText'; export function LivenessQuickStartReact({ handleNextForm, cedula }: any) { const next = handleNextForm; const id = cedula; - const [loading, setLoading] = React.useState(true); - const [error, setError] = React.useState(false); - const [sessionId, setSessionId] = React.useState(""); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(false); + const [sessionId, setSessionId] = useState(''); - React.useEffect(() => { + useEffect(() => { const fetchCreateLiveness = async () => { - const response = await fetch(`/api/biometric`, { method: "POST" }); + const response = await fetch(`/api/biometric`, { method: 'POST' }); const { sessionId } = await response.json(); setSessionId(sessionId); @@ -25,132 +22,38 @@ export function LivenessQuickStartReact({ handleNextForm, cedula }: any) { fetchCreateLiveness(); }, []); + const onUserCancel = () => { + setSessionId(''); + setError(false); + }; + const handleAnalysisComplete = async () => { const response = await fetch( `/api/biometric?sessionId=${sessionId}&cedula=${id}` ); const data = await response.json(); - if (data.match) { + if (data.match === true) { next(); } else { - setError(true); + setError(error); } }; - // const dictionary = { - // // use default strings for english - // en: null, - // es: { - // instructionsHeaderHeadingText: 'Verificación de vida', - // instructionsHeaderBodyText: - // 'Pasará por un proceso de verificación facial para demostrar que es una persona real.', - // instructionListStepOneText: - // 'Cuando aparezca un óvalo, rellena el óvalo con tu cara en 7 segundos.', - // instructionListStepTwoText: 'Maximiza el brillo de tu pantalla.', - // instructionListStepThreeText: - // 'Asegúrese de que su cara no esté cubierta con gafas de sol o una máscara.', - // instructionListStepFourText: - // 'Muévase a un lugar bien iluminado que no esté expuesto a la luz solar directa.', - // photosensitivyWarningHeadingText: 'Advertencia de fotosensibilidad', - // photosensitivyWarningBodyText: - // 'Esta verificación muestra luces de colores. Tenga cuidado si es fotosensible.', - // instructionListHeadingText: - // 'Siga las instrucciones para completar la verificación:', - // goodFitCaptionText: 'Buen ajuste', - // tooFarCaptionText: 'Demasiado lejos', - // }, - // }; - return ( - <> - {error && - + {loading ? ( + + ) : ( + - } -
- - {loading ? ( - - ) : ( - { - // return ( - // <> - // asd - // - // // - // // asd - // // - // // Yasdasd - // // - // // - // ); - // }, - // PhotosensitiveWarning: (): JSX.Element => { - // return ( - // <> - // asd - // - // // - // // asdasd - // // - // ); - // }, - // Instructions: (): JSX.Element => { - // return ( - // <> - // asd - // - // // - // // asdasd - // //
    - // //
  1. - // // asdasdasdmask. - // //
    2. - // //
  2. - // // Moasdasdas - // //
    3. - // //
  3. - // // Fill oasdasdasdasdasdold for colored lights. - // //
    4. - // //
- // // - // ); - // }, - // ErrorView: ({ children } : any) => { - // return ( - // <> - //
- // - // {/* - // adasdsd - // {children} - // asdsd - // */} - // - // ); - // }, - // }} - /> - )} - - + )} + ); } diff --git a/src/components/elements/alert/index.tsx b/src/components/elements/alert/index.tsx index 58fbcefb..b7b8c9aa 100644 --- a/src/components/elements/alert/index.tsx +++ b/src/components/elements/alert/index.tsx @@ -1,41 +1,39 @@ -import Swal from "sweetalert2"; +import Swal from 'sweetalert2'; import Alert from '@mui/material/Alert'; interface IPropsAlertErrorMessage { message: string; - type: "error" | "warning" | "info" | "success" -} - interface IProps { - text?: string; + type: 'error' | 'warning' | 'info' | 'success'; } -export const AlertErrorMessage = ({message, type}: IPropsAlertErrorMessage) => ( - {message} -) +export const AlertErrorMessage = ({ + message, + type, +}: IPropsAlertErrorMessage) => {message}; - export const AlertError = (text?: string) => { +export const AlertError = (text?: string) => { return Swal.fire({ - icon: "error", - title: "Error", - text: text ? text : "Ocurrió un error al procesar la solicitud", - confirmButtonColor: "#003670", + icon: 'error', + title: 'Error', + text: text ? text : 'Ocurrió un error al procesar la solicitud', + confirmButtonColor: '#003670', }); }; export const AlertWarning = (text: string) => { return Swal.fire({ - icon: "warning", - title: "Aviso", + icon: 'warning', + title: 'Aviso', text: text, - confirmButtonColor: "#003670", + confirmButtonColor: '#003670', }); }; export const AlertSuccess = (text?: string) => { return Swal.fire({ - icon: "success", - title: "Correcto", - text: text ? text : "Proceso realizado correctamente", - confirmButtonColor: "#003670", + icon: 'success', + title: 'Correcto', + text: text ? text : 'Proceso realizado correctamente', + confirmButtonColor: '#003670', }); }; diff --git a/src/components/elements/boxContentCenter/index.tsx b/src/components/elements/boxContentCenter/index.tsx index 5fbde208..0c757934 100644 --- a/src/components/elements/boxContentCenter/index.tsx +++ b/src/components/elements/boxContentCenter/index.tsx @@ -11,7 +11,9 @@ export default function BoxContentCenter({ children }: any) { alignItems: "center", }} > - {children} + + {children} + ); } diff --git a/src/components/elements/cardAuth/index.tsx b/src/components/elements/cardAuth/index.tsx index 6d2da7b1..4683fe0b 100644 --- a/src/components/elements/cardAuth/index.tsx +++ b/src/components/elements/cardAuth/index.tsx @@ -10,22 +10,22 @@ export const CardAuth = ({ subTitle, subTitle2, children, - lading, - ladingWidth, - ladingHeight, + landing, + landingWidth, + landingHeight, icon, }: any) => { return (
- {lading && ( + {landing && (
Lading
)} diff --git a/src/components/elements/loading/index.tsx b/src/components/elements/loading/index.tsx index 15e0c12d..74205b58 100644 --- a/src/components/elements/loading/index.tsx +++ b/src/components/elements/loading/index.tsx @@ -1,10 +1,10 @@ -import CircularProgress from '@mui/material/CircularProgress'; -import Box from '@mui/material/Box'; +import CircularProgress from "@mui/material/CircularProgress"; +import Box from "@mui/material/Box"; export const LoadingProgress = () => { return ( - - + + ); -} \ No newline at end of file +}; diff --git a/src/components/elements/loadingBackdrop/index.tsx b/src/components/elements/loadingBackdrop/index.tsx index b487efa4..db3bbe9a 100644 --- a/src/components/elements/loadingBackdrop/index.tsx +++ b/src/components/elements/loadingBackdrop/index.tsx @@ -1,21 +1,21 @@ -import * as React from "react"; -import Backdrop from "@mui/material/Backdrop"; -import CircularProgress from "@mui/material/CircularProgress"; -import { Typography } from "@mui/material"; +import * as React from 'react'; +import Backdrop from '@mui/material/Backdrop'; +import CircularProgress from '@mui/material/CircularProgress'; +import { Typography } from '@mui/material'; interface IProps { text?: string; } export default function LoadingBackdrop({ text }: IProps) { - const [open, setOpen] = React.useState(true); + const [open] = React.useState(true); return ( theme.zIndex.modal + 1 }} + sx={{ color: '#fff', zIndex: (theme) => theme.zIndex.modal + 1 }} open={open} > -
+
{text && {text}}
diff --git a/src/components/form/input/index.tsx b/src/components/form/input/index.tsx index 436a81ec..128f8e65 100644 --- a/src/components/form/input/index.tsx +++ b/src/components/form/input/index.tsx @@ -1,11 +1,11 @@ -import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; +import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined"; import Tooltip, { TooltipProps, tooltipClasses } from "@mui/material/Tooltip"; import { FormControl, InputLabel, Typography } from "@mui/material"; import { styled } from "@mui/material/styles"; import { IconButton } from "@mui/material"; interface IProps { - label?: String; + label?: string; icon?: any; msg?: string; required?: boolean; @@ -39,7 +39,18 @@ export const FormControlApp = (props: IProps) => { error={props.msg ? true : false} shrink={true} > - {props.label} {props.required && "*"} {props.icon} + {props.label}{" "} + + {props.required && "*"} + {" "} + {props.icon} {props.tooltip && ( { } > - + diff --git a/src/components/layout/footer.tsx b/src/components/layout/footer.tsx index 89f03f9d..930c7767 100644 --- a/src/components/layout/footer.tsx +++ b/src/components/layout/footer.tsx @@ -14,7 +14,14 @@ export default function Index() { return ( <>
-
+
@@ -78,7 +85,14 @@ export default function Index() {
-
+
diff --git a/src/components/layout/navBar.tsx b/src/components/layout/navBar.tsx index 3e602cf7..9e8076ed 100644 --- a/src/components/layout/navBar.tsx +++ b/src/components/layout/navBar.tsx @@ -1,13 +1,12 @@ -import AppsIcon from "@mui/icons-material/Apps"; -import AppBar from "@mui/material/AppBar"; -import Toolbar from "@mui/material/Toolbar"; -import Box from "@mui/material/Box"; -import Script from "next/script"; -import Image from "next/image"; -import Link from "next/link"; +import AppsIcon from '@mui/icons-material/Apps'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import Box from '@mui/material/Box'; +import Script from 'next/script'; +import Image from 'next/image'; +import Link from 'next/link'; -import Logo from "../../../public/assets/logo.png"; -import { routes } from "@/constants/routes"; +import Logo from '../../../public/assets/logo.png'; export default function Index() { return ( @@ -19,16 +18,20 @@ export default function Index() { -
- -
- +
+ +
+ logo
- -
+ +
diff --git a/src/constants/labels.ts b/src/constants/labels.ts index a64e29a7..5c58b0f9 100644 --- a/src/constants/labels.ts +++ b/src/constants/labels.ts @@ -1,12 +1,12 @@ export const labels = { form: { - requiredField: "Campo requerido", - requiredEmail: "El Correo Electrónico es obligatorio", - invalidEmail: "El Correo Electrónico no es válido", + requiredField: 'Campo requerido', + requiredEmail: 'El Correo Electrónico es obligatorio', + invalidEmail: 'El Correo Electrónico no es válido', }, select: { - select: "Sin Seleccionar", - selectFilters: "Todos(as)", - inputRequired: "Campo requerido", + select: 'Sin Seleccionar', + selectFilters: 'Todos(as)', + inputRequired: 'Campo requerido', }, }; diff --git a/src/constants/routes.ts b/src/constants/routes.ts index 59bf2f26..512c07c4 100644 --- a/src/constants/routes.ts +++ b/src/constants/routes.ts @@ -1,12 +1,12 @@ export const routes = { auth: { - home: "/", - password: "auth/password", - method: "method", + home: '/', + password: 'auth/password', + method: 'method', }, register: { - home: "register", - confirmation: "register/confirmation", - registered: "register/registered", + home: 'register', + confirmation: 'register/confirmation', + registered: 'register/registered', }, }; diff --git a/src/helpers/index.ts b/src/helpers/index.ts index 9de9c997..c95fe023 100644 --- a/src/helpers/index.ts +++ b/src/helpers/index.ts @@ -1,2 +1 @@ -export { validateSameSiteRequest } from "./same-site-validator"; -export { getRekognitionClient } from "./rekognition"; +export { getRekognitionClient } from './rekognition'; diff --git a/src/helpers/rekognition.ts b/src/helpers/rekognition.ts index 6c246630..596f2a41 100644 --- a/src/helpers/rekognition.ts +++ b/src/helpers/rekognition.ts @@ -1,21 +1,19 @@ -import { Rekognition } from "@aws-sdk/client-rekognition"; -import { Amplify, withSSRContext } from "aws-amplify"; -import { NextApiRequest } from "next/types"; +import { RekognitionClient } from '@aws-sdk/client-rekognition'; +import { Amplify, withSSRContext } from 'aws-amplify'; +import { NextApiRequest } from 'next/types'; -import awsExports from "../aws-exports"; +import awsExports from '../aws-exports'; Amplify.configure({ ...awsExports, ssr: true }); export async function getRekognitionClient( req: NextApiRequest -): Promise { - const { Credentials } = withSSRContext({ req }); - const credentials = await Credentials.get(); - const endpoint = "https://rekognition.us-east-1.amazonaws.com"; +): Promise { + const SSR = withSSRContext({ req }); + const credentials = await SSR.Credentials.get(); - return new Rekognition({ - region: "us-east-1", + return new RekognitionClient({ + region: awsExports.aws_project_region, credentials, - endpoint, }); } diff --git a/src/helpers/same-site-validator.ts b/src/helpers/same-site-validator.ts deleted file mode 100644 index d987f57d..00000000 --- a/src/helpers/same-site-validator.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { IncomingHttpHeaders } from "node:http"; - -export function validateSameSiteRequest(headers: IncomingHttpHeaders) { - const fetchHeaderKey = "sec-fetch-site"; - const fetchHeaderValue = "same-origin"; - - return ( - headers[fetchHeaderKey] && headers[fetchHeaderKey] === fetchHeaderValue - ); -} diff --git a/src/models/challenge-response.ts b/src/models/challenge-response.ts index 0fcbdda1..c3617c96 100644 --- a/src/models/challenge-response.ts +++ b/src/models/challenge-response.ts @@ -16,8 +16,8 @@ export class Challenge { !this.sign?.PINKY ) { return { - text: "Muestra tu mano cerrada", - image: "fist", + text: 'Muestra tu mano cerrada', + image: 'fist', }; } @@ -29,8 +29,8 @@ export class Challenge { !this.sign?.PINKY ) { return { - text: "Muestra tu pulgar", - image: "thumb", + text: 'Muestra tu pulgar', + image: 'thumb', }; } @@ -42,8 +42,8 @@ export class Challenge { !this.sign?.PINKY ) { return { - text: "Muestra dos dedos", - image: "two-fingers", + text: 'Muestra dos dedos', + image: 'two-fingers', }; } @@ -55,8 +55,8 @@ export class Challenge { !this.sign?.PINKY ) { return { - text: "Muestra tres dedos", - image: "three-fingers", + text: 'Muestra tres dedos', + image: 'three-fingers', }; } @@ -68,8 +68,8 @@ export class Challenge { this.sign?.PINKY ) { return { - text: "Muestra tu mano abierta", - image: "open-hand", + text: 'Muestra tu mano abierta', + image: 'open-hand', }; } diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 72f85496..8069c35c 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -1,15 +1,15 @@ -import CssBaseline from "@mui/material/CssBaseline"; -import { ThemeProvider } from "@mui/material/styles"; -import type { AppProps } from "next/app"; -import { Amplify } from "aws-amplify"; -import Head from "next/head"; +import CssBaseline from '@mui/material/CssBaseline'; +import { ThemeProvider } from '@mui/material/styles'; +import type { AppProps } from 'next/app'; +import { Amplify } from 'aws-amplify'; +import Head from 'next/head'; -import Layout from "../components/layout"; -import awsExports from "../aws-exports"; -import { theme } from "../themes"; +import Layout from '../components/layout'; +import awsExports from '../aws-exports'; +import { theme } from '../themes'; -import "@aws-amplify/ui-react/styles.css"; -import "@/styles/globals.css"; +import '@aws-amplify/ui-react/styles.css'; +import '@/styles/globals.css'; Amplify.configure(awsExports); diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx index e82cb215..367fe2be 100644 --- a/src/pages/_document.tsx +++ b/src/pages/_document.tsx @@ -1,4 +1,4 @@ -import { Html, Head, Main, NextScript } from "next/document"; +import { Html, Head, Main, NextScript } from 'next/document'; export default function Document() { return ( diff --git a/src/pages/api/auth/index.ts b/src/pages/api/auth/index.ts index 0b7b7c2f..c8f2788a 100644 --- a/src/pages/api/auth/index.ts +++ b/src/pages/api/auth/index.ts @@ -1,18 +1,18 @@ -import { NextApiRequest, NextApiResponse } from "next/types"; -import cookie from "cookie"; +import { NextApiRequest, NextApiResponse } from 'next/types'; +import cookie from 'cookie'; export default async function handler( req: NextApiRequest, res: NextApiResponse ): Promise { res.setHeader( - "Set-cookie", - cookie.serialize("token", process.env.NEXT_PUBLIC_COOKIE_KEY as string, { + 'Set-cookie', + cookie.serialize('token', process.env.NEXT_PUBLIC_COOKIE_KEY as string, { httpOnly: true, secure: true, maxAge: 60 * 60 * 10, - sameSite: "strict", - path: "/", + sameSite: 'strict', + path: '/', }) ); diff --git a/src/pages/api/biometric/index.ts b/src/pages/api/biometric/index.ts index d3f28b08..126044aa 100644 --- a/src/pages/api/biometric/index.ts +++ b/src/pages/api/biometric/index.ts @@ -1,7 +1,12 @@ -import { NextApiRequest, NextApiResponse } from "next/types"; -import axios from "axios"; +import { NextApiRequest, NextApiResponse } from 'next/types'; +import axios from 'axios'; -import { getRekognitionClient } from "@/helpers"; +import { getRekognitionClient } from '@/helpers'; +import { + GetFaceLivenessSessionResultsCommand, + CompareFacesCommand, + CreateFaceLivenessSessionCommand, +} from '@aws-sdk/client-rekognition'; export default async function handler( req: NextApiRequest, @@ -17,65 +22,73 @@ export default async function handler( baseURL: process.env.NEXT_PUBLIC_PHOTO_API, }); - const rekognition = await getRekognitionClient(req); + const client = await getRekognitionClient(req); - if (req.method === "GET") { + if (req.method === 'GET') { const { sessionId, cedula } = req.query; const SessionId = sessionId as string; - const response = await rekognition.getFaceLivenessSessionResults({ + const command = new GetFaceLivenessSessionResultsCommand({ SessionId, }); + const response = await client.send(command); - let isLive: any; - let base64Image: string = ""; - let result: any; + let isLive; if (response.Confidence) { isLive = response.Confidence > 90; } - if (response.ReferenceImage && response.ReferenceImage.Bytes) { - base64Image = response.ReferenceImage.Bytes.toString(); - + if (isLive && response.ReferenceImage && response.ReferenceImage.Bytes) { const { data } = await http.get(`/${cedula}/photo`, { params: { - "api-key": process.env.NEXT_PUBLIC_PHOTO_API_KEY, + 'api-key': process.env.NEXT_PUBLIC_PHOTO_API_KEY, }, - responseType: "arraybuffer", + responseType: 'arraybuffer', }); + const buffer1 = Buffer.from(response.ReferenceImage.Bytes); + const buffer2 = Buffer.from(data, 'base64'); + const params = { + SourceImage: { + Bytes: buffer1, + }, + TargetImage: { + Bytes: buffer2, + }, + SimilarityThreshold: 90, + }; + + const command = new CompareFacesCommand(params); + let similarPercent = 0; + try { - result = await rekognition.compareFaces({ - SimilarityThreshold: 80, - TargetImage: { - Bytes: data, - }, - SourceImage: { - Bytes: response.ReferenceImage.Bytes, - }, - }); - } catch (ex) { + const compare = await client.send(command); + if (compare.FaceMatches && compare.FaceMatches.length) { + compare.FaceMatches.forEach((data) => { + similarPercent = data.Similarity as number; + }); + + if (similarPercent > 90) { + console.log( + `Biometry validation successfully for citizen ${cedula}` + ); + res.status(200).end(JSON.stringify({ match: true })); + } else { + console.log(`Biometry validation failed for citizen ${cedula}`); + res.status(200).end(JSON.stringify({ match: false })); + } + } + } catch (error) { console.log(`Biometry validation failed for citizen ${cedula}`); - - return res.status(500).json({ - success: false, - }); + res.status(500).end(); } } - - const { FaceMatches } = result; - const isFaceMatched = - FaceMatches && FaceMatches.length && FaceMatches[0].Similarity > 90; - - console.log(`Biometry validation successfully for citizen ${cedula}`); - - return res.status(200).json({ - match: isFaceMatched, + } else if (req.method === 'POST') { + const command = new CreateFaceLivenessSessionCommand({ + ClientRequestToken: req.cookies.token, }); - } else if (req.method === "POST") { - const { SessionId: sessionId } = - await rekognition.createFaceLivenessSession({}); + const { SessionId: sessionId } = await client.send(command); return res.status(201).json({ sessionId }); } diff --git a/src/pages/api/citizens/[cedula].ts b/src/pages/api/citizens/[cedula].ts index ce4b6541..e770ad4e 100644 --- a/src/pages/api/citizens/[cedula].ts +++ b/src/pages/api/citizens/[cedula].ts @@ -1,7 +1,7 @@ -import { NextApiRequest, NextApiResponse } from "next/types"; -import axios from "axios"; +import { NextApiRequest, NextApiResponse } from 'next/types'; +import axios from 'axios'; -import { CitizensBasicInformationResponse } from "../types"; +import { CitizensBasicInformationResponse } from '../types'; export default async function handler( req: NextApiRequest, @@ -23,8 +23,8 @@ export default async function handler( `/${cedula}/info/basic?api-key=${process.env.NEXT_PUBLIC_CEDULA_API_KEY}` ); - let { names, id } = citizen.payload; - const name = names.split(" ")[0]; + const { names, id } = citizen.payload; + const name = names.split(' ')[0]; res.status(200).json({ name, id }); } diff --git a/src/pages/api/iam/index.ts b/src/pages/api/iam/index.ts index d015856b..66ff8175 100644 --- a/src/pages/api/iam/index.ts +++ b/src/pages/api/iam/index.ts @@ -1,10 +1,10 @@ -import { NextApiRequest, NextApiResponse } from "next/types"; -import axios, { AxiosError } from "axios"; +import { NextApiRequest, NextApiResponse } from 'next/types'; +import axios, { AxiosError } from 'axios'; import { CitizensBasicInformationResponse, VerifyIamUserResponse, -} from "../types"; +} from '../types'; export default async function handler( req: NextApiRequest, @@ -20,19 +20,19 @@ export default async function handler( baseURL: process.env.NEXT_PUBLIC_IAM_API, }); - if (req.method === "GET") { + if (req.method === 'GET') { const { cedula } = req.query; const { data } = await http.get( `/auth/validations/users/existence?username=${cedula}` ); return res.status(200).json(data); - } else if (req.method === "POST") { + } else if (req.method === 'POST') { const { body } = req; const { username, email, password } = body; - let success: boolean = true; - let statusCode: number = 201; + let success = true; + let statusCode = 201; const { data: citizen } = await axios.get( `${process.env.NEXT_PUBLIC_CEDULA_API}/${username}/info/basic?api-key=${process.env.NEXT_PUBLIC_CEDULA_API_KEY}` diff --git a/src/pages/api/types/index.ts b/src/pages/api/types/index.ts index bc5484ec..0dbe29e3 100644 --- a/src/pages/api/types/index.ts +++ b/src/pages/api/types/index.ts @@ -3,7 +3,7 @@ export type CitizenBasicInformation = { names: string; firstSurname: string; secondSurname: string; - gender: "M" | "F"; + gender: 'M' | 'F'; }; export type CitizensBasicInformationResponse = { diff --git a/src/pages/auth/code/index.tsx b/src/pages/auth/code/index.tsx deleted file mode 100644 index 45ebbc21..00000000 --- a/src/pages/auth/code/index.tsx +++ /dev/null @@ -1,93 +0,0 @@ -import { useState } from "react"; -import { useRouter } from "next/router"; -import { yupResolver } from "@hookform/resolvers/yup"; -import { useForm } from "react-hook-form"; -import * as yup from "yup"; - -import LadingChica from "../../../../public/assets/ladingChica.png"; - -import { CardAuth, CardAuthFooter } from "@/components/elements/cardAuth"; -import { GridContainer, GridItem } from "@/components/elements/grid"; -import { - TextBodyTiny, - TextSubTitle, - TextSubTitleBody, - TextTitle, -} from "@/components/elements/typography"; - -import { FormControlApp } from "@/components/form/input"; -import { InputApp } from "@/themes/form/input"; -import { ButtonApp } from "@/components/elements/button"; -import { routes } from "@/constants/routes"; -import BoxContentCenter from "@/components/elements/boxContentCenter"; -import { labels } from "@/constants/labels"; - -interface IFormInputs { - code: string; -} - -const schema = yup.object({ - code: yup.string().trim().required(labels.form.requiredField), -}); - -export default function Index() { - const router = useRouter(); - - const [dataItem, setDataItem] = useState({}); - - const { - register, - handleSubmit, - formState: { errors }, - control, - setValue, - } = useForm({ - reValidateMode: "onSubmit", - shouldFocusError: false, - resolver: yupResolver(schema), - }); - - const onSubmit = (data: IFormInputs) => {}; - - return ( -
- - - - - - - - - - - INICIAR SESIÓN - - - - router.push(routes.auth.method)} - > - Cambiar Método de Inicio de Sesión - - - - - -
- ); -} diff --git a/src/pages/auth/index.tsx b/src/pages/auth/index.tsx deleted file mode 100644 index 366303d2..00000000 --- a/src/pages/auth/index.tsx +++ /dev/null @@ -1,122 +0,0 @@ -import { useState } from "react"; -import { useRouter } from "next/router"; -import { yupResolver } from "@hookform/resolvers/yup"; -import { useForm } from "react-hook-form"; -import Image from "next/image"; -import * as yup from "yup"; - -import { - TextBodyTiny, - TextSubTitle, - TextSubTitleBody, - TextTitle, -} from "@/components/elements/typography"; -import { CardAuth, CardAuthFooter } from "@/components/elements/cardAuth"; -import { GridContainer, GridItem } from "@/components/elements/grid"; -import LadingHome from "../../../public/assets/ladingHome.svg"; -import { ButtonApp } from "@/components/elements/button"; -import { FormControlApp } from "@/components/form/input"; -import { InputApp } from "@/themes/form/input"; -import { routes } from "@/constants/routes"; -import { labels } from "@/constants/labels"; - -interface IFormInputs { - cedulaOrEmail: string; -} - -const schema = yup.object({ - cedulaOrEmail: yup.string().trim().required(labels.form.requiredField), -}); - -export default function Index() { - const router = useRouter(); - - const [dataItem, setDataItem] = useState({}); - - const { - register, - handleSubmit, - formState: { errors }, - control, - setValue, - } = useForm({ - reValidateMode: "onSubmit", - shouldFocusError: false, - resolver: yupResolver(schema), - }); - - const onSubmit = (data: IFormInputs) => { - router.push(routes.auth.password); - }; - - return ( -
- - - - ¡Bienvenido al Sistema de Autenticación Gubernamental{" "} - Ciudadana! - - - Accede o regístrate con un único usuario y contraseña, para - solicitar o consultar todos tus servicios y trámites - gubernamentales. - -
- - Una manera fácil y cómoda de identificarte, para realizar trámites - desde tu computadora o celular sin necesidad de trasladarte a los - organismos gubernamentales. - -
- Lading Home - - - - - - - - - - - - - INICIAR SESIÓN - - - - - - - ¿No tienes cuenta? - {" "} - Registrate, accede a trámites y servicios del estado dominicano - con un único usuario y contraseña, de forma segura y confiable. - -
- router.push(routes.register.home)} - > - CREAR TU CUENTA UNICA CIUDADANA - - - - -
- ); -} diff --git a/src/pages/auth/method/index.tsx b/src/pages/auth/method/index.tsx deleted file mode 100644 index 4d13055c..00000000 --- a/src/pages/auth/method/index.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { useState } from 'react'; -import { useRouter } from 'next/router' -import { yupResolver } from '@hookform/resolvers/yup'; -import { useForm } from 'react-hook-form'; -import * as yup from "yup"; - -import LockIcon from '@mui/icons-material/Lock'; -import PermContactCalendarIcon from '@mui/icons-material/PermContactCalendar'; - -import LadingChica from "../../../../public/assets/ladingChica.png" - -import { CardAuth, CardAuthFooter } from "@/components/elements/cardAuth" -import { GridContainer, GridItem } from "@/components/elements/grid" -import { TextBodyTiny, TextSubTitle, TextSubTitleBody, TextTitle } from "@/components/elements/typography" - -import { FormControlApp } from '@/components/form/input'; -import { InputApp } from '@/themes/form/input'; -import { ButtonApp } from '@/components/elements/button'; -import { routes } from '@/constants/routes'; -import BoxContentCenter from '@/components/elements/boxContentCenter'; -import { labels } from '@/constants/labels'; -import { Typography } from '@mui/material'; - -export default function Index() { - - const router = useRouter() - - return ( - - - - -
router.push("password")} style={{border: "1px solid #E5E5E5", cursor: "pointer", borderRadius: "6px", padding: "14px 12px", marginBottom: "10px", display: "flex", alignItems: "center", flexDirection: "row"}}> - -
- Contraseña - Iniciar sesión ingresando contraseña. -
-
- - - -
router.push("code")} style={{border: "1px solid #E5E5E5", cursor: "pointer", borderRadius: "6px", padding: "14px 12px", marginBottom: "10px", display: "flex", alignItems: "center", flexDirection: "row"}}> - -
- Código Autenticador - Ingrese un código de verificación de la aplicación de autenticación activa. -
-
- - - - - ) -} \ No newline at end of file diff --git a/src/pages/auth/password/index.tsx b/src/pages/auth/password/index.tsx deleted file mode 100644 index 9390c2ef..00000000 --- a/src/pages/auth/password/index.tsx +++ /dev/null @@ -1,110 +0,0 @@ -import { useState } from "react"; -import { useRouter } from "next/router"; -import { yupResolver } from "@hookform/resolvers/yup"; -import { useForm } from "react-hook-form"; -import * as yup from "yup"; - -import LadingChica from "../../../../public/assets/ladingChica.png"; - -import { CardAuth, CardAuthFooter } from "@/components/elements/cardAuth"; -import { GridContainer, GridItem } from "@/components/elements/grid"; -import { - TextBodyTiny, - TextSubTitle, - TextSubTitleBody, - TextTitle, -} from "@/components/elements/typography"; - -import { FormControlApp } from "@/components/form/input"; -import { InputApp } from "@/themes/form/input"; -import { ButtonApp } from "@/components/elements/button"; -import { routes } from "@/constants/routes"; -import BoxContentCenter from "@/components/elements/boxContentCenter"; -import { labels } from "@/constants/labels"; - -interface IFormInputs { - password: string; -} - -const schema = yup.object({ - password: yup.string().trim().required(labels.form.requiredField), -}); - -export default function Index() { - const router = useRouter(); - - const [dataItem, setDataItem] = useState({}); - - const { - register, - handleSubmit, - formState: { errors }, - control, - setValue, - } = useForm({ - reValidateMode: "onSubmit", - shouldFocusError: false, - resolver: yupResolver(schema), - }); - - const onSubmit = (data: IFormInputs) => {}; - - return ( -
- - - - - - - - - - - - - ¿Olvidaste tu contraseña? - - - - - - INICIAR SESIÓN - - - {/* - router.push(routes.auth.method)} - > - Cambiar Método de Inicio de Sesión - - */} - - - - - - ¿No tienes cuenta?{" "} - Registrate aquí. - - - - - -
- ); -} diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 94137ed2..c0426b8f 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,4 +1,4 @@ -import Register from "./register"; +import Register from './register'; export default function Home() { return ; diff --git a/src/pages/register/confirmation/index.tsx b/src/pages/register/confirmation/index.tsx index 7b8d0a36..510a6877 100644 --- a/src/pages/register/confirmation/index.tsx +++ b/src/pages/register/confirmation/index.tsx @@ -7,7 +7,7 @@ import * as yup from "yup"; import MarkEmailReadOutlinedIcon from "@mui/icons-material/MarkEmailReadOutlined"; import { GridContainer, GridItem } from "@/components/elements/grid"; import BoxContentCenter from "@/components/elements/boxContentCenter"; -import LadingChico from "../../../../public/assets/ladingChico.png"; +import LandingChico from "../../../../public/assets/landingChico.png"; import { CardAuth } from "@/components/elements/cardAuth"; import { ButtonApp } from "@/components/elements/button"; import { FormControlApp } from "@/components/form/input"; @@ -30,21 +30,19 @@ const schema = yup.object({ export default function Index() { const router = useRouter(); - const [dataItem, setDataItem] = useState({}); + const [dataItem] = useState({}); const { register, handleSubmit, formState: { errors }, - control, - setValue, } = useForm({ reValidateMode: "onSubmit", shouldFocusError: false, resolver: yupResolver(schema), }); - const onSubmit = (data: IFormInputs) => { + const onSubmit = () => { router.push(routes.register.registered); }; @@ -54,8 +52,8 @@ export default function Index() { } diff --git a/src/pages/register/index.tsx b/src/pages/register/index.tsx index ca4377f0..a29365f7 100644 --- a/src/pages/register/index.tsx +++ b/src/pages/register/index.tsx @@ -1,51 +1,19 @@ -import { - TextSubTitle, - TextSubTitleBody, - TextTitle, -} from "@/components/elements/typography"; -import LadingChica2 from "../../../public/assets/ladingChica2.png"; -import { GridContainer, GridItem } from "@/components/elements/grid"; -import { CardAuth } from "@/components/elements/cardAuth"; -import StepperRegister from "./stepper"; -import Image from "next/image"; -import BoxContentCenter from "@/components/elements/boxContentCenter"; -import LadingChica from "../../../public/assets/ladingChica.png"; +import LandingChica2 from '../../../public/assets/landingChica.png'; +import { CardAuth } from '@/components/elements/cardAuth'; +import StepperRegister from './stepper'; +import BoxContentCenter from '@/components/elements/boxContentCenter'; export default function Index() { return ( - // - // - // - // ¡Bienvenido a la Plataforma Única de Autenticación{" "} - // Ciudadana! - // - // - // Accede o regístrate con un único usuario y contraseña, para solicitar - // o consultar todos tus servicios y trámites gubernamentales. - // - //
- // - // Una manera fácil y cómoda de identificarte, para realizar trámites - // desde tu computadora o celular sin necesidad de trasladarte a los - // organismos gubernamentales. - // - //
- // Lading Home - // - - // - - - - - - - // - // + + + + + ); } diff --git a/src/pages/register/registered/index.tsx b/src/pages/register/registered/index.tsx index 1b170b81..15738f78 100644 --- a/src/pages/register/registered/index.tsx +++ b/src/pages/register/registered/index.tsx @@ -1,15 +1,15 @@ -import { yupResolver } from "@hookform/resolvers/yup"; -import { useForm } from "react-hook-form"; -import * as yup from "yup"; +import { yupResolver } from '@hookform/resolvers/yup'; +import { useForm } from 'react-hook-form'; +import * as yup from 'yup'; -import CheckCircleOutlineOutlinedIcon from "@mui/icons-material/CheckCircleOutlineOutlined"; -import BoxContentCenter from "@/components/elements/boxContentCenter"; -import { GridContainer, GridItem } from "@/components/elements/grid"; -import LadingChico from "../../../../public/assets/ladingChico.png"; -import { TextBody } from "@/components/elements/typography"; -import { CardAuth } from "@/components/elements/cardAuth"; -import { ButtonApp } from "@/components/elements/button"; -import { labels } from "@/constants/labels"; +import CheckCircleOutlineOutlinedIcon from '@mui/icons-material/CheckCircleOutlineOutlined'; +import BoxContentCenter from '@/components/elements/boxContentCenter'; +import { GridContainer, GridItem } from '@/components/elements/grid'; +import LandingChico from '../../../../public/assets/landingChico.png'; +import { TextBody } from '@/components/elements/typography'; +import { CardAuth } from '@/components/elements/cardAuth'; +import { ButtonApp } from '@/components/elements/button'; +import { labels } from '@/constants/labels'; interface IFormInputs { email: string; @@ -25,9 +25,9 @@ const schema = yup.object({ export default function Index() { const { - formState: { errors }, + formState: { }, } = useForm({ - reValidateMode: "onSubmit", + reValidateMode: 'onSubmit', shouldFocusError: false, resolver: yupResolver(schema), }); @@ -36,11 +36,11 @@ export default function Index() { } > @@ -63,7 +63,7 @@ export default function Index() { window.open( - "https://beta.auth.digital.gob.do/realms/master/account/" + 'https://beta.auth.digital.gob.do/realms/master/account/' ) } > diff --git a/src/pages/register/stepper/index.tsx b/src/pages/register/stepper/index.tsx index e453ca14..6624376e 100644 --- a/src/pages/register/stepper/index.tsx +++ b/src/pages/register/stepper/index.tsx @@ -1,21 +1,21 @@ -import Typography from "@mui/material/Typography"; -import StepLabel from "@mui/material/StepLabel"; -import Stepper from "@mui/material/Stepper"; -import Button from "@mui/material/Button"; -import Step from "@mui/material/Step"; -import Box from "@mui/material/Box"; -import * as React from "react"; -import axios from "axios"; - -import { routes } from "@/constants/routes"; -import { useRouter } from "next/router"; -import Step1 from "./step1"; -import Step2 from "./step2"; -import Step3 from "./step3"; - -const steps = ["PASO 1", "PASO 2", "PASO 3"]; - -export async function getServerSideProps(ctx: any) { +import Typography from '@mui/material/Typography'; +import StepLabel from '@mui/material/StepLabel'; +import Stepper from '@mui/material/Stepper'; +import Button from '@mui/material/Button'; +import Step from '@mui/material/Step'; +import Box from '@mui/material/Box'; +import * as React from 'react'; +import axios from 'axios'; + +import { routes } from '@/constants/routes'; +import { useRouter } from 'next/router'; +import Step1 from './step1'; +import Step2 from './step2'; +import Step3 from './step3'; + +const steps = ['PASO 1', 'PASO 2', 'PASO 3']; + +export async function getServerSideProps() { await axios.get(`/api/auth`); return { @@ -39,10 +39,6 @@ export default function StepperRegister() { const [infoCedula, setInfoCedula] = React.useState({}); - const isStepOptional = (step: number) => { - return step === 1; - }; - const isStepSkipped = (step: number) => { return skipped.has(step); }; @@ -63,33 +59,14 @@ export default function StepperRegister() { setSkipped(newSkipped); }; - const handleBack = () => { - setActiveStep((prevActiveStep) => prevActiveStep - 1); - }; - - const handleSkip = () => { - if (!isStepOptional(activeStep)) { - // You probably want to guard against something like this, - // it should never occur unless someone's actively trying to break something. - throw new Error("You can't skip a step that isn't optional."); - } - - setActiveStep((prevActiveStep) => prevActiveStep + 1); - setSkipped((prevSkipped) => { - const newSkipped = new Set(prevSkipped.values()); - newSkipped.add(activeStep); - return newSkipped; - }); - }; - const handleReset = () => { setActiveStep(0); }; return ( - + {steps.map((label, index) => { @@ -116,11 +93,11 @@ export default function StepperRegister() { - {label} + {label} ); @@ -131,13 +108,13 @@ export default function StepperRegister() { All steps completed - you're finished - - + + ) : ( -
+
{activeStep === 0 && ( )} diff --git a/src/pages/register/stepper/step1.tsx b/src/pages/register/stepper/step1.tsx index fb246519..50acef90 100644 --- a/src/pages/register/stepper/step1.tsx +++ b/src/pages/register/stepper/step1.tsx @@ -1,19 +1,19 @@ -import { yupResolver } from "@hookform/resolvers/yup"; -import ReCAPTCHA from "react-google-recaptcha"; -import { useForm } from "react-hook-form"; -import { useRef, useState } from "react"; -import getConfig from "next/config"; -import * as yup from "yup"; - -import { GridContainer, GridItem } from "@/components/elements/grid"; -import { CitizensBasicInformationResponse } from "@/pages/api/types"; -import LoadingBackdrop from "@/components/elements/loadingBackdrop"; -import { TextBody } from "@/components/elements/typography"; -import { AlertWarning } from "@/components/elements/alert"; -import { ButtonApp } from "@/components/elements/button"; -import { FormControlApp } from "@/components/form/input"; -import { InputApp } from "@/themes/form/input"; -import { labels } from "@/constants/labels"; +import { yupResolver } from '@hookform/resolvers/yup'; +import ReCAPTCHA from 'react-google-recaptcha'; +import { useForm } from 'react-hook-form'; +import { useRef, useState } from 'react'; +import getConfig from 'next/config'; +import * as yup from 'yup'; + +import { GridContainer, GridItem } from '@/components/elements/grid'; +import { CitizensBasicInformationResponse } from '@/pages/api/types'; +import LoadingBackdrop from '@/components/elements/loadingBackdrop'; +import { TextBody } from '@/components/elements/typography'; +import { AlertWarning } from '@/components/elements/alert'; +import { ButtonApp } from '@/components/elements/button'; +import { FormControlApp } from '@/components/form/input'; +import { InputApp } from '@/themes/form/input'; +import { labels } from '@/constants/labels'; const { publicRuntimeConfig } = getConfig(); @@ -26,7 +26,7 @@ const schema = yup.object({ .string() .trim() .required(labels.form.requiredField) - .min(11, "Debe contener 11 dígitos"), + .min(11, 'Debe contener 11 dígitos'), }); export default function Step1({ setInfoCedula, handleNext }: any) { @@ -42,15 +42,15 @@ export default function Step1({ setInfoCedula, handleNext }: any) { const handleChange = (e: any) => { const cedulaValue = e.target.value - .replace(/\D/g, "") + .replace(/\D/g, '') .match(/(\d{0,3})(\d{0,7})(\d{0,1})/); e.target.value = !cedulaValue[2] ? cedulaValue[1] : `${cedulaValue[1]}-${cedulaValue[2]}${`${ - cedulaValue[3] ? `-${cedulaValue[3]}` : "" - }`}${`${cedulaValue[4] ? `-${cedulaValue[4]}` : ""}`}`; - const numbers = e.target.value.replace(/(\D)/g, ""); - setValue("cedula", numbers); + cedulaValue[3] ? `-${cedulaValue[3]}` : '' + }`}${`${cedulaValue[4] ? `-${cedulaValue[4]}` : ''}`}`; + const numbers = e.target.value.replace(/(\D)/g, ''); + setValue('cedula', numbers); }; const { @@ -58,7 +58,7 @@ export default function Step1({ setInfoCedula, handleNext }: any) { formState: { errors }, setValue, } = useForm({ - reValidateMode: "onSubmit", + reValidateMode: 'onSubmit', shouldFocusError: false, resolver: yupResolver(schema), }); @@ -68,7 +68,7 @@ export default function Step1({ setInfoCedula, handleNext }: any) { if (!tokenCaptcha) { return AlertWarning( - "Necesitamos verificar que no eres un robot. Por favor complete el control de seguridad" + 'Necesitamos verificar que no eres un robot. Por favor complete el control de seguridad' ); } @@ -90,7 +90,7 @@ export default function Step1({ setInfoCedula, handleNext }: any) { handleNext(); }) .catch(() => { - AlertWarning("Parece que ha introducido una cédula inválida."); + AlertWarning('Parece que ha introducido una cédula inválida.'); }) .finally(() => setLoading(false)); }; @@ -133,19 +133,19 @@ export default function Step1({ setInfoCedula, handleNext }: any) {

diff --git a/src/pages/register/stepper/step2.tsx b/src/pages/register/stepper/step2.tsx index 9a7bf3fb..77d77c87 100644 --- a/src/pages/register/stepper/step2.tsx +++ b/src/pages/register/stepper/step2.tsx @@ -1,20 +1,20 @@ -import SentimentSatisfiedOutlinedIcon from "@mui/icons-material/SentimentSatisfiedOutlined"; -import CameraAltOutlinedIcon from "@mui/icons-material/CameraAltOutlined"; -import { yupResolver } from "@hookform/resolvers/yup"; -import { useForm } from "react-hook-form"; -import { useState } from "react"; -import * as yup from "yup"; +import SentimentSatisfiedOutlinedIcon from '@mui/icons-material/SentimentSatisfiedOutlined'; +import CameraAltOutlinedIcon from '@mui/icons-material/CameraAltOutlined'; +import { yupResolver } from '@hookform/resolvers/yup'; +import { useForm } from 'react-hook-form'; +import { useState } from 'react'; +import * as yup from 'yup'; -import { GridContainer, GridItem } from "@/components/elements/grid"; -import FormControlLabel from "@mui/material/FormControlLabel"; -import { TextBody } from "@/components/elements/typography"; -import { AlertWarning } from "@/components/elements/alert"; -import { ButtonApp } from "@/components/elements/button"; -import FormGroup from "@mui/material/FormGroup"; -import Checkbox from "@mui/material/Checkbox"; -import { labels } from "@/constants/labels"; -import { Typography } from "@mui/material"; -import Step2Modal from "./step2Modal"; +import { GridContainer, GridItem } from '@/components/elements/grid'; +import FormControlLabel from '@mui/material/FormControlLabel'; +import { TextBody } from '@/components/elements/typography'; +import { AlertWarning } from '@/components/elements/alert'; +import { ButtonApp } from '@/components/elements/button'; +import FormGroup from '@mui/material/FormGroup'; +import Checkbox from '@mui/material/Checkbox'; +import { labels } from '@/constants/labels'; +import { Typography } from '@mui/material'; +import Step2Modal from './step2Modal'; interface IFormInputs { acceptTermAndConditions: boolean; @@ -33,13 +33,11 @@ export default function Step2({ infoCedula, handleNext }: any) { const handleClick = () => setOpen(!open); const { - register, handleSubmit, - formState: { errors }, - control, + formState: { }, setValue, } = useForm({ - reValidateMode: "onSubmit", + reValidateMode: 'onSubmit', shouldFocusError: false, resolver: yupResolver(schema), }); @@ -47,7 +45,7 @@ export default function Step2({ infoCedula, handleNext }: any) { const onSubmit = (data: IFormInputs) => { if (!data.acceptTermAndConditions) { return AlertWarning( - "Para continuar debe aceptar Términos y Políticas de Privacidad" + 'Para continuar debe aceptar Términos y Políticas de Privacidad' ); } handleClick(); @@ -57,8 +55,8 @@ export default function Step2({ infoCedula, handleNext }: any) { <>
- ¡Hola {infoCedula?.name}!{" "} - + ¡Hola {infoCedula?.name}!{' '} + Ahora vamos a verificar tu identidad mediante autenticación biométrica y continuar con el proceso de tú registro, asegúrate de disponer de los siguientes elementos: @@ -71,21 +69,21 @@ export default function Step2({ infoCedula, handleNext }: any) {
- Tener disponible un teléfono móvil o computadora con{" "} - cámara integrada. + Tener disponible un teléfono móvil o computadora con{' '} + cámara integrada.
@@ -93,21 +91,21 @@ export default function Step2({ infoCedula, handleNext }: any) {
- Permitir capturas de{" "} - + Permitir capturas de{' '} + fotografías de tu rostro. @@ -117,7 +115,7 @@ export default function Step2({ infoCedula, handleNext }: any) { Verificación con pasaporte disponible próximamente @@ -125,15 +123,15 @@ export default function Step2({ infoCedula, handleNext }: any) {

- + { - setValue("acceptTermAndConditions", e.target.checked); + setValue('acceptTermAndConditions', e.target.checked); }} control={} label={ - Aceptar Términos y Políticas de Privacidad{" "} + Aceptar Términos y Políticas de Privacidad{' '} * } diff --git a/src/pages/register/stepper/step2Modal.tsx b/src/pages/register/stepper/step2Modal.tsx index c3d8255f..a3b2cdb8 100644 --- a/src/pages/register/stepper/step2Modal.tsx +++ b/src/pages/register/stepper/step2Modal.tsx @@ -1,19 +1,17 @@ -import { TransitionProps } from "@mui/material/transitions"; -import { ThemeProvider } from "@aws-amplify/ui-react"; -import LogoutIcon from "@mui/icons-material/Logout"; -import Toolbar from "@mui/material/Toolbar"; -import AppBar from "@mui/material/AppBar"; -import Dialog from "@mui/material/Dialog"; -import Slide from "@mui/material/Slide"; -import { Box } from "@mui/material"; -import { forwardRef } from "react"; -import Image from "next/image"; +import { TransitionProps } from '@mui/material/transitions'; +import { ThemeProvider } from '@aws-amplify/ui-react'; +import LogoutIcon from '@mui/icons-material/Logout'; +import Toolbar from '@mui/material/Toolbar'; +import AppBar from '@mui/material/AppBar'; +import Dialog from '@mui/material/Dialog'; +import Slide from '@mui/material/Slide'; +import { Box } from '@mui/material'; +import { forwardRef } from 'react'; +import Image from 'next/image'; -import { LivenessQuickStartReact } from "@/components/biometric/face-liveness-detector"; -import { ContainerApp } from "@/components/elements/container"; -import { ButtonApp } from "@/components/elements/button"; -import Logo from "../../../../public/assets/logo.png"; -import { GridContainer, GridItem } from "@/components/elements/grid"; +import { LivenessQuickStartReact } from '@/components/biometric/face-liveness-detector'; +import { ButtonApp } from '@/components/elements/button'; +import Logo from '../../../../public/assets/logo.png'; const Transition = forwardRef(function Transition( props: TransitionProps & { @@ -25,7 +23,6 @@ const Transition = forwardRef(function Transition( }); export default function Step2Modal({ - open, handleClick, handleNextForm, identity, @@ -38,8 +35,8 @@ export default function Step2Modal({ onClose={handleClick} TransitionComponent={Transition} > - -
+ +
logo @@ -58,14 +55,14 @@ export default function Step2Modal({
diff --git a/src/pages/register/stepper/step3.tsx b/src/pages/register/stepper/step3.tsx index ef4947da..2e7db38f 100644 --- a/src/pages/register/stepper/step3.tsx +++ b/src/pages/register/stepper/step3.tsx @@ -1,17 +1,17 @@ -import { yupResolver } from "@hookform/resolvers/yup"; -import { useForm } from "react-hook-form"; -import { useState } from "react"; -import * as yup from "yup"; -import axios from "axios"; +import { yupResolver } from '@hookform/resolvers/yup'; +import { useForm } from 'react-hook-form'; +import { useState } from 'react'; +import * as yup from 'yup'; +import axios from 'axios'; -import { AlertError, AlertWarning } from "@/components/elements/alert"; -import { GridContainer, GridItem } from "@/components/elements/grid"; -import LoadingBackdrop from "@/components/elements/loadingBackdrop"; -import { TextBody } from "@/components/elements/typography"; -import { FormControlApp } from "@/components/form/input"; -import { ButtonApp } from "@/components/elements/button"; -import { InputApp } from "@/themes/form/input"; -import { labels } from "@/constants/labels"; +import { AlertError, AlertWarning } from '@/components/elements/alert'; +import { GridContainer, GridItem } from '@/components/elements/grid'; +import LoadingBackdrop from '@/components/elements/loadingBackdrop'; +import { TextBody } from '@/components/elements/typography'; +import { FormControlApp } from '@/components/form/input'; +import { ButtonApp } from '@/components/elements/button'; +import { InputApp } from '@/themes/form/input'; +import { labels } from '@/constants/labels'; interface IFormInputs { email: string; @@ -30,24 +30,24 @@ const schema = yup.object({ .string() .trim() .required(labels.form.requiredField) - .oneOf([yup.ref("email")], "Los correos no coinciden"), + .oneOf([yup.ref('email')], 'Los correos no coinciden'), password: yup .string() - .min(8, "Debe contener al menos 8 caracteres") + .min(8, 'Debe contener al menos 8 caracteres') .required(labels.form.requiredField) .trim() .matches( /^.*(?=.{8,})((?=.*[!@#$%^&*()\-_=+{};:,<.>]){1})(?=.*\d)((?=.*[a-z]){1})((?=.*[A-Z]){1}).*$/, - "La contraseña debe contener una mayúscula, un número y un carácter especial" + 'La contraseña debe contener una mayúscula, un número y un carácter especial' ), passwordConfirm: yup .string() .required(labels.form.requiredField) - .oneOf([yup.ref("password")], "Las contraseñas no coinciden"), + .oneOf([yup.ref('password')], 'Las contraseñas no coinciden'), }); export default function Step3({ handleNext, infoCedula }: any) { - const [dataItem, setDataItem] = useState({}); + const [dataItem] = useState({}); const [loading, setLoading] = useState(false); @@ -56,10 +56,8 @@ export default function Step3({ handleNext, infoCedula }: any) { handleSubmit, formState: { errors }, getValues, - control, - setValue, } = useForm({ - mode: "onChange", + mode: 'onChange', resolver: yupResolver(schema), }); @@ -67,7 +65,7 @@ export default function Step3({ handleNext, infoCedula }: any) { setLoading(true); axios - .post("/api/iam", { + .post('/api/iam', { email: data.email, username: infoCedula.id, password: data.password, @@ -77,7 +75,7 @@ export default function Step3({ handleNext, infoCedula }: any) { }) .catch((err) => { if (err?.response?.status === 409) { - AlertWarning("El correo electrónico ya está registrado."); + AlertWarning('El correo electrónico ya está registrado.'); } else { AlertError(); } @@ -115,7 +113,7 @@ export default function Step3({ handleNext, infoCedula }: any) { return false; }} autoComplete="off" - {...register("email")} + {...register('email')} /> @@ -138,7 +136,7 @@ export default function Step3({ handleNext, infoCedula }: any) { return false; }} autoComplete="off" - {...register("emailConfirm")} + {...register('emailConfirm')} /> @@ -176,7 +174,7 @@ export default function Step3({ handleNext, infoCedula }: any) { return false; }} autoComplete="off" - {...register("password")} + {...register('password')} /> @@ -200,7 +198,7 @@ export default function Step3({ handleNext, infoCedula }: any) { return false; }} autoComplete="off" - {...register("passwordConfirm")} + {...register('passwordConfirm')} /> @@ -211,7 +209,7 @@ export default function Step3({ handleNext, infoCedula }: any) { disabled={ Object.values(getValues()).every( (value: any) => - value !== null && value !== undefined && value !== "" + value !== null && value !== undefined && value !== '' ) === false ? true : false diff --git a/src/styles/globals.css b/src/styles/globals.css index f62090b0..f5dfaf0e 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -1,4 +1,4 @@ -@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600&display=swap'); +@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600&display=swap"); body { font-family: Poppins, sans-serif; @@ -19,62 +19,121 @@ body { .text-primary { color: #003670; } + .text-success { - color: #2ECC71; + color: #2ecc71; } + .text-secondary { - color: #0087FF; + color: #0087ff; } + .text-error { - color: #EE2A24; + color: #ee2a24; } + .text-info { - color: #23C3DF; + color: #23c3df; } .bg-primary { background: #003670; } + .bg-success { - background: #2ECC71; + background: #2ecc71; } + .bg-secondary { - background: #0087FF; + background: #0087ff; } + .bg-error { - background: #EE2A24; + background: #ee2a24; } + .bg-info { - background: #23C3DF; + background: #23c3df; +} + +.p-1 { + padding: 5px; +} + +.py-1 { + padding-top: 5px; + padding-bottom: 5px; +} + +.px-1 { + padding-left: 5px; + padding-right: 5px; +} + +.p-2 { + padding: 10px; +} + +.py-2 { + padding-top: 10px; + padding-bottom: 10px; } -.p-1 { padding: 5px; } -.py-1 { padding-top: 5px; padding-bottom: 5px; } -.px-1 { padding-left: 5px; padding-right: 5px; } +.px-2 { + padding-left: 10px; + padding-right: 10px; +} -.p-2 { padding: 10px; } -.py-2 { padding-top: 10px; padding-bottom: 10px; } -.px-2 { padding-left: 10px; padding-right: 10px; } +.p-3 { + padding: 15px; +} -.p-3 { padding: 15px; } -.py-3 { padding-top: 15px; padding-bottom: 15px; } -.px-3 { padding-left: 15px; padding-right: 15px; } +.py-3 { + padding-top: 15px; + padding-bottom: 15px; +} -.p-4 { padding: 20px; } -.py-4 { padding-top: 20px; padding-bottom: 20px; } -.px-4 { padding-left: 20px; padding-right: 20px; } +.px-3 { + padding-left: 15px; + padding-right: 15px; +} -.p-5 { padding: 25px; } -.py-5 { padding-top: 25px; padding-bottom: 25px; } -.px-5 { padding-left: 25px; padding-right: 25px; } +.p-4 { + padding: 20px; +} + +.py-4 { + padding-top: 20px; + padding-bottom: 20px; +} + +.px-4 { + padding-left: 20px; + padding-right: 20px; +} + +.p-5 { + padding: 25px; +} + +.py-5 { + padding-top: 25px; + padding-bottom: 25px; +} + +.px-5 { + padding-left: 25px; + padding-right: 25px; +} /* MUI global */ -.MuiStepLabel-iconContainer, .MuiStepConnector-horizontal { +.muisteplabel-iconcontainer, +.muistepconnector-horizontal { display: none !important; } -.MuiStepLabel-label { +.muisteplabel-label { color: #03397775; } @@ -82,4 +141,4 @@ body { background: red; z-index: 500 !important; padding: 450px; -} \ No newline at end of file +} diff --git a/tsconfig.json b/tsconfig.json index 61c19abd..325ad8f7 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,11 @@ { "compilerOptions": { "target": "es5", - "lib": ["dom", "dom.iterable", "esnext"], + "lib": [ + "dom", + "dom.iterable", + "esnext" + ], "allowJs": true, "skipLibCheck": true, "strict": true, @@ -14,10 +18,31 @@ "isolatedModules": true, "jsx": "preserve", "incremental": true, + "baseUrl": ".", "paths": { - "@/*": ["./src/*"] + "@/*": [ + "src/*" + ], + "@components/*": [ + "components/*" + ], + "@utils/*": [ + "utils/*" + ], + "@lib/*": [ + "lib/*" + ], + "@services/*": [ + "services/*" + ] } }, - "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], - "exclude": ["node_modules"] -} + "include": [ + "next-env.d.ts", + "**/*.ts", + "**/*.tsx" + ], + "exclude": [ + "node_modules" + ] +} \ No newline at end of file diff --git a/yarn.lock.REMOVED.git-id b/yarn.lock.REMOVED.git-id index 23eb5494..81b68624 100644 --- a/yarn.lock.REMOVED.git-id +++ b/yarn.lock.REMOVED.git-id @@ -1 +1 @@ -4ea752c568807593c48f32b694392333beef9f3c \ No newline at end of file +fb297b2b79004dce6fe4782f5411f6a044d30c7a \ No newline at end of file