diff --git a/less/Common/Constants.less b/less/Common/Constants.less index 222b13c32..f77e82c8b 100644 --- a/less/Common/Constants.less +++ b/less/Common/Constants.less @@ -248,6 +248,10 @@ outline: 1px dashed @FocusColor; } +.focusedBorder() { + border: 1px dashed @FocusColor; +} + /************************************************************************************************ Common Toggle Switch *************************************************************************************************/ diff --git a/src/Common/Constants.ts b/src/Common/Constants.ts index cca173cb0..0169bf6e9 100644 --- a/src/Common/Constants.ts +++ b/src/Common/Constants.ts @@ -533,6 +533,9 @@ export class ariaLabelForLearnMoreLink { export class MaterializedViewsLabels { public static readonly NewMaterializedView: string = "New Materialized View"; } +export class FeedbackLabels { + public static readonly provideFeedback: string = "Provide feedback"; +} export const QueryCopilotSampleDatabaseId = "CopilotSampleDB"; export const QueryCopilotSampleContainerId = "SampleContainer"; diff --git a/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewSourceComponent.tsx b/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewSourceComponent.tsx index dafbd930c..96fbcf290 100644 --- a/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewSourceComponent.tsx +++ b/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewSourceComponent.tsx @@ -51,7 +51,9 @@ export const MaterializedViewSourceComponent: React.FC { const monacoInstance = await loadMonaco(); - if (disposed || !editorContainerRef.current) return; + if (disposed || !editorContainerRef.current) { + return; + } editorRef.current = monacoInstance.editor.create(editorContainerRef.current, { value: jsonValue, @@ -86,11 +88,7 @@ export const MaterializedViewSourceComponent: React.FC - console.log("Add view clicked")} - /> + {}} /> ); }; diff --git a/src/Explorer/Menus/NotificationConsole/NotificationConsole.less b/src/Explorer/Menus/NotificationConsole/NotificationConsole.less index 2e9413020..a03573a72 100644 --- a/src/Explorer/Menus/NotificationConsole/NotificationConsole.less +++ b/src/Explorer/Menus/NotificationConsole/NotificationConsole.less @@ -36,6 +36,10 @@ &:active { background-color:@NotificationHigh; } + + &:focus { + .focusedBorder(); + } .statusBar { .dataTypeIcons { diff --git a/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx b/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx index 1821fd14c..e2f63926f 100644 --- a/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx +++ b/src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx @@ -81,10 +81,6 @@ export class NotificationConsoleComponent extends React.Component< } } - public setElememntRef = (element: HTMLElement): void => { - this.consoleHeaderElement = element; - }; - public render(): JSX.Element { const numInProgress = this.state.allConsoleData.filter( (data: ConsoleData) => data.type === ConsoleDataType.InProgress, @@ -101,7 +97,9 @@ export class NotificationConsoleComponent extends React.Component<
this.expandCollapseConsole()} onKeyDown={(event: React.KeyboardEvent) => this.onExpandCollapseKeyPress(event)} tabIndex={0} @@ -129,14 +127,7 @@ export class NotificationConsoleComponent extends React.Component<
-
+
{this.props.isConsoleExpanded { - if (this.props.isConsoleExpanded && this.consoleHeaderElement) { - this.consoleHeaderElement.focus(); - } useNotificationConsole.getState().setConsoleAnimationFinished(true); }; diff --git a/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap b/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap index 268b110b0..b2672aeec 100644 --- a/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap +++ b/src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap @@ -5,10 +5,13 @@ exports[`NotificationConsoleComponent renders the console 1`] = ` className="notificationConsoleContainer" >
Expand icon
Expand icon { it("render default panel", () => { - const wrapper: ShallowWrapper = shallow(); + const wrapper: ShallowWrapper = shallow( + , + ); expect(wrapper).toMatchSnapshot(); }); it("should render form", () => { - const wrapper: ShallowWrapper = shallow(); + const wrapper: ShallowWrapper = shallow( + , + ); const form = wrapper.find("form").first(); expect(form).toBeDefined(); }); -}); \ No newline at end of file +}); diff --git a/src/Explorer/QueryCopilot/QueryCopilotPromptbar.tsx b/src/Explorer/QueryCopilot/QueryCopilotPromptbar.tsx index 1582a4335..830eb5196 100644 --- a/src/Explorer/QueryCopilot/QueryCopilotPromptbar.tsx +++ b/src/Explorer/QueryCopilot/QueryCopilotPromptbar.tsx @@ -18,7 +18,7 @@ import { Text, TextField, } from "@fluentui/react"; -import { HttpStatusCodes, NormalizedEventKey } from "Common/Constants"; +import { FeedbackLabels, HttpStatusCodes, NormalizedEventKey } from "Common/Constants"; import { handleError } from "Common/ErrorHandlingUtils"; import QueryError, { QueryErrorSeverity } from "Common/QueryError"; import { createUri } from "Common/UrlUtility"; @@ -579,7 +579,7 @@ export const QueryCopilotPromptbar: React.FC = ({ {userContext.feedbackPolicies?.policyAllowFeedback && ( - Provide feedback + {FeedbackLabels.provideFeedback} {showCallout && !hideFeedbackModalForLikedQueries && ( = ({ { setShowCallout(!likeQuery); @@ -648,8 +649,9 @@ export const QueryCopilotPromptbar: React.FC = ({ /> { let toggleStatusValue = "Unpressed";