Add cosmatc changes for font sizes
This commit is contained in:
parent
c3a52c46eb
commit
ff8fca72fa
@ -12,13 +12,12 @@ import EmployeeList from "./EmployeeList";
|
||||
import { useAllEmployees, useEmployees } from "../../hooks/useEmployees";
|
||||
import { useSortableData } from "../../hooks/useSortableData";
|
||||
import ConfirmModal from "../common/ConfirmModal";
|
||||
import {useHasUserPermission} from "../../hooks/useHasUserPermission";
|
||||
import {DIRECTORY_ADMIN, DIRECTORY_MANAGER} from "../../utils/constants";
|
||||
import {useProfile} from "../../hooks/useProfile";
|
||||
import { useHasUserPermission } from "../../hooks/useHasUserPermission";
|
||||
import { DIRECTORY_ADMIN, DIRECTORY_MANAGER } from "../../utils/constants";
|
||||
import { useProfile } from "../../hooks/useProfile";
|
||||
|
||||
const ManageBucket = () =>
|
||||
{
|
||||
const {profile} =useProfile()
|
||||
const ManageBucket = () => {
|
||||
const { profile } = useProfile();
|
||||
const [bucketList, setBucketList] = useState([]);
|
||||
const { employeesList } = useAllEmployees(false);
|
||||
const [selectedEmployee, setSelectEmployee] = useState([]);
|
||||
@ -27,9 +26,9 @@ const ManageBucket = () =>
|
||||
const [isSubmitting, setSubmitting] = useState(false);
|
||||
const [selected_bucket, select_bucket] = useState(null);
|
||||
const [deleteBucket, setDeleteBucket] = useState(null);
|
||||
const [ searchTerm, setSearchTerm ] = useState( "" );
|
||||
const DirManager = useHasUserPermission( DIRECTORY_MANAGER )
|
||||
const DirAdmin = useHasUserPermission(DIRECTORY_ADMIN)
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const DirManager = useHasUserPermission(DIRECTORY_MANAGER);
|
||||
const DirAdmin = useHasUserPermission(DIRECTORY_ADMIN);
|
||||
const {
|
||||
items: sortedBuckteList,
|
||||
requestSort,
|
||||
@ -228,7 +227,7 @@ const ManageBucket = () =>
|
||||
<div className="d-flex justify-content-center">
|
||||
<p className="fs-6 fw-semibold m-0">Manage Buckets</p>
|
||||
</div>
|
||||
<div className="d-flex justify-content-between px-2 px-sm-0 mt-5 mt-sm-1 align-items-center">
|
||||
<div className="d-flex justify-content-between px-2 px-sm-0 mt-5 mt-3 align-items-center ">
|
||||
{action_bucket ? (
|
||||
<i
|
||||
className={`fa-solid fa-arrow-left fs-5 cursor-pointer`}
|
||||
@ -255,7 +254,7 @@ const ManageBucket = () =>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
className={`btn btn-xs btn-primary ms-auto ${
|
||||
className={`btn btn-sm btn-primary ms-auto ${
|
||||
action_bucket ? "d-none" : ""
|
||||
}`}
|
||||
onClick={() => setAction_bucket(true)}
|
||||
@ -266,9 +265,9 @@ const ManageBucket = () =>
|
||||
</div>
|
||||
<div>
|
||||
{!action_bucket ? (
|
||||
<div className="table-responsive text-nowrap pt-1 px-2 px-sm-0">
|
||||
<div className="table-responsive text-nowrap pt-1 px-2 px-sm-0 mt-3">
|
||||
<table className="table px-2">
|
||||
<thead className="p-0 table-light">
|
||||
<thead className="p-0">
|
||||
<tr className="p-0">
|
||||
<th
|
||||
colSpan={2}
|
||||
@ -332,29 +331,28 @@ const ManageBucket = () =>
|
||||
<td
|
||||
className="text-start d-none d-sm-table-cell text-truncate"
|
||||
style={{
|
||||
maxWidth: "300px",
|
||||
maxWidth: "300px",
|
||||
whiteSpace: "wrap",
|
||||
overflow: "hidden",
|
||||
textOverflow: "ellipsis",
|
||||
}}
|
||||
title={bucket.description}
|
||||
title={bucket.description}
|
||||
>
|
||||
{bucket.description}
|
||||
</td>
|
||||
<td>{bucket.numberOfContacts}</td>
|
||||
<td className="justify-content-center">
|
||||
|
||||
{(DirManager ||
|
||||
{(DirManager ||
|
||||
DirAdmin ||
|
||||
bucket?.createdBy?.id ===
|
||||
profile?.employeeInfo?.id) && (
|
||||
<div className="d-flex justify-content-center align-items-center gap-2">
|
||||
<i
|
||||
<i
|
||||
className="bx bx-edit bx-sm text-primary cursor-pointer "
|
||||
onClick={() => {
|
||||
select_bucket(bucket);
|
||||
setAction_bucket(true);
|
||||
}}
|
||||
}}
|
||||
></i>
|
||||
<i
|
||||
className="bx bx-trash bx-sm text-danger cursor-pointer"
|
||||
|
@ -7,12 +7,18 @@ import showToast from "../../services/toastService";
|
||||
import { cacheData, getCachedData } from "../../slices/apiDataManager";
|
||||
import "../common/TextEditor/Editor.css";
|
||||
|
||||
const NoteCardDirectory = ({refetchProfile,refetchNotes, noteItem, contactId, setProfileContact, }) => {
|
||||
const NoteCardDirectory = ({
|
||||
refetchProfile,
|
||||
refetchNotes,
|
||||
noteItem,
|
||||
contactId,
|
||||
setProfileContact,
|
||||
}) => {
|
||||
const [editing, setEditing] = useState(false);
|
||||
const [editorValue, setEditorValue] = useState(noteItem.note);
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [ isDeleting, setIsDeleting ] = useState( false );
|
||||
const [isActivProcess,setActiveProcessing]= useState(false)
|
||||
const [isDeleting, setIsDeleting] = useState(false);
|
||||
const [isActivProcess, setActiveProcessing] = useState(false);
|
||||
const handleUpdateNote = async () => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
@ -51,8 +57,8 @@ const NoteCardDirectory = ({refetchProfile,refetchNotes, noteItem, contactId, se
|
||||
cacheData("Contact Profile", updatedProfile);
|
||||
}
|
||||
setEditing(false);
|
||||
setIsLoading( false );
|
||||
|
||||
setIsLoading(false);
|
||||
|
||||
showToast("Note Updated successfully", "success");
|
||||
} catch (error) {
|
||||
setIsLoading(false);
|
||||
@ -66,8 +72,11 @@ const NoteCardDirectory = ({refetchProfile,refetchNotes, noteItem, contactId, se
|
||||
|
||||
const handleDeleteNote = async (activeStatue) => {
|
||||
try {
|
||||
activeStatue ? setActiveProcessing(true) : setIsDeleting(true)
|
||||
const resp = await DirectoryRepository.DeleteNote(noteItem.id,activeStatue);
|
||||
activeStatue ? setActiveProcessing(true) : setIsDeleting(true);
|
||||
const resp = await DirectoryRepository.DeleteNote(
|
||||
noteItem.id,
|
||||
activeStatue
|
||||
);
|
||||
setProfileContact((prev) => ({
|
||||
...prev,
|
||||
notes: prev.notes.filter((note) => note.id !== noteItem.id),
|
||||
@ -91,11 +100,14 @@ const NoteCardDirectory = ({refetchProfile,refetchNotes, noteItem, contactId, se
|
||||
|
||||
cacheData("Contact Profile", updatedCache);
|
||||
}
|
||||
setIsDeleting( false );
|
||||
setActiveProcessing( false )
|
||||
refetchNotes( contactId, false )
|
||||
refetchProfile(contactId)
|
||||
showToast(`Note ${activeStatue ? "Restored":"Deleted"} Successfully`, "success");
|
||||
setIsDeleting(false);
|
||||
setActiveProcessing(false);
|
||||
refetchNotes(contactId, false);
|
||||
refetchProfile(contactId);
|
||||
showToast(
|
||||
`Note ${activeStatue ? "Restored" : "Deleted"} Successfully`,
|
||||
"success"
|
||||
);
|
||||
} catch (error) {
|
||||
setIsDeleting(false);
|
||||
const msg =
|
||||
@ -107,11 +119,15 @@ const NoteCardDirectory = ({refetchProfile,refetchNotes, noteItem, contactId, se
|
||||
};
|
||||
return (
|
||||
<div
|
||||
className="card p-1 shadow-sm border-1 mb-2 conntactNote"
|
||||
style={{ width: "100%", minWidth: "300px", borderRadius: "0px", background: `${noteItem.isActive ? "": "#f8f6f6"}` }}
|
||||
className="card p-1 shadow-sm border-1 mb-5 conntactNote rounded"
|
||||
style={{
|
||||
width: "100%",
|
||||
minWidth: "300px",
|
||||
borderRadius: "0px",
|
||||
background: `${noteItem.isActive ? "" : "#f8f6f6"}`,
|
||||
}}
|
||||
key={noteItem.id}
|
||||
>
|
||||
|
||||
<div className="d-flex justify-content-between align-items-center mb-1">
|
||||
<div className="d-flex align-items-center">
|
||||
<Avatar
|
||||
@ -133,40 +149,38 @@ const NoteCardDirectory = ({refetchProfile,refetchNotes, noteItem, contactId, se
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{noteItem.isActive ? (
|
||||
<>
|
||||
<i
|
||||
className="bx bxs-edit bx-sm me-1 text-primary cursor-pointer"
|
||||
onClick={() => setEditing(true)}
|
||||
></i>
|
||||
<div>
|
||||
{noteItem.isActive ? (
|
||||
<>
|
||||
<i
|
||||
className="bx bxs-edit bx-sm me-1 text-primary cursor-pointer"
|
||||
onClick={() => setEditing(true)}
|
||||
></i>
|
||||
|
||||
{!isDeleting ? (
|
||||
<i
|
||||
className="bx bx-trash bx-sm me-1 text-secondary cursor-pointer"
|
||||
onClick={() => handleDeleteNote(!noteItem.isActive)}
|
||||
></i>
|
||||
) : (
|
||||
<div
|
||||
className="spinner-border spinner-border-sm text-secondary"
|
||||
role="status"
|
||||
>
|
||||
<span className="visually-hidden">Loading...</span>
|
||||
{!isDeleting ? (
|
||||
<i
|
||||
className="bx bx-trash bx-sm me-1 text-secondary cursor-pointer"
|
||||
onClick={() => handleDeleteNote(!noteItem.isActive)}
|
||||
></i>
|
||||
) : (
|
||||
<div
|
||||
className="spinner-border spinner-border-sm text-secondary"
|
||||
role="status"
|
||||
>
|
||||
<span className="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
) : isActivProcess ? (
|
||||
<i className="bx bx-loader-alt bx-spin text-primary"></i>
|
||||
) : (
|
||||
<i
|
||||
className="bx bx-recycle me-1 text-primary cursor-pointer"
|
||||
onClick={() => handleDeleteNote(!noteItem.isActive)}
|
||||
title="Restore"
|
||||
></i>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
) : isActivProcess ? (
|
||||
< i className='bx bx-loader-alt bx-spin text-primary' ></i>
|
||||
) : (
|
||||
<i
|
||||
className="bx bx-recycle me-1 text-primary cursor-pointer"
|
||||
onClick={() => handleDeleteNote(!noteItem.isActive)}
|
||||
title="Restore"
|
||||
></i>
|
||||
)}
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<hr className="mt-0" />
|
||||
|
@ -16,13 +16,18 @@ const schema = z.object({
|
||||
note: z.string().min(1, { message: "Note is required" }),
|
||||
});
|
||||
|
||||
const NotesDirectory = ({refetchProfile, isLoading, contactProfile, setProfileContact }) => {
|
||||
const NotesDirectory = ({
|
||||
refetchProfile,
|
||||
isLoading,
|
||||
contactProfile,
|
||||
setProfileContact,
|
||||
}) => {
|
||||
const [IsActive, setIsActive] = useState(true);
|
||||
const {contactNotes,refetch} = useContactNotes( contactProfile?.id, true );
|
||||
const { contactNotes, refetch } = useContactNotes(contactProfile?.id, true);
|
||||
|
||||
const [NotesData, setNotesData] = useState();
|
||||
const [IsSubmitting, setIsSubmitting] = useState(false);
|
||||
const [addNote, setAddNote] = useState(false);
|
||||
const [addNote, setAddNote] = useState(true);
|
||||
const {
|
||||
register,
|
||||
handleSubmit,
|
||||
@ -70,7 +75,7 @@ const NotesDirectory = ({refetchProfile, isLoading, contactProfile, setProfileCo
|
||||
setValue("note", "");
|
||||
setIsSubmitting(false);
|
||||
showToast("Note added successfully!", "success");
|
||||
setAddNote(false);
|
||||
setAddNote(true);
|
||||
setIsActive(true);
|
||||
} catch (error) {
|
||||
setIsSubmitting(false);
|
||||
@ -85,14 +90,12 @@ const NotesDirectory = ({refetchProfile, isLoading, contactProfile, setProfileCo
|
||||
const onCancel = () => {
|
||||
setValue("note", "");
|
||||
};
|
||||
const handleSwitch = () =>
|
||||
{
|
||||
setIsActive( !IsActive )
|
||||
if ( IsActive )
|
||||
{
|
||||
refetch(contactProfile?.id, false)
|
||||
const handleSwitch = () => {
|
||||
setIsActive(!IsActive);
|
||||
if (IsActive) {
|
||||
refetch(contactProfile?.id, false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="text-start">
|
||||
@ -103,7 +106,7 @@ const NotesDirectory = ({refetchProfile, isLoading, contactProfile, setProfileCo
|
||||
<input
|
||||
type="checkbox"
|
||||
className="switch-input"
|
||||
onChange={()=>handleSwitch(!IsActive)}
|
||||
onChange={() => handleSwitch(!IsActive)}
|
||||
value={IsActive}
|
||||
/>
|
||||
<span className="switch-toggle-slider">
|
||||
@ -114,24 +117,11 @@ const NotesDirectory = ({refetchProfile, isLoading, contactProfile, setProfileCo
|
||||
{/* <i class="icon-base bx bx-x"></i> */}
|
||||
</span>
|
||||
</span>
|
||||
<span className="switch-label small-text">Show Including Inactive Notes</span>
|
||||
<span className="switch-label ">Show Including Inactive Notes</span>
|
||||
</label>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-flex justify-content-end px-2">
|
||||
<span
|
||||
className={`btn btn-xs ${addNote ? "btn-danger" : "btn-primary"}`}
|
||||
onClick={() => setAddNote(!addNote)}
|
||||
>
|
||||
{/* <i
|
||||
className={`icon-base bx ${
|
||||
addNote ? "bx-x bx-sm" : "bx-pencil"
|
||||
} bx-xs `}
|
||||
></i> */}
|
||||
{addNote ? "close" : "Add Note"}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{addNote && (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<Editor
|
||||
@ -146,6 +136,14 @@ const NotesDirectory = ({refetchProfile, isLoading, contactProfile, setProfileCo
|
||||
)}
|
||||
</form>
|
||||
)}
|
||||
<div className="d-flex justify-content-end px-2">
|
||||
<span
|
||||
className={`btn btn-sm ${addNote ? "btn-danger" : "btn-primary"}`}
|
||||
onClick={() => setAddNote(!addNote)}
|
||||
>
|
||||
{addNote ? "Hide Editor" : "Add Note"}
|
||||
</span>
|
||||
</div>
|
||||
<div className=" justify-content-start px-1 mt-1">
|
||||
{isLoading && (
|
||||
<div className="text-center">
|
||||
@ -154,32 +152,31 @@ const NotesDirectory = ({refetchProfile, isLoading, contactProfile, setProfileCo
|
||||
</div>
|
||||
)}
|
||||
{!isLoading &&
|
||||
[...(IsActive ? contactProfile?.notes || [] : contactNotes || [])]
|
||||
.reverse()
|
||||
.map((noteItem) => (
|
||||
<NoteCardDirectory
|
||||
refetchProfile={refetchProfile}
|
||||
refetchNotes={refetch}
|
||||
refetchContact ={refetch}
|
||||
noteItem={noteItem}
|
||||
contactId={contactProfile?.id}
|
||||
setProfileContact={setProfileContact}
|
||||
key={noteItem.id}
|
||||
|
||||
/>
|
||||
))}
|
||||
[...(IsActive ? contactProfile?.notes || [] : contactNotes || [])]
|
||||
.reverse()
|
||||
.map((noteItem) => (
|
||||
<NoteCardDirectory
|
||||
refetchProfile={refetchProfile}
|
||||
refetchNotes={refetch}
|
||||
refetchContact={refetch}
|
||||
noteItem={noteItem}
|
||||
contactId={contactProfile?.id}
|
||||
setProfileContact={setProfileContact}
|
||||
key={noteItem.id}
|
||||
/>
|
||||
))}
|
||||
|
||||
{IsActive && (
|
||||
<div>
|
||||
{!isLoading && contactProfile?.notes.length == 0 && !addNote && (
|
||||
<div className="text-center">No Notes Found</div>
|
||||
<div className="text-center mt-5">No Notes Found</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{!IsActive && (
|
||||
<div>
|
||||
{!isLoading && contactNotes.length == 0 && !addNote && (
|
||||
<div className="text-center">No Notes Found</div>
|
||||
<div className="text-center mt-5">No Notes Found</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
@ -11,7 +11,7 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
|
||||
const [profileContact, setProfileContact] = useState();
|
||||
const [expanded, setExpanded] = useState(false);
|
||||
const description = contactProfile?.description || "";
|
||||
const limit = 100;
|
||||
const limit = 500;
|
||||
|
||||
const toggleReadMore = () => setExpanded(!expanded);
|
||||
|
||||
@ -107,10 +107,10 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
|
||||
<p className="m-0">Created : </p>
|
||||
</div>
|
||||
<div className="d-flex align-items-center">
|
||||
<li className="list-inline-item">
|
||||
<i className="bx bx-calendar-week bx-xs me-1"></i>
|
||||
{moment(contactProfile.createdAt).format("MMMM, DD YYYY")}
|
||||
</li>
|
||||
<li className="list-inline-item">
|
||||
<i className="bx bx-calendar-week bx-xs me-1"></i>
|
||||
{moment(contactProfile.createdAt).format("MMMM, DD YYYY")}
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@ -202,8 +202,11 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="p-3 alert alert-secondary text-small text-start rounded muted">
|
||||
<small className="fw-130">
|
||||
<div className="d-flex mb-2 align-items-start">
|
||||
<div style={{ minWidth: "100px" }}>
|
||||
<p className="m-0 text-start">Description :</p>
|
||||
</div>
|
||||
<div className="text-start">
|
||||
{displayText}
|
||||
{isLong && (
|
||||
<span
|
||||
@ -213,8 +216,9 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
|
||||
{expanded ? "Read less" : "Read more"}
|
||||
</span>
|
||||
)}
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr className="my-1" />
|
||||
<NotesDirectory
|
||||
refetchProfile={refetch}
|
||||
|
@ -33,7 +33,7 @@ const Editor = ({
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="editor-wrapper">
|
||||
<div className="editor-wrapper m-5">
|
||||
<div id="custom-toolbar" className="ql-toolbar ql-snow custom-toolbar">
|
||||
<div className="d-flex justify-content-between align-items-center w-100">
|
||||
{/* Left: Quill Format Buttons */}
|
||||
|
Loading…
x
Reference in New Issue
Block a user