added contact us structure for sending data to backend

.env

@@ -1,13 +1,16 @@
 APP_PORT=8091
 ESLINT_NO_DEV_ERRORS=true
-PANEL_URL=https://dev-panel.mermsemr.com
+PANEL_URL=https://panel.mermsemr.com
 
 # auth routes
-NEXT_PUBLIC_LOGIN_URL=https://dev-panel.mermsemr.com
-NEXT_PUBLIC_SIGNUP_URL=https://dev-panel.mermsemr.com/auth/signup
+NEXT_PUBLIC_LOGIN_URL=https://panel.mermsemr.com
+NEXT_PUBLIC_SIGNUP_URL=https://panel.mermsemr.com/auth/signup
 
 # social links
 NEXT_PUBLIC_FACEBOOK_URL=https://www.facebook.com/people/Mermsemr/100066498622246/
 NEXT_PUBLIC_TWITTER_URL=#
 NEXT_PUBLIC_INSTAGRAM_URL=#
-NEXT_PUBLIC_YOUTUBE_URL=#
+NEXT_PUBLIC_YOUTUBE_URL=#
+
+#forum
+NEXT_SITE_FORUM=https://forum.automedsys.ai/

.env.development

@@ -10,4 +10,7 @@ NEXT_PUBLIC_SIGNUP_URL=https://dev-panel.mermsemr.com/auth/signup
 NEXT_PUBLIC_FACEBOOK_URL=https://www.facebook.com/people/Mermsemr/100066498622246/
 NEXT_PUBLIC_TWITTER_URL=#
 NEXT_PUBLIC_INSTAGRAM_URL=#
-NEXT_PUBLIC_YOUTUBE_URL=#
+NEXT_PUBLIC_YOUTUBE_URL=#
+
+#forum
+NEXT_SITE_FORUM=https://forum.automedsys.ai/

.env.local

@@ -10,4 +10,7 @@ NEXT_PUBLIC_SIGNUP_URL=https://panel.mermsemr.com/auth/signup
 NEXT_PUBLIC_FACEBOOK_URL=https://www.facebook.com/people/Mermsemr/100066498622246/
 NEXT_PUBLIC_TWITTER_URL=#
 NEXT_PUBLIC_INSTAGRAM_URL=#
-NEXT_PUBLIC_YOUTUBE_URL=#
+NEXT_PUBLIC_YOUTUBE_URL=#
+
+#forum
+NEXT_SITE_FORUM=https://forum.automedsys.ai/

.env.production

@@ -0,0 +1,16 @@
+APP_PORT=8091
+ESLINT_NO_DEV_ERRORS=true
+PANEL_URL=https://panel.mermsemr.com
+
+# auth routes
+NEXT_PUBLIC_LOGIN_URL=https://panel.mermsemr.com
+NEXT_PUBLIC_SIGNUP_URL=https://panel.mermsemr.com/auth/signup
+
+# social links
+NEXT_PUBLIC_FACEBOOK_URL=https://www.facebook.com/people/Mermsemr/100066498622246/
+NEXT_PUBLIC_TWITTER_URL=#
+NEXT_PUBLIC_INSTAGRAM_URL=#
+NEXT_PUBLIC_YOUTUBE_URL=#
+
+#forum
+NEXT_SITE_FORUM=https://forum.automedsys.ai/

.env.test

@@ -10,4 +10,7 @@ NEXT_PUBLIC_SIGNUP_URL=https://qa-panel.mermsemr.com/auth/signup
 NEXT_PUBLIC_FACEBOOK_URL=https://www.facebook.com/people/Mermsemr/100066498622246/
 NEXT_PUBLIC_TWITTER_URL=#
 NEXT_PUBLIC_INSTAGRAM_URL=#
-NEXT_PUBLIC_YOUTUBE_URL=#
+NEXT_PUBLIC_YOUTUBE_URL=#
+
+#forum
+NEXT_SITE_FORUM=https://forum.automedsys.ai/

README.md

@@ -0,0 +1,34 @@
+# MermsWebsite2025
+
+## Running
+
+### Development
+
+Docker:
+```
+NODE_ENV=development docker compose --env-file .env.development up -d
+```
+Direct:
+```
+NODE_ENV=development npm run dev
+```
+### QA
+
+Docker:
+```
+NODE_ENV=test docker compose --env-file .env.test up -d
+```
+Direct:
+```
+NODE_ENV=test npm run dev
+```
+### Production
+
+Docker:
+```
+NODE_ENV=live docker compose --env-file .env up -d
+```
+Direct:
+```
+NODE_ENV=live npm run dev
+```

components/layout/Menu.js

@@ -9,15 +9,15 @@ export default function Menu() {
       <ul className="wsmenu-list nav-theme">
         {/* DROPDOWN SUB MENU */}
         <li aria-haspopup="true">
-          <Link href="#" className="h-link">
+          <Link href="/#" className="h-link">
             About <span className="wsarrow" />
           </Link>
           <ul className="sub-menu">
             <li aria-haspopup="true">
-              <Link href="#merms-about">Why MERMS?</Link>
+              <Link href="/#merms-about">Why MERMS?</Link>
             </li>
             <li aria-haspopup="true">
-              <Link href="#merms-works">How It Works</Link>
+              <Link href="/#merms-works">How It Works</Link>
             </li>
             <li aria-haspopup="true">
               <Link href="/contacts">Contacts Us</Link>
@@ -33,6 +33,13 @@ export default function Menu() {
             Features
           </Link>
         </li>
+
+        <li className="nl-simple" aria-haspopup="true">
+          <Link href="/merms-blog" className="h-link">
+            Forum
+          </Link>
+        </li>
+
         <li
           className="nl-simple reg-fst-link mobile-last-link"
           aria-haspopup="true"

components/layout/footer/MermsFooter.js

@@ -23,18 +23,24 @@ export default function MermsFooter() {
                             <div className="col-6 col-sm-4 col-md-4 col-xl-4">
                                 <div className="footer-links fl-1">
                                     {/* Title */}
-                                    <h6 className="s-17 w-700">Company</h6>
+                                    <h6 className="s-17 w-700">Site</h6>
                                     {/* Links */}
                                     <ul className="foo-links clearfix">
+                                        <li>
+                                            <p><Link href="/">Home</Link></p>
+                                        </li>
                                         <li>
                                             <p><Link href="/about">About Us</Link></p>
                                         </li>
                                         <li>
-                                            <p><Link href="/contacts">Contact Us</Link></p>
+                                            <p><Link href="/merms-blog">Use Cases</Link></p>
                                         </li>
                                         <li>
-                                            <p><Link href="/merms-blog">Our Blog</Link></p>
+                                            <p><Link href="/contacts">Contact Us</Link></p>
                                         </li>
+                                        {/*<li>*/}
+                                        {/*    <p><Link href="/merms-blog">Our Blog</Link></p>*/}
+                                        {/*</li>*/}
                                     </ul>
                                 </div>
                             </div> {/* END FOOTER LINKS */}
@@ -42,9 +48,11 @@ export default function MermsFooter() {
                             <div className="col-6 col-sm-4 col-md-4 col-xl-4">
                                 <div className="footer-links fl-2">
                                     {/* Title */}
-                                    <h6 className="s-17 w-700">Product</h6>
+                                    <h6 className="s-17 w-700">Resources</h6>
                                     {/* Links */}
                                     <ul className="foo-links clearfix1">
+
+
                                         <li>
                                             <p><Link href="/features">Features</Link></p>
                                         </li>
@@ -57,6 +65,9 @@ export default function MermsFooter() {
                                         <li>
                                             <p><Link href="/help-center">Help Center</Link></p>
                                         </li>
+                                        <li>
+                                            <p><Link href="https://forum.automedsys.ai/">Our Forum</Link></p>
+                                        </li>
                                     </ul>
                                 </div>
                             </div> {/* END FOOTER LINKS */}

components/sections/MersmHero.js

@@ -11,11 +11,11 @@ export default function MersmHero() {
                         <div className="col-md-5">
                             <div className="hero-13-txt wow fadeInRight">
                                 {/* Section ID */}
-                                <span className="section-id">Online Reputation That Work</span>
+                                {/*<span className="section-id">Online Reputation That Work</span>*/}
                                 {/* Title */}
-                                <h2 className="s-54 w-700">Your practice’s reputation is strategic for your success</h2>
+                                <h2 className="s-54 w-700">Supercharge Your Practice Efficiency with MERMS AI Agent Today!</h2>
                                 {/* Text */}
-                                <p className="p-lg">In the digital age, your online reputation has to work for you for your practice to be effective and create trust.
+                                <p className="p-lg">Streamline workflows across practice with powerful AI agents. Build and deploy automated workflows with ease.
                                 </p>
                                 {/* Button */}
                                 <Link href={process.env.NEXT_PUBLIC_SIGNUP_URL} className="btn r-04 btn--theme hover--tra-black">Get started for free</Link>

components/services/services.js

@@ -0,0 +1,61 @@
+import axios from "axios"
+
+
+axios.interceptors.request.use(
+    config => {
+        config.headers = {
+            Accept: "application/json",
+            "Access-Control-Allow-Origin": "*",
+            // "Access-Control-Expose-Headers": "Access-Control-Allow-Origin",
+            // "Access-Control-Allow-Headers": "Origin, X-API-KEY, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method, Access-Control-Allow-Headers, Authorization, observe, enctype, Content-Length, X-Csrf-Token",
+            // "Content-Type": "application/json;charset=UTF-8",
+            // 'Authorization': (localStorage && localStorage.getItem('access_token')) ? `Bearer ${localStorage.getItem('access_token')}` : '',
+          };
+    // config.headers['Authorization'] = `Bearer ${localStorage.getItem('token')}`;
+    // config.baseURL = process.env.REACT_APP_MAIN_API
+        return config;
+    },
+    error => {
+        return Promise.reject(error);
+    }
+);
+
+const postAuxEnd = (path, postData, media=false) => {
+    const basePath = media ? 'https://blogdata.chiefsoft.net' : 'https://blogdata.chiefsoft.net'
+    let newPostData = {}
+    if(!media){
+        newPostData = {...postData}
+    }else{
+        newPostData = new FormData();
+        for (let data in postData) {
+        newPostData.append(data, postData[data]);
+        }
+    }
+    return axios.post(`${basePath}${path}`, newPostData).then(res => {
+        return res
+    }).catch(err => {
+        // throw new Error(err.response.data.error_message);
+        throw new Error(err);
+    })
+}
+
+const getAuxEnd = (path, reqData= null) => {
+    const basePath = 'https://blogdata.chiefsoft.net'
+    return axios.get(`${basePath}${path}`,{ params: reqData }).then(res => {
+        return res
+        // localStorage.clear();
+        // window.location.href = `/login?sessionExpired=true`;
+    }).catch(err => {
+        throw new Error(err);
+        // throw new Error(err.response.data.message);
+        // return err
+    })
+}
+
+// FUNCTION TO GET MERMS BLOGS
+export const getMermsBlogs = (reqData) => {
+    let postData = {
+        ...reqData
+    }
+    return getAuxEnd('/mermsblogdata/mermsemr', postData, false)
+}

docker-compose.yml

@@ -20,5 +20,7 @@ services:
       - backend.wrenchboard.api.test:10.10.33.15
     tty: true
     stdin_open: true
+    environment:
+      - NODE_ENV=${NODE_ENV:-live}
 volumes:
   src:

docker-entrypoint.sh

@@ -1,6 +1,7 @@
 #!/bin/sh
 set -e
 
+echo "NODE_ENV=$NODE_ENV"
 # Run command with node if the first argument contains a "-" or is not a system command. The last
 # part inside the "{}" is a workaround for the following bug in ash/dash:
 # https://bugs.debian.org/cgi-bin/bugreport.cgi?bug=874264
@@ -8,4 +9,4 @@ if [ "${1#-}" != "${1}" ] || [ -z "$(command -v "${1}")" ] || { [ -f "${1}" ] &&
   set -- node "$@"
 fi
 
-exec "$@"
+exec "$@"

package.json

@@ -12,8 +12,10 @@
     },
     "dependencies": {
         "@tanstack/react-query": "^5.62.16",
+        "axios": "^1.13.2",
         "eslint": "8.41.0",
         "eslint-config-next": "13.4.3",
+        "formik": "^2.4.9",
         "next": "^13.5.8",
         "react": "18.2.0",
         "react-dom": "18.2.0",
@@ -21,6 +23,7 @@
         "sass": "^1.62.1",
         "server-only": "^0.0.1",
         "swiper": "^10.0.4",
-        "wowjs": "^1.1.3"
+        "wowjs": "^1.1.3",
+        "yup": "^1.7.1"
     }
 }

pages/contacts.js

@@ -1,7 +1,49 @@
+import { useMutation } from '@tanstack/react-query';
 import Layout from "../components/layout/Layout"
 import Link from "next/link"
+import { Form, Formik } from 'formik';
+import * as Yup from "yup";
 export default function Home() {
 
+    const validationSchema = Yup.object().shape({
+        subject: Yup.string().required("Required"),
+        name: Yup.string().required("Required"),
+        email: Yup.string().required("Required"),
+        message: Yup.string().required("Required"),
+    })
+
+    const initialValues = {
+        subject: '',
+        name: '',
+        email: '',
+        message: ''
+    };
+
+    const contactMutation = useMutation({
+        mutationFn: (fields) => {
+            return null //completePWDReset(fields)
+        },
+        onSuccess: (res) => {
+            if(res?.data?.resultCode != '0'){
+                throw({message: res?.data?.resultDescription})
+            }
+        },
+        // onError: (err) => {
+        //     console.log('err', err)
+        // }
+  })
+  
+  const handleContactMutation = (values) => {
+    let reqData = {
+        ...values
+    }
+    console.log(reqData)
+    setTimeout(()=>{
+        contactMutation.reset()
+    },3000)
+    // contactMutation.mutate(reqData)
+  }
+
     return (
         <>
             <Layout headerStyle={1} footerStyle={3} headerCls="navbar-dark inner-page-header">
@@ -25,52 +67,68 @@ export default function Home() {
                             <div className="row justify-content-center">
                                 <div className="col-md-11 col-lg-10 col-xl-8">
                                     <div className="form-holder">
-                                        <form name="contactform" className="row contact-form">
-                                            {/* Form Select */}
-                                            <div className="col-md-12 input-subject">
-                                                <p className="p-lg">This question is about: </p>
-                                                <span>Choose a topic, so we know who to send your request to: </span>
-                                                <select className="form-select subject" aria-label="Default select example">
-                                                    <option>This question is about...</option>
-                                                    <option>Registering/Authorising</option>
-                                                    <option>Using Application</option>
-                                                    <option>Troubleshooting</option>
-                                                    <option>Backup/Restore</option>
-                                                    <option>Other</option>
-                                                </select>
-                                            </div>
-                                            {/* Contact Form Input */}
-                                            <div className="col-md-12">
-                                                <p className="p-lg">Your Name: </p>
-                                                <span>Please enter your real name: </span>
-                                                <input type="text" name="name" className="form-control name" placeholder="Your Name*" />
-                                            </div>
-                                            <div className="col-md-12">
-                                                <p className="p-lg">Your Email Address: </p>
-                                                <span>Please carefully check your email address for accuracy</span>
-                                                <input type="text" name="email" className="form-control email" placeholder="Email Address*" />
-                                            </div>
-                                            <div className="col-md-12">
-                                                <p className="p-lg">Explain your question in details: </p>
-                                                <span>Your OS version, MERMS version &amp; build, steps you did. Be VERY precise!</span>
-                                                <textarea className="form-control message" name="message" rows={6} placeholder="I have a problem with..." />
-                                            </div>
-                                            {/* Contact Form Button */}
-                                            <div className="col-md-12 mt-15 form-btn text-right">
-                                                <button type="submit" className="btn btn--theme hover--theme submit">Submit Request</button>
-                                            </div>
-                                            <div className="contact-form-notice">
-                                                <p className="p-sm">We are committed to your privacy. MERMS uses the information you
-                                                    provide us to contact you about our relevant content, products, and services.
-                                                    You may unsubscribe from these communications at any time. For more information,
-                                                    check out our <Link href="/privacy">Privacy Policy</Link>.
-                                                </p>
-                                            </div>
-                                            {/* Contact Form Message */}
-                                            <div className="col-lg-12 contact-form-msg">
-                                                <span className="loading" />
-                                            </div>
-                                        </form>
+                                        <Formik
+                                            initialValues={initialValues}
+                                            validationSchema={validationSchema}
+                                            onSubmit={handleContactMutation}
+                                        >
+                                            {(props) => {
+                                            return (
+                                                <Form name="contactform" className="row contact-form">
+                                                    {/* Form Select */}
+                                                    <div className="col-md-12 input-subject">
+                                                        <p className="p-lg">This question is about:{(props.errors.subject && props.touched.subject) && <span style={{display: 'inline'}} className='text-danger'>{props.errors.subject}</span>}</p>
+                                                        <span>Choose a topic, so we know who to send your request to: </span>
+                                                        <select name='subject' onChange={props.handleChange} className="form-select subject" aria-label="Default select example">
+                                                            <option value=''>This question is about...</option>
+                                                            <option value='registering/authorising'>Registering/Authorising</option>
+                                                            <option value='using application'>Using Application</option>
+                                                            <option value='troubleshooting'>Troubleshooting</option>
+                                                            <option value='backup/restore'>Backup/Restore</option>
+                                                            <option value='others'>Other</option>
+                                                        </select>
+                                                    </div>
+                                                    {/* Contact Form Input */}
+                                                    <div className="col-md-12">
+                                                        <p className="p-lg">Your Name:{(props.errors.name && props.touched.name) && <span style={{display: 'inline'}} className='text-danger'>{props.errors.name}</span>}</p>
+                                                        <span>Please enter your real name: </span>
+                                                        <input type="text" onChange={props.handleChange} name="name" className="form-control name" placeholder="Your Name*" />
+                                                    </div>
+                                                    <div className="col-md-12">
+                                                        <p className="p-lg">Your Email Address:{(props.errors.email && props.touched.email) && <span style={{display: 'inline'}} className='text-danger'>{props.errors.email}</span>}</p>
+                                                        <span>Please carefully check your email address for accuracy</span>
+                                                        <input type="text" onChange={props.handleChange} name="email" className="form-control email" placeholder="Email Address*" />
+                                                    </div>
+                                                    <div className="col-md-12">
+                                                        <p className="p-lg">Explain your question in details:{(props.errors.message && props.touched.message) && <span style={{display: 'inline'}} className='text-danger'>{props.errors.message}</span>}</p>
+                                                        <span>Your OS version, MERMS version &amp; build, steps you did. Be VERY precise!</span>
+                                                        <textarea onChange={props.handleChange} className="form-control message" name="message" rows={6} placeholder="I have a problem with..." />
+                                                    </div>
+                                                    {/* Contact Form Button */}
+                                                    <div className="col-md-12 mt-15 form-btn text-right">
+                                                        <button 
+                                                            type="submit" 
+                                                            className="btn btn--theme hover--theme submit"
+                                                            disabled={contactMutation.isPending || contactMutation.isSuccess}
+                                                        >
+                                                           {contactMutation.isPending ? 'Sending' : contactMutation.isSuccess ? 'Message Sent' : 'Submit Request'}
+                                                        </button>
+                                                    </div>
+                                                    <div className="contact-form-notice">
+                                                        <p className="p-sm">We are committed to your privacy. MERMS uses the information you
+                                                            provide us to contact you about our relevant content, products, and services.
+                                                            You may unsubscribe from these communications at any time. For more information,
+                                                            check out our <Link href="/privacy">Privacy Policy</Link>.
+                                                        </p>
+                                                    </div>
+                                                    {/* Contact Form Message */}
+                                                    <div className="col-lg-12 contact-form-msg">
+                                                        <span className="loading" />
+                                                    </div>
+                                                </Form>
+                                            );
+                                            }}
+                                        </Formik>
                                     </div>
                                 </div>
                             </div>	   {/* END CONTACT FORM */}

pages/help-center.js

@@ -1,6 +1,6 @@
 import Layout from "../components/layout/Layout"
 import Link from "next/link"
-import { useState } from "react"
+import {useState} from "react"
 
 const tabs = [
     {name: 'Getting Started', icon: 'flaticon-mechanics'},
@@ -10,25 +10,41 @@ const tabs = [
 ]
 
 const tabContents = {
-    'Getting Started' : [
-            {title: 'What is MERMS, and how does it work?', desc: `MERMS operates on a cloud-based model, allowing users to access the software from anywhere, at any time. By leveraging advanced technology, MERMS streamlines processes, enhances collaboration, and provides real-time data analytics. This system automates routine tasks, enabling teams to focus on more strategic initiatives.`},
-            {title: 'What can I do with MERMS?', desc: `With MERMS, users can manage projects, track budgets, oversee inventory, and collaborate across different departments. Whether you're in finance, marketing, or operations, MERMS offers customizable solutions to cater to your specific needs. Not only can you streamline processes, but you can also improve decision-making with data-driven insights.`},
-            {title: 'Which Product and Tools does MERMS support?', desc: `MERMS supports a wide array of tools, including CRM systems, project management software, and financial applications. It integrates seamlessly with popular platforms like Slack, Microsoft Teams, and Google Workspace, allowing for a comprehensive management experience without losing functionality.`},
-            {title: 'Can I Automate with MERMS?', desc: `Yes! MERMS offers robust automation capabilities. Users can set up automated workflows for routine tasks, such as reporting, notifications, and data entry, minimizing human error and saving valuable time. This feature enhances productivity, making it easier for organizations to scale and adapt to changing needs.`}
-        ],
+    'Getting Started': [
+        {
+            title: 'What is MERMS, and how does it work?',
+            desc: `MERMS operates on a cloud-based model, allowing users to access the software from anywhere, at any time. By leveraging advanced technology, MERMS streamlines processes, enhances collaboration, and provides real-time data analytics. This system automates routine tasks, enabling teams to focus on more strategic initiatives.`
+        },
+        {
+            title: 'What can I do with MERMS?',
+            desc: `With MERMS, users can manage projects, track budgets, oversee inventory, and collaborate across different departments. Whether you're in finance, marketing, or operations, MERMS offers customizable solutions to cater to your specific needs. Not only can you streamline processes, but you can also improve decision-making with data-driven insights.`
+        },
+        {
+            title: 'Which Product and Tools does MERMS support?',
+            desc: `MERMS supports a wide array of tools, including CRM systems, project management software, and financial applications. It integrates seamlessly with popular platforms like Slack, Microsoft Teams, and Google Workspace, allowing for a comprehensive management experience without losing functionality.`
+        },
+        {
+            title: 'Can I Automate with MERMS?',
+            desc: `Yes! MERMS offers robust automation capabilities. Users can set up automated workflows for routine tasks, such as reporting, notifications, and data entry, minimizing human error and saving valuable time. This feature enhances productivity, making it easier for organizations to scale and adapt to changing needs.`
+        }
+    ],
 
     'My Account': [
-            {title: 'Sign up and manage your account', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
-        ],
+        {title: 'Sign up and manage your account', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
+    ],
 
     'Pricing Plans': [
-            {title: 'How much does MERMS cost?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
-        ],
+        {title: 'How much does MERMS cost?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
+    ],
 
     'Other Questions': [
-            {title: 'How do I get the error log?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
-        ]
-    
+        {
+            title: 'How do I get a custom solution from MERMS?',
+            desc: `Simply contact our product team and describe your need. We will engage to understand and help reach your objectives.`
+        },
+        {title: 'How do I get the error log?', desc: `Curabitur ac dapibus libero eu congue tristique neque.`},
+    ]
+
 }
 
 export default function Home() {
@@ -75,33 +91,40 @@ export default function Home() {
                                     <div className="tabs-nav tabs--theme clearfix">
                                         <ul className="tabs-1">
                                             {/* TAB-1 LINK */}
-                                            {tabs.map((tab, index)=>(
-                                                <li key={index} className={activeTab?.name === tab?.name ? "tab-link ico-45 r-16 current" : "tab-link ico-45 r-16"} onClick={() => handleOnClick(tab)}>
-                                                    <div className="tab-link-ico"><span className={tab.icon} /></div>
+                                            {tabs.map((tab, index) => (
+                                                <li key={index}
+                                                    className={activeTab?.name === tab?.name ? "tab-link ico-45 r-16 current" : "tab-link ico-45 r-16"}
+                                                    onClick={() => handleOnClick(tab)}>
+                                                    <div className="tab-link-ico"><span className={tab.icon}/></div>
                                                     <p>{tab.name}</p>
                                                 </li>
                                             ))}
                                         </ul>
                                     </div>
                                 </div>
-                            </div>	{/* END TABS NAVIGATION */}
+                            </div>
+                            {/* END TABS NAVIGATION */}
                             {/* TABS CONTENT */}
                             <div className="tabs-content">
                                 <div className="row justify-content-center">
                                     <div className="col-xl-10">
                                         {/* CONTENT */}
-                                        {tabs.map((tab, index)=>(
-                                            <div key={index} id="tab-1" className={activeTab?.name === tab?.name ? "tab-content current" : "tab-content "}>
+                                        {tabs.map((tab, index) => (
+                                            <div key={index} id="tab-1"
+                                                 className={activeTab?.name === tab?.name ? "tab-content current" : "tab-content "}>
                                                 <div className="accordion-wrapper">
                                                     <ul className="accordion">
-                                                        {tabContents[activeTab.name]?.map((content, index)=>(
-                                                            <li key={index} className={isActive.key == index ? "accordion-item is-active" : "accordion-item"} onClick={() => handleToggle(index)}>
+                                                        {tabContents[activeTab.name]?.map((content, index) => (
+                                                            <li key={index}
+                                                                className={isActive.key == index ? "accordion-item is-active" : "accordion-item"}
+                                                                onClick={() => handleToggle(index)}>
                                                                 {/* Question */}
                                                                 <div className="accordion-thumb">
                                                                     <h5 className="s-22 w-700">{content?.title}</h5>
                                                                 </div>
                                                                 {/* Answer */}
-                                                                <div className="accordion-panel color--grey" style={{ display: `${isActive.key == index ? "block" : "none"}` }}>
+                                                                <div className="accordion-panel color--grey"
+                                                                     style={{display: `${isActive.key == index ? "block" : "none"}`}}>
                                                                     {/* Text */}
                                                                     <p>{content?.desc}</p>
                                                                 </div>
@@ -113,10 +136,14 @@ export default function Home() {
                                         ))}
                                         {/* END OF CONTENT */}
                                     </div>
-                                </div> {/* End row */}
-                            </div>	{/* END TABS CONTENT */}
-                        </div>     {/* End container */}
-                    </section>	{/* END  FAQs-4 */}
+                                </div>
+                                {/* End row */}
+                            </div>
+                            {/* END TABS CONTENT */}
+                        </div>
+                        {/* End container */}
+                    </section>
+                    {/* END  FAQs-4 */}
                     {/* BANNER-9
 			============================================= */}
                     <section id="banner-9" className="bg--02 py-70 x-border banner-section">
@@ -130,20 +157,25 @@ export default function Home() {
                                             {/* Title */}
                                             <h3 className="s-40 w-700">Still need help?</h3>
                                             {/* Text */}
-                                            <p className="p-lg">Don't hesitate to contact us about any question you might be interested in</p>
+                                            <p className="p-lg">Don't hesitate to contact us about any question you
+                                                might be interested in</p>
                                             {/* Button */}
-                                            <Link href="/contacts" className="btn r-04 btn--theme hover--theme">Ask your question here</Link>
+                                            <Link href="/contacts" className="btn r-04 btn--theme hover--theme">Ask your
+                                                question here</Link>
                                         </div>
                                     </div>
                                     {/* BANNER-9 IMAGE */}
                                     <div className="col-md-5 col-xl-5">
                                         <div className="banner-9-img text-end">
-                                            <img className="img-fluid" src="/images/help.png" alt="banner-image" />
+                                            <img className="img-fluid" src="/images/help.png" alt="banner-image"/>
                                         </div>
                                     </div>
-                                </div>     {/* End row */}
-                            </div>    {/* END BANNER-9 WRAPPER */}
-                        </div>     {/* End container */}
+                                </div>
+                                {/* End row */}
+                            </div>
+                            {/* END BANNER-9 WRAPPER */}
+                        </div>
+                        {/* End container */}
                     </section>
                 </div>
 

pages/merms-blog.js

@@ -5,11 +5,14 @@ import Layout from "../components/layout/Layout"
 import Link from "next/link"
 import queryKeys from "../components/queryclientProvider/queryKeys";
 import MermsBlogFix from "../components/sections/MermsBlogFix";
+import { getMermsBlogs } from "../components/services/services";
 
 export default  function Home() {
 
     const {data, isFetching, isError, error} = useQuery({
         queryKey: queryKeys.blog,
+        // queryFn: () => getMermsBlogs(),
+        staleTime: 0,
         queryFn: async () => {
             try {
                 const blog_url = 'https://blogdata.chiefsoft.net/mermsblogdata/mermsemr';
@@ -136,7 +139,7 @@ export default  function Home() {
                                             {/* END BLOG POST #1 */}
                                         </div>
                                     </div>	{/* END POSTS WRAPPER */}
-                                    <MermsBlogFix />
+                                    {/*<MermsBlogFix />*/}
                                 </>
                                 :
                                 <div className="">