MERMS/MermsPanelReactJS
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

fixed settings page sorting by list order

Browse Source
This commit was merged in pull request #81.
This commit is contained in:
victorAnumudu
2025-09-04 17:46:47 +01:00
parent 599e8a7715
commit f66f92c58d
6 changed files with 37 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/component/product/settingsTab/GeneralTab.jsx
+6 -3
View File
@@ -5,6 +5,7 @@ import SiteTemplateSelector from './SiteTemplateSelector';
import NoYesBooleanDropdown from './NoYesBooleanDropdown';
import {IoMdArrowDropdown} from 'react-icons/io';
import queryKeys from '../../../services/queryKeys';
import sortObjectByListOrder from '../../../helpers/sortObjectByListOrder';
const GeneralTab = memo(({name = 'Full Name', data, isCustom, productData, backendValues, setFieldsChanged}) => {
@@ -27,9 +28,11 @@ const GeneralTab = memo(({name = 'Full Name', data, isCustom, productData, backe
const [fields, setFields] = useState({})
const sortedData = sortObjectByListOrder(data ? data : {}) // SORTED SETTINGSCONFIG
useEffect(() => {
const fieldData = {}
Object.entries(data)?.forEach(([key, value]) => { // LOOP TO POPULATE FIELDDATA PROPERTIES WITH DATA OF EACH TAB
Object.entries(sortedData)?.forEach(([key, value]) => { // LOOP TO POPULATE FIELDDATA PROPERTIES WITH DATA OF EACH TAB
fieldData[value?.name?.toLowerCase().replaceAll(" ", "_")] = ''
})
backendValues?.data?.forEach(item => { //LOOPING THROUGH USER ALREADY ADDED DATA FROM BACKEND IF ANY AND UPDATING THE FIELDDATA OBJECT
@@ -98,7 +101,7 @@ const GeneralTab = memo(({name = 'Full Name', data, isCustom, productData, backe
:
<>
{isCustom === true ?
<SiteTemplateSelector name={name} data={data} isCustom={isCustom}
<SiteTemplateSelector name={name} data={sortedData} isCustom={isCustom}
productData={productData}/>
:
<div className="page-account-form">
@@ -107,7 +110,7 @@ const GeneralTab = memo(({name = 'Full Name', data, isCustom, productData, backe
<form id='tab_form'>
<div className="form-row">
<>
{Object.entries(data)?.map(([key, value]) => {
{Object.entries(sortedData)?.map(([key, value]) => {
let fieldName = key; // value.key.toLowerCase().replaceAll(" ", "_")
let fieldValue = fields[key]; //fields[value.name.toLowerCase().replaceAll(" ", "_")]
return (
src/component/product/settingsTab/Settings.jsx
+6 -3
View File
@@ -4,6 +4,7 @@ import { getSettingsData, getMyProductConfig } from '../../../services/services'
import queryKeys from '../../../services/queryKeys';
import { useSelector } from 'react-redux';
import { useQuery } from '@tanstack/react-query';
import sortObjectByListOrder from '../../../helpers/sortObjectByListOrder'
const Settings = memo(({productData}) => {
@@ -59,6 +60,8 @@ const Settings = memo(({productData}) => {
const settingsData = {data: data?.data?.settings, isFetching, isError, error}
// console.log('data', settingsData)
const sortedSettingsConfig = sortObjectByListOrder(settingsConfig ? settingsConfig : {}) // SORTED SETTINGSCONFIG
return (
<>
{configIsFetching ?
@@ -79,7 +82,7 @@ const Settings = memo(({productData}) => {
<div className="tab tab-vertical">
<ul className="nav nav-tabs" role="tablist">
<>
{Object.entries(settingsConfig).map(([key, value], index) => (
{Object.entries(sortedSettingsConfig).map(([key, value], index) => (
<li key={key} className="nav-item">
<a className={`nav-link ${(activeTab == value.controls || (index == 0 & !activeTab)) && 'active show'}`}
id={key}
@@ -99,7 +102,7 @@ const Settings = memo(({productData}) => {
</ul>
<div className="tab-content">
<>
{Object.entries(settingsConfig).map(([key, value], index) => (
{Object.entries(sortedSettingsConfig).map(([key, value], index) => (
<div key={key} className={`tab-pane fade ${(activeTab == value.controls || (index == 0 & !activeTab)) && 'active show'}`}
// id={value.controls} role="tabpanel"
// aria-labelledby={key}
@@ -116,4 +119,4 @@ const Settings = memo(({productData}) => {
}
)
export default Settings
export default Settings