All the issues are fixed reported in #7884

* Show the icon for the 'Reset' button. (Reference #7884)

* Reload the server list after connecting to a server in the 'New
connection' dialog (QueryTool). (Reference: #7884)

* Pass the grid path during the bulk update (click on a radio action)

* Don't assign the cell value to the 'rowValue' variable.
This commit is contained in:
Ashesh Vashi
2024-09-11 12:21:41 +05:30
committed by GitHub
parent d3d1eb3355
commit e21911b1c6
4 changed files with 96 additions and 65 deletions

View File

@@ -27,7 +27,7 @@ export function getMappedCell({field}) {
const [key, setKey] = useState(0); const [key, setKey] = useState(0);
const schemaState = useContext(SchemaStateContext); const schemaState = useContext(SchemaStateContext);
const { dataDispatch } = useContext(DataGridContext); const { dataDispatch, accessPath } = useContext(DataGridContext);
const { rowAccessPath, row } = useContext(DataGridRowContext); const { rowAccessPath, row } = useContext(DataGridRowContext);
const colAccessPath = schemaState.accessPath(rowAccessPath, field.id); const colAccessPath = schemaState.accessPath(rowAccessPath, field.id);
@@ -44,7 +44,6 @@ export function getMappedCell({field}) {
colOptions = { disabled: true, readonly: true }; colOptions = { disabled: true, readonly: true };
} else { } else {
colOptions['readonly'] = !colOptions['editable']; colOptions['readonly'] = !colOptions['editable'];
rowValue = value;
} }
let cellProps = {}; let cellProps = {};
@@ -70,7 +69,7 @@ export function getMappedCell({field}) {
if(field.radioType) { if(field.radioType) {
dataDispatch({ dataDispatch({
type: SCHEMA_STATE_ACTIONS.BULK_UPDATE, type: SCHEMA_STATE_ACTIONS.BULK_UPDATE,
path: rowAccessPath, path: accessPath,
value: changeValue, value: changeValue,
id: field.id id: field.id
}); });

View File

@@ -13,7 +13,7 @@ import { DefaultButton } from 'sources/components/Buttons';
import { SchemaStateContext } from './SchemaState'; import { SchemaStateContext } from './SchemaState';
export function ResetButton({label, Icon, onClick}) { export function ResetButton({label, icon, onClick}) {
const [key, setKey] = useState(0); const [key, setKey] = useState(0);
const schemaState = useContext(SchemaStateContext); const schemaState = useContext(SchemaStateContext);
const checkDisabled = (state) => (state.isSaving || !state.isDirty); const checkDisabled = (state) => (state.isSaving || !state.isDirty);
@@ -33,7 +33,7 @@ export function ResetButton({label, Icon, onClick}) {
return ( return (
<DefaultButton <DefaultButton
data-test='Reset' onClick={onClick} data-test='Reset' onClick={onClick}
startIcon={Icon} startIcon={icon}
disabled={isDisabled} disabled={isDisabled}
className='Dialog-buttonMargin'> className='Dialog-buttonMargin'>
{ label } { label }

View File

@@ -27,6 +27,7 @@ export default class BaseUISchema {
this._state = null; this._state = null;
this._id = Date.now(); this._id = Date.now();
this._dynamicFields = false;
} }
/* Top schema is helpful if this is used as child */ /* Top schema is helpful if this is used as child */
@@ -96,9 +97,8 @@ export default class BaseUISchema {
*/ */
get fields() { get fields() {
if (!this.__filteredFields) { if (!this.__filteredFields) {
// Memoize the results const getFields = (baseFields, keys, filterGroups) => baseFields.filter(
this.__filteredFields = memoizeFn( (field) => {
(baseFields, keys, filterGroups) => baseFields.filter((field) => {
let retval; let retval;
// If any groups are to be filtered. // If any groups are to be filtered.
@@ -110,8 +110,12 @@ export default class BaseUISchema {
} }
return retval; return retval;
}) }
); );
// Memoize the results (if required)
this.__filteredFields =
this._dynamicFields ? getFields : memoizeFn(getFields);
} }
return this.__filteredFields( return this.__filteredFields(

View File

@@ -18,7 +18,10 @@ class NewConnectionSchema extends BaseUISchema {
role: null, role: null,
server_name: null, server_name: null,
database_name: null, database_name: null,
connected: false,
}); });
// Regenerate the fields on every render.
this._dynamicFields = true;
this.flatServers = []; this.flatServers = [];
this.groupedServers = []; this.groupedServers = [];
this.dbs = []; this.dbs = [];
@@ -41,7 +44,7 @@ class NewConnectionSchema extends BaseUISchema {
} }
isServerConnected(sid) { isServerConnected(sid) {
return _.find(this.flatServers, (s)=>s.value==sid)?.connected; return _.find(this.flatServers, (s) => s.value == sid)?.connected;
} }
getServerList() { getServerList() {
@@ -106,16 +109,21 @@ class NewConnectionSchema extends BaseUISchema {
let self = this; let self = this;
return [ return [
{ {
id: 'sid', label: gettext('Server'), type: 'select', noEmpty: true, id: 'sid', label: gettext('Server'), deps: ['connected'],
controlProps: { noEmpty: true,
allowClear: false, controlProps: { allowClear: false },
}, options: ()=>this.getServerList(), type: () => ({
optionsLoaded: (res)=>this.flatServers=flattenSelectOptions(res), type: 'select',
optionsReloadBasis: this.flatServers.map((s)=>s.connected).join(''), options: () => self.getServerList(),
optionsLoaded: (res) => self.flatServers = flattenSelectOptions(res),
optionsReloadBasis: self.flatServers.map((s) => s.connected).join(''),
}),
depChange: (state)=>{ depChange: (state)=>{
/* Once the option is selected get the name */ /* Once the option is selected get the name */
/* Force sid to null, and set only if connected */ /* Force sid to null, and set only if connected */
let selectedServer = _.find(this.flatServers, (s)=>s.value==state.sid); let selectedServer = _.find(
self.flatServers, (s) => s.value == state.sid
);
return { return {
server_name: selectedServer?.label, server_name: selectedServer?.label,
did: null, did: null,
@@ -124,62 +132,74 @@ class NewConnectionSchema extends BaseUISchema {
sid: null, sid: null,
fgcolor: selectedServer?.fgcolor, fgcolor: selectedServer?.fgcolor,
bgcolor: selectedServer?.bgcolor, bgcolor: selectedServer?.bgcolor,
connected: selectedServer?.connected,
}; };
}, },
deferredDepChange: (state, source, topState, actionObj)=>{ deferredDepChange: (state, source, topState, actionObj) => {
return new Promise((resolve)=>{ return new Promise((resolve) => {
let sid = actionObj.value; let sid = actionObj.value;
if(!_.find(this.flatServers, (s)=>s.value==sid)?.connected) { if(!_.find(self.flatServers, (s) => s.value == sid)?.connected) {
this.connectServer(sid, state.user, null, (data)=>{ this.connectServer(sid, state.user, null, (data) => {
self.setServerConnected(sid, data.icon); self.setServerConnected(sid, data.icon);
resolve(()=>({sid: sid})); resolve(() => ({ sid: sid, connected: true }));
}); });
} else { } else {
resolve(()=>({sid: sid})); resolve(()=>({ sid: sid, connected: true }));
} }
}); });
}, },
}, { }, {
id: 'did', label: gettext('Database'), deps: ['sid'], noEmpty: true, id: 'did', label: gettext('Database'), deps: ['sid', 'connected'],
noEmpty: true,
controlProps: { controlProps: {
allowClear: false, allowClear: false,
}, },
type: (state)=>({ type: (state) => {
type: 'select', return {
options: ()=>this.getOtherOptions(state.sid, 'get_new_connection_database'), type: 'select',
optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`, options: () => this.getOtherOptions(
}), state.sid, 'get_new_connection_database'
optionsLoaded: (res)=>this.dbs=res, ),
depChange: (state)=>{ optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`,
};
},
optionsLoaded: (res) => this.dbs = res,
depChange: (state) => {
/* Once the option is selected get the name */ /* Once the option is selected get the name */
return {database_name: _.find(this.dbs, (s)=>s.value==state.did)?.label}; return {
database_name: _.find(this.dbs, (s) => s.value == state.did)?.label
};
} }
},{ }, {
id: 'user', label: gettext('User'), deps: ['sid'], noEmpty: true, id: 'user', label: gettext('User'), deps: ['sid', 'connected'],
controlProps: { noEmpty: true, controlProps: { allowClear: false },
allowClear: false, type: (state) => ({
},
type: (state)=>({
type: 'select', type: 'select',
options: ()=>this.getOtherOptions(state.sid, 'get_new_connection_user'), options: () => this.getOtherOptions(
state.sid, 'get_new_connection_user'
),
optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`, optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`,
}), }),
},{ }, {
id: 'role', label: gettext('Role'), deps: ['sid'], id: 'role', label: gettext('Role'), deps: ['sid', 'connected'],
type: (state)=>({ type: (state)=>({
type: 'select', type: 'select',
options: ()=>this.getOtherOptions(state.sid, 'get_new_connection_role'), options: () => this.getOtherOptions(
state.sid, 'get_new_connection_role'
),
optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`, optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`,
}), }),
},{ }, {
id: 'server_name', label: '', type: 'text', visible: false, id: 'server_name', label: '', type: 'text', visible: false,
},{ }, {
id: 'database_name', label: '', type: 'text', visible: false, id: 'database_name', label: '', type: 'text', visible: false,
},{ }, {
id: 'bgcolor', label: '', type: 'text', visible: false, id: 'bgcolor', label: '', type: 'text', visible: false,
},{ }, {
id: 'fgcolor', label: '', type: 'text', visible: false, id: 'fgcolor', label: '', type: 'text', visible: false,
}, }, {
id: 'connected', label: '', type: 'text', visible: false,
}
]; ];
} }
} }
@@ -189,7 +209,6 @@ export default function NewConnectionDialog({onClose, onSave}) {
const [connecting, setConnecting] = useState(false); const [connecting, setConnecting] = useState(false);
const queryToolCtx = React.useContext(QueryToolContext); const queryToolCtx = React.useContext(QueryToolContext);
const connectServer = async (sid, user, formData, connectCallback) => { const connectServer = async (sid, user, formData, connectCallback) => {
setConnecting(true); setConnecting(true);
try { try {
@@ -223,25 +242,34 @@ export default function NewConnectionDialog({onClose, onSave}) {
}); });
} }
}; };
const schema = React.useRef(null);
return <SchemaView if (!schema.current)
formType={'dialog'} schema.current = new NewConnectionSchema(queryToolCtx.api, {
getInitData={()=>Promise.resolve({})}
schema={new NewConnectionSchema(queryToolCtx.api, {
sid: queryToolCtx.params.sid, sgid: 0, sid: queryToolCtx.params.sid, sgid: 0,
}, connectServer)} }, connectServer);
viewHelperProps={{
mode: 'create', return <>
}} {
loadingText={connecting ? 'Connecting...' : ''} schema.current &&
onSave={onSave} <SchemaView
onClose={onClose} formType={'dialog'}
hasSQL={false} getInitData={()=>Promise.resolve({})}
disableSqlHelp={true} schema={schema.current}
disableDialogHelp={true} viewHelperProps={{
isTabView={false} mode: 'create',
Notifier={queryToolCtx.modal} }}
/>; loadingText={connecting ? 'Connecting...' : ''}
onSave={onSave}
onClose={onClose}
hasSQL={false}
disableSqlHelp={true}
disableDialogHelp={true}
isTabView={false}
Notifier={queryToolCtx.modal}
/>
}
</>;
} }
NewConnectionDialog.propTypes = { NewConnectionDialog.propTypes = {