From cb78f721a945d581f66376ea5391c46f64ad5918 Mon Sep 17 00:00:00 2001 From: Aime-Patrick Date: Mon, 26 Aug 2024 09:25:17 +0200 Subject: [PATCH] fixes (#82) * user should be able to becomme a seller * user be able to become a seller --- README.md | 3 +- package-lock.json | 139 ++++++-- package.json | 2 + src/assets/styles/LandingPage.scss | 2 +- src/assets/styles/SellerRegistration.scss | 21 +- src/assets/styles/Settings.scss | 93 +++-- src/assets/styles/UserDetails.scss | 63 ++-- src/assets/styles/tables.scss | 3 + src/assets/styles/verticalStepper.scss | 2 +- .../FullScreenPdfView/FullScreenPdfView.tsx | 46 ++- src/components/GoogleCallback.tsx | 1 - .../TermsAndCondition/EditTerms.tsx | 119 ++++--- .../TermsAndCondition/TermsAndCondition.tsx | 188 ++++++---- src/components/UserDetails.tsx | 11 +- src/components/layout/AdminHeader.tsx | 4 +- src/components/layout/Header.tsx | 16 +- src/components/layout/Layout.tsx | 2 + src/components/layout/Logout.tsx | 2 + src/components/layout/SellerLayout.tsx | 279 ++++++++------- src/components/live-chat/LiveChat.tsx | 10 +- src/components/product/SellerProduct.tsx | 23 +- src/components/seller/BusinessDetails.tsx | 231 +++++++----- src/components/seller/SellerDetails.tsx | 36 +- src/components/settings/GeneralSettings.tsx | 214 +++++++++-- src/components/table/Table.tsx | 9 +- .../vertical stepper/VerticalStepper.tsx | 114 +++--- src/hooks/useAdminAuthCheck.ts | 4 +- src/hooks/useSellerAuthCheck.ts | 14 +- src/hooks/useSocket.ts | 6 +- src/index.tsx | 3 +- src/pages/AboutUs.tsx | 13 +- src/pages/LandingPage.tsx | 4 +- src/pages/Login.tsx | 22 +- src/pages/Search.tsx | 107 +++--- src/pages/SignUp.tsx | 10 +- src/pages/UserViewCart.tsx | 203 +++++------ src/pages/UserViewOrders.tsx | 2 - src/pages/admin/Dashboard.tsx | 33 +- src/pages/admin/OverView.tsx | 45 ++- src/pages/admin/Users.tsx | 35 +- src/pages/seller/SellerCollection.tsx | 18 +- src/pages/seller/SellerDashboard.tsx | 5 +- src/pages/seller/SellerRegistrationPage.tsx | 230 ++++++------ src/router.tsx | 170 ++++++--- src/store/features/admin/adminService.tsx | 17 +- src/store/features/admin/adminSlice.tsx | 78 +++- src/store/features/auth/authService.tsx | 1 + src/store/features/auth/authSlice.tsx | 13 +- src/store/features/carts/cartService.tsx | 1 - src/store/features/carts/cartSlice.tsx | 1 - src/store/features/chat/chatSlice.tsx | 1 - src/store/features/product/productService.tsx | 8 +- .../features/product/sellerProductSlice.tsx | 332 +++++++++++------- src/store/features/user/userSlice.tsx | 3 +- src/utils/axios/axiosInstance.ts | 3 +- src/utils/protectRoute/ProtectedRoute.tsx | 117 +++++- src/utils/socket/socket.ts | 10 +- src/utils/types/store.d.ts | 4 +- 58 files changed, 2029 insertions(+), 1117 deletions(-) diff --git a/README.md b/README.md index d94a2b49..cfd523a9 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ Our e-commerce web application server, developed by Team Ninjas, facilitates smo ## Hosted Application URL -[https://e-commerce-ninja-fn-staging.netlify.app/](https://e-commerce-ninja-fn-staging.netlify.app/) +[https://e-commerce-ninjas.netlify.app/](https://e-commerce-ninjas.netlify.app/) ## Github repository @@ -18,6 +18,7 @@ Our e-commerce web application server, developed by Team Ninjas, facilitates smo [![Coverage Status](https://coveralls.io/repos/github/atlp-rwanda/e-commerce-ninjas-fe/badge.svg)](https://coveralls.io/github/atlp-rwanda/e-commerce-ninjas-fe) [![CircleCI](https://dl.circleci.com/status-badge/img/gh/atlp-rwanda/e-commerce-ninjas-fe/tree/develop.svg?style=svg)](https://dl.circleci.com/status-badge/redirect/gh/atlp-rwanda/e-commerce-ninjas-fe/tree/develop) [![CI](https://github.com/atlp-rwanda/e-commerce-ninjas-fe/actions/workflows/ci.yml/badge.svg)](https://github.com/atlp-rwanda/e-commerce-ninjas-fe/actions/workflows/ci.yml) +[![Netlify Status](https://api.netlify.com/api/v1/badges/ec14a22a-2d7e-4892-9ff4-9203cd3e8ac3/deploy-status)](https://app.netlify.com/sites/e-commerce-ninjas/deploys) ## Completed features - Setup empty react diff --git a/package-lock.json b/package-lock.json index f8115741..2d72a7c1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -40,6 +40,7 @@ "react-input-emoji": "^5.9.0", "react-loader-spinner": "^6.1.6", "react-pdf": "^9.1.0", + "react-quill": "^2.0.0", "react-redux": "^9.1.2", "react-router-dom": "^6.24.0", "react-spinners": "^0.14.1", @@ -74,6 +75,7 @@ "@types/aos": "^3.0.7", "@types/fork-ts-checker-webpack-plugin": "^0.4.5", "@types/jest": "^29.5.12", + "@types/js-cookie": "^3.0.6", "@types/mini-css-extract-plugin": "^2.5.1", "@types/node": "^20.14.9", "@types/papaparse": "^5.3.14", @@ -8023,6 +8025,12 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/js-cookie": { + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/@types/js-cookie/-/js-cookie-3.0.6.tgz", + "integrity": "sha512-wkw9yd1kEXOPnvEeEV1Go1MmxtBJL0RR79aOTAApecWFVu7w0NNXNqhcWgvw2YgZDYadliXkl14pa3WXw5jlCQ==", + "dev": true + }, "node_modules/@types/jsdom": { "version": "20.0.1", "dev": true, @@ -8118,6 +8126,14 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/quill": { + "version": "1.3.10", + "resolved": "https://registry.npmjs.org/@types/quill/-/quill-1.3.10.tgz", + "integrity": "sha512-IhW3fPW+bkt9MLNlycw8u8fWb7oO7W5URC9MfZYHBlA24rex9rs23D5DETChu1zvgVdc5ka64ICjJOgQMr6Shw==", + "dependencies": { + "parchment": "^1.1.2" + } + }, "node_modules/@types/raf": { "version": "3.4.3", "resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.3.tgz", @@ -10785,7 +10801,6 @@ }, "node_modules/call-bind": { "version": "1.0.7", - "dev": true, "license": "MIT", "dependencies": { "es-define-property": "^1.0.0", @@ -12636,7 +12651,6 @@ }, "node_modules/define-data-property": { "version": "1.1.4", - "dev": true, "license": "MIT", "dependencies": { "es-define-property": "^1.0.0", @@ -12663,7 +12677,6 @@ }, "node_modules/define-properties": { "version": "1.2.1", - "dev": true, "license": "MIT", "dependencies": { "define-data-property": "^1.0.1", @@ -13356,7 +13369,6 @@ }, "node_modules/es-define-property": { "version": "1.0.0", - "dev": true, "license": "MIT", "dependencies": { "get-intrinsic": "^1.2.4" @@ -13367,7 +13379,6 @@ }, "node_modules/es-errors": { "version": "1.3.0", - "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -15033,7 +15044,6 @@ }, "node_modules/extend": { "version": "3.0.2", - "dev": true, "license": "MIT" }, "node_modules/extsprintf": { @@ -15048,6 +15058,11 @@ "version": "3.1.3", "license": "MIT" }, + "node_modules/fast-diff": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.1.2.tgz", + "integrity": "sha512-KaJUt+M9t1qaIteSvjc6P3RbMdXsNhK61GRftR6SNxqmhthcd9MGIi4T+o0jD8LUSpSnSKXE20nLtJ3fOHxQig==" + }, "node_modules/fast-equals": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-5.0.1.tgz", @@ -15856,7 +15871,6 @@ }, "node_modules/functions-have-names": { "version": "1.2.3", - "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -15932,7 +15946,6 @@ }, "node_modules/get-intrinsic": { "version": "1.2.4", - "dev": true, "license": "MIT", "dependencies": { "es-errors": "^1.3.0", @@ -16171,7 +16184,6 @@ }, "node_modules/gopd": { "version": "1.0.1", - "dev": true, "license": "MIT", "dependencies": { "get-intrinsic": "^1.1.3" @@ -16319,7 +16331,6 @@ }, "node_modules/has-property-descriptors": { "version": "1.0.2", - "dev": true, "license": "MIT", "dependencies": { "es-define-property": "^1.0.0" @@ -16330,7 +16341,6 @@ }, "node_modules/has-proto": { "version": "1.0.3", - "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -16350,7 +16360,6 @@ }, "node_modules/has-symbols": { "version": "1.0.3", - "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -16373,7 +16382,6 @@ }, "node_modules/has-tostringtag": { "version": "1.0.2", - "dev": true, "license": "MIT", "dependencies": { "has-symbols": "^1.0.3" @@ -17402,7 +17410,6 @@ }, "node_modules/is-arguments": { "version": "1.1.1", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -17543,7 +17550,6 @@ }, "node_modules/is-date-object": { "version": "1.0.5", - "dev": true, "license": "MIT", "dependencies": { "has-tostringtag": "^1.0.0" @@ -17858,7 +17864,6 @@ }, "node_modules/is-regex": { "version": "1.1.4", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -20542,7 +20547,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-4.0.0.tgz", "integrity": "sha512-+KJGIyHgkGuIq3IEBNftfhW/LfWhXUIY6OmyVWjliu5KH1y0fw7VQ8YndE2O4qZdMSd9SqbnC8GOcZEy0Om7sA==", - "license": "MIT", "engines": { "node": ">=18" } @@ -21645,7 +21649,6 @@ }, "node_modules/object-is": { "version": "1.1.6", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.7", @@ -21660,7 +21663,6 @@ }, "node_modules/object-keys": { "version": "1.1.1", - "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -22157,6 +22159,11 @@ "tslib": "^2.0.3" } }, + "node_modules/parchment": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/parchment/-/parchment-1.1.4.tgz", + "integrity": "sha512-J5FBQt/pM2inLzg4hEWmzQx/8h8D0CiDxaG3vyp9rKrQRSDgBlhjdP5jQGgosEajXPSQouXGHOmVdgo7QmJuOg==" + }, "node_modules/parent-module": { "version": "1.0.1", "license": "MIT", @@ -22943,6 +22950,83 @@ ], "license": "MIT" }, + "node_modules/quill": { + "version": "1.3.7", + "resolved": "https://registry.npmjs.org/quill/-/quill-1.3.7.tgz", + "integrity": "sha512-hG/DVzh/TiknWtE6QmWAF/pxoZKYxfe3J/d/+ShUWkDvvkZQVTPeVmUJVu1uE6DDooC4fWTiCLh84ul89oNz5g==", + "dependencies": { + "clone": "^2.1.1", + "deep-equal": "^1.0.1", + "eventemitter3": "^2.0.3", + "extend": "^3.0.2", + "parchment": "^1.1.4", + "quill-delta": "^3.6.2" + } + }, + "node_modules/quill-delta": { + "version": "3.6.3", + "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-3.6.3.tgz", + "integrity": "sha512-wdIGBlcX13tCHOXGMVnnTVFtGRLoP0imqxM696fIPwIf5ODIYUHIvHbZcyvGlZFiFhK5XzDC2lpjbxRhnM05Tg==", + "dependencies": { + "deep-equal": "^1.0.1", + "extend": "^3.0.2", + "fast-diff": "1.1.2" + }, + "engines": { + "node": ">=0.10" + } + }, + "node_modules/quill-delta/node_modules/deep-equal": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.1.2.tgz", + "integrity": "sha512-5tdhKF6DbU7iIzrIOa1AOUt39ZRm13cmL1cGEh//aqR8x9+tNfbywRf0n5FD/18OKMdo7DNEtrX2t22ZAkI+eg==", + "dependencies": { + "is-arguments": "^1.1.1", + "is-date-object": "^1.0.5", + "is-regex": "^1.1.4", + "object-is": "^1.1.5", + "object-keys": "^1.1.1", + "regexp.prototype.flags": "^1.5.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/quill/node_modules/clone": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz", + "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==", + "engines": { + "node": ">=0.8" + } + }, + "node_modules/quill/node_modules/deep-equal": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.1.2.tgz", + "integrity": "sha512-5tdhKF6DbU7iIzrIOa1AOUt39ZRm13cmL1cGEh//aqR8x9+tNfbywRf0n5FD/18OKMdo7DNEtrX2t22ZAkI+eg==", + "dependencies": { + "is-arguments": "^1.1.1", + "is-date-object": "^1.0.5", + "is-regex": "^1.1.4", + "object-is": "^1.1.5", + "object-keys": "^1.1.1", + "regexp.prototype.flags": "^1.5.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/quill/node_modules/eventemitter3": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-2.0.3.tgz", + "integrity": "sha512-jLN68Dx5kyFHaePoXWPsCGW5qdyZQtLYHkxkg02/Mz6g0kYpDx4FyP6XfArhQdlOC4b8Mv+EMxPo/8La7Tzghg==" + }, "node_modules/raf": { "version": "3.4.1", "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz", @@ -23784,6 +23868,20 @@ "path2d": "^0.2.0" } }, + "node_modules/react-quill": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/react-quill/-/react-quill-2.0.0.tgz", + "integrity": "sha512-4qQtv1FtCfLgoD3PXAur5RyxuUbPXQGOHgTlFie3jtxp43mXDtzCKaOgQ3mLyZfi1PUlyjycfivKelFhy13QUg==", + "dependencies": { + "@types/quill": "^1.3.10", + "lodash": "^4.17.4", + "quill": "^1.3.7" + }, + "peerDependencies": { + "react": "^16 || ^17 || ^18", + "react-dom": "^16 || ^17 || ^18" + } + }, "node_modules/react-redux": { "version": "9.1.2", "license": "MIT", @@ -24253,7 +24351,6 @@ }, "node_modules/regexp.prototype.flags": { "version": "1.5.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.6", @@ -25050,7 +25147,6 @@ }, "node_modules/set-function-length": { "version": "1.2.2", - "dev": true, "license": "MIT", "dependencies": { "define-data-property": "^1.1.4", @@ -25066,7 +25162,6 @@ }, "node_modules/set-function-name": { "version": "2.0.2", - "dev": true, "license": "MIT", "dependencies": { "define-data-property": "^1.1.4", diff --git a/package.json b/package.json index 24f78d7e..27b8842c 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,7 @@ "react-input-emoji": "^5.9.0", "react-loader-spinner": "^6.1.6", "react-pdf": "^9.1.0", + "react-quill": "^2.0.0", "react-redux": "^9.1.2", "react-router-dom": "^6.24.0", "react-spinners": "^0.14.1", @@ -76,6 +77,7 @@ "@types/aos": "^3.0.7", "@types/fork-ts-checker-webpack-plugin": "^0.4.5", "@types/jest": "^29.5.12", + "@types/js-cookie": "^3.0.6", "@types/mini-css-extract-plugin": "^2.5.1", "@types/node": "^20.14.9", "@types/papaparse": "^5.3.14", diff --git a/src/assets/styles/LandingPage.scss b/src/assets/styles/LandingPage.scss index 0145701c..4f6aa230 100644 --- a/src/assets/styles/LandingPage.scss +++ b/src/assets/styles/LandingPage.scss @@ -90,7 +90,7 @@ .filters { label { - width: 15rem; + width: 16rem; } .span { diff --git a/src/assets/styles/SellerRegistration.scss b/src/assets/styles/SellerRegistration.scss index 38d5206d..e7481035 100644 --- a/src/assets/styles/SellerRegistration.scss +++ b/src/assets/styles/SellerRegistration.scss @@ -142,6 +142,8 @@ .check-group{ display: flex; flex-direction: row; + gap: 1rem; + align-items: center; input[type="checkbox"] { appearance: none; @@ -173,8 +175,13 @@ } } label { - margin-left: .2rem; + margin: 0; font-size: 1.5rem; + .btn-link{ + color: $primary-color; + cursor: pointer; + + } } } .form-control { @@ -202,7 +209,7 @@ label { font-size: 14px; - margin-bottom: 8px; + margin-bottom: .5rem; display: block; span { @@ -215,13 +222,21 @@ padding: 10px 0; font-size: 1.4rem; border-bottom: 2px solid $border-color; - margin-bottom: 15px; + margin-bottom: 1rem; box-sizing: border-box; &:focus { border-bottom: 2px solid $primary-color; } } + .pass-hide{ + position: relative; + .hide{ + position: absolute; + right: 20rem; + font-size: 2.5rem; + } + } } div:last-child { diff --git a/src/assets/styles/Settings.scss b/src/assets/styles/Settings.scss index 68352bca..28932fe5 100644 --- a/src/assets/styles/Settings.scss +++ b/src/assets/styles/Settings.scss @@ -83,6 +83,9 @@ font-size: 1.4rem; width: 30%; } + &.margin{ + margin-top: 2rem !important; + } } .btn { @@ -141,60 +144,76 @@ padding: 0; margin: 2rem 0; - div:first-child { - margin: 20px 0; - display: flex; - flex-direction: column; - justify-content: space-between; - - textarea { - padding: 10px; - border: 1px solid #ddd; - border-radius: 5px; - font-size: 1.4rem; - width: 50%; - height: 100px; - &:hover { - border-color: $primary-color; - } - } + select { + border: 1px solid #ddd; + border-radius: 5px; + font-size: 1.4rem; + height: 30%; + width: 20%; + margin: 2rem 0; - select { - border: 1px solid #ddd; - border-radius: 5px; - font-size: 1.4rem; - height: 30%; - width: 20%; - margin: 2rem 0; - - &:hover { - border-color: $primary-color; - } + &:hover { + border-color: $primary-color; } } - .form-group { - .btn { + .uploadMethod { + display: flex; + gap: 2rem; + margin: 1rem 0; + + button { padding: 10px 20px; background-color: $primary-color; color: $white-color; border: none; border-radius: 5px; font-size: 1.6rem; - width: 8rem; cursor: pointer; - transition: width 0.5s linear; + } + } + .quill{ + margin-bottom: 7rem; + height: 30rem; + width: 100%; + font-size: 1.4rem; + resize: vertical; + } + + .upload-file { + margin: 1rem; + + } + } + + .form-group { + .btn { + padding: 10px 20px; + background-color: $primary-color; + color: $white-color; + border: none; + border-radius: 5px; + font-size: 1.6rem; + width: 8rem; + cursor: pointer; + transition: width 0.5s linear; - &:hover { - background-color: $primary-color-dark; - width: 10rem; - transition: width 0.5s linear; - } + &:hover { + background-color: $primary-color-dark; + width: 10rem; + transition: width 0.5s linear; } } } } + .display-content{ + display: flex; + align-items: center; + } + .viewer{ + display: flex; + } } } diff --git a/src/assets/styles/UserDetails.scss b/src/assets/styles/UserDetails.scss index 735e9ed9..514738a2 100644 --- a/src/assets/styles/UserDetails.scss +++ b/src/assets/styles/UserDetails.scss @@ -165,30 +165,49 @@ height: 8rem; } } - .view__pdf{ - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: rgba(0, 0, 0, 0.453); - z-index: 1000; - - .close__icon{ - position: absolute; - top: 2rem; - right: 2rem; - font-size: 3rem; - cursor: pointer; - color: $white-color; - &:hover{ - color: $red-color; - transform: scale(1.1); - transition: all 0.5s ease-in-out; - } - } + + } + .view__pdf { + position: fixed; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + background-color: rgba(0, 0, 0, 0.75); + z-index: 10000; + overflow: auto; + display: flex; + justify-content: center; + align-items: center; + pointer-events: all; + } + + .pdf__container { + width: 80%; + height: 90%; + background-color: #fff; + overflow: auto; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); + border-radius: 8px; + pointer-events: all; + } + + .close__icon { + position: absolute; + top: 1rem; + right: 1rem; + font-size: 2.5rem; + cursor: pointer; + color: $white-color; + pointer-events: all; + + &:hover { + color: $red-color; + transform: scale(1.1); + transition: all 0.5s ease-in-out; } } + .pageNumber{ display: flex; justify-content: center; diff --git a/src/assets/styles/tables.scss b/src/assets/styles/tables.scss index 1c57794c..86c99425 100644 --- a/src/assets/styles/tables.scss +++ b/src/assets/styles/tables.scss @@ -67,6 +67,9 @@ align-items: center; width: 100%; height: 100%; + &.flex{ + flex-direction: column; + } } .empty-container .ant-empty { diff --git a/src/assets/styles/verticalStepper.scss b/src/assets/styles/verticalStepper.scss index b7d24439..14af9026 100644 --- a/src/assets/styles/verticalStepper.scss +++ b/src/assets/styles/verticalStepper.scss @@ -101,4 +101,4 @@ } } -} \ No newline at end of file +} diff --git a/src/components/FullScreenPdfView/FullScreenPdfView.tsx b/src/components/FullScreenPdfView/FullScreenPdfView.tsx index 75241a23..1c5cb8ea 100644 --- a/src/components/FullScreenPdfView/FullScreenPdfView.tsx +++ b/src/components/FullScreenPdfView/FullScreenPdfView.tsx @@ -1,29 +1,37 @@ /* eslint-disable */ -import React, { useRef, useState } from "react"; +import React, { useRef, useState, useEffect } from "react"; import { Document, Page, pdfjs } from "react-pdf"; import { IoIosArrowBack, IoIosArrowForward } from "react-icons/io"; import 'react-pdf/dist/Page/TextLayer.css'; import 'react-pdf/dist/Page/AnnotationLayer.css'; +import { IoCloseCircleOutline } from "react-icons/io5"; +import { Button } from "@mui/material"; pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`; -export const FullScreenPdfView = ({ pdfUrl }) => { +export const FullScreenPdfView = ({ pdfUrl, open, onClose }) => { const pdfContainerRef = useRef(null); const [numPages, setNumPages] = useState(0); const [pageNumber, setPageNumber] = useState(1); const [scale, setScale] = useState(1); + useEffect(() => { + if (open) { + setPageNumber(1); // Reset to the first page when opening + } + }, [open]); + function onDocumentLoadSuccess({ numPages }: { numPages: number }): void { setNumPages(numPages); - // adjustScale(); + adjustScale(); } const adjustScale = () => { if (pdfContainerRef.current) { const containerWidth = pdfContainerRef.current.clientWidth; - setScale(containerWidth / 600); + setScale(containerWidth / 245); } }; @@ -35,19 +43,27 @@ export const FullScreenPdfView = ({ pdfUrl }) => { setPageNumber((prevPage) => Math.min(prevPage + 1, numPages)); }; + if (!open) return null; + return ( -
-
- - - - - +
+
+
+ + + + + +
+
); }; diff --git a/src/components/GoogleCallback.tsx b/src/components/GoogleCallback.tsx index 938d656d..c82e7d9d 100644 --- a/src/components/GoogleCallback.tsx +++ b/src/components/GoogleCallback.tsx @@ -32,7 +32,6 @@ const GoogleCallback = () => { useEffect(() => { if (isSuccess && isAuthenticated) { - localStorage.setItem("token", token); navigate("/home"); } if (isError) { diff --git a/src/components/TermsAndCondition/EditTerms.tsx b/src/components/TermsAndCondition/EditTerms.tsx index ab007891..265edeb6 100644 --- a/src/components/TermsAndCondition/EditTerms.tsx +++ b/src/components/TermsAndCondition/EditTerms.tsx @@ -3,14 +3,13 @@ import React, { useEffect, useState } from "react"; import PropTypes from "prop-types"; import { useAppDispatch, useAppSelector } from "../../store/store"; import { getTerm, updateTerm } from "../../store/features/admin/adminSlice"; -import { Dialog, DialogTitle, DialogContent, DialogContentText, DialogActions,Button } from "@mui/material"; +import ReactQuill from "react-quill"; export const EditTerms = ({ id }) => { const [isDisabled, setIsDisabled] = useState(true); const [isEdit, setIsEdit] = useState(true); - const [termType, setTermType] = useState(""); - const [termContent, setTermContent] = useState(""); - const [localState, setLocalState] = useState(); + const [localState, setLocalState] = useState({}); + const [editorContent, setEditorContent] = useState(""); const dispatch = useAppDispatch(); const term = useAppSelector((state) => state?.admin?.term); @@ -23,25 +22,31 @@ export const EditTerms = ({ id }) => { fetchTerm(); }, [dispatch, id]); - useEffect(()=>{ + useEffect(() => { if (term) { - setIsDisabled(false); - setIsEdit(false); - setLocalState({ - type: term.type, - content: term.content, - }); - } - },[term]) - const handleSaveTerms = async (e) => { + setIsDisabled(false); + setIsEdit(false); + setLocalState({ + type: term.type, + content: term.content, + pdfUrl: term.pdfUrl || "", + }); + } + }, [term]); + + const handleSaveTerms = async (e: React.FormEvent) => { e.preventDefault(); - const termData = { - id, - termType: localState.type, - termContent: localState.content, - }; - console.log("Saving Term: ", termData); - await dispatch(updateTerm(termData)); + + + if (localState.pdfFile) { + const formData = new FormData(); + formData.append("pdf", localState.pdfFile); + await dispatch(updateTerm({formData, id})); + } else if (localState.content) { + const content = localState.content; + await dispatch(updateTerm({id,content})); + } + setIsDisabled(true); setIsEdit(true); }; @@ -54,16 +59,24 @@ export const EditTerms = ({ id }) => { })); setIsEdit(false); }; - - const handleContentChange = (e) => { - const updatedContent = e.target.value; + + const handleContentChange = (value) => { + setLocalState((prevState) => ({ ...prevState, - content: updatedContent, + content: value, + })); + setIsEdit(false); + }; + + const handlePdfChange = (e) => { + const file = e.target.files[0]; + setLocalState((prevState) => ({ + ...prevState, + pdfFile: file, })); setIsEdit(false); }; - return ( <> @@ -74,7 +87,7 @@ export const EditTerms = ({ id }) => { {localState && ( <> -