install react native drawer

2024-07-30 07:58:07 +08:00
parent f20b0ad4e8
commit 2a7c2fec77
6 changed files with 152 additions and 6 deletions
--- a/App.tsx
+++ b/App.tsx
@@ -1,3 +1,6 @@
+import './gesture-handler';
+
+
 import React, { useState } from 'react';
 import { NavigationContainer } from '@react-navigation/native';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
--- a/android/app/src/main/java/com/safeqr/safeqr/MainActivity.kt
+++ b/android/app/src/main/java/com/safeqr/safeqr/MainActivity.kt
@@ -1,3 +1,6 @@
+import android.os.Bundle;
+
+
 package com.safeqr.safeqr

 import android.os.Build
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -1471,6 +1471,48 @@ PODS:
    - React-utils (= 0.74.3)
  - RNCAsyncStorage (1.23.1):
    - React-Core
+  - RNGestureHandler (2.16.2):
+    - DoubleConversion
+    - glog
+    - hermes-engine
+    - RCT-Folly (= 2024.01.01.00)
+    - RCTRequired
+    - RCTTypeSafety
+    - React-Codegen
+    - React-Core
+    - React-debug
+    - React-Fabric
+    - React-featureflags
+    - React-graphics
+    - React-ImageManager
+    - React-NativeModulesApple
+    - React-RCTFabric
+    - React-rendererdebug
+    - React-utils
+    - ReactCommon/turbomodule/bridging
+    - ReactCommon/turbomodule/core
+    - Yoga
+  - RNReanimated (3.10.1):
+    - DoubleConversion
+    - glog
+    - hermes-engine
+    - RCT-Folly (= 2024.01.01.00)
+    - RCTRequired
+    - RCTTypeSafety
+    - React-Codegen
+    - React-Core
+    - React-debug
+    - React-Fabric
+    - React-featureflags
+    - React-graphics
+    - React-ImageManager
+    - React-NativeModulesApple
+    - React-RCTFabric
+    - React-rendererdebug
+    - React-utils
+    - ReactCommon/turbomodule/bridging
+    - ReactCommon/turbomodule/core
+    - Yoga
  - RNScreens (3.31.1):
    - DoubleConversion
    - glog
@@ -1589,6 +1631,8 @@ DEPENDENCIES:
  - React-utils (from `../node_modules/react-native/ReactCommon/react/utils`)
  - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
  - "RNCAsyncStorage (from `../node_modules/@react-native-async-storage/async-storage`)"
+  - RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
+  - RNReanimated (from `../node_modules/react-native-reanimated`)
  - RNScreens (from `../node_modules/react-native-screens`)
  - RNSVG (from `../node_modules/react-native-svg`)
  - Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
@@ -1761,6 +1805,10 @@ EXTERNAL SOURCES:
    :path: "../node_modules/react-native/ReactCommon"
  RNCAsyncStorage:
    :path: "../node_modules/@react-native-async-storage/async-storage"
+  RNGestureHandler:
+    :path: "../node_modules/react-native-gesture-handler"
+  RNReanimated:
+    :path: "../node_modules/react-native-reanimated"
  RNScreens:
    :path: "../node_modules/react-native-screens"
  RNSVG:
@@ -1849,6 +1897,8 @@ SPEC CHECKSUMS:
  React-utils: a06061b3887c702235d2dac92dacbd93e1ea079e
  ReactCommon: f00e436b3925a7ae44dfa294b43ef360fbd8ccc4
  RNCAsyncStorage: 826b603ae9c0f88b5ac4e956801f755109fa4d5c
+  RNGestureHandler: 2282cfbcf86c360d29f44ace393203afd5c6cff7
+  RNReanimated: 35f9ac9c3ac42d0497ebd1cce5c39d7687a8493e
  RNScreens: b32a9ff15bea7fcdbe5dff6477bc503f792b1208
  RNSVG: 43b64ed39c14ce830d840903774154ca0c1f27ec
  SDWebImage: 066c47b573f408f18caa467d71deace7c0f8280d
--- a/package-lock.json
+++ b/package-lock.json
@@ -16,6 +16,7 @@
        "@react-native-async-storage/async-storage": "^1.23.1",
        "@react-native-community/netinfo": "11.3.1",
        "@react-navigation/bottom-tabs": "^6.5.20",
+        "@react-navigation/drawer": "^6.7.2",
        "@react-navigation/native": "^6.1.17",
        "@reduxjs/toolkit": "^2.2.6",
        "aws-amplify": "^6.4.2",
@@ -31,8 +32,10 @@
        "react": "18.2.0",
        "react-native": "^0.74.3",
        "react-native-dotenv": "^3.4.11",
+        "react-native-gesture-handler": "~2.16.1",
        "react-native-get-random-values": "^1.11.0",
        "react-native-qrcode-svg": "^6.3.1",
+        "react-native-reanimated": "~3.10.1",
        "react-native-safe-area-context": "^4.10.4",
        "react-native-screens": "3.31.1",
        "react-native-svg": "15.2.0",
@@ -2974,7 +2977,6 @@
      "version": "7.24.7",
      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.24.7.tgz",
      "integrity": "sha512-Ts7xQVk1OEocqzm8rHMXHlxvsfZ0cEF2yomUqpKENHWMF4zKk175Y4q8H5knJes6PgYad50uuRmt3UJuhBw8pQ==",
-      "peer": true,
      "dependencies": {
        "@babel/helper-plugin-utils": "^7.24.7",
        "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3"
@@ -3055,7 +3057,6 @@
      "version": "7.24.7",
      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.24.7.tgz",
      "integrity": "sha512-tK+0N9yd4j+x/4hxF3F0e0fu/VdcxU18y5SevtyM/PCFlQvXbR0Zmlo2eBrKtVipGNFzpq56o8WsIIKcJFUCRQ==",
-      "peer": true,
      "dependencies": {
        "@babel/helper-plugin-utils": "^7.24.7",
        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
@@ -3317,7 +3318,6 @@
      "version": "7.24.7",
      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.24.7.tgz",
      "integrity": "sha512-AfDTQmClklHCOLxtGoP7HkeMw56k1/bTQjwsfhL6pppo/M4TOBSq+jjBUBLmV/4oeFg4GWMavIl44ZeCtmmZTw==",
-      "peer": true,
      "dependencies": {
        "@babel/helper-plugin-utils": "^7.24.7"
      },
@@ -3665,6 +3665,18 @@
        "node": ">=6.9.0"
      }
    },
+    "node_modules/@egjs/hammerjs": {
+      "version": "2.0.17",
+      "resolved": "https://registry.npmjs.org/@egjs/hammerjs/-/hammerjs-2.0.17.tgz",
+      "integrity": "sha512-XQsZgjm2EcVUiZQf11UBJQfmZeEmOW8DpI1gsFeln6w0ae0ii4dMQEQ0kjl6DspdWX1aGY1/loyXnP0JS06e/A==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hammerjs": "^2.0.36"
+      },
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
    "node_modules/@expo/bunyan": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/@expo/bunyan/-/bunyan-4.0.0.tgz",
@@ -7324,10 +7336,31 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/@react-navigation/drawer": {
+      "version": "6.7.2",
+      "resolved": "https://registry.npmjs.org/@react-navigation/drawer/-/drawer-6.7.2.tgz",
+      "integrity": "sha512-o4g2zgTZa2+oLd+8V33etrSM38KIqu8S/zCBTsdsHUoQyVE7JNRiv3Qgq/jMvEb8PZCqWmm7jHItcgzrBuwyOQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@react-navigation/elements": "^1.3.31",
+        "color": "^4.2.3",
+        "warn-once": "^0.1.0"
+      },
+      "peerDependencies": {
+        "@react-navigation/native": "^6.0.0",
+        "react": "*",
+        "react-native": "*",
+        "react-native-gesture-handler": ">= 1.0.0",
+        "react-native-reanimated": ">= 1.0.0",
+        "react-native-safe-area-context": ">= 3.0.0",
+        "react-native-screens": ">= 3.0.0"
+      }
+    },
    "node_modules/@react-navigation/elements": {
-      "version": "1.3.30",
-      "resolved": "https://registry.npmjs.org/@react-navigation/elements/-/elements-1.3.30.tgz",
-      "integrity": "sha512-plhc8UvCZs0UkV+sI+3bisIyn78wz9O/BiWZXpounu72k/R/Sj5PuZYFJ1fi6psvriUveMCGh4LeZckAZu2qiQ==",
+      "version": "1.3.31",
+      "resolved": "https://registry.npmjs.org/@react-navigation/elements/-/elements-1.3.31.tgz",
+      "integrity": "sha512-bUzP4Awlljx5RKEExw8WYtif8EuQni2glDaieYROKTnaxsu9kEIA515sXQgUDZU4Ob12VoL7+z70uO3qrlfXcQ==",
+      "license": "MIT",
      "peerDependencies": {
        "@react-navigation/native": "^6.0.0",
        "react": "*",
@@ -8720,6 +8753,12 @@
      "integrity": "sha512-SMWlRBukG9KV8ZNjwemp2AzDibp/czIAeKKTw09nCPbWxVskIxactCJCGOp4y6I1hCMY7T7UGfySvBLXNeUbEw==",
      "license": "MIT"
    },
+    "node_modules/@types/hammerjs": {
+      "version": "2.0.45",
+      "resolved": "https://registry.npmjs.org/@types/hammerjs/-/hammerjs-2.0.45.tgz",
+      "integrity": "sha512-qkcUlZmX6c4J8q45taBKTL3p+LbITgyx7qhlPYOdOHZB7B31K0mXbP5YA7i7SgDeEGuI9MnumiKPEMrxg8j3KQ==",
+      "license": "MIT"
+    },
    "node_modules/@types/istanbul-lib-coverage": {
      "version": "2.0.6",
      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.6.tgz",
@@ -12186,6 +12225,15 @@
        "node": ">=8"
      }
    },
+    "node_modules/hoist-non-react-statics": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+      "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "react-is": "^16.7.0"
+      }
+    },
    "node_modules/hosted-git-info": {
      "version": "3.0.8",
      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-3.0.8.tgz",
@@ -16260,6 +16308,23 @@
        "@babel/runtime": "^7.20.6"
      }
    },
+    "node_modules/react-native-gesture-handler": {
+      "version": "2.16.2",
+      "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.16.2.tgz",
+      "integrity": "sha512-vGFlrDKlmyI+BT+FemqVxmvO7nqxU33cgXVsn6IKAFishvlG3oV2Ds67D5nPkHMea8T+s1IcuMm0bF8ntZtAyg==",
+      "license": "MIT",
+      "dependencies": {
+        "@egjs/hammerjs": "^2.0.17",
+        "hoist-non-react-statics": "^3.3.0",
+        "invariant": "^2.2.4",
+        "lodash": "^4.17.21",
+        "prop-types": "^15.7.2"
+      },
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*"
+      }
+    },
    "node_modules/react-native-get-random-values": {
      "version": "1.11.0",
      "resolved": "https://registry.npmjs.org/react-native-get-random-values/-/react-native-get-random-values-1.11.0.tgz",
@@ -16286,6 +16351,27 @@
        "react-native-svg": ">=13.2.0"
      }
    },
+    "node_modules/react-native-reanimated": {
+      "version": "3.10.1",
+      "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.10.1.tgz",
+      "integrity": "sha512-sfxg6vYphrDc/g4jf/7iJ7NRi+26z2+BszPmvmk0Vnrz6FL7HYljJqTf531F1x6tFmsf+FEAmuCtTUIXFLVo9w==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/plugin-transform-arrow-functions": "^7.0.0-0",
+        "@babel/plugin-transform-nullish-coalescing-operator": "^7.0.0-0",
+        "@babel/plugin-transform-optional-chaining": "^7.0.0-0",
+        "@babel/plugin-transform-shorthand-properties": "^7.0.0-0",
+        "@babel/plugin-transform-template-literals": "^7.0.0-0",
+        "@babel/preset-typescript": "^7.16.7",
+        "convert-source-map": "^2.0.0",
+        "invariant": "^2.2.4"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0",
+        "react": "*",
+        "react-native": "*"
+      }
+    },
    "node_modules/react-native-safe-area-context": {
      "version": "4.10.8",
      "resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-4.10.8.tgz",
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
    "@react-native-async-storage/async-storage": "^1.23.1",
    "@react-native-community/netinfo": "11.3.1",
    "@react-navigation/bottom-tabs": "^6.5.20",
+    "@react-navigation/drawer": "^6.7.2",
    "@react-navigation/native": "^6.1.17",
    "@reduxjs/toolkit": "^2.2.6",
    "aws-amplify": "^6.4.2",
@@ -34,8 +35,10 @@
    "react": "18.2.0",
    "react-native": "^0.74.3",
    "react-native-dotenv": "^3.4.11",
+    "react-native-gesture-handler": "~2.16.1",
    "react-native-get-random-values": "^1.11.0",
    "react-native-qrcode-svg": "^6.3.1",
+    "react-native-reanimated": "~3.10.1",
    "react-native-safe-area-context": "^4.10.4",
    "react-native-screens": "3.31.1",
    "react-native-svg": "15.2.0",
--- a/screens/SettingsScreen.tsx
+++ b/screens/SettingsScreen.tsx
@@ -4,6 +4,7 @@ import useFetchUserAttributes from '../hooks/useFetchUserAttributes';
 import { fetchAuthSession, getCurrentUser, signInWithRedirect } from 'aws-amplify/auth';
 import { useEffect, useState } from 'react';
 import { Buffer } from 'buffer';
+import { createDrawerNavigator } from '@react-navigation/drawer';


 function SignOutButton() {