From 4b0b9053c30c18faa94048062eca156c91c27f89 Mon Sep 17 00:00:00 2001 From: Justin Date: Sat, 26 Oct 2024 23:48:15 -0500 Subject: [PATCH 1/4] set-up firebase and displayed on page --- package-lock.json | 772 +++++++++++++++++++++++++++++++++++++++++- package.json | 5 +- src/App.tsx | 29 +- src/firebaseconfig.ts | 21 ++ src/login.tsx | 41 +++ src/register.tsx | 41 +++ 6 files changed, 876 insertions(+), 33 deletions(-) create mode 100644 src/firebaseconfig.ts create mode 100644 src/login.tsx create mode 100644 src/register.tsx diff --git a/package-lock.json b/package-lock.json index dab1a4e..21c4f0d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,9 +13,10 @@ "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", "@types/jest": "^27.5.2", - "@types/node": "^16.18.114", - "@types/react": "^18.3.11", + "@types/node": "^16.18.115", + "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", + "firebase": "^11.0.1", "react": "^18.3.1", "react-dom": "^18.3.1", "react-scripts": "5.0.1", @@ -2578,6 +2579,568 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/@firebase/analytics": { + "version": "0.10.9", + "resolved": "https://registry.npmjs.org/@firebase/analytics/-/analytics-0.10.9.tgz", + "integrity": "sha512-FrvW6u6xDBKXUGYUy1WIUh0J9tvbppMsk90mig0JhHST8iLveKu/dIBVeVE/ZYZhmXy4fkI7SPSWvD1V0O4tXw==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/installations": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/analytics-compat": { + "version": "0.2.15", + "resolved": "https://registry.npmjs.org/@firebase/analytics-compat/-/analytics-compat-0.2.15.tgz", + "integrity": "sha512-C5to422Sr8FkL0MPwXcIecbMnF4o2Ll7MtoWvIm4Q/LPJvvM+tWa1DiU+LzsCdsd1/CYE9EIW9Ma3ko9XnAAYw==", + "dependencies": { + "@firebase/analytics": "0.10.9", + "@firebase/analytics-types": "0.8.2", + "@firebase/component": "0.6.10", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/analytics-types": { + "version": "0.8.2", + "resolved": "https://registry.npmjs.org/@firebase/analytics-types/-/analytics-types-0.8.2.tgz", + "integrity": "sha512-EnzNNLh+9/sJsimsA/FGqzakmrAUKLeJvjRHlg8df1f97NLUlFidk9600y0ZgWOp3CAxn6Hjtk+08tixlUOWyw==" + }, + "node_modules/@firebase/app": { + "version": "0.10.15", + "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.10.15.tgz", + "integrity": "sha512-he6qlG3pmwL+LHdG/BrSMBQeJzzutciq4fpXN3lGa1uSwYSijJ24VtakS/bP2X9SiDf8jGywJ4u+OgXAenJsNg==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "idb": "7.1.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@firebase/app-check": { + "version": "0.8.9", + "resolved": "https://registry.npmjs.org/@firebase/app-check/-/app-check-0.8.9.tgz", + "integrity": "sha512-YzVn1mMLzD2JboMPVVO0Pe20YOgWzrF+aXoAmmd0v3xec051n83YpxSUZbacL69uYvk0dHrEsbea44QtQ5WPDA==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/app-check-compat": { + "version": "0.3.16", + "resolved": "https://registry.npmjs.org/@firebase/app-check-compat/-/app-check-compat-0.3.16.tgz", + "integrity": "sha512-AxIGzLRXrTFNL+H6V+4BO0w/gERloROfRbWI/FoJUnQd0qPZIzyfdHZBbThFzFGLfDt/mVs2kdjYFx/l9I8NhQ==", + "dependencies": { + "@firebase/app-check": "0.8.9", + "@firebase/app-check-types": "0.5.2", + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/app-check-interop-types": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/@firebase/app-check-interop-types/-/app-check-interop-types-0.3.2.tgz", + "integrity": "sha512-LMs47Vinv2HBMZi49C09dJxp0QT5LwDzFaVGf/+ITHe3BlIhUiLNttkATSXplc89A2lAaeTqjgqVkiRfUGyQiQ==" + }, + "node_modules/@firebase/app-check-types": { + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/@firebase/app-check-types/-/app-check-types-0.5.2.tgz", + "integrity": "sha512-FSOEzTzL5bLUbD2co3Zut46iyPWML6xc4x+78TeaXMSuJap5QObfb+rVvZJtla3asN4RwU7elaQaduP+HFizDA==" + }, + "node_modules/@firebase/app-compat": { + "version": "0.2.45", + "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.2.45.tgz", + "integrity": "sha512-5rYbXq1ndtMTg+07oH4WrkYuP+NZq61uzVwW1hlmybp/gr4cXq2SfaP9fc6/9IzTKmu3dh3H0fjj++HG7Z7o/w==", + "dependencies": { + "@firebase/app": "0.10.15", + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@firebase/app-types": { + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.9.2.tgz", + "integrity": "sha512-oMEZ1TDlBz479lmABwWsWjzHwheQKiAgnuKxE0pz0IXCVx7/rtlkx1fQ6GfgK24WCrxDKMplZrT50Kh04iMbXQ==" + }, + "node_modules/@firebase/auth": { + "version": "1.8.0", + "resolved": "https://registry.npmjs.org/@firebase/auth/-/auth-1.8.0.tgz", + "integrity": "sha512-/O7UDWE5S5ux456fzNHSLx/0YN/Kykw/WyAzgDQ6wvkddZhSEmPX19EzxgsFldzhuFjsl5uOZTz8kzlosCiJjg==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app": "0.x", + "@react-native-async-storage/async-storage": "^1.18.1" + }, + "peerDependenciesMeta": { + "@react-native-async-storage/async-storage": { + "optional": true + } + } + }, + "node_modules/@firebase/auth-compat": { + "version": "0.5.15", + "resolved": "https://registry.npmjs.org/@firebase/auth-compat/-/auth-compat-0.5.15.tgz", + "integrity": "sha512-jz6k1ridPiecKI8CBRiqCM6IMOhwYp2MD+YvoxnMiK8nQLSTm57GvHETlPNX3WlbyQnCjMCOvrAhe27whyxAEg==", + "dependencies": { + "@firebase/auth": "1.8.0", + "@firebase/auth-types": "0.12.2", + "@firebase/component": "0.6.10", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/auth-interop-types": { + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/@firebase/auth-interop-types/-/auth-interop-types-0.2.3.tgz", + "integrity": "sha512-Fc9wuJGgxoxQeavybiuwgyi+0rssr76b+nHpj+eGhXFYAdudMWyfBHvFL/I5fEHniUM/UQdFzi9VXJK2iZF7FQ==" + }, + "node_modules/@firebase/auth-types": { + "version": "0.12.2", + "resolved": "https://registry.npmjs.org/@firebase/auth-types/-/auth-types-0.12.2.tgz", + "integrity": "sha512-qsEBaRMoGvHO10unlDJhaKSuPn4pyoTtlQuP1ghZfzB6rNQPuhp/N/DcFZxm9i4v0SogjCbf9reWupwIvfmH6w==", + "peerDependencies": { + "@firebase/app-types": "0.x", + "@firebase/util": "1.x" + } + }, + "node_modules/@firebase/component": { + "version": "0.6.10", + "resolved": "https://registry.npmjs.org/@firebase/component/-/component-0.6.10.tgz", + "integrity": "sha512-OsNbEKyz9iLZSmMUhsl6+kCADzte00iisJIRUspnUqvDCX+RSGZOBIqekukv/jN177ovjApBQNFaxSYIDc/SyQ==", + "dependencies": { + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@firebase/data-connect": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/@firebase/data-connect/-/data-connect-0.1.1.tgz", + "integrity": "sha512-RBJ7XE/a3oXFv31Jlw8cbMRdsxQoI8F3L7xm4n93ab+bIr1NQUiYGgW9L7TTw7obdNev91ZnW0xfqJtXcPA5yA==", + "dependencies": { + "@firebase/auth-interop-types": "0.2.3", + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/database": { + "version": "1.0.9", + "resolved": "https://registry.npmjs.org/@firebase/database/-/database-1.0.9.tgz", + "integrity": "sha512-EkiPSKSu2TJJGtOjyISASf3UFpFJDil1lMbfqnxilfbmIsilvC8DzgjuLoYD+eOitcug4wtU9Fh1tt2vgBhskA==", + "dependencies": { + "@firebase/app-check-interop-types": "0.3.2", + "@firebase/auth-interop-types": "0.2.3", + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "faye-websocket": "0.11.4", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@firebase/database-compat": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@firebase/database-compat/-/database-compat-2.0.0.tgz", + "integrity": "sha512-2xlODKWwf/vNAxCmou0GFhymx2pqZKkhXMN9B5aiTjZ6+81sOxGim53ELY2lj+qKG2IvgiCYFc4X+ZJA2Ad5vg==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/database": "1.0.9", + "@firebase/database-types": "1.0.6", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@firebase/database-types": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/@firebase/database-types/-/database-types-1.0.6.tgz", + "integrity": "sha512-sMI7IynSZBsyGbUugc8PKE1jwKbnvaieAz/RxuM57PZQNCi6Rteiviwcw/jqZOX6igqYJwXWZ3UzKOZo2nUDRA==", + "dependencies": { + "@firebase/app-types": "0.9.2", + "@firebase/util": "1.10.1" + } + }, + "node_modules/@firebase/firestore": { + "version": "4.7.4", + "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-4.7.4.tgz", + "integrity": "sha512-K2nq4w+NF8J1waGawY5OHLawP/Aw5CYxyDstVv1NZemGPcM3U+LZ9EPaXr1PatYIrPA7fS4DxZoWcbB0aGJ8Zg==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "@firebase/webchannel-wrapper": "1.0.2", + "@grpc/grpc-js": "~1.9.0", + "@grpc/proto-loader": "^0.7.8", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/firestore-compat": { + "version": "0.3.39", + "resolved": "https://registry.npmjs.org/@firebase/firestore-compat/-/firestore-compat-0.3.39.tgz", + "integrity": "sha512-CsK8g34jNeHx95LISDRTcArJLonW+zJCqHI1Ez9WNiLAK2X8FeQ4UiD+RwOwxAIR+t2a6xED/5Fe6ZIqx7MuoQ==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/firestore": "4.7.4", + "@firebase/firestore-types": "3.0.2", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/firestore-types": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/@firebase/firestore-types/-/firestore-types-3.0.2.tgz", + "integrity": "sha512-wp1A+t5rI2Qc/2q7r2ZpjUXkRVPtGMd6zCLsiWurjsQpqPgFin3AhNibKcIzoF2rnToNa/XYtyWXuifjOOwDgg==", + "peerDependencies": { + "@firebase/app-types": "0.x", + "@firebase/util": "1.x" + } + }, + "node_modules/@firebase/functions": { + "version": "0.11.9", + "resolved": "https://registry.npmjs.org/@firebase/functions/-/functions-0.11.9.tgz", + "integrity": "sha512-dhO5IUfQRCsrc20YD20nSOX+QCT+cH6N86HlZOLz2XgyEFgzOdBQnUot4EabBJQRkMBI7fZWUrbYfRcnov53ug==", + "dependencies": { + "@firebase/app-check-interop-types": "0.3.2", + "@firebase/auth-interop-types": "0.2.3", + "@firebase/component": "0.6.10", + "@firebase/messaging-interop-types": "0.2.2", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/functions-compat": { + "version": "0.3.15", + "resolved": "https://registry.npmjs.org/@firebase/functions-compat/-/functions-compat-0.3.15.tgz", + "integrity": "sha512-eiHpc6Sd9Y/SNhBsGi944SapiFbfTPKsiSUQ74QxNSs0yoxvABeIRolVMFk4TokP57NGmstGYpYte02XGNPcYw==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/functions": "0.11.9", + "@firebase/functions-types": "0.6.2", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/functions-types": { + "version": "0.6.2", + "resolved": "https://registry.npmjs.org/@firebase/functions-types/-/functions-types-0.6.2.tgz", + "integrity": "sha512-0KiJ9lZ28nS2iJJvimpY4nNccV21rkQyor5Iheu/nq8aKXJqtJdeSlZDspjPSBBiHRzo7/GMUttegnsEITqR+w==" + }, + "node_modules/@firebase/installations": { + "version": "0.6.10", + "resolved": "https://registry.npmjs.org/@firebase/installations/-/installations-0.6.10.tgz", + "integrity": "sha512-TuGSOMqkFrllxa0X/8VZIqBCRH4POndU/iWKWkRmkh12+/xKSpdp+y/kWaVbsySrelltan6LeYlcYPmLibWbwg==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/util": "1.10.1", + "idb": "7.1.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/installations-compat": { + "version": "0.2.10", + "resolved": "https://registry.npmjs.org/@firebase/installations-compat/-/installations-compat-0.2.10.tgz", + "integrity": "sha512-YTonkcVz3AK7RF8xFhvs5CwDuJ0xbzzCJIwXoV14gnzdYbMgy6vWlUUbzkvbtEDXzPRHB0n7aGZl56oy9dLOFw==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/installations": "0.6.10", + "@firebase/installations-types": "0.5.2", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/installations-types": { + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/@firebase/installations-types/-/installations-types-0.5.2.tgz", + "integrity": "sha512-que84TqGRZJpJKHBlF2pkvc1YcXrtEDOVGiDjovP/a3s6W4nlbohGXEsBJo0JCeeg/UG9A+DEZVDUV9GpklUzA==", + "peerDependencies": { + "@firebase/app-types": "0.x" + } + }, + "node_modules/@firebase/logger": { + "version": "0.4.3", + "resolved": "https://registry.npmjs.org/@firebase/logger/-/logger-0.4.3.tgz", + "integrity": "sha512-Th42bWJg18EF5bJwhRosn2M/eYxmbWCwXZr4hHX7ltO0SE3QLrpgiMKeRBR/NW7vJke7i0n3i8esbCW2s93qBw==", + "dependencies": { + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@firebase/messaging": { + "version": "0.12.13", + "resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.12.13.tgz", + "integrity": "sha512-YLa8PWl+BgiOVR5WOyzl21fVJFJeBRfniNuN25d9DBrQzppSAahuN6yS+vt1OIjvZNPN4pZ/lcRLYupbGu4W0w==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/installations": "0.6.10", + "@firebase/messaging-interop-types": "0.2.2", + "@firebase/util": "1.10.1", + "idb": "7.1.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/messaging-compat": { + "version": "0.2.13", + "resolved": "https://registry.npmjs.org/@firebase/messaging-compat/-/messaging-compat-0.2.13.tgz", + "integrity": "sha512-9ootPClS6m2c2KIzo7AqSHaWzAw28zWcjQPjVv7WeQDu6wjufpbOg+7tuVzb+gqpF9Issa3lDoYOwlO0ZudO3g==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/messaging": "0.12.13", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/messaging-interop-types": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/@firebase/messaging-interop-types/-/messaging-interop-types-0.2.2.tgz", + "integrity": "sha512-l68HXbuD2PPzDUOFb3aG+nZj5KA3INcPwlocwLZOzPp9rFM9yeuI9YLl6DQfguTX5eAGxO0doTR+rDLDvQb5tA==" + }, + "node_modules/@firebase/performance": { + "version": "0.6.10", + "resolved": "https://registry.npmjs.org/@firebase/performance/-/performance-0.6.10.tgz", + "integrity": "sha512-x/mNYKGxq7A+QV0EiEZeD2S+E+kw+UcZ8FXuE7qDJyGGt/0Wd+bIIL7RakG/VrFt7/UYc//nKygDc7/Ig7sOmQ==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/installations": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/performance-compat": { + "version": "0.2.10", + "resolved": "https://registry.npmjs.org/@firebase/performance-compat/-/performance-compat-0.2.10.tgz", + "integrity": "sha512-0h1qYkF6I79DSSpHfTQFvb91fo8shmmwiPzWFYAPdPK02bSWpKwVssNYlZX2iUnumxerDMbl7dWN+Im/W3bnXA==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/performance": "0.6.10", + "@firebase/performance-types": "0.2.2", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/performance-types": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/@firebase/performance-types/-/performance-types-0.2.2.tgz", + "integrity": "sha512-gVq0/lAClVH5STrIdKnHnCo2UcPLjJlDUoEB/tB4KM+hAeHUxWKnpT0nemUPvxZ5nbdY/pybeyMe8Cs29gEcHA==" + }, + "node_modules/@firebase/remote-config": { + "version": "0.4.10", + "resolved": "https://registry.npmjs.org/@firebase/remote-config/-/remote-config-0.4.10.tgz", + "integrity": "sha512-jTRjy3TdqzVna19m5a1HEHE5BG4Z3BQTxBgvQRTmMKlHacx4QS0CToAas7R9M9UkxpgFcVuAE7FpWIOWQGCEWw==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/installations": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/remote-config-compat": { + "version": "0.2.10", + "resolved": "https://registry.npmjs.org/@firebase/remote-config-compat/-/remote-config-compat-0.2.10.tgz", + "integrity": "sha512-fIi5OB2zk0zpChMV/tTd0oEZcZI8TlwQDlLlcrDpMOV5l5dqd0JNlWKh6Fwmh4izmytk+rZIAIpnak/NjGVesQ==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/remote-config": "0.4.10", + "@firebase/remote-config-types": "0.3.2", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/remote-config-types": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/@firebase/remote-config-types/-/remote-config-types-0.3.2.tgz", + "integrity": "sha512-0BC4+Ud7y2aPTyhXJTMTFfrGGLqdYXrUB9sJVAB8NiqJswDTc4/2qrE/yfUbnQJhbSi6ZaTTBKyG3n1nplssaA==" + }, + "node_modules/@firebase/storage": { + "version": "0.13.3", + "resolved": "https://registry.npmjs.org/@firebase/storage/-/storage-0.13.3.tgz", + "integrity": "sha512-B5HiJ7isYKaT4dOEV43f2ySdhQxzq+SQEm7lqXebJ8AYCsebdHrgGzrPR0LR962xGjPzJHFKx63gA8Be/P2MCw==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app": "0.x" + } + }, + "node_modules/@firebase/storage-compat": { + "version": "0.3.13", + "resolved": "https://registry.npmjs.org/@firebase/storage-compat/-/storage-compat-0.3.13.tgz", + "integrity": "sha512-15kje7JALswRCBKsCSvKg5FbqUYykaIMqMbZRD7I6uVRWwdyTvez5MBQfMhBia2JcEmPiDpXhJTXH4PAWFiA8g==", + "dependencies": { + "@firebase/component": "0.6.10", + "@firebase/storage": "0.13.3", + "@firebase/storage-types": "0.8.2", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app-compat": "0.x" + } + }, + "node_modules/@firebase/storage-types": { + "version": "0.8.2", + "resolved": "https://registry.npmjs.org/@firebase/storage-types/-/storage-types-0.8.2.tgz", + "integrity": "sha512-0vWu99rdey0g53lA7IShoA2Lol1jfnPovzLDUBuon65K7uKG9G+L5uO05brD9pMw+l4HRFw23ah3GwTGpEav6g==", + "peerDependencies": { + "@firebase/app-types": "0.x", + "@firebase/util": "1.x" + } + }, + "node_modules/@firebase/util": { + "version": "1.10.1", + "resolved": "https://registry.npmjs.org/@firebase/util/-/util-1.10.1.tgz", + "integrity": "sha512-AIhFnCCjM8FmCqSNlNPTuOk3+gpHC1RkeNUBLtPbcqGYpN5MxI5q7Yby+rxycweOZOCboDzfIj8WyaY4tpQG/g==", + "dependencies": { + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + } + }, + "node_modules/@firebase/vertexai": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@firebase/vertexai/-/vertexai-1.0.0.tgz", + "integrity": "sha512-48N3Lp/9GgiCCRfrSdHS+Y1IiMdYXvnHFO/f+HL1PgUtBq7WQ/fWmYOX3mzAN36zvytq13nb68ImF+GALopp+Q==", + "dependencies": { + "@firebase/app-check-interop-types": "0.3.2", + "@firebase/component": "0.6.10", + "@firebase/logger": "0.4.3", + "@firebase/util": "1.10.1", + "tslib": "^2.1.0" + }, + "engines": { + "node": ">=18.0.0" + }, + "peerDependencies": { + "@firebase/app": "0.x", + "@firebase/app-types": "0.x" + } + }, + "node_modules/@firebase/webchannel-wrapper": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@firebase/webchannel-wrapper/-/webchannel-wrapper-1.0.2.tgz", + "integrity": "sha512-3F4iA2E+NtdMbOU0XC1cHE8q6MqpGIKRj62oGOF38S6AAx5VHR9cXmoDUSj7ejvTAT7m6jxuEeQkHeq0F+mU2w==" + }, "node_modules/@formatjs/ecma402-abstract": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-2.2.0.tgz", @@ -2628,6 +3191,73 @@ "tslib": "^2.7.0" } }, + "node_modules/@grpc/grpc-js": { + "version": "1.9.15", + "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.15.tgz", + "integrity": "sha512-nqE7Hc0AzI+euzUwDAy0aY5hCp10r734gMGRdU+qOPX0XSceI2ULrcXB5U2xSc5VkWwalCj4M7GzCAygZl2KoQ==", + "dependencies": { + "@grpc/proto-loader": "^0.7.8", + "@types/node": ">=12.12.47" + }, + "engines": { + "node": "^8.13.0 || >=10.10.0" + } + }, + "node_modules/@grpc/proto-loader": { + "version": "0.7.13", + "resolved": "https://registry.npmjs.org/@grpc/proto-loader/-/proto-loader-0.7.13.tgz", + "integrity": "sha512-AiXO/bfe9bmxBjxxtYxFAXGZvMaN5s8kO+jBHAJCON8rJoB5YS/D6X7ZNc6XQkuHNmyl4CYaMI1fJ/Gn27RGGw==", + "dependencies": { + "lodash.camelcase": "^4.3.0", + "long": "^5.0.0", + "protobufjs": "^7.2.5", + "yargs": "^17.7.2" + }, + "bin": { + "proto-loader-gen-types": "build/bin/proto-loader-gen-types.js" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@grpc/proto-loader/node_modules/cliui": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz", + "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==", + "dependencies": { + "string-width": "^4.2.0", + "strip-ansi": "^6.0.1", + "wrap-ansi": "^7.0.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@grpc/proto-loader/node_modules/yargs": { + "version": "17.7.2", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz", + "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==", + "dependencies": { + "cliui": "^8.0.1", + "escalade": "^3.1.1", + "get-caller-file": "^2.0.5", + "require-directory": "^2.1.1", + "string-width": "^4.2.3", + "y18n": "^5.0.5", + "yargs-parser": "^21.1.1" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@grpc/proto-loader/node_modules/yargs-parser": { + "version": "21.1.1", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz", + "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==", + "engines": { + "node": ">=12" + } + }, "node_modules/@humanwhocodes/config-array": { "version": "0.13.0", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz", @@ -3647,6 +4277,60 @@ } } }, + "node_modules/@protobufjs/aspromise": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@protobufjs/aspromise/-/aspromise-1.1.2.tgz", + "integrity": "sha512-j+gKExEuLmKwvz3OgROXtrJ2UG2x8Ch2YZUxahh+s1F2HZ+wAceUNLkvy6zKCPVRkU++ZWQrdxsUeQXmcg4uoQ==" + }, + "node_modules/@protobufjs/base64": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@protobufjs/base64/-/base64-1.1.2.tgz", + "integrity": "sha512-AZkcAA5vnN/v4PDqKyMR5lx7hZttPDgClv83E//FMNhR2TMcLUhfRUBHCmSl0oi9zMgDDqRUJkSxO3wm85+XLg==" + }, + "node_modules/@protobufjs/codegen": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/@protobufjs/codegen/-/codegen-2.0.4.tgz", + "integrity": "sha512-YyFaikqM5sH0ziFZCN3xDC7zeGaB/d0IUb9CATugHWbd1FRFwWwt4ld4OYMPWu5a3Xe01mGAULCdqhMlPl29Jg==" + }, + "node_modules/@protobufjs/eventemitter": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@protobufjs/eventemitter/-/eventemitter-1.1.0.tgz", + "integrity": "sha512-j9ednRT81vYJ9OfVuXG6ERSTdEL1xVsNgqpkxMsbIabzSo3goCjDIveeGv5d03om39ML71RdmrGNjG5SReBP/Q==" + }, + "node_modules/@protobufjs/fetch": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@protobufjs/fetch/-/fetch-1.1.0.tgz", + "integrity": "sha512-lljVXpqXebpsijW71PZaCYeIcE5on1w5DlQy5WH6GLbFryLUrBD4932W/E2BSpfRJWseIL4v/KPgBFxDOIdKpQ==", + "dependencies": { + "@protobufjs/aspromise": "^1.1.1", + "@protobufjs/inquire": "^1.1.0" + } + }, + "node_modules/@protobufjs/float": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@protobufjs/float/-/float-1.0.2.tgz", + "integrity": "sha512-Ddb+kVXlXst9d+R9PfTIxh1EdNkgoRe5tOX6t01f1lYWOvJnSPDBlG241QLzcyPdoNTsblLUdujGSE4RzrTZGQ==" + }, + "node_modules/@protobufjs/inquire": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@protobufjs/inquire/-/inquire-1.1.0.tgz", + "integrity": "sha512-kdSefcPdruJiFMVSbn801t4vFK7KB/5gd2fYvrxhuJYg8ILrmn9SKSX2tZdV6V+ksulWqS7aXjBcRXl3wHoD9Q==" + }, + "node_modules/@protobufjs/path": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@protobufjs/path/-/path-1.1.2.tgz", + "integrity": "sha512-6JOcJ5Tm08dOHAbdR3GrvP+yUUfkjG5ePsHYczMFLq3ZmMkAD98cDgcT2iA1lJ9NVwFd4tH/iSSoe44YWkltEA==" + }, + "node_modules/@protobufjs/pool": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@protobufjs/pool/-/pool-1.1.0.tgz", + "integrity": "sha512-0kELaGSIDBKvcgS4zkjz1PeddatrjYcmMWOlAuAPwAeccUrPHdUqo/J6LiymHHEiJT5NrF1UVwxY14f+fy4WQw==" + }, + "node_modules/@protobufjs/utf8": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@protobufjs/utf8/-/utf8-1.1.0.tgz", + "integrity": "sha512-Vvn3zZrhQZkkBE8LSuW3em98c0FwgO4nxzv6OdSxPKJIEKY2bGbHn+mhGIPerzI4twdxaP8/0+06HBpwf345Lw==" + }, "node_modules/@react-aria/accordion": { "version": "3.0.0-alpha.35", "resolved": "https://registry.npmjs.org/@react-aria/accordion/-/accordion-3.0.0-alpha.35.tgz", @@ -7706,10 +8390,9 @@ "license": "MIT" }, "node_modules/@types/node": { - "version": "16.18.114", - "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.114.tgz", - "integrity": "sha512-7oAtnxrgkMNzyzT443UDWwzkmYew81F1ZSPm3/lsITJfW/WludaSOpegTvUG+UdapcbrtWOtY/E4LyTkhPGJ5Q==", - "license": "MIT" + "version": "16.18.115", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.115.tgz", + "integrity": "sha512-NF5ajYn+dq0tRfswdyp8Df75h7D9z+L8TCIwrXoh46ZLK6KZVXkRhf/luXaZytvm/keUo9vU4m1Bg39St91a5w==" }, "node_modules/@types/node-forge": { "version": "1.3.11", @@ -7757,10 +8440,9 @@ "license": "MIT" }, "node_modules/@types/react": { - "version": "18.3.11", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.11.tgz", - "integrity": "sha512-r6QZ069rFTjrEYgFdOck1gK7FLVsgJE7tTz0pQBczlBNUhBNk0MQH4UbnFSwjpQLMkLzgqvBBa+qGpLje16eTQ==", - "license": "MIT", + "version": "18.3.12", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.12.tgz", + "integrity": "sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==", "dependencies": { "@types/prop-types": "*", "csstype": "^3.0.2" @@ -7770,7 +8452,6 @@ "version": "18.3.1", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.1.tgz", "integrity": "sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==", - "license": "MIT", "dependencies": { "@types/react": "*" } @@ -12208,6 +12889,41 @@ "node": ">=8" } }, + "node_modules/firebase": { + "version": "11.0.1", + "resolved": "https://registry.npmjs.org/firebase/-/firebase-11.0.1.tgz", + "integrity": "sha512-qsFb8dMcQINEDhJteG7RP+GqwgSRvfyiexQqHd5JToDdm87i9I2rGC4XQsGawKGxzKwZ/ISdgwNWxXAFYdCC6A==", + "dependencies": { + "@firebase/analytics": "0.10.9", + "@firebase/analytics-compat": "0.2.15", + "@firebase/app": "0.10.15", + "@firebase/app-check": "0.8.9", + "@firebase/app-check-compat": "0.3.16", + "@firebase/app-compat": "0.2.45", + "@firebase/app-types": "0.9.2", + "@firebase/auth": "1.8.0", + "@firebase/auth-compat": "0.5.15", + "@firebase/data-connect": "0.1.1", + "@firebase/database": "1.0.9", + "@firebase/database-compat": "2.0.0", + "@firebase/firestore": "4.7.4", + "@firebase/firestore-compat": "0.3.39", + "@firebase/functions": "0.11.9", + "@firebase/functions-compat": "0.3.15", + "@firebase/installations": "0.6.10", + "@firebase/installations-compat": "0.2.10", + "@firebase/messaging": "0.12.13", + "@firebase/messaging-compat": "0.2.13", + "@firebase/performance": "0.6.10", + "@firebase/performance-compat": "0.2.10", + "@firebase/remote-config": "0.4.10", + "@firebase/remote-config-compat": "0.2.10", + "@firebase/storage": "0.13.3", + "@firebase/storage-compat": "0.3.13", + "@firebase/util": "1.10.1", + "@firebase/vertexai": "1.0.0" + } + }, "node_modules/flat-cache": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.2.0.tgz", @@ -16466,6 +17182,11 @@ "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", "license": "MIT" }, + "node_modules/lodash.camelcase": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz", + "integrity": "sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==" + }, "node_modules/lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", @@ -16496,6 +17217,11 @@ "integrity": "sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ==", "license": "MIT" }, + "node_modules/long": { + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/long/-/long-5.2.3.tgz", + "integrity": "sha512-lcHwpNoggQTObv5apGNCTdJrO69eHOZMi4BNC+rTLER8iHAqGrUVeLh/irVIM7zTw2bOXA8T6uNPeujwOLg/2Q==" + }, "node_modules/loose-envify": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", @@ -18873,6 +19599,29 @@ "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", "license": "MIT" }, + "node_modules/protobufjs": { + "version": "7.4.0", + "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.4.0.tgz", + "integrity": "sha512-mRUWCc3KUU4w1jU8sGxICXH/gNS94DvI1gxqDvBzhj1JpcsimQkYiOJfwsPUykUI5ZaspFbSgmBLER8IrQ3tqw==", + "hasInstallScript": true, + "dependencies": { + "@protobufjs/aspromise": "^1.1.2", + "@protobufjs/base64": "^1.1.2", + "@protobufjs/codegen": "^2.0.4", + "@protobufjs/eventemitter": "^1.1.0", + "@protobufjs/fetch": "^1.1.0", + "@protobufjs/float": "^1.0.2", + "@protobufjs/inquire": "^1.1.0", + "@protobufjs/path": "^1.1.2", + "@protobufjs/pool": "^1.1.0", + "@protobufjs/utf8": "^1.1.0", + "@types/node": ">=13.7.0", + "long": "^5.0.0" + }, + "engines": { + "node": ">=12.0.0" + } + }, "node_modules/proxy-addr": { "version": "2.0.7", "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz", @@ -21738,7 +22487,6 @@ "version": "4.9.5", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", - "license": "Apache-2.0", "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" diff --git a/package.json b/package.json index 7bd9f2c..daf847c 100644 --- a/package.json +++ b/package.json @@ -8,9 +8,10 @@ "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", "@types/jest": "^27.5.2", - "@types/node": "^16.18.114", - "@types/react": "^18.3.11", + "@types/node": "^16.18.115", + "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", + "firebase": "^11.0.1", "react": "^18.3.1", "react-dom": "^18.3.1", "react-scripts": "5.0.1", diff --git a/src/App.tsx b/src/App.tsx index a53698a..ca3448f 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,26 +1,17 @@ +// src/App.tsx import React from 'react'; -import logo from './logo.svg'; -import './App.css'; +import Register from './register'; +import Login from './login'; -function App() { +const App: React.FC = () => { return ( -
-
- logo -

- Edit src/App.tsx and save to reload. -

- - Learn React - -
+
+

Metroll v1

+ +
); -} +}; export default App; + diff --git a/src/firebaseconfig.ts b/src/firebaseconfig.ts new file mode 100644 index 0000000..ad050d3 --- /dev/null +++ b/src/firebaseconfig.ts @@ -0,0 +1,21 @@ +// Import the functions you need from the SDKs you need +import { initializeApp } from "firebase/app"; +import { getAuth } from 'firebase/auth'; +// TODO: Add SDKs for Firebase products that you want to use +// https://firebase.google.com/docs/web/setup#available-libraries + +// Your web app's Firebase configuration +// For Firebase JS SDK v7.20.0 and later, measurementId is optional +const firebaseConfig = { + apiKey: "AIzaSyBctlGjVBPDHhr34jLPiHuQtNvY0Thx-k0", + authDomain: "metroll-c924c.firebaseapp.com", + projectId: "metroll-c924c", + storageBucket: "metroll-c924c.appspot.com", + messagingSenderId: "1012554613311", + appId: "1:1012554613311:web:5b9deb9281b46d2edc6e8a", + measurementId: "G-Q6DHKKY7V5" +}; + +// Initialize Firebase +const app = initializeApp(firebaseConfig); +export const auth = getAuth(app); \ No newline at end of file diff --git a/src/login.tsx b/src/login.tsx new file mode 100644 index 0000000..d57b049 --- /dev/null +++ b/src/login.tsx @@ -0,0 +1,41 @@ +// src/Login.tsx +import React, { useState } from 'react'; +import { signInWithEmailAndPassword } from 'firebase/auth'; +import { auth } from './firebaseconfig'; + +const Login: React.FC = () => { + const [email, setEmail] = useState(''); + const [password, setPassword] = useState(''); + + const handleLogin = async () => { + try { + await signInWithEmailAndPassword(auth, email, password); + alert('Login Successful'); + } catch (error) { + console.error("Error logging in:", error); + alert((error as Error).message); + } + }; + + return ( +
+

Login

+ setEmail(e.target.value)} + placeholder="Email" + /> + setPassword(e.target.value)} + placeholder="Password" + /> + +
+ ); +}; + +export default Login; +export {}; diff --git a/src/register.tsx b/src/register.tsx new file mode 100644 index 0000000..3d3cc70 --- /dev/null +++ b/src/register.tsx @@ -0,0 +1,41 @@ +// src/Register.tsx +import React, { useState } from 'react'; +import { createUserWithEmailAndPassword } from 'firebase/auth'; +import { auth } from './firebaseconfig'; + +const Register: React.FC = () => { + const [email, setEmail] = useState(''); + const [password, setPassword] = useState(''); + + const handleRegister = async () => { + try { + await createUserWithEmailAndPassword(auth, email, password); + alert('Registration Successful'); + } catch (error) { + console.error("Error registering:", error); + alert((error as Error).message); + } + }; + + return ( +
+

Register

+ setEmail(e.target.value)} + placeholder="Email" + /> + setPassword(e.target.value)} + placeholder="Password" + /> + +
+ ); +}; + +export default Register; +export {}; From 4cd8616ffa23f43fa38b61f88db9d22bcde8ed42 Mon Sep 17 00:00:00 2001 From: Justin Date: Sun, 27 Oct 2024 00:29:13 -0500 Subject: [PATCH 2/4] google-sign in --- package-lock.json | 39 +++++++++++++++++++++++++++++++ package.json | 1 + src/App.tsx | 33 +++++++++++++++++++------- src/components/googlelog.tsx | 24 +++++++++++++++++++ src/{ => components}/login.tsx | 2 +- src/{ => components}/register.tsx | 2 +- src/firebaseconfig.ts | 6 +++-- src/pages/googlepage.tsx | 15 ++++++++++++ src/pages/loginpage.tsx | 15 ++++++++++++ src/pages/registerpage.tsx | 15 ++++++++++++ 10 files changed, 140 insertions(+), 12 deletions(-) create mode 100644 src/components/googlelog.tsx rename src/{ => components}/login.tsx (95%) rename src/{ => components}/register.tsx (95%) create mode 100644 src/pages/googlepage.tsx create mode 100644 src/pages/loginpage.tsx create mode 100644 src/pages/registerpage.tsx diff --git a/package-lock.json b/package-lock.json index 21c4f0d..5dd16f6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,6 +19,7 @@ "firebase": "^11.0.1", "react": "^18.3.1", "react-dom": "^18.3.1", + "react-router-dom": "^6.27.0", "react-scripts": "5.0.1", "typescript": "^4.9.5", "web-vitals": "^2.1.4" @@ -7447,6 +7448,14 @@ "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0" } }, + "node_modules/@remix-run/router": { + "version": "1.20.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.20.0.tgz", + "integrity": "sha512-mUnk8rPJBI9loFDZ+YzPGdeniYK+FTmRD1TMCz7ev2SNIozyKKpnGgsxO34u6Z4z/t0ITuu7voi/AshfsGsgFg==", + "engines": { + "node": ">=14.0.0" + } + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -20124,6 +20133,36 @@ "node": ">=0.10.0" } }, + "node_modules/react-router": { + "version": "6.27.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.27.0.tgz", + "integrity": "sha512-YA+HGZXz4jaAkVoYBE98VQl+nVzI+cVI2Oj/06F5ZM+0u3TgedN9Y9kmMRo2mnkSK2nCpNQn0DVob4HCsY/WLw==", + "dependencies": { + "@remix-run/router": "1.20.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/react-router-dom": { + "version": "6.27.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.27.0.tgz", + "integrity": "sha512-+bvtFWMC0DgAFrfKXKG9Fc+BcXWRUO1aJIihbB79xaeq0v5UzfvnM5houGUm1Y461WVRcgAQ+Clh5rdb1eCx4g==", + "dependencies": { + "@remix-run/router": "1.20.0", + "react-router": "6.27.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/react-scripts": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz", diff --git a/package.json b/package.json index daf847c..45f16d9 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "firebase": "^11.0.1", "react": "^18.3.1", "react-dom": "^18.3.1", + "react-router-dom": "^6.27.0", "react-scripts": "5.0.1", "typescript": "^4.9.5", "web-vitals": "^2.1.4" diff --git a/src/App.tsx b/src/App.tsx index ca3448f..9ac66f8 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,17 +1,34 @@ -// src/App.tsx + import React from 'react'; -import Register from './register'; -import Login from './login'; +import { BrowserRouter as Router, Routes, Route, useNavigate } from 'react-router-dom'; +import RegisterPage from './pages/registerpage'; +import LoginPage from './pages/loginpage'; +import GoogleSignInPage from './pages/googlepage'; + +const Home: React.FC = () => { + const navigate = useNavigate(); -const App: React.FC = () => { return (
-

Metroll v1

- - +

Home Page

+ + +
); }; -export default App; +const App: React.FC = () => { + return ( + + + } /> + } /> + } /> + } /> + + + ); +}; +export default App; diff --git a/src/components/googlelog.tsx b/src/components/googlelog.tsx new file mode 100644 index 0000000..131a953 --- /dev/null +++ b/src/components/googlelog.tsx @@ -0,0 +1,24 @@ +// src/GoogleSignIn.tsx +import React from 'react'; +import { signInWithPopup } from 'firebase/auth'; +import { auth, googleProvider } from '../firebaseconfig'; + +const GoogleSignIn: React.FC = () => { + const handleGoogleSignIn = async () => { + try { + await signInWithPopup(auth, googleProvider); + alert('Google Sign-In Successful'); + } catch (error) { + console.error("Error with Google Sign-In:", error); + alert((error as Error).message); + } + }; + + return ( + + ); +}; + +export default GoogleSignIn; diff --git a/src/login.tsx b/src/components/login.tsx similarity index 95% rename from src/login.tsx rename to src/components/login.tsx index d57b049..09db5a3 100644 --- a/src/login.tsx +++ b/src/components/login.tsx @@ -1,7 +1,7 @@ // src/Login.tsx import React, { useState } from 'react'; import { signInWithEmailAndPassword } from 'firebase/auth'; -import { auth } from './firebaseconfig'; +import { auth } from '../firebaseconfig'; const Login: React.FC = () => { const [email, setEmail] = useState(''); diff --git a/src/register.tsx b/src/components/register.tsx similarity index 95% rename from src/register.tsx rename to src/components/register.tsx index 3d3cc70..169e5a8 100644 --- a/src/register.tsx +++ b/src/components/register.tsx @@ -1,7 +1,7 @@ // src/Register.tsx import React, { useState } from 'react'; import { createUserWithEmailAndPassword } from 'firebase/auth'; -import { auth } from './firebaseconfig'; +import { auth } from '../firebaseconfig'; const Register: React.FC = () => { const [email, setEmail] = useState(''); diff --git a/src/firebaseconfig.ts b/src/firebaseconfig.ts index ad050d3..eccdb8b 100644 --- a/src/firebaseconfig.ts +++ b/src/firebaseconfig.ts @@ -1,6 +1,7 @@ // Import the functions you need from the SDKs you need import { initializeApp } from "firebase/app"; -import { getAuth } from 'firebase/auth'; +import { getAuth , GoogleAuthProvider} from 'firebase/auth'; + // TODO: Add SDKs for Firebase products that you want to use // https://firebase.google.com/docs/web/setup#available-libraries @@ -18,4 +19,5 @@ const firebaseConfig = { // Initialize Firebase const app = initializeApp(firebaseConfig); -export const auth = getAuth(app); \ No newline at end of file +export const auth = getAuth(app); +export const googleProvider = new GoogleAuthProvider(); \ No newline at end of file diff --git a/src/pages/googlepage.tsx b/src/pages/googlepage.tsx new file mode 100644 index 0000000..4a0b4bb --- /dev/null +++ b/src/pages/googlepage.tsx @@ -0,0 +1,15 @@ +// src/GoogleSignInPage.tsx +import React from 'react'; +import GoogleSignIn from '../components/googlelog'; + +const GoogleSignInPage: React.FC = () => { + return ( +
+

Google Sign-In Page

+ +
+ ); +}; + +export default GoogleSignInPage; +export {}; \ No newline at end of file diff --git a/src/pages/loginpage.tsx b/src/pages/loginpage.tsx new file mode 100644 index 0000000..a7edda3 --- /dev/null +++ b/src/pages/loginpage.tsx @@ -0,0 +1,15 @@ +// src/LoginPage.tsx +import React from 'react'; +import Login from '../components/login'; + +const LoginPage: React.FC = () => { + return ( +
+

Login Page

+ +
+ ); +}; + +export default LoginPage; +export {}; \ No newline at end of file diff --git a/src/pages/registerpage.tsx b/src/pages/registerpage.tsx new file mode 100644 index 0000000..9141430 --- /dev/null +++ b/src/pages/registerpage.tsx @@ -0,0 +1,15 @@ +// src/RegisterPage.tsx +import React from 'react'; +import Register from '../components/register'; + +const RegisterPage: React.FC = () => { + return ( +
+

Register Page

+ +
+ ); +}; + +export default RegisterPage; +export {}; From 809c329b8828ff1621ba57255711a548daf18257 Mon Sep 17 00:00:00 2001 From: Justin Date: Sun, 27 Oct 2024 00:40:15 -0500 Subject: [PATCH 3/4] updated logic(register to login) --- src/components/register.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/register.tsx b/src/components/register.tsx index 169e5a8..ab0e20b 100644 --- a/src/components/register.tsx +++ b/src/components/register.tsx @@ -2,15 +2,17 @@ import React, { useState } from 'react'; import { createUserWithEmailAndPassword } from 'firebase/auth'; import { auth } from '../firebaseconfig'; +import { useNavigate } from 'react-router-dom'; const Register: React.FC = () => { const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); - + const navigate = useNavigate(); const handleRegister = async () => { try { await createUserWithEmailAndPassword(auth, email, password); alert('Registration Successful'); + navigate('/login'); } catch (error) { console.error("Error registering:", error); alert((error as Error).message); From a6d614a6abfa7520bb06309b349660777317361d Mon Sep 17 00:00:00 2001 From: NishilJ <78994772+NishilJ@users.noreply.github.com> Date: Tue, 29 Oct 2024 11:57:59 -0500 Subject: [PATCH 4/4] changes to auth --- src/App.tsx | 47 ++++++++----------- .../GoogleSSO.tsx} | 5 +- src/Components/TopNavBar.tsx | 25 +++++----- src/Components/TransitBar.tsx | 5 +- src/components/{login.tsx => Login.tsx} | 1 + src/components/{register.tsx => Register.tsx} | 1 + src/components/TopNavBar.tsx | 23 +++++++++ src/components/TransitBar.tsx | 18 +++++++ src/index.tsx | 4 +- src/pages/AboutPage.tsx | 20 ++++++++ src/{Home.tsx => pages/HomePage.tsx} | 10 ++-- src/pages/LoginPage.tsx | 21 +++++++++ src/pages/RegisterPage.tsx | 20 ++++++++ src/pages/googlepage.tsx | 15 ------ src/pages/loginpage.tsx | 15 ------ src/pages/registerpage.tsx | 15 ------ 16 files changed, 151 insertions(+), 94 deletions(-) rename src/{components/googlelog.tsx => Components/GoogleSSO.tsx} (88%) rename src/components/{login.tsx => Login.tsx} (99%) rename src/components/{register.tsx => Register.tsx} (99%) create mode 100644 src/components/TopNavBar.tsx create mode 100644 src/components/TransitBar.tsx create mode 100644 src/pages/AboutPage.tsx rename src/{Home.tsx => pages/HomePage.tsx} (84%) create mode 100644 src/pages/LoginPage.tsx create mode 100644 src/pages/RegisterPage.tsx delete mode 100644 src/pages/googlepage.tsx delete mode 100644 src/pages/loginpage.tsx delete mode 100644 src/pages/registerpage.tsx diff --git a/src/App.tsx b/src/App.tsx index 9ac66f8..75c0885 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,34 +1,25 @@ - import React from 'react'; -import { BrowserRouter as Router, Routes, Route, useNavigate } from 'react-router-dom'; -import RegisterPage from './pages/registerpage'; -import LoginPage from './pages/loginpage'; -import GoogleSignInPage from './pages/googlepage'; +import { BrowserRouter as Router, Routes, Route} from 'react-router-dom'; +import LoginPage from './pages/LoginPage'; +import RegisterPage from "./pages/RegisterPage"; +import AboutPage from "./pages/AboutPage"; +import HomePage from './pages/HomePage'; -const Home: React.FC = () => { - const navigate = useNavigate(); +// Nishil +const App: React.FC = () => { - return ( -
-

Home Page

- - - -
- ); + return ( + + + } /> + } /> + } /> + } /> + + + ); }; -const App: React.FC = () => { - return ( - - - } /> - } /> - } /> - } /> - - - ); -}; -export default App; + +export default App; \ No newline at end of file diff --git a/src/components/googlelog.tsx b/src/Components/GoogleSSO.tsx similarity index 88% rename from src/components/googlelog.tsx rename to src/Components/GoogleSSO.tsx index 131a953..db11429 100644 --- a/src/components/googlelog.tsx +++ b/src/Components/GoogleSSO.tsx @@ -3,7 +3,8 @@ import React from 'react'; import { signInWithPopup } from 'firebase/auth'; import { auth, googleProvider } from '../firebaseconfig'; -const GoogleSignIn: React.FC = () => { +// Justin +const GoogleSSO: React.FC = () => { const handleGoogleSignIn = async () => { try { await signInWithPopup(auth, googleProvider); @@ -21,4 +22,4 @@ const GoogleSignIn: React.FC = () => { ); }; -export default GoogleSignIn; +export default GoogleSSO; diff --git a/src/Components/TopNavBar.tsx b/src/Components/TopNavBar.tsx index a751d93..c041aaf 100644 --- a/src/Components/TopNavBar.tsx +++ b/src/Components/TopNavBar.tsx @@ -1,19 +1,22 @@ import React from 'react'; import {Flex, Heading, MenuTrigger, ActionButton, Menu, Item} from '@adobe/react-spectrum'; +// Nishil +// Implements the top navigation bar const TopNavBar: React.FC = () => { return ( - - Metroll - - ☰ - alert(key)}> - Login/Sign In - Home - About - - - + + + Metroll + + ☰ + alert(key)}*/> + Login/Sign In + Home + About + + + ); } diff --git a/src/Components/TransitBar.tsx b/src/Components/TransitBar.tsx index 4ada4ec..b222715 100644 --- a/src/Components/TransitBar.tsx +++ b/src/Components/TransitBar.tsx @@ -1,6 +1,8 @@ import React from 'react'; -import {Flex, Heading, MenuTrigger, ActionButton, Menu, Item, ActionGroup} from '@adobe/react-spectrum'; +import {Flex, Item, ActionGroup} from '@adobe/react-spectrum'; +// Nishil +// Implements the three transit use case buttons const TransitBar: React.FC = () => { return ( @@ -9,7 +11,6 @@ const TransitBar: React.FC = () => { Trip Planner Routes - ); } diff --git a/src/components/login.tsx b/src/components/Login.tsx similarity index 99% rename from src/components/login.tsx rename to src/components/Login.tsx index 09db5a3..38d81d7 100644 --- a/src/components/login.tsx +++ b/src/components/Login.tsx @@ -3,6 +3,7 @@ import React, { useState } from 'react'; import { signInWithEmailAndPassword } from 'firebase/auth'; import { auth } from '../firebaseconfig'; +// Justin const Login: React.FC = () => { const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); diff --git a/src/components/register.tsx b/src/components/Register.tsx similarity index 99% rename from src/components/register.tsx rename to src/components/Register.tsx index ab0e20b..f64197e 100644 --- a/src/components/register.tsx +++ b/src/components/Register.tsx @@ -4,6 +4,7 @@ import { createUserWithEmailAndPassword } from 'firebase/auth'; import { auth } from '../firebaseconfig'; import { useNavigate } from 'react-router-dom'; +// Justin const Register: React.FC = () => { const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); diff --git a/src/components/TopNavBar.tsx b/src/components/TopNavBar.tsx new file mode 100644 index 0000000..c041aaf --- /dev/null +++ b/src/components/TopNavBar.tsx @@ -0,0 +1,23 @@ +import React from 'react'; +import {Flex, Heading, MenuTrigger, ActionButton, Menu, Item} from '@adobe/react-spectrum'; + +// Nishil +// Implements the top navigation bar +const TopNavBar: React.FC = () => { + return ( + + + Metroll + + ☰ + alert(key)}*/> + Login/Sign In + Home + About + + + + ); +} + +export default TopNavBar; diff --git a/src/components/TransitBar.tsx b/src/components/TransitBar.tsx new file mode 100644 index 0000000..b222715 --- /dev/null +++ b/src/components/TransitBar.tsx @@ -0,0 +1,18 @@ +import React from 'react'; +import {Flex, Item, ActionGroup} from '@adobe/react-spectrum'; + +// Nishil +// Implements the three transit use case buttons +const TransitBar: React.FC = () => { + return ( + + + Departures + Trip Planner + Routes + + + ); +} + +export default TransitBar; diff --git a/src/index.tsx b/src/index.tsx index a19046d..f449765 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,7 +1,7 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; -import Home from './Home'; +import App from './App'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot( @@ -9,7 +9,7 @@ const root = ReactDOM.createRoot( ); root.render( - + ); diff --git a/src/pages/AboutPage.tsx b/src/pages/AboutPage.tsx new file mode 100644 index 0000000..70266da --- /dev/null +++ b/src/pages/AboutPage.tsx @@ -0,0 +1,20 @@ +import React from 'react'; +import {defaultTheme, Provider} from "@adobe/react-spectrum"; +import {useNavigate} from "react-router-dom"; + +const AboutPage: React.FC = () => { + const navigate = useNavigate(); + + return ( + +
+ +

About Page

+

This is the about page

+
+ + ); +}; + +export default AboutPage; +export {}; \ No newline at end of file diff --git a/src/Home.tsx b/src/pages/HomePage.tsx similarity index 84% rename from src/Home.tsx rename to src/pages/HomePage.tsx index f665df4..3aea0b3 100644 --- a/src/Home.tsx +++ b/src/pages/HomePage.tsx @@ -1,9 +1,11 @@ import React from 'react'; -import TopNavBar from './Components/TopNavBar'; +import TopNavBar from '../components/TopNavBar'; import {Provider, defaultTheme, Grid, View} from "@adobe/react-spectrum"; -import TransitBar from "./Components/TransitBar"; +import TransitBar from "../components/TransitBar"; -function Home() { +// Nishil +// Arranges home page layout using react-spectrum and grid +const HomePage: React.FC = () => { return ( { + const navigate = useNavigate(); + + return ( +
+ + + + +
+ ); +}; + +export default LoginPage; \ No newline at end of file diff --git a/src/pages/RegisterPage.tsx b/src/pages/RegisterPage.tsx new file mode 100644 index 0000000..eb1ecfa --- /dev/null +++ b/src/pages/RegisterPage.tsx @@ -0,0 +1,20 @@ +// src/RegisterPage.tsx +import React from 'react'; +import Register from '../components/Register'; +import {useNavigate} from "react-router-dom"; + +// Nishil & Justin +const RegisterPage: React.FC = () => { + const navigate = useNavigate(); + + return ( +
+ + + +
+ ); +}; + +export default RegisterPage; + diff --git a/src/pages/googlepage.tsx b/src/pages/googlepage.tsx deleted file mode 100644 index 4a0b4bb..0000000 --- a/src/pages/googlepage.tsx +++ /dev/null @@ -1,15 +0,0 @@ -// src/GoogleSignInPage.tsx -import React from 'react'; -import GoogleSignIn from '../components/googlelog'; - -const GoogleSignInPage: React.FC = () => { - return ( -
-

Google Sign-In Page

- -
- ); -}; - -export default GoogleSignInPage; -export {}; \ No newline at end of file diff --git a/src/pages/loginpage.tsx b/src/pages/loginpage.tsx deleted file mode 100644 index a7edda3..0000000 --- a/src/pages/loginpage.tsx +++ /dev/null @@ -1,15 +0,0 @@ -// src/LoginPage.tsx -import React from 'react'; -import Login from '../components/login'; - -const LoginPage: React.FC = () => { - return ( -
-

Login Page

- -
- ); -}; - -export default LoginPage; -export {}; \ No newline at end of file diff --git a/src/pages/registerpage.tsx b/src/pages/registerpage.tsx deleted file mode 100644 index 9141430..0000000 --- a/src/pages/registerpage.tsx +++ /dev/null @@ -1,15 +0,0 @@ -// src/RegisterPage.tsx -import React from 'react'; -import Register from '../components/register'; - -const RegisterPage: React.FC = () => { - return ( -
-

Register Page

- -
- ); -}; - -export default RegisterPage; -export {};