From 52e3553aaaacfa2db5c412e764b6710269370da9 Mon Sep 17 00:00:00 2001 From: victorAnumudu Date: Wed, 6 Aug 2025 14:03:03 +0100 Subject: [PATCH] added settings endpoint --- src/component/product/__ProductActive.jsx | 149 ++++++++++++++++++ .../product/settingsTab/GeneralTab.jsx | 53 ++++++- src/services/services.js | 10 ++ 3 files changed, 206 insertions(+), 6 deletions(-) create mode 100644 src/component/product/__ProductActive.jsx diff --git a/src/component/product/__ProductActive.jsx b/src/component/product/__ProductActive.jsx new file mode 100644 index 0000000..23202b2 --- /dev/null +++ b/src/component/product/__ProductActive.jsx @@ -0,0 +1,149 @@ +import React, { useRef, useState } from "react"; +import getImage from "../../utils/getImage"; +import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS"; +import GeneralTab from "./settingsTab/GeneralTab"; +import { useMutation } from "@tanstack/react-query"; +import { productRefreshSite } from "../../services/services"; + + +export default function ProductActive({productData}){ + const iframe = useRef() + + const dataFields ={ + site_title: { name: 'Title', controls: 'TEXT', active: true }, + site_description: { name: 'Description', controls: 'TEXTAREA', active: true }, + site_logo_text: { name: 'Logo Text', controls: 'TEXT', active: true }, + site_contact_email: { name: 'Email', controls: 'TEXT', active: true }, + site_contact_phone: { name: 'Phone', controls: 'TEXT', active: true }, + } + + const socialFields ={ + facebook: { name: 'Facebook', controls: 'TEXT', active: true }, + twitter: { name: 'Twitter', controls: 'TEXT', active: true }, + youtube: { name: 'Youtube', controls: 'TEXT', active: true }, + } + + const homeFields ={ + banner_text: { name: 'Banner Text', controls: 'TEXT', active: true }, + banner_description: { name: 'Banner Description', controls: 'TEXTAREA', active: true }, + } + + const footerFields ={ + footer_description: { name: 'Footer Description', controls: 'TEXTAREA', active: true }, + } + + const aboutFields ={ + about_description: { name: 'About us', controls: 'TEXTAREA', active: true }, + } + + const templateData = { + template_16 : { title: 'Template Name-16', template_id: '02af24fd-2b1a-46ed-af21-87018e726408', banner: 'file-icon/svg.png', active: '' }, + template_22 : { title: 'Template Name-22', template_id: '8b296894-42e4-4f2e-abd1-7c2a38d6e07b', banner: 'file-icon/svg.png', active: '' }, + template_47 : { title: 'Template Name-47', template_id: 'ef2ffa1c-9272-42cd-9d33-0e614047b4f8', banner: 'file-icon/svg.png', active: '' }, + template_25 : { title: 'Template Name-25', template_id: 'b3a7ba31-dc47-4a40-a5cc-fd1ff27d6b78', banner: 'file-icon/svg.png', active: '' }, + template_49 : { title: 'Template Name-49', template_id: '60959c69-6672-4f69-a006-eeb7d210e605', banner: 'file-icon/svg.png', active: '' }, + template_27 : { title: 'Template Name-27', template_id: 'e4acb98a-c584-45f2-bece-af677dcf0a1f', banner: 'file-icon/svg.png', active: '' }, + template_51 : { title: 'Template Name-51', template_id: '975ee42e-3169-4978-92d7-d28e7e2ac014', banner: 'file-icon/svg.png', active: '' }, + template_9 : { title: 'Template Name-9', template_id: 'fc8f0738-6500-4775-9895-2047cd275302', banner: 'file-icon/svg.png', active: '' }, + } + + const settingsObject = { + settings: { title: 'Settings', controls: 'settings', active: 'active show' , custom: false, data: dataFields}, + home_tab: { title: 'Home Page', controls: 'home', active: '', custom: false, data: homeFields}, + footer_tab: { title: 'Footer', controls: 'footer', active: '', custom: false, data: footerFields }, + about_tab: { title: 'About Page', controls: 'about', active: '', custom: false, data: aboutFields }, + contact_tab: { title: 'Contact Page', controls: 'contact', active: '', custom: false, data: {} }, + social_tab: { title: 'Socials', controls: 'social', active: '', custom: false, data: socialFields }, + template_tab: { title: 'Template', controls: 'template', active: '', custom: true, data: templateData }, + color_scheme_tab: { title: 'Color Scheme', controls: 'color-scheme', active: '', custom: true, data: {} }, + }; + + + const [activeTab, setActiveTab] = useState(Object.entries(settingsObject)[0][1]?.controls) + + const refresh = useMutation({ + mutationFn: (fields) => { + return productRefreshSite(fields) + }, + onSuccess: (res) => { + iframe.current.src += '' + } + }) + + const handleRefresh = () => { + const reqData = { + token: localStorage.getItem('token'), // USER TOKEN + uid: localStorage.getItem('uid'), // USER UID + product_id: productData.product_id, + subscription_uid: productData.subscription_uid + } + refresh.mutate(reqData) + } + let externalUrl= 'https://'+productData?.internal_url + + return( + <> +
+ <> +
+
+
+
+
+

{externalUrl}

+ +
+
+
+ +
+
+ +
+
+
+
+
+
+
+

Site Settings

+
+
+
+
+ +
+ <> +
+ +
+ +
+
+
+
+
+
+ +
+ + ) +} \ No newline at end of file diff --git a/src/component/product/settingsTab/GeneralTab.jsx b/src/component/product/settingsTab/GeneralTab.jsx index d982cad..4358384 100644 --- a/src/component/product/settingsTab/GeneralTab.jsx +++ b/src/component/product/settingsTab/GeneralTab.jsx @@ -1,20 +1,54 @@ import React, {memo, useState} from 'react' +import { useMutation } from "@tanstack/react-query"; +import { pageSettings } from "../../../services/services"; import SiteTemplateSelector from './SiteTemplateSelector'; const GeneralTab = memo(({name='Full Name', data, isCustom, productData}) =>{ - console.log("Page data == ", data) + // console.log("Page data == ", data) + + const [reqStatus, setReqStatus] = useState({error: null, message: ''}) const fieldData = {} Object.entries(data)?.forEach(([key, value]) => { // LOOP TO POPULATE FIELDDATA PROPERTIES WITH DATA OF EACH TAB - fieldData[value.name] = '' + fieldData[value?.name?.toLowerCase().replace(" ", "_")] = '' }) const [fields, setFields] = useState(fieldData) const handleChange = ({target:{name, value}}) => { setFields(prev => ({...prev, [name]:value})) } + + const submitSettings = useMutation({ + mutationFn: (fields) => { + return pageSettings(fields) + }, + onSuccess: (res) => { + if(res?.data?.resultCode != '0'){ + return setReqStatus({error: true, message: 'Unable to complete, try again later'}) + } + setReqStatus({error: false, message: 'Completed successfully'}) + }, + onError: (err) => { + setReqStatus({error: true, message: 'Unable to complete, try again later'}) + }, + onSettled: () => { + setTimeout(()=>{ + setReqStatus({error: null, message: ''}) + },3000) + }, + }) + const handleSubmit = () => { - console.log('formInfo', fields) + const reqData = { + token: localStorage.getItem('token'), // USER TOKEN + uid: localStorage.getItem('uid'), // USER UID + product_id: productData?.product_id, + settings : { + ...fields + } + } + // console.log('formInfo', reqData) + submitSettings.mutate(reqData) } if (isCustom === true){ @@ -33,17 +67,24 @@ const GeneralTab = memo(({name='Full Name', data, isCustom, productData}) =>{
{value.controls == 'TEXT' ? - + :value.controls == 'TEXTAREA' ? -