diff --git a/src/component/contacts/Contacts.js b/src/component/contacts/Contacts.js index f529d9a..e64ef80 100644 --- a/src/component/contacts/Contacts.js +++ b/src/component/contacts/Contacts.js @@ -1,354 +1,240 @@ -import React from "react"; +"use client" +import React, { useEffect, useState } from "react"; import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS"; import getImage from "../../utils/getImage"; +import { useQuery } from "@tanstack/react-query"; +import { contactData } from "../../services/services"; +import queryKeys from "../../services/queryKeys"; +import getCustomTime from "../../utils/getCustomTime"; export default function Contacts(){ + const {data:contacts, isFetching, isError, error} = useQuery({ + queryKey: queryKeys.contacts, + queryFn: () => contactData() + }) + + const contactsData = contacts?.data?.calendar_data?.contacts + + const [activeContactUID, setActiveContactUID] = useState(null) + + const [activeDetail, setActiveDetail] = useState(null) + + const changeActiveUID = (uid) => { + setActiveContactUID(uid) + let detail = contactsData.filter(item => item.uid == uid) + setActiveDetail(detail) + } + return( <> -
- {/*
Coming Soon
*/} -
-
-
-
- -
-
-
-
+ {isFetching ? + <> +
+
+

Loading...

+
+
+ + : isError ? +
+
+

{error.message}

+
+
+ : +
+ {/*
Coming Soon
*/} +
+
+
+
+
+ -
-
- -
-
-
- user -
-
-
-
-

Martin smith

-

06:59 PM

-
-
Saas Designer
-

Since there is not an "all the above" category, I'll take the opportunity to enthusiastically congratulate you on the very high quality.

-

06:59 PM

-
+
+
+
+ -
- -
- - - - - - - -
-
-
-
-
-
- user -
-
-

Dutca Patrick

-

30 Min ago

-
-
-
-
-

Landing page Designer...

-
-
- {/**/} - {/**/} -
-
-
-

hey adminjon...

-

I truly believe Augustine’s words are true and if you look at history you know it is true. There are many people in the world with amazing talents who realize only a small percentage of their potential. We all know people who live this truth.

-

We also know those epic stories, those modern-day legends surrounding the early failures of such supremely successful folks as Michael Jordan and Bill Gates. We can look a bit further back in time to Albert Einstein or even further back to Abraham Lincoln. What made each of these people so successful? Motivation.

-

We know this in our gut, but what can we do about it? How can we motivate ourselves? One of the most difficult aspects of achieving success is staying motivated over the long haul.

- {/*
*/} - {/*

Have lovely Day,

*/} - {/*

adminjon

*/} - {/*
*/} -
-
+
-
-
-

Click here to ReplyorForward

- -
-
-
- +
+
+
+ user +
+
+

{activeContactUID ? activeDetail[0].sender : contactsData[0].sender}

+

{activeContactUID ? getCustomTime(activeDetail[0].added) : getCustomTime(contactsData[0].added)}

+
-
-
-
- -
-
-
-
- {/*
    */} - {/*
    • */} - {/*
    • */} - {/*
    • */} - {/*
*/} +
+
+

{activeContactUID ? activeDetail[0].title : contactsData[0].title}

+
+
+ {/**/} + {/**/} +
- {/*Send */} +

{activeContactUID ? activeDetail[0].message : contactsData[0].message}

+ {/*

hey adminjon...

+

I truly believe Augustine’s words are true and if you look at history you know it is true. There are many people in the world with amazing talents who realize only a small percentage of their potential. We all know people who live this truth.

+

We also know those epic stories, those modern-day legends surrounding the early failures of such supremely successful folks as Michael Jordan and Bill Gates. We can look a bit further back in time to Albert Einstein or even further back to Abraham Lincoln. What made each of these people so successful? Motivation.

+

We know this in our gut, but what can we do about it? How can we motivate ourselves? One of the most difficult aspects of achieving success is staying motivated over the long haul.

*/} + {/*
*/} + {/*

Have lovely Day,

*/} + {/*

adminjon

*/} + {/*
*/} +
+
+ +
+
+

Click here to ReplyorForward

+ +
+
+
+ +
+
+
+
+ +
+
+
+
+ {/*
    */} + {/*
    • */} + {/*
    • */} + {/*
    • */} + {/*
*/} +
+
+ {/*Send */} +
@@ -357,7 +243,7 @@ export default function Contacts(){
-
+ } ) } \ No newline at end of file diff --git a/src/css/mail/_mail.scss b/src/css/mail/_mail.scss index 6e05694..0f9a4dd 100644 --- a/src/css/mail/_mail.scss +++ b/src/css/mail/_mail.scss @@ -40,9 +40,7 @@ align-items: center; } .mail-msg{ - max-height: 500px; - min-height: 400px; - // max-height: 747px; + max-height: 747px; overflow-y: auto; outline: none; @include laptop { diff --git a/src/services/queryKeys.js b/src/services/queryKeys.js index 0de8804..9ebcce1 100644 --- a/src/services/queryKeys.js +++ b/src/services/queryKeys.js @@ -5,7 +5,8 @@ const queryKeys = { product: ['product-data'], product_url: ['product_url'], myproduct_provision: ['myproduct_provision'], - calendar_events: ['calendar_events'] + calendar_events: ['calendar_events'], + contacts: ['contacts'] } export default queryKeys \ No newline at end of file diff --git a/src/services/services.js b/src/services/services.js index d036b17..bc03d86 100644 --- a/src/services/services.js +++ b/src/services/services.js @@ -122,6 +122,11 @@ export const productData = () => { return getAuxEnd(`/panel/account/products`) } +// FUNCTION TO GET DASHBOARD PRODUCT DATA SECTION +export const contactData = () => { + return getAuxEnd(`/panel/contacts`) +} + // FUNCTION TO GET DASHBOARD PRODUCT URL DATA SECTION export const productsURL = () => { return getAuxEnd(`/panel/account/products/url`) diff --git a/src/utils/getCustomTime.js b/src/utils/getCustomTime.js new file mode 100644 index 0000000..c92924e --- /dev/null +++ b/src/utils/getCustomTime.js @@ -0,0 +1,13 @@ +function getCustomTime(dateStr) { + let date = new Date(dateStr); + + if(isNaN(date)){ + return '00:00' + } + const hours = date.getHours() + const minutes = date.getMinutes() + + return `${hours}:${minutes} ${hours >= 12 ? 'PM' : 'AM'}` + } + + export default getCustomTime \ No newline at end of file