[Query Copilot] Dropdown hide and buttons disabled in specific occasions (#1534)

Co-authored-by: Predrag Klepic <v-prklepic@microsoft.com>
This commit is contained in:
Predrag Klepic 2023-07-15 00:01:16 +02:00 committed by GitHub
parent fb6eb635c1
commit 53cd78452b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 74 additions and 54 deletions

View File

@ -491,7 +491,7 @@ function createOpenTerminalButton(container: Explorer): CommandButtonComponentPr
onCommandClick: () => container.openNotebookTerminal(ViewModels.TerminalKind.Default), onCommandClick: () => container.openNotebookTerminal(ViewModels.TerminalKind.Default),
commandButtonLabel: label, commandButtonLabel: label,
hasPopup: false, hasPopup: false,
disabled: false, disabled: useSelectedNode.getState().isQueryCopilotCollectionSelected(),
ariaLabel: label, ariaLabel: label,
}; };
} }

View File

@ -246,6 +246,7 @@ export const QueryCopilotTab: React.FC<QueryCopilotTabProps> = ({
commandButtonLabel: executeQueryBtnLabel, commandButtonLabel: executeQueryBtnLabel,
ariaLabel: executeQueryBtnLabel, ariaLabel: executeQueryBtnLabel,
hasPopup: false, hasPopup: false,
disabled: query?.trim() === "",
}; };
const saveQueryBtn = { const saveQueryBtn = {
@ -256,6 +257,7 @@ export const QueryCopilotTab: React.FC<QueryCopilotTabProps> = ({
commandButtonLabel: "Save Query", commandButtonLabel: "Save Query",
ariaLabel: "Save Query", ariaLabel: "Save Query",
hasPopup: false, hasPopup: false,
disabled: query?.trim() === "",
}; };
const samplePromptsBtn = { const samplePromptsBtn = {
@ -393,52 +395,60 @@ export const QueryCopilotTab: React.FC<QueryCopilotTabProps> = ({
))} ))}
</Stack> </Stack>
)} )}
<Text {filteredSuggestedPrompts?.length > 0 && (
style={{ <Stack>
width: "100%", <Text
fontSize: 14, style={{
fontWeight: 600, width: "100%",
color: "#0078D4", fontSize: 14,
marginLeft: 16, fontWeight: 600,
padding: "4px 0", color: "#0078D4",
}} marginLeft: 16,
> padding: "4px 0",
Suggested Prompts }}
</Text> >
{filteredSuggestedPrompts.map((prompt) => ( Suggested Prompts
<DefaultButton </Text>
key={prompt.id} {filteredSuggestedPrompts.map((prompt) => (
onClick={() => { <DefaultButton
setUserPrompt(prompt.text); key={prompt.id}
setShowSamplePrompts(false); onClick={() => {
}} setUserPrompt(prompt.text);
onRenderIcon={() => <Image src={HintIcon} />} setShowSamplePrompts(false);
styles={promptStyles} }}
> onRenderIcon={() => <Image src={HintIcon} />}
{prompt.text} styles={promptStyles}
</DefaultButton> >
))} {prompt.text}
<Separator </DefaultButton>
styles={{ ))}
root: { </Stack>
selectors: { "::before": { background: "#E1DFDD" } }, )}
padding: 0, {(filteredHistories?.length > 0 || filteredSuggestedPrompts?.length > 0) && (
}, <Stack>
}} <Separator
/> styles={{
<Text root: {
style={{ selectors: { "::before": { background: "#E1DFDD" } },
width: "100%", padding: 0,
fontSize: 14, },
marginLeft: 16, }}
padding: "4px 0", />
}} <Text
> style={{
Learn about{" "} width: "100%",
<Link target="_blank" href=""> fontSize: 14,
writing effective prompts marginLeft: 16,
</Link> padding: "4px 0",
</Text> }}
>
Learn about{" "}
<Link target="_blank" href="">
writing effective prompts
</Link>
</Text>
</Stack>
)}
</Stack> </Stack>
</Callout> </Callout>
)} )}

View File

@ -823,7 +823,7 @@ export default class DocumentsTab extends TabsBase {
commandButtonLabel: label, commandButtonLabel: label,
ariaLabel: label, ariaLabel: label,
hasPopup: false, hasPopup: false,
disabled: !this.newDocumentButton.enabled(), disabled: !this.newDocumentButton.enabled() || useSelectedNode.getState().isQueryCopilotCollectionSelected(),
id: "mongoNewDocumentBtn", id: "mongoNewDocumentBtn",
}); });
} }
@ -837,7 +837,8 @@ export default class DocumentsTab extends TabsBase {
commandButtonLabel: label, commandButtonLabel: label,
ariaLabel: label, ariaLabel: label,
hasPopup: false, hasPopup: false,
disabled: !this.saveNewDocumentButton.enabled(), disabled:
!this.saveNewDocumentButton.enabled() || useSelectedNode.getState().isQueryCopilotCollectionSelected(),
}); });
} }
@ -850,7 +851,9 @@ export default class DocumentsTab extends TabsBase {
commandButtonLabel: label, commandButtonLabel: label,
ariaLabel: label, ariaLabel: label,
hasPopup: false, hasPopup: false,
disabled: !this.discardNewDocumentChangesButton.enabled(), disabled:
!this.discardNewDocumentChangesButton.enabled() ||
useSelectedNode.getState().isQueryCopilotCollectionSelected(),
}); });
} }
@ -863,7 +866,8 @@ export default class DocumentsTab extends TabsBase {
commandButtonLabel: label, commandButtonLabel: label,
ariaLabel: label, ariaLabel: label,
hasPopup: false, hasPopup: false,
disabled: !this.saveExistingDocumentButton.enabled(), disabled:
!this.saveExistingDocumentButton.enabled() || useSelectedNode.getState().isQueryCopilotCollectionSelected(),
}); });
} }
@ -876,7 +880,9 @@ export default class DocumentsTab extends TabsBase {
commandButtonLabel: label, commandButtonLabel: label,
ariaLabel: label, ariaLabel: label,
hasPopup: false, hasPopup: false,
disabled: !this.discardExisitingDocumentChangesButton.enabled(), disabled:
!this.discardExisitingDocumentChangesButton.enabled() ||
useSelectedNode.getState().isQueryCopilotCollectionSelected(),
}); });
} }
@ -889,7 +895,9 @@ export default class DocumentsTab extends TabsBase {
commandButtonLabel: label, commandButtonLabel: label,
ariaLabel: label, ariaLabel: label,
hasPopup: false, hasPopup: false,
disabled: !this.deleteExisitingDocumentButton.enabled(), disabled:
!this.deleteExisitingDocumentButton.enabled() ||
useSelectedNode.getState().isQueryCopilotCollectionSelected(),
}); });
} }
@ -933,7 +941,9 @@ export default class DocumentsTab extends TabsBase {
commandButtonLabel: label, commandButtonLabel: label,
ariaLabel: label, ariaLabel: label,
hasPopup: true, hasPopup: true,
disabled: useSelectedNode.getState().isDatabaseNodeOrNoneSelected(), disabled:
useSelectedNode.getState().isDatabaseNodeOrNoneSelected() ||
useSelectedNode.getState().isQueryCopilotCollectionSelected(),
}; };
} }
} }