How to preselect checkbox in showQuickPick in vscode - visual-studio-code

Question

I am using quickpick to display list of items and allowing user to do multiselect. I am using quickpick like this.
context.subscriptions.push(vscode.commands.registerCommand('command', async () => {
const list = await vscode.window.showQuickPick(filedsList, { ignoreFocusOut: true, canPickMany: true});
}));
I trying to make like if user previously selected some items in the quick pick and next time use opened this quick pick I want to preselect the previously selected values.
Is it feasible to do it in vscode extension development.

Answer 1

There are two options. In both cases you'll have to make QuickPickItems out of your AccurevOperations.cpkFieldsList as you cannot just pass strings as the first argument and use the pre-selection capability. It isn't difficult to do this, just loop through that AccurevOperations.cpkFieldsList array and create objects with the QuickPickItem properties you want, like:
const arr = ["1", "2", "3"];
// const quickPickItems = arr.map(item => ( { label: item, picked: true } ) ); // but this would select them all
const quickPickItems = arr.map(item => {
if (Number(item) % 2 != 0) return { label: item, picked: true };
else return { label: item }
});
So you would use your logic to set the items you want pre-selected to have the picked:true object property. Then
const options = { canPickMany: true };
const qp = vscode.window.showQuickPick(quickPickItems, options);
should show a QuickPick with your selected items.
The other option is to use the createQuickPick method instead, because with that you can use its selectedItems property. So starting with your array:
const arr = ["1", "2", "3"];
const quickPickItems = arr.map(item => ( { label: item } ) ); // and whatever other properties each item needs, perhaps nothing other than label
const qp = vscode.window.createQuickPick();
qp.canSelectMany = true;
qp.items = quickPickItems;
qp.selectedItems = [quickPickItems[0], quickPickItems[2]]; // your logic here
qp.show();
You will have to create an array of objects to assign to the selectedItems property. Perhaps by filtering the quickPickItems array (from above) for the labels you want pre-selected:
qp.selectedItems = quickPickItems.filter(item => {
return item.label === "1" || item.label === "3";
});

Answer 2

the object vscode::QuickPickItem has a property
picked
Optional flag indicating if this item is picked initially.