Skip to content

Commit

Permalink
Merge pull request #2163 from SadafKausar2025/form
Browse files Browse the repository at this point in the history 
Created Deactivate and delete form for VigyBag Account
  • Loading branch information
@codervivek5
codervivek5 authored Aug 7, 2024
2 parents e770ae5 + 2580173 commit 8c6c094
Show file tree
Hide file tree
Showing 5 changed files with 272 additions and 8 deletions.
13 changes: 13 additions & 0 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@
"react-slick": "^0.30.2",
"react-spinners": "^0.14.1",
"react-use": "^17.5.0",
"reactjs-popup": "^2.0.6",
"sitemap": "^8.0.0",
"slick-carousel": "^1.8.1",
"styled-component": "^2.8.0",
Expand Down
10 changes: 5 additions & 5 deletions src/User/components/Footer/Footer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,15 +68,15 @@ const Footer = () => {
<Link to="/contact" onClick={scrollToTop}>
Contact us
</Link>
<Link to="/service" onClick={scrollToTop}>
Our Services
</Link>
<Link to="/about" onClick={scrollToTop}>
Meet our contributor
<Link to="/career" onClick={scrollToTop}>
Careers
</Link>
<Link to="/certificate" onClick={scrollToTop}>
Certification Page
</Link>
<Link to="/about" onClick={scrollToTop}>
Meet our contributor
</Link>
</div>
<div className="contact-info text-sm">
<p className="font-thin text-center text-gray-400">CONSUMER POLICY</p>{" "}
Expand Down
219 changes: 216 additions & 3 deletions src/User/pages/Dashboard/ProfilePage.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@ import React, { useState } from "react";
import Aside from "../../components/Aside/Aside";
import copy from "../../../assets/copy.png";
import toast from "react-hot-toast";

import Popup from "reactjs-popup";
import "reactjs-popup/dist/index.css";
import "./model.css";
import "./profile.css";

const ProfilePage = () => {
Expand All @@ -15,6 +17,215 @@ const ProfilePage = () => {
"https://img.freepik.com/free-psd/3d-illustration-human-avatar-profile_23-2150671142.jpg", // Sample avatar URL
});

const DeactivateAccount = () => (
<Popup
trigger={
<button className="button text-blue-500 font-bold text-sm hover:cursor-pointer">
Deactivate Account
</button>
}
modal
nested>
{(close) => (
<div className="modal p-4">
<button className="close" onClick={close}>
&times;
</button>
<div className="content">
<h1 className="text-[14px] font-bold">
When You <b>Deactivate</b> Your VigyBag Account
</h1>
<br />
<ul className="text-xsm">
<li>You are logged out of your VigyBag account.</li>
<br />
<li>Your public profile on VigyBag is no longer visible.</li>
<br />
<li>
Your reviews/ratings are still visible, but your profile
information is shown as ‘unavailable’ due to deactivation.
</li>
<br />
<li>
Your wishlist items are no longer accessible through the
associated public hyperlink. The wishlist is shown as
‘unavailable’ due to deactivation.
</li>
<br />
<li>
You will be unsubscribed from receiving promotional emails from
VigyBag.
</li>
<br />
<li>
Your account data is retained and can be restored if you choose
to reactivate your account.
</li>
</ul>
<br />

<h1 className="text-[14px] font-bold">
How Do I Reactivate My VigyBag Account?
</h1>
<p>Reactivation is easy.</p>
<br />
<ul>
<li>
Simply log in with your registered email ID or mobile number and
the password used prior to deactivation. Your account data will
be fully restored.
</li>
<br />
<li>
Default settings will be applied, and you will be subscribed to
receive promotional emails from VigyBag.
</li>
<br />
</ul>
<p>
VigyBag retains your account data so you can conveniently resume
from where you left off if you decide to reactivate your account.
</p>
<p>
<strong>Remember:</strong> Account reactivation can be done only
on the desktop version.
</p>
</div>
<div className="actions">
<button
className="button bg-blue-600 text-white p-4 font-bold rounded-md"
onClick={() => {
console.log("modal closed ");
close();
}}>
CONFIRM DEACTIVATION
</button>
</div>
</div>
)}
</Popup>
);

const DeleteAccount = () => (
<Popup
trigger={
<button className="button text-red-600 font-bold text-sm">
Delete Account
</button>
}
modal
nested>
{(close) => (
<div className="modal p-4">
<button className="close" onClick={close}>
&times;
</button>
<div className="content">
<p className="text-xsm">
Please note that once you choose to <b>delete</b> your account
with VigyBag (“Platform”), your account will no longer be
available to you and you will not be able to activate, restore, or
use the account again.
</p>
<p className="text-xsm">
In case you are not sure about deleting your account, you may
instead deactivate your account.
</p>
<p className="text-xsm">
When you deactivate your account, you are logged out of your
account, your public profile on the Platform is no longer visible,
your wishlist items are no longer accessible through the
associated public hyperlink, and you will be unsubscribed from
receiving promotional emails.
</p>

<h2 className="text-xsm font-bold">
If you wish to proceed with an account deletion request, please
ensure that you have read and understood the following:
</h2>
<ul className="text-xsm">
<li>
There are no pending orders, cancellations, returns, refunds, or
other requests (“Transactions”). If there are pending
Transactions, please raise your account deletion request once
the Transactions are completed.
</li>
<li>
If you hold any subscription or membership, you will lose all
benefits and rewards associated with it immediately upon
deletion of the account.
</li>
<li>
You have exhausted or do not intend to use SuperCoins, Gift
Cards, or any such reward points or balances associated with
your account. Please note that once your account is deleted, you
will not be able to access any such reward points.
</li>
<li>
You will not be able to access or request to access order
history, profile, wishlists, saved addresses, previous orders
and invoices, saved or preferred payment methods, content,
images, or use any of the products and services offered by the
Platform immediately on deletion and will have to create a new
account to use products and services offered by us.
</li>
<li>
The Platform may choose to refuse deletion of your account in
case you have any legal dispute, or grievances related to
pending payments to your orders, shipments or deliveries, credit
lines, etc.
</li>
<li>
The Platform may retain certain data for legitimate reasons
(towards enforcement of legal rights or regulatory compliance)
such as security, fraud prevention, future abuse, and regulatory
compliance including the exercise of legal rights or comply with
legal orders under applicable laws.
</li>
<li>
After your account is deleted, if you log into the Platform
using the same phone number or email ID, a fresh new account
will be created and your old account data will not be
accessible.
</li>
<li>
Please uninstall the VigyBag App after your account is deleted
to stop receiving any notifications from VigyBag. Notifications
are app-level settings and uninstalling the app is required to
stop the notifications.
</li>
</ul>
<p>
You acknowledge that you have read our
<a href="/terms">Terms of Use</a> and
<a href="/privacy-policy">Privacy Policy</a>.
</p>
<p>
<br />
<hr />
<br />
<input type="checkbox" id="agree" name="agree" />I have read and
agreed to the Terms and Conditions.
</p>

<h2>Please tell us why you’re leaving us</h2>
<textarea id="feedback" name="feedback" rows="4" cols="50" />
</div>
<div className="actions">
<button
className="button bg-red-600 p-2 text-white text-sm rounded-md"
onClick={() => {
console.log("modal closed ");
close();
}}>
Delete Account
</button>
</div>
</div>
)}
</Popup>
);

const [couponVisibility, setCouponVisibility] = useState([false, false]); // State for coupon visibility

const handleChange = (e) => {
Expand Down Expand Up @@ -254,9 +465,11 @@ const ProfilePage = () => {
</div>
<br />
<br />
<p className="text-blue-500 font-bold text-sm">Deactivate Account</p>

<DeactivateAccount />
<br />
<br />
<p className="text-red-600 font-bold text-sm">Delete Account</p>
<DeleteAccount />
<br />
<br />
{/* <img className="w-full h-[25vh]" src={profilefooter} alt="footer" /> */}
Expand Down
37 changes: 37 additions & 0 deletions src/User/pages/Dashboard/model.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
.modal {
font-size: 12px;
}

.modal>.header {
width: 100%;
border-bottom: 1px solid gray;
font-size: 18px;
text-align: center;
padding: 5px;
}

.modal>.content {
width: 100%;
padding: 10px 5px;
}

.modal>.actions {
width: 100%;
padding: 10px 5px;
margin: auto;
text-align: center;
}

.modal>.close {
cursor: pointer;
position: absolute;
display: block;
padding: 2px 5px;
line-height: 20px;
right: -10px;
top: -10px;
font-size: 24px;
background: #ffffff;
border-radius: 18px;
border: 1px solid #cfcece;
}

0 comments on commit 8c6c094

Please sign in to comment.