fix(Computer): ✨ update selectFirstRowOnMount logic
* Introduce selectFirstRowOnMount to manage row selection on component mount. * Update useEffect dependencies to include selectFirstRowOnMount. * Ensure first row selection logic handles cases where keyField is not defined.
This commit is contained in:
@@ -25,9 +25,10 @@ export const Computer = React.memo(() => {
|
|||||||
scrollToRowKey,
|
scrollToRowKey,
|
||||||
searchStr,
|
searchStr,
|
||||||
selectedRowKey,
|
selectedRowKey,
|
||||||
|
selectFirstRowOnMount,
|
||||||
setState,
|
setState,
|
||||||
setStateFN,
|
setStateFN,
|
||||||
values,
|
values
|
||||||
} = useGridlerStore((s) => ({
|
} = useGridlerStore((s) => ({
|
||||||
_glideref: s._glideref,
|
_glideref: s._glideref,
|
||||||
_gridSelectionRows: s._gridSelectionRows,
|
_gridSelectionRows: s._gridSelectionRows,
|
||||||
@@ -44,6 +45,7 @@ export const Computer = React.memo(() => {
|
|||||||
scrollToRowKey: s.scrollToRowKey,
|
scrollToRowKey: s.scrollToRowKey,
|
||||||
searchStr: s.searchStr,
|
searchStr: s.searchStr,
|
||||||
selectedRowKey: s.selectedRowKey,
|
selectedRowKey: s.selectedRowKey,
|
||||||
|
selectFirstRowOnMount:s.selectFirstRowOnMount,
|
||||||
setState: s.setState,
|
setState: s.setState,
|
||||||
setStateFN: s.setStateFN,
|
setStateFN: s.setStateFN,
|
||||||
uniqueid: s.uniqueid,
|
uniqueid: s.uniqueid,
|
||||||
@@ -268,18 +270,25 @@ export const Computer = React.memo(() => {
|
|||||||
//Logic to select first row on mount
|
//Logic to select first row on mount
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const _events = getState('_events');
|
const _events = getState('_events');
|
||||||
|
|
||||||
const loadPage = () => {
|
const loadPage = () => {
|
||||||
const selectFirstRowOnMount = getState('selectFirstRowOnMount');
|
const selectFirstRowOnMount = getState('selectFirstRowOnMount');
|
||||||
|
const ready = getState('ready');
|
||||||
|
|
||||||
if (ready && selectFirstRowOnMount) {
|
if (ready && selectFirstRowOnMount) {
|
||||||
|
|
||||||
const scrollToRowKey = getState('scrollToRowKey');
|
const scrollToRowKey = getState('scrollToRowKey');
|
||||||
|
|
||||||
|
|
||||||
if (scrollToRowKey && scrollToRowKey >= 0) {
|
if (scrollToRowKey && scrollToRowKey >= 0) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const keyField = getState('keyField') ?? 'id';
|
const keyField = getState('keyField') ?? 'id';
|
||||||
const page_data = getState('_page_data');
|
const page_data = getState('_page_data');
|
||||||
|
|
||||||
const firstBuffer = page_data?.[0]?.[0];
|
const firstBuffer = page_data?.[0]?.[0];
|
||||||
const firstRow = firstBuffer?.[keyField];
|
const firstRow = firstBuffer?.[keyField] ?? -1;
|
||||||
const currentValues = getState('values') ?? [];
|
const currentValues = getState('values') ?? [];
|
||||||
|
|
||||||
if (
|
if (
|
||||||
@@ -290,6 +299,7 @@ export const Computer = React.memo(() => {
|
|||||||
) {
|
) {
|
||||||
const values = [firstBuffer, ...(currentValues as Array<Record<string, unknown>>)];
|
const values = [firstBuffer, ...(currentValues as Array<Record<string, unknown>>)];
|
||||||
|
|
||||||
|
|
||||||
const onChange = getState('onChange');
|
const onChange = getState('onChange');
|
||||||
//console.log('Selecting first row:', firstRow, firstBuffer, values);
|
//console.log('Selecting first row:', firstRow, firstBuffer, values);
|
||||||
if (onChange) {
|
if (onChange) {
|
||||||
@@ -308,7 +318,7 @@ export const Computer = React.memo(() => {
|
|||||||
return () => {
|
return () => {
|
||||||
_events?.removeEventListener('loadPage', loadPage);
|
_events?.removeEventListener('loadPage', loadPage);
|
||||||
};
|
};
|
||||||
}, [ready]);
|
}, [ready, selectFirstRowOnMount]);
|
||||||
|
|
||||||
/// logic to apply the selected row.
|
/// logic to apply the selected row.
|
||||||
// useEffect(() => {
|
// useEffect(() => {
|
||||||
|
|||||||
@@ -36,6 +36,7 @@ function _GlidlerAPIAdaptorForGoLangv2<T = unknown>(props: GlidlerAPIAdaptorForG
|
|||||||
const searchStr = getState('searchStr');
|
const searchStr = getState('searchStr');
|
||||||
const searchFields = getState('searchFields');
|
const searchFields = getState('searchFields');
|
||||||
const _active_requests = getState('_active_requests');
|
const _active_requests = getState('_active_requests');
|
||||||
|
const keyField = getState('keyField');
|
||||||
setState('loadingData', true);
|
setState('loadingData', true);
|
||||||
try {
|
try {
|
||||||
//console.log('APIAdaptorGoLangv2', { _active_requests, index, pageSize, props });
|
//console.log('APIAdaptorGoLangv2', { _active_requests, index, pageSize, props });
|
||||||
@@ -113,6 +114,12 @@ function _GlidlerAPIAdaptorForGoLangv2<T = unknown>(props: GlidlerAPIAdaptorForG
|
|||||||
col_ids?.push(props.hotfields.join(','));
|
col_ids?.push(props.hotfields.join(','));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (keyField) {
|
||||||
|
if (!col_ids.includes(keyField)) {
|
||||||
|
col_ids.push(keyField);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (col_ids && col_ids.length > 0) {
|
if (col_ids && col_ids.length > 0) {
|
||||||
ops.push({
|
ops.push({
|
||||||
type: 'select-fields',
|
type: 'select-fields',
|
||||||
|
|||||||
Reference in New Issue
Block a user