From 84ddc0d28cd37ea8ab43306753cdea28e26468dc Mon Sep 17 00:00:00 2001 From: thaddmt <68032955+thaddmt@users.noreply.github.com> Date: Mon, 18 Sep 2023 16:07:33 -0700 Subject: [PATCH 1/9] chore(liveness): move liveness example app to its own app (#4451) * chore(liveness): move liveness example app to its own app * address feedback * uppgrade outdated deps * Update examples/next-liveness/.eslintrc Co-authored-by: Caleb Pollman --------- Co-authored-by: Caleb Pollman --- .github/workflows/reusable-e2e.yml | 234 +- examples/next-liveness/.env.example | 3 + examples/next-liveness/.eslintrc | 3 + examples/next-liveness/.gitignore | 34 + examples/next-liveness/README.md | 36 + examples/next-liveness/next-env.d.ts | 5 + examples/next-liveness/next.config.js | 26 + examples/next-liveness/package.json | 40 + examples/next-liveness/pages/_app.page.tsx | 14 + .../next-liveness/pages/_document.page.tsx | 33 + .../components/GetLivenessResultCard.tsx | 0 .../components/liveness/components/Layout.tsx | 2 +- .../liveness/components/LivenessDefault.tsx | 4 + .../components/LivenessInlineResults.tsx | 5 +- .../components/liveness/components/NavBar.tsx | 6 + .../liveness/components/SessionIdAlert.tsx | 4 +- .../liveness/components/useLiveness.ts | 2 +- .../disable-start-screen/index.page.tsx | 0 .../ui/components/liveness/index.page.tsx | 0 .../pages/ui/components/liveness/style.css | 0 .../with-credential-provider/index.page.tsx | 0 .../with-custom-components/index.page.tsx | 8 +- examples/next-liveness/tsconfig.json | 36 + examples/next/package.json | 1 - .../with-credential-provider/aws-exports.js | 2 - package.json | 1 + .../liveness/disable-start-screen.feature | 4 +- .../liveness/liveness-detector.feature | 6 +- .../components/liveness/start-screen.feature | 6 +- .../liveness/with-credential-provider.feature | 4 +- .../liveness/with-custom-components.feature | 4 +- packages/e2e/package.json | 2 +- packages/react-liveness/package.json | 4 +- yarn.lock | 9761 ++++++++--------- 34 files changed, 5163 insertions(+), 5127 deletions(-) create mode 100644 examples/next-liveness/.env.example create mode 100644 examples/next-liveness/.eslintrc create mode 100644 examples/next-liveness/.gitignore create mode 100644 examples/next-liveness/README.md create mode 100644 examples/next-liveness/next-env.d.ts create mode 100644 examples/next-liveness/next.config.js create mode 100644 examples/next-liveness/package.json create mode 100644 examples/next-liveness/pages/_app.page.tsx create mode 100644 examples/next-liveness/pages/_document.page.tsx rename examples/{next => next-liveness}/pages/ui/components/liveness/components/GetLivenessResultCard.tsx (100%) rename examples/{next => next-liveness}/pages/ui/components/liveness/components/Layout.tsx (92%) rename examples/{next => next-liveness}/pages/ui/components/liveness/components/LivenessDefault.tsx (97%) rename examples/{next => next-liveness}/pages/ui/components/liveness/components/LivenessInlineResults.tsx (92%) rename examples/{next => next-liveness}/pages/ui/components/liveness/components/NavBar.tsx (96%) rename examples/{next => next-liveness}/pages/ui/components/liveness/components/SessionIdAlert.tsx (86%) rename examples/{next => next-liveness}/pages/ui/components/liveness/components/useLiveness.ts (95%) rename examples/{next => next-liveness}/pages/ui/components/liveness/disable-start-screen/index.page.tsx (100%) rename examples/{next => next-liveness}/pages/ui/components/liveness/index.page.tsx (100%) rename examples/{next => next-liveness}/pages/ui/components/liveness/style.css (100%) rename examples/{next => next-liveness}/pages/ui/components/liveness/with-credential-provider/index.page.tsx (100%) rename examples/{next => next-liveness}/pages/ui/components/liveness/with-custom-components/index.page.tsx (94%) create mode 100644 examples/next-liveness/tsconfig.json delete mode 100644 examples/next/pages/ui/components/liveness/with-credential-provider/aws-exports.js diff --git a/.github/workflows/reusable-e2e.yml b/.github/workflows/reusable-e2e.yml index 95f932af153..f104fad4043 100644 --- a/.github/workflows/reusable-e2e.yml +++ b/.github/workflows/reusable-e2e.yml @@ -71,7 +71,11 @@ jobs: - example: next package: react - tags: '@react and not @todo-react' + tags: '@react and not @todo-react and not @liveness-react' + + - example: next-liveness + package: react + tags: '@liveness-react and not @react and not @todo-react' - example: vue package: vue @@ -319,6 +323,234 @@ jobs: packages/e2e/cypress/screenshots/** retention-days: 5 + e2e-liveness: + # Only run e2e tests if unit tests pass + runs-on: ubuntu-latest + environment: ci + env: + NODE_ENV: test + + strategy: + # Run each examples (e.g. `next-example`) which uses a library (e.g. `@aws-amplify/ui-react`) + # BUT, Exclude `@todo-${{ package }}` tests in PRs + # See: https://docs.github.com/en/actions/reference/workflow-syntax-for-github-actions#using-environment-variables-in-a-matrix + matrix: + include: + - example: next-liveness + package: react + tags: '@liveness-react and not @react and not @todo-react' + + steps: + - name: Checkout Amplify UI + uses: actions/checkout@24cb9080177205b6e8c946b17badbe402adc938f # v3.4.0 https://github.com/actions/checkout/commit/24cb9080177205b6e8c946b17badbe402adc938f + with: + # For `pull_request_target`, we want ref to point to `pull_request.head.ref` because `github.ref` + # always points to the target branch. + # See: https://docs.github.com/en/actions/learn-github-actions/events-that-trigger-workflows + ref: ${{ inputs.commit }} + repository: ${{ inputs.repository }} + persist-credentials: false + + - name: Next.js Cache + uses: actions/cache@88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 # v3.3.1 https://github.com/actions/cache/commit/88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 + with: + path: ${{ github.workspace }}/.next/cache + key: ${{ runner.os }}-nextjs-${{ hashFiles('**/yarn.lock') }} + env: + SEGMENT_DOWNLOAD_TIMEOUT_MINS: 1 + + - name: Setup Node.js 16 + uses: actions/setup-node@64ed1c7eab4cce3362f8c340dee64e5eaeef8f7c # v3.6.0 https://github.com/actions/setup-node/commit/64ed1c7eab4cce3362f8c340dee64e5eaeef8f7c + with: + node-version: 16 + cache: 'yarn' + env: + SEGMENT_DOWNLOAD_TIMEOUT_MINS: 2 + + - name: Restore cypress runner Cache + uses: actions/cache@88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 # v3.3.1 https://github.com/actions/cache/commit/88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 + id: restore-cypress-cache + with: + path: ~/.cache/Cypress + key: ${{ runner.os }}-cypress-${{ hashFiles('yarn.lock') }} + env: + SEGMENT_DOWNLOAD_TIMEOUT_MINS: 1 + + - name: Restore node_modules cache + uses: actions/cache@88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 # v3.3.1 https://github.com/actions/cache/commit/88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 + id: restore-cache + with: + path: | + ./node_modules + **/node_modules + key: ${{ runner.os }}-nodemodules-${{ inputs.commit }} + env: + SEGMENT_DOWNLOAD_TIMEOUT_MINS: 3 + + - name: Restore ui/dist cache + uses: actions/cache@88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 # v3.3.1 https://github.com/actions/cache/commit/88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 + id: restore-ui-cache + with: + path: ./packages/ui/dist + key: ${{ runner.os }}-ui-${{ inputs.commit }} + + - name: Restore ${{ matrix.package }}/dist cache + id: restore-package-cache + uses: actions/cache@88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 # v3.3.1 https://github.com/actions/cache/commit/88522ab9f39a2ea568f7027eddc7d8d8bc9d59c8 + with: + path: ./packages/${{ matrix.package }}/dist + key: ${{ runner.os }}-${{ matrix.package }}-${{ inputs.commit }} + env: + SEGMENT_DOWNLOAD_TIMEOUT_MINS: 1 + + - name: Install packages + if: steps.restore-cache.outputs.cache-hit != 'true' || steps.restore-cypress-cache.outputs.cache-hit != 'true' + uses: ./.github/actions/install-with-retries + with: + skip-cypress-binary: false + + - name: Build @aws-amplify/ui package + if: steps.restore-ui-cache.outputs.cache-hit != 'true' + run: yarn ui build + + - name: Build react-core package + if: ${{ matrix.package == 'react' }} + run: yarn react-core build + + - name: Build ${{ matrix.package }} package + if: steps.restore-package-cache.outputs.cache-hit != 'true' + run: yarn ${{ matrix.package }} build + + - name: Build react-liveness package + if: ${{ matrix.package == 'react' }} + run: yarn react-liveness build + + - name: Add Amplify CLI + run: yarn global add @aws-amplify/cli + + - name: Configure auth credentials + uses: aws-actions/configure-aws-credentials@e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef # v2.0.0 https://github.com/aws-actions/configure-aws-credentials/commit/e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef + with: + aws-region: us-east-2 + role-to-assume: ${{ secrets.AUTH_E2E_ROLE_ARN }} + + # Amplify CLI does not support headless pull with temporary credentials + # when useProfile is false. + # See: https://github.com/aws-amplify/amplify-cli/issues/11009. + - name: Create temp AWS Profile + run: | + aws configure set aws_access_key_id $AWS_ACCESS_KEY_ID && \ + aws configure set aws_secret_access_key $AWS_SECRET_ACCESS_KEY && \ + aws configure set aws_session_token $AWS_SESSION_TOKEN && \ + aws configure set default.region $AWS_REGION + + - name: Pull down Auth AWS environments + run: yarn environments auth pull + + - name: Create temp AWS profile + run: | + aws configure set aws_access_key_id $AWS_ACCESS_KEY_ID && \ + aws configure set aws_secret_access_key $AWS_SECRET_ACCESS_KEY && \ + aws configure set aws_session_token $AWS_SESSION_TOKEN && \ + aws configure set default.region $AWS_REGION + + - name: Configure AWS Credentials + uses: aws-actions/configure-aws-credentials@e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef # v2.0.0 https://github.com/aws-actions/configure-aws-credentials/commit/e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef + with: + aws-region: us-east-2 + role-to-assume: ${{ secrets.STORAGE_E2E_ROLE_ARN }} + + - name: Create temp AWS profile + run: | + aws configure set aws_access_key_id $AWS_ACCESS_KEY_ID && \ + aws configure set aws_secret_access_key $AWS_SECRET_ACCESS_KEY && \ + aws configure set aws_session_token $AWS_SESSION_TOKEN && \ + aws configure set default.region $AWS_REGION + + - name: Pull down Storage AWS environments + run: yarn environments storage pull + + - name: Configure datastore credentials + uses: aws-actions/configure-aws-credentials@e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef # v2.0.0 https://github.com/aws-actions/configure-aws-credentials/commit/e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef + with: + aws-region: us-east-2 + role-to-assume: ${{ secrets.DATASTORE_E2E_ROLE_ARN }} + + - name: Create temp AWS profile + run: | + aws configure set aws_access_key_id $AWS_ACCESS_KEY_ID && \ + aws configure set aws_secret_access_key $AWS_SECRET_ACCESS_KEY && \ + aws configure set aws_session_token $AWS_SESSION_TOKEN && \ + aws configure set default.region $AWS_REGION + + - name: Pull down Datastore AWS environments + run: yarn environments datastore pull + + - name: Configure liveness credentials + uses: aws-actions/configure-aws-credentials@e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef # v2.0.0 https://github.com/aws-actions/configure-aws-credentials/commit/e1e17a757e536f70e52b5a12b2e8d1d1c60e04ef + with: + aws-region: us-east-2 + role-to-assume: ${{ secrets.LIVENESS_E2E_ROLE_ARN }} + + - name: Create temp AWS profile + run: | + aws configure set aws_access_key_id $AWS_ACCESS_KEY_ID && \ + aws configure set aws_secret_access_key $AWS_SECRET_ACCESS_KEY && \ + aws configure set aws_session_token $AWS_SESSION_TOKEN && \ + aws configure set default.region $AWS_REGION + + - name: Pull down Liveness AWS environments + run: yarn environments liveness pull + + # Amplify CLI does not support headless pull with temporary credentials + # when useProfile is false. + # See: https://github.com/aws-amplify/amplify-cli/issues/11009. + - name: Create temp AWS Profile + run: | + aws configure set aws_access_key_id $AWS_ACCESS_KEY_ID && \ + aws configure set aws_secret_access_key $AWS_SECRET_ACCESS_KEY && \ + aws configure set aws_session_token $AWS_SESSION_TOKEN && \ + aws configure set default.region $AWS_REGION + + - name: Pull down In-app-messaging AWS environments + run: yarn environments in-app-messaging pull + + - name: Delete AWS profile + run: rm -rf ~/.aws + + - name: Build ${{ matrix.example }} example + run: yarn ${{ matrix.example }}-example build + + - name: Start ${{ matrix.example }} example + run: yarn ${{ matrix.example }}-example-liveness start & npx wait-on -c waitOnConfig.json -t 20000 http-get://localhost:3000/ui/components/liveness/ + env: + # Setting this value temporarily since the beta liveness sample app hits the gamma endpoint + NEXT_PUBLIC_STREAMING_API_URL: wss://streaming-rekognition-gamma.us-east-1.amazonaws.com + + - name: Run E2E tests against ${{ matrix.example }} example + id: e2e + run: yarn e2e test:liveness + env: + # Override on the default value in `cypress.json` with framework-specific tag + TAGS: '${{ matrix.tags }}' + + # Env values for testing flows + DOMAIN: ${{ secrets.DOMAIN }} + PHONE_NUMBER: ${{ secrets.PHONE_NUMBER }} + USERNAME: ${{ secrets.USERNAME }} + NEW_PASSWORD: ${{ secrets.NEW_PASSWORD }} + VALID_PASSWORD: ${{ secrets.VALID_PASSWORD }} + + - name: Upload failure screenshots and errors + uses: actions/upload-artifact@0b7f8abb1508181956e8e162db84b466c27e18ce # v3.1.2 https://github.com/actions/upload-artifact/commit/0b7f8abb1508181956e8e162db84b466c27e18ce + if: ${{ failure() && steps.e2e.outcome != 'success' }} + with: + name: e2e-cypress-error-${{ matrix.package }} + path: | + packages/e2e/cypress/videos/** + packages/e2e/cypress/screenshots/** + retention-days: 5 + check-changed-packages: runs-on: ubuntu-latest outputs: diff --git a/examples/next-liveness/.env.example b/examples/next-liveness/.env.example new file mode 100644 index 00000000000..5c6a3029059 --- /dev/null +++ b/examples/next-liveness/.env.example @@ -0,0 +1,3 @@ +# Set this .env to the beta/gamma endpoints to test locally +NEXT_PUBLIC_STREAMING_API_URL= +NEXT_PUBLIC_BACKEND_API_REGION= diff --git a/examples/next-liveness/.eslintrc b/examples/next-liveness/.eslintrc new file mode 100644 index 00000000000..e4f9606ab48 --- /dev/null +++ b/examples/next-liveness/.eslintrc @@ -0,0 +1,3 @@ +{ + "extends": ["next", "next/babel", "next/core-web-vitals"] +} diff --git a/examples/next-liveness/.gitignore b/examples/next-liveness/.gitignore new file mode 100644 index 00000000000..1437c53f70b --- /dev/null +++ b/examples/next-liveness/.gitignore @@ -0,0 +1,34 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# local env files +.env.local +.env.development.local +.env.test.local +.env.production.local + +# vercel +.vercel diff --git a/examples/next-liveness/README.md b/examples/next-liveness/README.md new file mode 100644 index 00000000000..15a696d2660 --- /dev/null +++ b/examples/next-liveness/README.md @@ -0,0 +1,36 @@ +# Next.js + Amplify UI Example + +This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). + +## Getting Started + +First, run the development server: + +```bash +npm run dev +# or +yarn dev +``` + +Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. e.g. Authenticator Sign In With Email is at "http://localhost:3000/ui/components/authenticator/sign-in-with-email". + +You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file. + +[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`. + +The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages. + +## Learn More + +To learn more about Next.js, take a look at the following resources: + +- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. +- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. + +You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! + +## Deploy on Vercel + +The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. + +Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/examples/next-liveness/next-env.d.ts b/examples/next-liveness/next-env.d.ts new file mode 100644 index 00000000000..4f11a03dc6c --- /dev/null +++ b/examples/next-liveness/next-env.d.ts @@ -0,0 +1,5 @@ +/// +/// + +// NOTE: This file should not be edited +// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/examples/next-liveness/next.config.js b/examples/next-liveness/next.config.js new file mode 100644 index 00000000000..3e860428ba2 --- /dev/null +++ b/examples/next-liveness/next.config.js @@ -0,0 +1,26 @@ +const path = require('path'); +const { patchWebpackConfig } = require('next-global-css'); + +module.exports = { + reactStrictMode: true, + /** + * Setting trailingSlash to true to resolve known bug with federated sign in redirect + next.js + * https://github.com/aws-amplify/amplify-cli/issues/7359#issuecomment-812821315 + */ + trailingSlash: true, + pageExtensions: ['page.tsx'], + webpack: (config, options) => { + // allows importing of css files inside modules + patchWebpackConfig(config, options); + + // resolve react and react-dom from project node_modules + config.resolve.alias = { + ...config.resolve.alias, + react: path.resolve(__dirname, 'node_modules/react'), + 'react-dom': path.resolve(__dirname, 'node_modules/react-dom'), + 'react-map-gl': path.resolve(__dirname, 'node_modules/react-map-gl'), + }; + + return config; + }, +}; diff --git a/examples/next-liveness/package.json b/examples/next-liveness/package.json new file mode 100644 index 00000000000..10dbbbd8f58 --- /dev/null +++ b/examples/next-liveness/package.json @@ -0,0 +1,40 @@ +{ + "name": "@aws-amplify/ui-next-example-liveness", + "version": "0.0.1", + "private": true, + "scripts": { + "dev": "next dev", + "build": "next build", + "clean": "rimraf node_modules .next", + "start": "next start", + "lint": "next lint" + }, + "dependencies": { + "@aws-amplify/ui-react": "5.2.0", + "@aws-amplify/ui-react-liveness": "^2.0.6", + "@aws-sdk/credential-providers": "^3.370.0", + "aws-amplify": "5", + "next": "^13.4.19", + "next-global-css": "^1.1.1", + "react": "^18.2.0", + "react-copy-to-clipboard": "^5.1.0", + "react-dom": "^18.2.0", + "react-icons": "^4.4.0", + "react-map-gl": "7.0.23", + "swr": "^2.0.0" + }, + "devDependencies": { + "@types/node": "^15.12.4", + "@types/react": "^18.2.22", + "eslint": "^8.44.0", + "eslint-config-next": "11.0.1", + "rimraf": "^3.0.2" + }, + "workspaces": { + "nohoist": [ + "aws-amplify", + "react", + "react-dom" + ] + } +} diff --git a/examples/next-liveness/pages/_app.page.tsx b/examples/next-liveness/pages/_app.page.tsx new file mode 100644 index 00000000000..6c605ce8eaf --- /dev/null +++ b/examples/next-liveness/pages/_app.page.tsx @@ -0,0 +1,14 @@ +// This file only exists to expose `Amplify` & its categories on `window` for e2e testing + +// https://nextjs.org/docs/advanced-features/custom-app +import App from 'next/app'; +import { Amplify, Hub } from 'aws-amplify'; +import { Authenticator, AmplifyProvider } from '@aws-amplify/ui-react'; + +export default function MyApp(props: any) { + return ( + + + + ); +} diff --git a/examples/next-liveness/pages/_document.page.tsx b/examples/next-liveness/pages/_document.page.tsx new file mode 100644 index 00000000000..05393254e10 --- /dev/null +++ b/examples/next-liveness/pages/_document.page.tsx @@ -0,0 +1,33 @@ +import Document, { Html, Head, Main, NextScript } from 'next/document'; + +class MyDocument extends Document { + static async getInitialProps(ctx: any) { + const initialProps = await Document.getInitialProps(ctx); + return { ...initialProps }; + } + + render() { + return ( + + + + + + + + + React Example App +

React Example App

+ +
+ + + + ); + } +} + +export default MyDocument; diff --git a/examples/next/pages/ui/components/liveness/components/GetLivenessResultCard.tsx b/examples/next-liveness/pages/ui/components/liveness/components/GetLivenessResultCard.tsx similarity index 100% rename from examples/next/pages/ui/components/liveness/components/GetLivenessResultCard.tsx rename to examples/next-liveness/pages/ui/components/liveness/components/GetLivenessResultCard.tsx diff --git a/examples/next/pages/ui/components/liveness/components/Layout.tsx b/examples/next-liveness/pages/ui/components/liveness/components/Layout.tsx similarity index 92% rename from examples/next/pages/ui/components/liveness/components/Layout.tsx rename to examples/next-liveness/pages/ui/components/liveness/components/Layout.tsx index e0fdf490203..a82fb1d373b 100644 --- a/examples/next/pages/ui/components/liveness/components/Layout.tsx +++ b/examples/next-liveness/pages/ui/components/liveness/components/Layout.tsx @@ -11,7 +11,7 @@ import '@aws-amplify/ui-react-liveness/styles.css'; import '../style.css'; import NavBar from './NavBar'; -export default function Layout({ children }) { +export default function Layout({ children }: { children: React.ReactNode }) { const [colorMode, setColorMode] = React.useState('system'); const [navOpen, toggleNavOpen] = React.useState(false); diff --git a/examples/next/pages/ui/components/liveness/components/LivenessDefault.tsx b/examples/next-liveness/pages/ui/components/liveness/components/LivenessDefault.tsx similarity index 97% rename from examples/next/pages/ui/components/liveness/components/LivenessDefault.tsx rename to examples/next-liveness/pages/ui/components/liveness/components/LivenessDefault.tsx index 6555e0bc99b..0633f89cea4 100644 --- a/examples/next/pages/ui/components/liveness/components/LivenessDefault.tsx +++ b/examples/next-liveness/pages/ui/components/liveness/components/LivenessDefault.tsx @@ -11,6 +11,10 @@ export default function LivenessDefault({ disableInstructionScreen = false, components = undefined, credentialProvider = undefined, +}: { + disableInstructionScreen?: boolean; + components?: any; + credentialProvider?: any; }) { const { getLivenessResponse, diff --git a/examples/next/pages/ui/components/liveness/components/LivenessInlineResults.tsx b/examples/next-liveness/pages/ui/components/liveness/components/LivenessInlineResults.tsx similarity index 92% rename from examples/next/pages/ui/components/liveness/components/LivenessInlineResults.tsx rename to examples/next-liveness/pages/ui/components/liveness/components/LivenessInlineResults.tsx index ed39dced0cd..e8554c4c7b6 100644 --- a/examples/next/pages/ui/components/liveness/components/LivenessInlineResults.tsx +++ b/examples/next-liveness/pages/ui/components/liveness/components/LivenessInlineResults.tsx @@ -1,7 +1,7 @@ import { Flex, Text, Image } from '@aws-amplify/ui-react'; import { Badge, Button } from '@aws-amplify/ui-react'; -function truncateNumber(number, digitsAfterDot) { +function truncateNumber(number: number, digitsAfterDot: number) { const str = `${number}`; const truncated = str.slice(0, str.indexOf('.') + digitsAfterDot + 1); return Math.max(parseFloat(truncated), 0.0001); @@ -10,6 +10,9 @@ function truncateNumber(number, digitsAfterDot) { export default function LivenessInlineResults({ getLivenessResponse, onUserCancel, +}: { + getLivenessResponse: any; + onUserCancel: any; }) { const { isLive, confidenceScore, auditImageBytes } = getLivenessResponse; diff --git a/examples/next/pages/ui/components/liveness/components/NavBar.tsx b/examples/next-liveness/pages/ui/components/liveness/components/NavBar.tsx similarity index 96% rename from examples/next/pages/ui/components/liveness/components/NavBar.tsx rename to examples/next-liveness/pages/ui/components/liveness/components/NavBar.tsx index 796ab2f39d2..0e75067de53 100644 --- a/examples/next/pages/ui/components/liveness/components/NavBar.tsx +++ b/examples/next-liveness/pages/ui/components/liveness/components/NavBar.tsx @@ -8,6 +8,7 @@ import { Icon, Flex, Link, + ColorMode, } from '@aws-amplify/ui-react'; export default function NavBar({ @@ -15,6 +16,11 @@ export default function NavBar({ setColorMode, navOpen, handleNav, +}: { + colorMode: ColorMode; + setColorMode: any; + navOpen: boolean; + handleNav: () => void; }) { return ( diff --git a/examples/next/pages/ui/components/liveness/components/SessionIdAlert.tsx b/examples/next-liveness/pages/ui/components/liveness/components/SessionIdAlert.tsx similarity index 86% rename from examples/next/pages/ui/components/liveness/components/SessionIdAlert.tsx rename to examples/next-liveness/pages/ui/components/liveness/components/SessionIdAlert.tsx index 06bced77150..e4ad09dd947 100644 --- a/examples/next/pages/ui/components/liveness/components/SessionIdAlert.tsx +++ b/examples/next-liveness/pages/ui/components/liveness/components/SessionIdAlert.tsx @@ -2,14 +2,14 @@ import * as React from 'react'; import { CopyToClipboard } from 'react-copy-to-clipboard'; import { Alert, Button, Flex, Icon, Text } from '@aws-amplify/ui-react'; -export const SessionIdAlert = ({ sessionId }) => { +export const SessionIdAlert = ({ sessionId }: { sessionId: string }) => { return ( SessionId: {sessionId} - +