fix: on edit button show upgrade now validation issue in profile page

This commit is contained in:
RaktimaNXG
2024-09-03 12:26:49 +05:30
parent cfbebc4989
commit c587abddae
8 changed files with 40 additions and 137 deletions
@@ -363,7 +363,7 @@
"initial-teb": "Initials",
"signature-tab": "Signature",
"your-signature": "Your signature",
"copy-to-all-pages": "Copy to all pages",
"copy-title": "Copy widget to",
"contact-delete-alert": "Are you sure you want to delete this contact?",
"reset-password-alert-1": "Reset password link has been sent to your email id",
"reset-password-alert-2": "Please setup email adapter ",
@@ -374,7 +374,7 @@
"All pages": "All pages",
"All pages but last": "All pages but last",
"All pages but first": "All pages but first",
"Beside to widget": "Beside to widget"
"Next to current widget": "Next to current widget"
},
"options": "Options",
"minimun-check": "Minimun check",
@@ -362,7 +362,7 @@
"initial-teb": "Initiales",
"signature-tab": "Signature",
"your-signature": "Votre signature",
"copy-to-all-pages": "Copier sur toutes les pages",
"copy-title": "Copier le widget vers",
"contact-delete-alert": "Êtes-vous sûr de vouloir supprimer ce contact ?",
"reset-password": "Le lien de réinitialisation du mot de passe a été envoyé à votre identifiant de messagerie",
"reset-password-alert-2": "Veuillez configurer l'adaptateur de messagerie",
@@ -373,7 +373,7 @@
"All pages": "Toutes les pages",
"All pages but last": "Toutes les pages sauf la dernière",
"All pages but first": "Toutes les pages sauf la première",
"Beside to widget": "À côté du widget"
"Next to current widget": "À côté du widget actuel"
},
"options": "Possibilités",
"minimun-check": "Vérification minimale",
Binary file not shown.

Before

Width:  |  Height:  |  Size: 63 KiB

@@ -13,7 +13,7 @@ function PlaceholderCopy(props) {
{ id: 1, type: "All pages" },
{ id: 2, type: "All pages but last" },
{ id: 3, type: "All pages but first" },
{ id: 4, type: "Beside to widget" }
{ id: 4, type: "Next to current widget" }
];
const [selectCopyType, setSelectCopyType] = useState(1);
//function for get copy placeholder position
@@ -239,7 +239,7 @@ function PlaceholderCopy(props) {
return (
<ModalUi
isOpen={props.isPageCopy}
title={t("copy-to-all-pages")}
title={t("copy-title")}
handleClose={() => handleUniqueId()}
>
<div className="h-full p-[20px] text-base-content">
@@ -21,7 +21,7 @@ function SelectLanguage(props) {
return (
<div
className={`${
!props.isProfile && " mt-3 pb-2 md:pb-0 "
!props.isProfile && " mt-[9px] pb-2 md:pb-0 "
} flex justify-center items-center `}
>
<select
+18 -97
View File
@@ -24,7 +24,6 @@ import { RWebShare } from "react-web-share";
import Alert from "../primitives/Alert";
import Tour from "reactour";
import TourContentWithBtn from "../primitives/TourContentWithBtn";
import userName from "../assets/images/user-name-image.png";
import publicRole from "../assets/images/public-role.mp4";
function UserProfile() {
@@ -65,7 +64,6 @@ function UserProfile() {
const [tourStatus, setTourStatus] = useState([]);
const [isProfileTour, setIsProfileTour] = useState(false);
const [isDontShow, setIsDontShow] = useState(false);
const [isPublicInfo, setIsPublicInfo] = useState({});
const getPublicUrl = isStaging
? `https://staging.opensign.me/${extendUser?.[0]?.UserName}`
: `https://opensign.me/${extendUser?.[0]?.UserName}`;
@@ -345,31 +343,6 @@ function UserProfile() {
const tourConfig = [
{
selector: '[data-tut="username"]',
content: () => (
<TourContentWithBtn
message={t("tour-mssg.username")}
isChecked={handleDontShow}
image={userName}
/>
),
position: "top",
style: { fontSize: "13px" }
},
{
selector: '[data-tut="tagline"]',
content: () => (
<TourContentWithBtn
message={t("tour-mssg.tagline")}
isChecked={handleDontShow}
image={userName}
/>
),
position: "top",
style: { fontSize: "13px" }
},
{
selector: '[data-tut="publicTemplate"]',
content: () => (
<TourContentWithBtn
message={t("tour-mssg.public-template")}
@@ -429,20 +402,8 @@ function UserProfile() {
const handleDontShow = (isChecked) => {
setIsDontShow(isChecked);
};
const handleTooltipClick = (type) => {
if (type === "public") {
setIsPublicInfo({
status: true,
message: t("tour-mssg.username"),
image: userName
});
} else if (type === "tagline") {
setIsPublicInfo({
status: true,
message: t("tour-mssg.tagline"),
image: userName
});
}
const handleOnlickHelp = () => {
setIsProfileTour(false);
};
return (
<React.Fragment>
@@ -501,17 +462,6 @@ function UserProfile() {
</div>
</div>
<ul className="w-full flex flex-col p-2 text-sm">
<li
className={`flex justify-between items-center border-t-[1px] border-gray-300 break-all ${
editmode ? "py-1.5" : "py-2"
}`}
>
<span className="font-semibold">{t("language")}:</span>{" "}
<SelectLanguage
isProfile={true}
updateExtUser={updateExtUser}
/>
</li>
<li
className={`flex justify-between items-center border-t-[1px] border-gray-300 break-all ${
editmode ? "py-1.5" : "py-2"
@@ -608,26 +558,13 @@ function UserProfile() {
<li className="flex flex-row justify-between md:items-center border-t-[1px] border-gray-300 py-2 break-all">
<span className="font-semibold flex gap-1">
{t("public-profile")} :{" "}
<Tooltip
handleTooltipClick={handleTooltipClick}
type="public"
/>
<Tooltip handleOnlickHelp={handleOnlickHelp} />
</span>
<div
data-tut="username"
className="flex flex-row items-center gap-1"
>
<div className="flex flex-row items-center gap-1">
{editmode || !extendUser?.[0]?.UserName ? (
<>
<input
maxLength={40}
style={{
border:
!isSubscribe &&
publicUserName?.length > 0 &&
publicUserName?.length < 9 &&
"solid red"
}}
onChange={handleOnchangeUserName}
value={publicUserName}
disabled={!editmode}
@@ -669,15 +606,9 @@ function UserProfile() {
<li className="flex flex-row justify-between items-center border-t-[1px] border-gray-300 py-2 break-all">
<span className="font-semibold flex gap-1">
{t("tagline")} :{" "}
<Tooltip
handleTooltipClick={handleTooltipClick}
type="tagline"
/>
<Tooltip handleOnlickHelp={handleOnlickHelp} />
</span>
<div
data-tut="tagline"
className="flex flex-row md:items-center gap-1"
>
<div className="flex flex-row md:items-center gap-1">
{editmode || !extendUser?.[0]?.Tagline ? (
<input
maxLength={40}
@@ -734,6 +665,17 @@ function UserProfile() {
</div>
</li>
)}
<li
className={`flex justify-between items-center border-b-[1px] border-gray-300 break-all ${
editmode ? "py-1.5" : "py-2"
}`}
>
<span className="font-semibold">{t("language")}:</span>{" "}
<SelectLanguage
isProfile={true}
updateExtUser={updateExtUser}
/>
</li>
</ul>
<div
className={`${
@@ -744,6 +686,7 @@ function UserProfile() {
type="button"
onClick={(e) => {
if (
editmode &&
!isSubscribe &&
publicUserName?.length > 0 &&
publicUserName?.length < 9
@@ -814,28 +757,6 @@ function UserProfile() {
</ModalUi>
)}
<ModalUi
isOpen={isPublicInfo.status}
title={t("validation-alert")}
handleClose={() => setIsPublicInfo({})}
>
<div className="p-[20px] h-full">
<p>{isPublicInfo.message}</p>
<div className="my-2">
<img src={isPublicInfo.image} />
</div>
<div className="h-[1px] w-full my-[15px] bg-[#9f9f9f]"></div>
<button
onClick={() => setIsPublicInfo({})}
type="button"
className="op-btn op-btn-ghost shadow-md"
>
{t("close")}
</button>
</div>
</ModalUi>
{isUpgrade && (
<div className="op-modal op-modal-open">
<div className="max-h-90 bg-base-100 w-[95%] md:max-w-[500px] rounded-box relative">
+5 -4
View File
@@ -7,12 +7,13 @@ const Tooltip = ({
url,
iconColor,
maxWidth,
handleTooltipClick,
type
handleOnlickHelp
}) =>
url || type ? (
url || handleOnlickHelp ? (
<button
onClick={() => (type ? handleTooltipClick(type) : openInNewTab(url))}
onClick={() =>
handleOnlickHelp ? handleOnlickHelp() : openInNewTab(url)
}
className={"text-center cursor-pointer"}
>
<sup>
@@ -1,11 +1,6 @@
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
export default function TourContentWithBtn({
message,
isChecked,
image,
video
}) {
export default function TourContentWithBtn({ message, isChecked, video }) {
const { t } = useTranslation();
const [isCheck, setIsCheck] = useState(false);
@@ -18,30 +13,16 @@ export default function TourContentWithBtn({
return (
<div>
<p>{message}</p>
{image && (
<div className="flex items-center justify-center my-[10px] border-[1px] border-gray-400 rounded-sm">
<img src={image} />
</div>
)}
{video && (
<>
<a
className="cursor-pointer underline text-blue-700"
target="_blank"
rel="noreferrer"
href="https://www.youtube.com/embed/aGjaMfm7Gqo?si=2Ul0nUlFovlVoZ1U"
>
Open in new tab
</a>
<div className="flex items-center justify-center my-[10px] border-[1.3px] border-gray-400 rounded-sm">
<iframe
src="https://www.youtube.com/embed/aGjaMfm7Gqo?si=2Ul0nUlFovlVoZ1U"
title="YouTube video player"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen
></iframe>
</div>
</>
<div className="flex items-center justify-center my-[10px] border-[1.3px] border-gray-400 rounded-sm">
<iframe
src="https://www.youtube.com/embed/aGjaMfm7Gqo?si=2Ul0nUlFovlVoZ1U"
title="YouTube video player"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowFullScreen
></iframe>
</div>
)}
<label className="flex items-center justify-center mb-0">