diff --git a/assets/src/js/formgent-integration/components/style.js b/assets/src/js/formgent-integration/components/style.js
index cbcc18c0ef..ca71d506f5 100644
--- a/assets/src/js/formgent-integration/components/style.js
+++ b/assets/src/js/formgent-integration/components/style.js
@@ -220,7 +220,9 @@ const EnquiryDetailsModalStyle = styled.div`
}
}
.directorist-enquiry-listing {
- margin-bottom: 24px;
+ margin-bottom: 16px;
+ border-bottom: 1px solid var(--directorist-color-border);
+ padding-bottom: 16px;
h3 {
margin: 0 0 4px 0;
font-size: 16px;
@@ -353,6 +355,131 @@ const EnquiryDetailsModalStyle = styled.div`
color: var(--directorist-color-info);
}
}
+ .directorist-answers-section {
+ display: flex;
+ gap: 24px;
+ flex-direction: column;
+ align-items: flex-start;
+ }
+
+ .formgent-response-badge {
+ background-color: var(--directorist-color-light);
+ padding: 0 8px;
+ color: var(--directorist-color-dark);
+ font-size: 14px;
+ line-height: 1.6;
+ font-weight: 400;
+ border-radius: 4px;
+ }
+
+ .response-table__drawer__tab__item {
+ display: flex;
+ gap: 12px;
+ width: 100%;
+ &.response-table__drawer__tab__item--tag {
+ .response-table__drawer__tab__item__title {
+ height: 40px;
+ }
+ }
+ .response-table__drawer__tab__item__icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 40px;
+ width: 40px;
+ min-width: 40px;
+ border-radius: 10px;
+ color: var(--directorist-color-dark);
+ background-color: var(--directorist-color-light);
+ }
+ .response-table__drawer__tab__item__content {
+ display: flex;
+ gap: 6px;
+ flex-direction: column;
+ flex: 1;
+ }
+ .response-table__drawer__tab__item__title {
+ display: block;
+ font-size: 15px;
+ font-weight: 600;
+ color: var(--formgent-color-dark);
+ margin: 0;
+ &:first-letter {
+ text-transform: uppercase;
+ }
+ }
+ .response-table__drawer__tab__item__desc {
+ display: flex;
+ gap: 5px;
+ flex-wrap: wrap;
+ font-size: 14px;
+ font-weight: 400;
+ color: var(--directorist-color-light-gray);
+ margin: 0;
+ img {
+ max-width: 200px;
+ }
+ .formgent-signature-image-preview,
+ .formgent-file-upload-preview {
+ width: 100%;
+ max-width: 350px;
+ }
+ .formgent-file-upload-answer {
+ padding: 8px 0;
+ &:last-child {
+ border-bottom: 0 none;
+ padding-bottom: 0;
+ }
+ }
+ }
+ .response-table__drawer__tab__item__desc__key {
+ font-size: 14px;
+ font-weight: 500;
+ display: inline-flex;
+ padding-right: 4px;
+ &::first-letter {
+ text-transform: uppercase;
+ }
+ }
+ .response-table__drawer__tab__item__desc__value {
+ font-size: 14px;
+ color: var(--directorist-color-light-gray);
+ }
+ .response-table__drawer__tab__item__add {
+ display: flex;
+ align-items: center;
+ background: transparent;
+ border: none;
+ margin: 0;
+ padding: 0;
+ cursor: pointer;
+ &:hover {
+ color: var(--directorist-color-primary);
+ }
+ }
+ .response-table__drawer__tab__item__btns {
+ display: flex;
+ gap: 8px;
+ flex-wrap: wrap;
+ .response-table__drawer__tab__item__btn {
+ font-size: 14px;
+ font-weight: 500;
+ padding: 0 8px;
+ margin: 0;
+ height: 28px;
+ color: var(--directorist-color-gray);
+ background: var(--formgent-color-border);
+ border: none;
+ border-radius: 8px;
+ cursor: pointer;
+ transition: all ease 0.3s;
+ &:hover {
+ color: var(--formgent-color-white);
+ background: var(--formgent-color-light-gray);
+ }
+ }
+ }
+ }
`;
export { EnquiriesComponentStyle, EnquiryDetailsModalStyle };
diff --git a/assets/src/js/formgent-integration/utils/renderAnswerValue.js b/assets/src/js/formgent-integration/utils/renderAnswerValue.js
deleted file mode 100644
index 56910c1028..0000000000
--- a/assets/src/js/formgent-integration/utils/renderAnswerValue.js
+++ /dev/null
@@ -1,176 +0,0 @@
-/**
- * Utility function to render different types of form answer values
- * @param {Object} answer - The answer object containing field_type, value, and other properties
- * @returns {JSX.Element} - The rendered answer value component
- */
-export const renderAnswerValue = (answer) => {
- const {
- field_type,
- value,
- options,
- option_label,
- rating_limit,
- rating_icon,
- children,
- } = answer;
-
- switch (field_type) {
- case 'name':
- case 'address':
- return (
-
- {children?.map((child) => (
-
-
- {child.label || 'Unknown Field'}:
-
-
- {child.value}
-
-
- ))}
-
- );
-
- case 'email':
- return
{value};
-
- case 'website':
- return (
-
- {value}
-
- );
-
- case 'file-upload':
- if (Array.isArray(value)) {
- return (
-
- );
- }
- return (
-
- {value}
-
- );
-
- case 'rating':
- const rating = parseInt(value);
- return (
-
-
- {rating} out of {rating_limit || 5}
-
-
- );
-
- case 'dropdown':
- case 'single-choice':
- return
{option_label || value};
-
- case 'multiple-choice':
- if (options && Array.isArray(options)) {
- const selectedValues = JSON.parse(value || '[]');
- const selectedOptions = options.filter((opt) =>
- selectedValues.includes(opt.value)
- );
- return (
-
- {selectedOptions.map((option, index) => (
-
- {option.label}
-
- ))}
-
- );
- }
- return
{value};
-
- case 'google-map':
- try {
- const mapData = JSON.parse(value);
- return (
-
-
- Address: {mapData.address}
-
-
- Coordinates: {mapData.map.lat},{' '}
- {mapData.map.lng}
-
-
- );
- } catch (e) {
- return
{value};
- }
-
- case 'repeater':
- try {
- // Check if value is already an array or needs to be parsed
- const repeaterData = Array.isArray(value)
- ? value
- : JSON.parse(value);
- return (
-
-
-
-
- {Object.entries(repeaterData[0]).map(
- ([key, val]) => (
- |
- {val.label || key}
- |
- )
- )}
-
-
-
- {repeaterData.map((item, index) => (
-
- {Object.entries(item).map(
- ([key, val]) => (
- | {val.value} |
- )
- )}
-
- ))}
-
-
-
- );
- } catch (e) {
- return
Error rendering repeater data;
- }
-
- case 'digital-signature':
- return (
-
-

-
- );
-
- default:
- return
{value};
- }
-};
diff --git a/assets/src/scss/component/listing-details/_details-content.scss b/assets/src/scss/component/listing-details/_details-content.scss
index e69de29bb2..2831cd1a33 100644
--- a/assets/src/scss/component/listing-details/_details-content.scss
+++ b/assets/src/scss/component/listing-details/_details-content.scss
@@ -0,0 +1,14 @@
+// Formgent Integration Styles
+.directorist-single-wrapper {
+ .formgent-form-general {
+ .formgent-field-list--frontend {
+ padding: 0;
+ }
+ }
+ .formgent-file-upload-progress-text {
+ min-width: 40px;
+ }
+ .formgent-file-preview-action .formgent-file-delete {
+ line-height: 1;
+ }
+}
diff --git a/package.json b/package.json
index c34c419854..3907e24f98 100644
--- a/package.json
+++ b/package.json
@@ -41,6 +41,7 @@
"lodash": "^4.17.20",
"prettier": "^3.5.3",
"react-hot-toast": "^2.6.0",
+ "react-inlinesvg": "^4.2.0",
"styled-components": "^6.1.19",
"vue": "^2.6.11",
"vue-dndrop": "^1.3.0",
From a0e46bfde5b13a155a10442b9fed79d465f4f81d Mon Sep 17 00:00:00 2001
From: Tanjim Hasan <34968601+tanjimhasan@users.noreply.github.com>
Date: Tue, 2 Dec 2025 14:38:18 +0600
Subject: [PATCH 2/2] integration update
---
assets/css/formgent-integration.css | 38 ++++-----
assets/css/formgent-integration.rtl.css | 38 ++++-----
assets/js/formgent-integration.js | 7 +-
.../components/EnquiryDetailsModal.js | 3 +
.../formgent-integration/components/style.js | 80 +++++++++----------
assets/src/js/formgent-integration/index.scss | 48 ++++-------
includes/model/ListingDashboard.php | 2 +
7 files changed, 95 insertions(+), 121 deletions(-)
diff --git a/assets/css/formgent-integration.css b/assets/css/formgent-integration.css
index 4e5f98bb6d..ecf3c8263e 100644
--- a/assets/css/formgent-integration.css
+++ b/assets/css/formgent-integration.css
@@ -2117,29 +2117,23 @@ div.dataviews-view-list {
/*!******************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/resolve-url-loader/index.js!./node_modules/postcss-loader/src/index.js??clonedRuleSet-4.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./assets/src/js/formgent-integration/index.scss ***!
\******************************************************************************************************************************************************************************************************************************************************************************************************/
-.directorist-answers-modal .directorist-modal-content {
- max-height: 70vh;
- overflow-y: auto;
- padding: 20px;
-}
-.directorist-answers-modal .directorist-enquiry-info {
- margin-bottom: 30px;
- padding-bottom: 20px;
- border-bottom: 1px solid #e0e0e0;
-}
-.directorist-answers-modal .directorist-enquiry-info h3 {
- margin: 0 0 15px 0;
- color: #333;
-}
-.directorist-answers-modal .directorist-enquiry-info p {
- margin: 8px 0;
- color: #666;
+.directorist-enquiry-modal {
+ --formgent-color-primary: #5e53f9;
+ --formgent-color-primary-hover: #563dee;
+ --formgent-color-primary-2: #2188ff;
+ --formgent-color-primary-50: #edefff;
+ --formgent-color-primary-100: #dee3ff;
+ --formgent-color-primary-200: #c4cbff;
+ --formgent-color-gray-100: #f3f4f6;
+ --formgent-color-gray-200: #e5e7eb;
+ --formgent-color-gray-300: #d2d6db;
+ --formgent-color-gray-400: #a1a9b2;
+ --formgent-color-gray-500: #747c89;
+ --formgent-color-gray-600: #4d5761;
+ --formgent-color-gray-700: #383f47;
+ --formgent-color-gray-800: #2c3239;
+ --formgent-color-gray-900: #141921;
}
-.directorist-answers-modal .directorist-answers-section h3 {
- margin: 0 0 20px 0;
- color: #333;
-}
-
.directorist-enquiry-modal .components-modal__header {
border-bottom: 1px solid #e0e0e0;
}
diff --git a/assets/css/formgent-integration.rtl.css b/assets/css/formgent-integration.rtl.css
index 3f75ecca29..66c0c60cd2 100644
--- a/assets/css/formgent-integration.rtl.css
+++ b/assets/css/formgent-integration.rtl.css
@@ -2117,29 +2117,23 @@ div.dataviews-view-list {
/*!******************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-4.use[1]!./node_modules/resolve-url-loader/index.js!./node_modules/postcss-loader/src/index.js??clonedRuleSet-4.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-4.use[4]!./assets/src/js/formgent-integration/index.scss ***!
\******************************************************************************************************************************************************************************************************************************************************************************************************/
-.directorist-answers-modal .directorist-modal-content {
- max-height: 70vh;
- overflow-y: auto;
- padding: 20px;
-}
-.directorist-answers-modal .directorist-enquiry-info {
- margin-bottom: 30px;
- padding-bottom: 20px;
- border-bottom: 1px solid #e0e0e0;
-}
-.directorist-answers-modal .directorist-enquiry-info h3 {
- margin: 0 0 15px 0;
- color: #333;
-}
-.directorist-answers-modal .directorist-enquiry-info p {
- margin: 8px 0;
- color: #666;
+.directorist-enquiry-modal {
+ --formgent-color-primary: #5e53f9;
+ --formgent-color-primary-hover: #563dee;
+ --formgent-color-primary-2: #2188ff;
+ --formgent-color-primary-50: #edefff;
+ --formgent-color-primary-100: #dee3ff;
+ --formgent-color-primary-200: #c4cbff;
+ --formgent-color-gray-100: #f3f4f6;
+ --formgent-color-gray-200: #e5e7eb;
+ --formgent-color-gray-300: #d2d6db;
+ --formgent-color-gray-400: #a1a9b2;
+ --formgent-color-gray-500: #747c89;
+ --formgent-color-gray-600: #4d5761;
+ --formgent-color-gray-700: #383f47;
+ --formgent-color-gray-800: #2c3239;
+ --formgent-color-gray-900: #141921;
}
-.directorist-answers-modal .directorist-answers-section h3 {
- margin: 0 0 20px 0;
- color: #333;
-}
-
.directorist-enquiry-modal .components-modal__header {
border-bottom: 1px solid #e0e0e0;
}
diff --git a/assets/js/formgent-integration.js b/assets/js/formgent-integration.js
index 14a9fe92ec..fb1f5655b7 100644
--- a/assets/js/formgent-integration.js
+++ b/assets/js/formgent-integration.js
@@ -942,6 +942,11 @@
react_inlinesvg__WEBPACK_IMPORTED_MODULE_4__[
'default'
],
+ useState:
+ _wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState,
+ useEffect:
+ _wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect,
+ isLoadedFromDirectorist: true,
}
);
}
@@ -1696,7 +1701,7 @@
_babel_runtime_helpers_taggedTemplateLiteral__WEBPACK_IMPORTED_MODULE_0__[
'default'
])([
- '\n\tmargin-top: 20px;\n\t.directorist-enquiry-sender {\n\t\tdisplay: flex;\n\t\tgap: 16px;\n\t\talign-items: flex-start;\n\t\tmargin-bottom: 24px;\n\t}\n\t.directorist-enquiry-sender-avatar img {\n\t\twidth: 48px;\n\t\theight: 48px;\n\t\tborder-radius: 50%;\n\t\tobject-fit: cover;\n\t}\n\t.directorist-enquiry-sender-info {\n\t\th2 {\n\t\t\tmargin: 0 0 8px 0;\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tgap: 12px;\n\t\t\tfont-size: 16px;\n\t\t\tfont-weight: 600;\n\t\t}\n\t\tp {\n\t\t\tmargin: 0 0 8px 0;\n\t\t\tfont-size: 14px;\n\t\t\tcolor: var(--directorist-color-body);\n\t\t}\n\t\tspan {\n\t\t\tdisplay: flex;\n\t\t\tfont-size: 12px;\n\t\t}\n\t}\n\t.directorist-enquiry-listing {\n\t\tmargin-bottom: 16px;\n\t\tborder-bottom: 1px solid var(--directorist-color-border);\n\t\tpadding-bottom: 16px;\n\t\th3 {\n\t\t\tmargin: 0 0 4px 0;\n\t\t\tfont-size: 16px;\n\t\t\tfont-weight: 600;\n\t\t}\n\t\ta {\n\t\t\ttext-decoration: none;\n\t\t\tcolor: var(--directorist-color-info);\n\t\t\tfont-size: 14px;\n\t\t\tfont-weight: 500;\n\t\t}\n\t}\n\t.directorist-answers-section {\n\t\tmargin-bottom: 110px;\n\t}\n\t.directorist-enquiry-answer-item {\n\t\tmargin-bottom: 24px;\n\t}\n\t.directorist-enquiry-answer-title {\n\t\tmargin: 0 0 10px 0;\n\t\tfont-size: 16px;\n\t\tfont-weight: 600;\n\t\tcolor: var(--directorist-color-dark);\n\t}\n\t.directorist-enquiry-answer-value {\n\t\tmargin: 0;\n\t\tfont-size: 14px;\n\t\tfont-weight: 500;\n\t\tcolor: var(--directorist-color-deep-gray);\n\t}\n\t.directorist-enquiry-answer-child {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 12px;\n\t\tmargin-bottom: 5px;\n\t}\n\t.directorist-enquiry-answer-title-child {\n\t\tmargin: 0;\n\t\tfont-size: 14px;\n\t\tfont-weight: 600;\n\t\tcolor: var(--directorist-color-dark);\n\t}\n\t.directorist-enquiry-answer-value-child {\n\t\tmargin: 0;\n\t\tfont-size: 14px;\n\t\tfont-weight: 400;\n\t}\n\t.directorist-enquiry-answer-repeater {\n\t\ttable {\n\t\t\twidth: 100%;\n\t\t\tborder-collapse: separate;\n\t\t\tborder-spacing: 0;\n\t\t\tborder-radius: 8px;\n\t\t\toverflow: hidden;\n\t\t\tborder: 1px solid #eee;\n\t\t}\n\n\t\tthead {\n\t\t\tbackground: linear-gradient(to bottom, #f9f9f9, #f1f3f5);\n\t\t}\n\n\t\tth {\n\t\t\ttext-align: left;\n\t\t\tpadding: 12px 16px;\n\t\t\tfont-weight: 600;\n\t\t\tfont-size: 14px;\n\t\t\tcolor: #333;\n\t\t}\n\n\t\ttd {\n\t\t\tpadding: 12px 16px;\n\t\t\tfont-size: 14px;\n\t\t\tcolor: #000;\n\t\t\tborder-top: 1px solid #eee;\n\t\t}\n\n\t\t/* Hover effect */\n\t\ttr:hover td {\n\t\t\tbackground-color: #fafafa;\n\t\t}\n\t}\n\t//stick footer to bottom\n\t.directorist-enquiry-modal-footer {\n\t\tborder-top: 1px solid #e5e7eb;\n\t\tdisplay: flex;\n\t\tgap: 12px;\n\t\tposition: fixed;\n\t\tbottom: 0;\n\t\tbackground-color: #fff;\n\t\twidth: 100%;\n\t\tpadding: 20px 30px;\n\t\tbox-sizing: border-box;\n\t\tleft: 0;\n\t}\n\t.directorist-enquiry-modal-btn {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t\tpadding: 0 16px;\n\t\tmin-height: 42px;\n\t\tborder-radius: 8px;\n\t\tfont-size: 14px;\n\t\tfont-weight: 500;\n\t\tbox-shadow: none;\n\t\tborder: 1px solid #e5e7eb;\n\t\tbackground: none;\n\t\tcursor: pointer;\n\t\ttransition: 0.3s ease;\n\t\t&.directorist-btn-disabled {\n\t\t\topacity: 0.5;\n\t\t\tpointer-events: none;\n\t\t}\n\t}\n\t.directorist-enquiry-modal-btn-delete {\n\t\tmargin-left: auto;\n\t\t&:hover {\n\t\t\tborder-color: var(--directorist-color-danger);\n\t\t\tcolor: var(--directorist-color-danger);\n\t\t}\n\t}\n\t.directorist-enquiry-modal-btn-resolved {\n\t\t&:hover {\n\t\t\tborder-color: var(--directorist-color-success);\n\t\t\tcolor: var(--directorist-color-success);\n\t\t}\n\t}\n\t.directorist-enquiry-modal-btn-reply {\n\t\t&:hover {\n\t\t\tborder-color: var(--directorist-color-info);\n\t\t\tcolor: var(--directorist-color-info);\n\t\t}\n\t}\n\t.directorist-answers-section{\n\t\tdisplay: flex;\n\t\tgap: 24px;\n\t\tflex-direction: column;\n\t\talign-items: flex-start;\n\t}\n\n\t.formgent-response-badge {\n\t\tbackground-color: var(--directorist-color-light);\n\t\tpadding: 0 8px;\n\t\tcolor: var(--directorist-color-dark);\n\t\tfont-size: 14px;\n\t\tline-height: 1.6;\n\t\tfont-weight: 400;\n\t\tborder-radius: 4px;\n\t}\n\n\t.response-table__drawer__tab__item {\n display: flex;\n gap: 12px;\n width: 100%;\n &.response-table__drawer__tab__item--tag {\n .response-table__drawer__tab__item__title {\n height: 40px;\n }\n }\n .response-table__drawer__tab__item__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 40px;\n width: 40px;\n min-width: 40px;\n border-radius: 10px;\n color: var(--directorist-color-dark);\n background-color: var(--directorist-color-light);\n }\n .response-table__drawer__tab__item__content {\n display: flex;\n gap: 6px;\n flex-direction: column;\n flex: 1;\n }\n .response-table__drawer__tab__item__title {\n display: block;\n font-size: 15px;\n font-weight: 600;\n color: var(--formgent-color-dark);\n margin: 0;\n &:first-letter{\n text-transform: uppercase;\n }\n }\n .response-table__drawer__tab__item__desc {\n display: flex;\n gap: 5px;\n flex-wrap: wrap;\n font-size: 14px;\n font-weight: 400;\n color: var(--directorist-color-light-gray);\n margin: 0;\n img{\n max-width: 200px;\n }\n .formgent-signature-image-preview,\n .formgent-file-upload-preview{\n width: 100%;\n max-width: 350px;\n }\n .formgent-file-upload-answer{\n padding: 8px 0;\n &:last-child{\n border-bottom: 0 none;\n padding-bottom: 0;\n }\n }\n }\n .response-table__drawer__tab__item__desc__key {\n\t\t\tfont-size: 14px;\n font-weight: 500;\n display: inline-flex;\n padding-right: 4px;\n &::first-letter{\n text-transform: uppercase;\n }\n }\n .response-table__drawer__tab__item__desc__value {\n\t\t\tfont-size: 14px;\n color: var(--directorist-color-light-gray);\n }\n .response-table__drawer__tab__item__add {\n display: flex;\n align-items: center;\n background: transparent;\n border: none;\n margin: 0;\n padding: 0;\n cursor: pointer;\n &:hover {\n color: var(--directorist-color-primary);\n }\n }\n .response-table__drawer__tab__item__btns {\n display: flex;\n gap: 8px;\n flex-wrap: wrap;\n .response-table__drawer__tab__item__btn {\n font-size: 14px;\n font-weight: 500;\n padding: 0 8px;\n margin: 0;\n height: 28px;\n color: var(--directorist-color-gray);\n background: var(--formgent-color-border);\n border: none;\n border-radius: 8px;\n cursor: pointer;\n transition: all ease .3s;\n &:hover {\n color: var(--formgent-color-white);\n background: var(--formgent-color-light-gray);\n }\n }\n }\n }\n',
+ '\n\tmargin-top: 20px;\n\t.directorist-enquiry-sender {\n\t\tdisplay: flex;\n\t\tgap: 16px;\n\t\talign-items: flex-start;\n\t\tmargin-bottom: 24px;\n\t}\n\t.directorist-enquiry-sender-avatar img {\n\t\twidth: 48px;\n\t\theight: 48px;\n\t\tborder-radius: 50%;\n\t\tobject-fit: cover;\n\t}\n\t.directorist-enquiry-sender-info {\n\t\th2 {\n\t\t\tmargin: 0 0 8px 0;\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tgap: 12px;\n\t\t\tfont-size: 16px;\n\t\t\tfont-weight: 600;\n\t\t}\n\t\tp {\n\t\t\tmargin: 0 0 8px 0;\n\t\t\tfont-size: 14px;\n\t\t\tcolor: var(--directorist-color-body);\n\t\t}\n\t\tspan {\n\t\t\tdisplay: flex;\n\t\t\tfont-size: 12px;\n\t\t}\n\t}\n\t.directorist-enquiry-listing {\n\t\tmargin-bottom: 16px;\n\t\tborder-bottom: 1px solid var(--directorist-color-border);\n\t\tpadding-bottom: 16px;\n\t\th3 {\n\t\t\tmargin: 0 0 4px 0;\n\t\t\tfont-size: 16px;\n\t\t\tfont-weight: 600;\n\t\t}\n\t\ta {\n\t\t\ttext-decoration: none;\n\t\t\tcolor: var(--directorist-color-info);\n\t\t\tfont-size: 14px;\n\t\t\tfont-weight: 500;\n\t\t}\n\t}\n\t.directorist-answers-section {\n\t\tmargin-bottom: 110px;\n\t}\n\t.directorist-enquiry-answer-item {\n\t\tmargin-bottom: 24px;\n\t}\n\t.directorist-enquiry-answer-title {\n\t\tmargin: 0 0 10px 0;\n\t\tfont-size: 16px;\n\t\tfont-weight: 600;\n\t\tcolor: var(--directorist-color-dark);\n\t}\n\t.directorist-enquiry-answer-value {\n\t\tmargin: 0;\n\t\tfont-size: 14px;\n\t\tfont-weight: 500;\n\t\tcolor: var(--directorist-color-deep-gray);\n\t}\n\t.directorist-enquiry-answer-child {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 12px;\n\t\tmargin-bottom: 5px;\n\t}\n\t.directorist-enquiry-answer-title-child {\n\t\tmargin: 0;\n\t\tfont-size: 14px;\n\t\tfont-weight: 600;\n\t\tcolor: var(--directorist-color-dark);\n\t}\n\t.directorist-enquiry-answer-value-child {\n\t\tmargin: 0;\n\t\tfont-size: 14px;\n\t\tfont-weight: 400;\n\t}\n\t.directorist-repeater-table-wrapper{\n max-width: 600px;\n @media (max-width: 768px) {\n max-width: 500px;\n }\n }\n\t.formgent-editor-rating {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 12px;\n\t\tmargin: 5px 0;\n\t}\n\t.formgent-editor-rating__icons {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 5px;\n\t}\n\t.formgent-editor-rating__icons .formgent-editor-rating__icon--active svg path{\n\t\tfill: var(--directorist-color-primary);\n\t}\n\t.formgent-google-map-external-link{\n\t\tcolor: var(--directorist-color-info);\n\t}\n\t//stick footer to bottom\n\t.directorist-enquiry-modal-footer {\n\t\tborder-top: 1px solid #e5e7eb;\n\t\tdisplay: flex;\n\t\tgap: 12px;\n\t\tposition: fixed;\n\t\tbottom: 0;\n\t\tbackground-color: #fff;\n\t\twidth: 100%;\n\t\tpadding: 20px 30px;\n\t\tbox-sizing: border-box;\n\t\tleft: 0;\n\t}\n\t.directorist-enquiry-modal-btn {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t\tpadding: 0 16px;\n\t\tmin-height: 42px;\n\t\tborder-radius: 8px;\n\t\tfont-size: 14px;\n\t\tfont-weight: 500;\n\t\tbox-shadow: none;\n\t\tborder: 1px solid #e5e7eb;\n\t\tbackground: none;\n\t\tcursor: pointer;\n\t\ttransition: 0.3s ease;\n\t\t&.directorist-btn-disabled {\n\t\t\topacity: 0.5;\n\t\t\tpointer-events: none;\n\t\t}\n\t}\n\t.directorist-enquiry-modal-btn-delete {\n\t\tmargin-left: auto;\n\t\t&:hover {\n\t\t\tborder-color: var(--directorist-color-danger);\n\t\t\tcolor: var(--directorist-color-danger);\n\t\t}\n\t}\n\t.directorist-enquiry-modal-btn-resolved {\n\t\t&:hover {\n\t\t\tborder-color: var(--directorist-color-success);\n\t\t\tcolor: var(--directorist-color-success);\n\t\t}\n\t}\n\t.directorist-enquiry-modal-btn-reply {\n\t\t&:hover {\n\t\t\tborder-color: var(--directorist-color-info);\n\t\t\tcolor: var(--directorist-color-info);\n\t\t}\n\t}\n\t.directorist-answers-section {\n\t\tdisplay: flex;\n\t\tgap: 24px;\n\t\tflex-direction: column;\n\t\talign-items: flex-start;\n\t}\n\n\t.formgent-response-badge {\n\t\tbackground-color: var(--directorist-color-light);\n\t\tpadding: 0 8px;\n\t\tcolor: var(--directorist-color-dark);\n\t\tfont-size: 14px;\n\t\tline-height: 1.6;\n\t\tfont-weight: 400;\n\t\tborder-radius: 4px;\n\t}\n\n\t.formgent-response-table__drawer__tab__item {\n\t\tdisplay: flex;\n\t\tgap: 12px;\n\t\twidth: 100%;\n\t\t&.formgent-response-table__drawer__tab__item--tag {\n\t\t\t.formgent-response-table__drawer__tab__item__title {\n\t\t\t\theight: 40px;\n\t\t\t}\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__icon {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\theight: 40px;\n\t\t\twidth: 40px;\n\t\t\tmin-width: 40px;\n\t\t\tborder-radius: 10px;\n\t\t\tcolor: var(--directorist-color-dark);\n\t\t\tbackground-color: var(--directorist-color-light);\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__content {\n\t\t\tdisplay: flex;\n\t\t\tgap: 6px;\n\t\t\tflex-direction: column;\n\t\t\tflex: 1;\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__title {\n\t\t\tdisplay: block;\n\t\t\tfont-size: 15px;\n\t\t\tfont-weight: 600;\n\t\t\tcolor: var(--formgent-color-dark);\n\t\t\tmargin: 0;\n\t\t\t&:first-letter {\n\t\t\t\ttext-transform: uppercase;\n\t\t\t}\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__desc {\n\t\t\tdisplay: flex;\n\t\t\tgap: 5px;\n\t\t\tflex-wrap: wrap;\n\t\t\tfont-size: 14px;\n\t\t\tfont-weight: 400;\n\t\t\tcolor: var(--directorist-color-light-gray);\n\t\t\tmargin: 0;\n\t\t\timg {\n\t\t\t\tmax-width: 200px;\n\t\t\t}\n\t\t\t.formgent-signature-image-preview,\n\t\t\t.formgent-file-upload-preview {\n\t\t\t\twidth: 100%;\n\t\t\t\tmax-width: 350px;\n\t\t\t}\n\t\t\t.formgent-file-upload-answer {\n\t\t\t\tpadding: 8px 0;\n\t\t\t\t&:last-child {\n\t\t\t\t\tborder-bottom: 0 none;\n\t\t\t\t\tpadding-bottom: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__desc__key {\n\t\t\tfont-size: 14px;\n\t\t\tfont-weight: 500;\n\t\t\tdisplay: inline-flex;\n\t\t\tpadding-right: 4px;\n\t\t\t&::first-letter {\n\t\t\t\ttext-transform: uppercase;\n\t\t\t}\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__desc__value {\n\t\t\tfont-size: 14px;\n\t\t\tcolor: var(--directorist-color-light-gray);\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__add {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tbackground: transparent;\n\t\t\tborder: none;\n\t\t\tmargin: 0;\n\t\t\tpadding: 0;\n\t\t\tcursor: pointer;\n\t\t\t&:hover {\n\t\t\t\tcolor: var(--directorist-color-primary);\n\t\t\t}\n\t\t}\n\t\t.formgent-response-table__drawer__tab__item__btns {\n\t\t\tdisplay: flex;\n\t\t\tgap: 8px;\n\t\t\tflex-wrap: wrap;\n\t\t\t.formgent-response-table__drawer__tab__item__btn {\n\t\t\t\tfont-size: 14px;\n\t\t\t\tfont-weight: 500;\n\t\t\t\tpadding: 0 8px;\n\t\t\t\tmargin: 0;\n\t\t\t\theight: 28px;\n\t\t\t\tcolor: var(--directorist-color-gray);\n\t\t\t\tbackground: var(--formgent-color-border);\n\t\t\t\tborder: none;\n\t\t\t\tborder-radius: 8px;\n\t\t\t\tcursor: pointer;\n\t\t\t\ttransition: all ease 0.3s;\n\t\t\t\t&:hover {\n\t\t\t\t\tcolor: var(--formgent-color-white);\n\t\t\t\t\tbackground: var(--formgent-color-light-gray);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n',
]))
);
diff --git a/assets/src/js/formgent-integration/components/EnquiryDetailsModal.js b/assets/src/js/formgent-integration/components/EnquiryDetailsModal.js
index c24f475082..3059c5e5ab 100644
--- a/assets/src/js/formgent-integration/components/EnquiryDetailsModal.js
+++ b/assets/src/js/formgent-integration/components/EnquiryDetailsModal.js
@@ -194,6 +194,9 @@ export default function EnquiryDetailsModal({
getFormattedAnswer
}
ReactSVG={ReactSVG}
+ useState={useState}
+ useEffect={useEffect}
+ isLoadedFromDirectorist={true}
/>
);
}
diff --git a/assets/src/js/formgent-integration/components/style.js b/assets/src/js/formgent-integration/components/style.js
index ca71d506f5..a028f1bf45 100644
--- a/assets/src/js/formgent-integration/components/style.js
+++ b/assets/src/js/formgent-integration/components/style.js
@@ -270,40 +270,32 @@ const EnquiryDetailsModalStyle = styled.div`
font-size: 14px;
font-weight: 400;
}
- .directorist-enquiry-answer-repeater {
- table {
- width: 100%;
- border-collapse: separate;
- border-spacing: 0;
- border-radius: 8px;
- overflow: hidden;
- border: 1px solid #eee;
- }
-
- thead {
- background: linear-gradient(to bottom, #f9f9f9, #f1f3f5);
- }
-
- th {
- text-align: left;
- padding: 12px 16px;
- font-weight: 600;
- font-size: 14px;
- color: #333;
- }
-
- td {
- padding: 12px 16px;
- font-size: 14px;
- color: #000;
- border-top: 1px solid #eee;
- }
-
- /* Hover effect */
- tr:hover td {
- background-color: #fafafa;
+ .directorist-repeater-table-wrapper {
+ max-width: 600px;
+ @media (max-width: 768px) {
+ max-width: 500px;
}
}
+ .formgent-editor-rating {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ margin: 5px 0;
+ }
+ .formgent-editor-rating__icons {
+ display: flex;
+ align-items: center;
+ gap: 5px;
+ }
+ .formgent-editor-rating__icons
+ .formgent-editor-rating__icon--active
+ svg
+ path {
+ fill: var(--directorist-color-primary);
+ }
+ .formgent-google-map-external-link {
+ color: var(--directorist-color-info);
+ }
//stick footer to bottom
.directorist-enquiry-modal-footer {
border-top: 1px solid #e5e7eb;
@@ -372,16 +364,16 @@ const EnquiryDetailsModalStyle = styled.div`
border-radius: 4px;
}
- .response-table__drawer__tab__item {
+ .formgent-response-table__drawer__tab__item {
display: flex;
gap: 12px;
width: 100%;
- &.response-table__drawer__tab__item--tag {
- .response-table__drawer__tab__item__title {
+ &.formgent-response-table__drawer__tab__item--tag {
+ .formgent-response-table__drawer__tab__item__title {
height: 40px;
}
}
- .response-table__drawer__tab__item__icon {
+ .formgent-response-table__drawer__tab__item__icon {
display: flex;
align-items: center;
justify-content: center;
@@ -392,13 +384,13 @@ const EnquiryDetailsModalStyle = styled.div`
color: var(--directorist-color-dark);
background-color: var(--directorist-color-light);
}
- .response-table__drawer__tab__item__content {
+ .formgent-response-table__drawer__tab__item__content {
display: flex;
gap: 6px;
flex-direction: column;
flex: 1;
}
- .response-table__drawer__tab__item__title {
+ .formgent-response-table__drawer__tab__item__title {
display: block;
font-size: 15px;
font-weight: 600;
@@ -408,7 +400,7 @@ const EnquiryDetailsModalStyle = styled.div`
text-transform: uppercase;
}
}
- .response-table__drawer__tab__item__desc {
+ .formgent-response-table__drawer__tab__item__desc {
display: flex;
gap: 5px;
flex-wrap: wrap;
@@ -432,7 +424,7 @@ const EnquiryDetailsModalStyle = styled.div`
}
}
}
- .response-table__drawer__tab__item__desc__key {
+ .formgent-response-table__drawer__tab__item__desc__key {
font-size: 14px;
font-weight: 500;
display: inline-flex;
@@ -441,11 +433,11 @@ const EnquiryDetailsModalStyle = styled.div`
text-transform: uppercase;
}
}
- .response-table__drawer__tab__item__desc__value {
+ .formgent-response-table__drawer__tab__item__desc__value {
font-size: 14px;
color: var(--directorist-color-light-gray);
}
- .response-table__drawer__tab__item__add {
+ .formgent-response-table__drawer__tab__item__add {
display: flex;
align-items: center;
background: transparent;
@@ -457,11 +449,11 @@ const EnquiryDetailsModalStyle = styled.div`
color: var(--directorist-color-primary);
}
}
- .response-table__drawer__tab__item__btns {
+ .formgent-response-table__drawer__tab__item__btns {
display: flex;
gap: 8px;
flex-wrap: wrap;
- .response-table__drawer__tab__item__btn {
+ .formgent-response-table__drawer__tab__item__btn {
font-size: 14px;
font-weight: 500;
padding: 0 8px;
diff --git a/assets/src/js/formgent-integration/index.scss b/assets/src/js/formgent-integration/index.scss
index ee0ecb7d55..618dc6ffda 100644
--- a/assets/src/js/formgent-integration/index.scss
+++ b/assets/src/js/formgent-integration/index.scss
@@ -1,38 +1,22 @@
@import "~@wordpress/dataviews/build-style/style.css";
-// Modal Styles
-.directorist-answers-modal {
- .directorist-modal-content {
- max-height: 70vh;
- overflow-y: auto;
- padding: 20px;
- }
-
- .directorist-enquiry-info {
- margin-bottom: 30px;
- padding-bottom: 20px;
- border-bottom: 1px solid #e0e0e0;
-
- h3 {
- margin: 0 0 15px 0;
- color: #333;
- }
-
- p {
- margin: 8px 0;
- color: #666;
- }
- }
-
- .directorist-answers-section {
- h3 {
- margin: 0 0 20px 0;
- color: #333;
- }
- }
-}
-
.directorist-enquiry-modal {
+ --formgent-color-primary: #5e53f9;
+ --formgent-color-primary-hover: #563dee;
+ --formgent-color-primary-2: #2188ff;
+ --formgent-color-primary-50: #edefff;
+ --formgent-color-primary-100: #dee3ff;
+ --formgent-color-primary-200: #c4cbff;
+ --formgent-color-gray-100: #f3f4f6;
+ --formgent-color-gray-200: #e5e7eb;
+ --formgent-color-gray-300: #d2d6db;
+ --formgent-color-gray-400: #a1a9b2;
+ --formgent-color-gray-500: #747c89;
+ --formgent-color-gray-600: #4d5761;
+ --formgent-color-gray-700: #383f47;
+ --formgent-color-gray-800: #2c3239;
+ --formgent-color-gray-900: #141921;
+
.components-modal__header {
border-bottom: 1px solid #e0e0e0;
}
diff --git a/includes/model/ListingDashboard.php b/includes/model/ListingDashboard.php
index 9f0bf2da79..594b2679ff 100644
--- a/includes/model/ListingDashboard.php
+++ b/includes/model/ListingDashboard.php
@@ -517,6 +517,8 @@ public function render_shortcode( $atts ) {
return $this->restrict_access_template();
}
+ do_action( 'directorist_before_load_dashboard', $atts, $this );
+
return Helper::get_template_contents( 'dashboard-contents', [ 'dashboard' => $this ] );
}