From 8b21afc871cef94159d784502dab9ed4e1589974 Mon Sep 17 00:00:00 2001 From: Sakshi Gupta Date: Tue, 30 Sep 2025 16:10:24 +0530 Subject: [PATCH] formatting issue resolved --- src/Common/Upload/Upload.tsx | 4 +- .../CollapsibleSectionComponent.tsx | 2 +- .../Controls/Settings/SettingsComponent.tsx | 52 +++++++++---------- .../Controls/Settings/SettingsRenderUtils.tsx | 4 +- .../ComputedPropertiesComponent.tsx | 2 +- .../IndexingPolicyComponent.tsx | 3 +- .../Menus/CommandBar/ThemeToggleButton.tsx | 6 +-- .../AddCollectionPanel/AddCollectionPanel.tsx | 6 +-- .../AddDatabasePanel/AddDatabasePanel.tsx | 6 +-- .../Components/AdvancedComponent.tsx | 10 ++-- .../Panes/LoadQueryPane/LoadQueryPane.tsx | 8 +-- .../Panes/SaveQueryPane/SaveQueryPane.tsx | 12 ++--- .../Panes/SettingsPane/SettingsPane.tsx | 26 ++++------ src/Main.tsx | 10 ++-- 14 files changed, 71 insertions(+), 80 deletions(-) diff --git a/src/Common/Upload/Upload.tsx b/src/Common/Upload/Upload.tsx index 70dfe1930..2f4ac1181 100644 --- a/src/Common/Upload/Upload.tsx +++ b/src/Common/Upload/Upload.tsx @@ -50,7 +50,9 @@ export const Upload: FunctionComponent = ({ const title = label + " to upload"; return (
- {label} + + {label} + {tooltip && {tooltip}} diff --git a/src/Explorer/Controls/CollapsiblePanel/CollapsibleSectionComponent.tsx b/src/Explorer/Controls/CollapsiblePanel/CollapsibleSectionComponent.tsx index 653e4ca23..7d7510626 100644 --- a/src/Explorer/Controls/CollapsiblePanel/CollapsibleSectionComponent.tsx +++ b/src/Explorer/Controls/CollapsiblePanel/CollapsibleSectionComponent.tsx @@ -80,7 +80,7 @@ export class CollapsibleSectionComponent extends React.Component = { }; export const messageBarStyles: Partial = { - root: { - marginTop: "5px", + root: { + marginTop: "5px", backgroundColor: "var(--colorNeutralBackground1)", selectors: { "&.ms-MessageBar--severeWarning": { diff --git a/src/Explorer/Controls/Settings/SettingsSubComponents/ComputedPropertiesComponent.tsx b/src/Explorer/Controls/Settings/SettingsSubComponents/ComputedPropertiesComponent.tsx index cf679dc09..727b9d7f6 100644 --- a/src/Explorer/Controls/Settings/SettingsSubComponents/ComputedPropertiesComponent.tsx +++ b/src/Explorer/Controls/Settings/SettingsSubComponents/ComputedPropertiesComponent.tsx @@ -101,7 +101,7 @@ export class ComputedPropertiesComponent extends React.Component< monaco.editor.setTheme(newTheme); } }); - + const computedPropertiesEditorModel = this.computedPropertiesEditor.getModel(); computedPropertiesEditorModel.onDidChangeContent(this.onEditorContentChange.bind(this)); this.props.logComputedPropertiesSuccessMessage(); diff --git a/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyComponent.tsx b/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyComponent.tsx index d002d0197..ae8dd0001 100644 --- a/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyComponent.tsx +++ b/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyComponent.tsx @@ -112,7 +112,7 @@ export class IndexingPolicyComponent extends React.Component< monaco.editor.setTheme(newTheme); } }); - + const indexingPolicyEditorModel = this.indexingPolicyEditor.getModel(); indexingPolicyEditorModel.onDidChangeContent(this.onEditorContentChange.bind(this)); this.props.logIndexingPolicySuccessMessage(); @@ -120,7 +120,6 @@ export class IndexingPolicyComponent extends React.Component< } } - private onEditorContentChange = (): void => { const indexingPolicyEditorModel = this.indexingPolicyEditor.getModel(); try { diff --git a/src/Explorer/Menus/CommandBar/ThemeToggleButton.tsx b/src/Explorer/Menus/CommandBar/ThemeToggleButton.tsx index 01ed852aa..595e1c0e1 100644 --- a/src/Explorer/Menus/CommandBar/ThemeToggleButton.tsx +++ b/src/Explorer/Menus/CommandBar/ThemeToggleButton.tsx @@ -13,9 +13,9 @@ export const ThemeToggleButton = (): CommandButtonComponentProps => { }); return unsubscribe; }, []); - + const tooltipText = darkMode ? "Switch to Light Theme" : "Switch to Dark Theme"; - + return { iconSrc: darkMode ? SunBlueIcon : MoonBlueIcon, iconAlt: "Theme Toggle", @@ -26,4 +26,4 @@ export const ThemeToggleButton = (): CommandButtonComponentProps => { hasPopup: false, disabled: false, }; -}; \ No newline at end of file +}; diff --git a/src/Explorer/Panes/AddCollectionPanel/AddCollectionPanel.tsx b/src/Explorer/Panes/AddCollectionPanel/AddCollectionPanel.tsx index b70f1f1d9..9d8bfab96 100644 --- a/src/Explorer/Panes/AddCollectionPanel/AddCollectionPanel.tsx +++ b/src/Explorer/Panes/AddCollectionPanel/AddCollectionPanel.tsx @@ -354,9 +354,9 @@ export class AddCollectionPanel extends React.Component, isChecked: boolean) => this.setState({ isSharedThroughputChecked: isChecked }) diff --git a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx index b1e0d50be..e5d26a4a8 100644 --- a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx +++ b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx @@ -229,9 +229,9 @@ export const AddDatabasePanel: FunctionComponent = ({ label: { padding: 0, alignItems: "center" }, root: { selectors: { - ':hover .ms-Checkbox-text': { color: "var(--colorNeutralForeground1)" } - } - } + ":hover .ms-Checkbox-text": { color: "var(--colorNeutralForeground1)" }, + }, + }, }} label="Provision throughput" checked={databaseCreateNewShared} diff --git a/src/Explorer/Panes/AddGlobalSecondaryIndexPanel/Components/AdvancedComponent.tsx b/src/Explorer/Panes/AddGlobalSecondaryIndexPanel/Components/AdvancedComponent.tsx index fee5be42f..28599f565 100644 --- a/src/Explorer/Panes/AddGlobalSecondaryIndexPanel/Components/AdvancedComponent.tsx +++ b/src/Explorer/Panes/AddGlobalSecondaryIndexPanel/Components/AdvancedComponent.tsx @@ -35,11 +35,11 @@ export const AdvancedComponent = (props: AdvancedComponentProps): JSX.Element => text: { fontSize: 12, color: "var(--colorNeutralForeground1)" }, checkbox: { width: 12, height: 12 }, label: { padding: 0, alignItems: "center", wordWrap: "break-word", whiteSpace: "break-spaces" }, - root: { - selectors: { - ':hover .ms-Checkbox-text': { color: "var(--colorNeutralForeground1)" } - } - } + root: { + selectors: { + ":hover .ms-Checkbox-text": { color: "var(--colorNeutralForeground1)" }, + }, + }, }} onChange={(ev: React.FormEvent, isChecked: boolean) => { useHashV1CheckboxOnChange(isChecked); diff --git a/src/Explorer/Panes/LoadQueryPane/LoadQueryPane.tsx b/src/Explorer/Panes/LoadQueryPane/LoadQueryPane.tsx index 3a8dc1ee6..52214c308 100644 --- a/src/Explorer/Panes/LoadQueryPane/LoadQueryPane.tsx +++ b/src/Explorer/Panes/LoadQueryPane/LoadQueryPane.tsx @@ -94,13 +94,13 @@ export const LoadQueryPane: FunctionComponent = (): JSX.Element => { value={selectedFileName} autoFocus readOnly - styles={{ + styles={{ fieldGroup: { width: 300, color: "var(--colorNeutralForeground1)" }, subComponentStyles: { label: { - root: { color: "var(--colorNeutralForeground1)" } - } - } + root: { color: "var(--colorNeutralForeground1)" }, + }, + }, }} />
@@ -1129,8 +1123,8 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({ label="Max degree of parallelism" styles={{ label: { - color: "var(--colorNeutralForeground1)" - } + color: "var(--colorNeutralForeground1)", + }, }} /> @@ -1202,9 +1196,7 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({ checked={copilotSampleDBEnabled} onChange={handleSampleDatabaseChange} onRenderLabel={() => ( - - Enable sample database - + Enable sample database )} /> diff --git a/src/Main.tsx b/src/Main.tsx index 60a30a912..759042688 100644 --- a/src/Main.tsx +++ b/src/Main.tsx @@ -156,14 +156,12 @@ const Root: React.FC = () => { // Use React state to track isDarkMode and subscribe to changes const [isDarkMode, setIsDarkMode] = React.useState(useThemeStore.getState().isDarkMode); const currentTheme = isDarkMode ? webDarkTheme : webLightTheme; - + // Subscribe to theme changes React.useEffect(() => { - return useThemeStore.subscribe( - (state) => { - setIsDarkMode(state.isDarkMode); - } - ); + return useThemeStore.subscribe((state) => { + setIsDarkMode(state.isDarkMode); + }); }, []); useEffect(() => {