P1 bugs for copilot (#1689)

* P1 bugs for copilot

* P1 bugs for copilot

* P1 bugs for copilot

* Update branding and AFEC

* Update branding and AFEC

* add timeout for ARM calls

* increase test timeout

* fix formatting

* fix formatting

* fix formatting

* fix formatting

* don't call ARM when connectionstring login
This commit is contained in:
sunghyunkang1111
2023-11-10 16:55:39 -06:00
committed by GitHub
parent 0e124f4881
commit 40b8127a6f
11 changed files with 74 additions and 676 deletions

View File

@@ -1,4 +1,4 @@
import { Checkbox, ChoiceGroup, DefaultButton, IconButton, PrimaryButton, TextField } from "@fluentui/react";
import { Checkbox, DefaultButton, IconButton, PrimaryButton, TextField } from "@fluentui/react";
import Explorer from "Explorer/Explorer";
import { QueryCopilotFeedbackModal } from "Explorer/QueryCopilot/Modal/QueryCopilotFeedbackModal";
import { useCopilotStore } from "Explorer/QueryCopilot/QueryCopilotContext";
@@ -83,42 +83,6 @@ describe("Query Copilot Feedback Modal snapshot test", () => {
expect(wrapper).toMatchSnapshot();
});
it("should record user contact choice no", () => {
const wrapper = shallow(
<QueryCopilotFeedbackModal
explorer={new Explorer()}
databaseId="CopilotUserDb"
containerId="CopilotUserContainer"
mode="User"
/>,
);
const contactAllowed = wrapper.find(ChoiceGroup);
contactAllowed.simulate("change", {}, { key: "no" });
expect(getUserEmail).toHaveBeenCalledTimes(3);
expect(wrapper.find(ChoiceGroup).props().selectedKey).toEqual("no");
expect(wrapper).toMatchSnapshot();
});
it("should record user contact choice yes", () => {
const wrapper = shallow(
<QueryCopilotFeedbackModal
explorer={new Explorer()}
databaseId="CopilotUserDb"
containerId="CopilotUserContainer"
mode="User"
/>,
);
const contactAllowed = wrapper.find(ChoiceGroup);
contactAllowed.simulate("change", {}, { key: "yes" });
expect(getUserEmail).toHaveBeenCalledTimes(4);
expect(wrapper.find(ChoiceGroup).props().selectedKey).toEqual("yes");
expect(wrapper).toMatchSnapshot();
});
it("should not render dont show again button", () => {
const wrapper = shallow(
<QueryCopilotFeedbackModal
@@ -219,7 +183,6 @@ describe("Query Copilot Feedback Modal snapshot test", () => {
generatedQuery: "test query",
userPrompt: "test prompt",
description: "",
contact: getUserEmail(),
},
explorer: explorer,
});

View File

@@ -1,6 +1,5 @@
import {
Checkbox,
ChoiceGroup,
DefaultButton,
IconButton,
Link,
@@ -14,7 +13,6 @@ import Explorer from "Explorer/Explorer";
import { useCopilotStore } from "Explorer/QueryCopilot/QueryCopilotContext";
import { SubmitFeedback } from "Explorer/QueryCopilot/Shared/QueryCopilotClient";
import React from "react";
import { getUserEmail } from "../../../Utils/UserUtils";
export const QueryCopilotFeedbackModal = ({
explorer,
@@ -35,16 +33,14 @@ export const QueryCopilotFeedbackModal = ({
closeFeedbackModal,
setHideFeedbackModalForLikedQueries,
} = useCopilotStore();
const [isContactAllowed, setIsContactAllowed] = React.useState<boolean>(false);
const [description, setDescription] = React.useState<string>("");
const [doNotShowAgainChecked, setDoNotShowAgainChecked] = React.useState<boolean>(false);
const [contact, setContact] = React.useState<string>(getUserEmail());
const handleSubmit = () => {
closeFeedbackModal();
setHideFeedbackModalForLikedQueries(doNotShowAgainChecked);
SubmitFeedback({
params: { generatedQuery, likeQuery, description, userPrompt, contact },
params: { generatedQuery, likeQuery, description, userPrompt },
explorer,
databaseId,
containerId,
@@ -77,30 +73,6 @@ export const QueryCopilotFeedbackModal = ({
defaultValue={generatedQuery}
readOnly
/>
<ChoiceGroup
styles={{
root: {
marginBottom: 14,
},
flexContainer: {
selectors: {
".ms-ChoiceField-field::before": { marginTop: 4 },
".ms-ChoiceField-field::after": { marginTop: 4 },
".ms-ChoiceFieldLabel": { paddingLeft: 6 },
},
},
}}
label="May we contact you about your feedback?"
options={[
{ key: "yes", text: "Yes, you may contact me." },
{ key: "no", text: "No, do not contact me." },
]}
selectedKey={isContactAllowed ? "yes" : "no"}
onChange={(_, option) => {
setIsContactAllowed(option.key === "yes");
setContact(option.key === "yes" ? getUserEmail() : "");
}}
></ChoiceGroup>
<Text style={{ fontSize: 12, marginBottom: 14 }}>
By pressing submit, your feedback will be used to improve Microsoft products and services. Please see the{" "}
{

View File

@@ -1,7 +1,6 @@
.modalContentPadding {
padding-top: 15px;
width: 513px;
height: 638px;
}
.exitPadding {
@@ -39,7 +38,7 @@
}
.buttonPadding {
padding: 15px 0px 0px 0px;
padding: 15px 0px 15px 0px;
}
.tryButton {

View File

@@ -23,7 +23,7 @@ export const WelcomeModal = ({ visible }: { visible: boolean }): JSX.Element =>
isBlocking={false}
styles={{
main: {
maxHeight: 530,
maxHeight: 600,
borderRadius: 10,
overflow: "hidden",
},
@@ -53,7 +53,7 @@ export const WelcomeModal = ({ visible }: { visible: boolean }): JSX.Element =>
</Stack>
<Stack horizontalAlign="center">
<Stack.Item align="center" style={{ textAlign: "center" }}>
<Text className="title bold">Welcome to Copilot in Azure Cosmos DB</Text>
<Text className="title bold">Welcome to Microsoft Copilot for Azure in Cosmos DB (preview)</Text>
</Stack.Item>
<Stack.Item align="center" className="text">
<Stack horizontal>

View File

@@ -76,43 +76,6 @@ exports[`Query Copilot Feedback Modal snapshot test shoud render and match snaps
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
@@ -235,43 +198,6 @@ exports[`Query Copilot Feedback Modal snapshot test should cancel submission 1`]
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
@@ -394,43 +320,6 @@ exports[`Query Copilot Feedback Modal snapshot test should close on cancel click
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
@@ -553,43 +442,6 @@ exports[`Query Copilot Feedback Modal snapshot test should get user unput 1`] =
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
@@ -712,361 +564,6 @@ exports[`Query Copilot Feedback Modal snapshot test should not render dont show
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
"fontSize": 12,
"marginBottom": 14,
}
}
>
By pressing submit, your feedback will be used to improve Microsoft products and services. Please see the
<StyledLinkBase
href="https://privacy.microsoft.com/privacystatement"
target="_blank"
>
Privacy statement
</StyledLinkBase>
for more information.
</Text>
<Stack
horizontal={true}
horizontalAlign="end"
>
<CustomizedPrimaryButton
styles={
Object {
"root": Object {
"marginRight": 8,
},
}
}
type="submit"
>
Submit
</CustomizedPrimaryButton>
<CustomizedDefaultButton
onClick={[Function]}
>
Cancel
</CustomizedDefaultButton>
</Stack>
</Stack>
</form>
</Modal>
`;
exports[`Query Copilot Feedback Modal snapshot test should record user contact choice no 1`] = `
<Modal
isOpen={false}
>
<form
onSubmit={[Function]}
>
<Stack
style={
Object {
"padding": 24,
}
}
>
<Stack
horizontal={true}
horizontalAlign="space-between"
>
<Text
style={
Object {
"fontSize": 20,
"fontWeight": 600,
"marginBottom": 20,
}
}
>
Send feedback to Microsoft
</Text>
<CustomizedIconButton
iconProps={
Object {
"iconName": "Cancel",
}
}
onClick={[Function]}
/>
</Stack>
<Text
style={
Object {
"fontSize": 14,
"marginBottom": 14,
}
}
>
Your feedback will help improve the experience.
</Text>
<StyledTextFieldBase
label="Description"
multiline={true}
onChange={[Function]}
placeholder="Provide more details"
required={true}
rows={3}
styles={
Object {
"root": Object {
"marginBottom": 14,
},
}
}
value=""
/>
<StyledTextFieldBase
defaultValue="test query"
label="Query generated"
readOnly={true}
styles={
Object {
"root": Object {
"marginBottom": 14,
},
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
"fontSize": 12,
"marginBottom": 14,
}
}
>
By pressing submit, your feedback will be used to improve Microsoft products and services. Please see the
<StyledLinkBase
href="https://privacy.microsoft.com/privacystatement"
target="_blank"
>
Privacy statement
</StyledLinkBase>
for more information.
</Text>
<Stack
horizontal={true}
horizontalAlign="end"
>
<CustomizedPrimaryButton
styles={
Object {
"root": Object {
"marginRight": 8,
},
}
}
type="submit"
>
Submit
</CustomizedPrimaryButton>
<CustomizedDefaultButton
onClick={[Function]}
>
Cancel
</CustomizedDefaultButton>
</Stack>
</Stack>
</form>
</Modal>
`;
exports[`Query Copilot Feedback Modal snapshot test should record user contact choice yes 1`] = `
<Modal
isOpen={false}
>
<form
onSubmit={[Function]}
>
<Stack
style={
Object {
"padding": 24,
}
}
>
<Stack
horizontal={true}
horizontalAlign="space-between"
>
<Text
style={
Object {
"fontSize": 20,
"fontWeight": 600,
"marginBottom": 20,
}
}
>
Send feedback to Microsoft
</Text>
<CustomizedIconButton
iconProps={
Object {
"iconName": "Cancel",
}
}
onClick={[Function]}
/>
</Stack>
<Text
style={
Object {
"fontSize": 14,
"marginBottom": 14,
}
}
>
Your feedback will help improve the experience.
</Text>
<StyledTextFieldBase
label="Description"
multiline={true}
onChange={[Function]}
placeholder="Provide more details"
required={true}
rows={3}
styles={
Object {
"root": Object {
"marginBottom": 14,
},
}
}
value=""
/>
<StyledTextFieldBase
defaultValue="test query"
label="Query generated"
readOnly={true}
styles={
Object {
"root": Object {
"marginBottom": 14,
},
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="yes"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
@@ -1189,43 +686,6 @@ exports[`Query Copilot Feedback Modal snapshot test should render dont show agai
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {
@@ -1363,43 +823,6 @@ exports[`Query Copilot Feedback Modal snapshot test should submit submission 1`]
}
}
/>
<StyledChoiceGroup
label="May we contact you about your feedback?"
onChange={[Function]}
options={
Array [
Object {
"key": "yes",
"text": "Yes, you may contact me.",
},
Object {
"key": "no",
"text": "No, do not contact me.",
},
]
}
selectedKey="no"
styles={
Object {
"flexContainer": Object {
"selectors": Object {
".ms-ChoiceField-field::after": Object {
"marginTop": 4,
},
".ms-ChoiceField-field::before": Object {
"marginTop": 4,
},
".ms-ChoiceFieldLabel": Object {
"paddingLeft": 6,
},
},
},
"root": Object {
"marginBottom": 14,
},
}
}
/>
<Text
style={
Object {

View File

@@ -10,7 +10,7 @@ exports[`Query Copilot Welcome Modal snapshot test should render when isOpen is
Object {
"main": Object {
"borderRadius": 10,
"maxHeight": 530,
"maxHeight": 600,
"overflow": "hidden",
},
}
@@ -78,7 +78,7 @@ exports[`Query Copilot Welcome Modal snapshot test should render when isOpen is
<Text
className="title bold"
>
Welcome to Copilot in Azure Cosmos DB
Welcome to Microsoft Copilot for Azure in Cosmos DB (preview)
</Text>
</StackItem>
<StackItem