random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-03-04 08:57:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Retrieve read and write regions from user context and populate dropdown menu. Update local storage value.

Browse Source 
Need to now connect with updating read region of primary cosmos client.
This commit is contained in:
Craig Boger (from Dev Box) 2024-12-27 17:16:23 -08:00
parent fc9f2ea78b
commit 4e2abfd082
2 changed files with 52 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/Explorer/Panes/SettingsPane/SettingsPane.tsx
View File

@ -8,6 +8,7 @@ import {
DefaultButton,
Dropdown,
IChoiceGroupOption,
IDropdownOption,
ISpinButtonStyles,
IToggleStyles,
Position,
@ -143,6 +144,16 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
? LocalStorageUtility.getEntryString(StorageKey.IsGraphAutoVizDisabled)
: "false",
);
const [readRegion, setReadRegion] = useState<string>(
LocalStorageUtility.hasItem(StorageKey.ReadRegion)
? LocalStorageUtility.getEntryString(StorageKey.ReadRegion)
: userContext?.databaseAccount?.properties?.readLocations?.[0]?.locationName,
);
const [writeRegion, setWriteRegion] = useState<string>(
LocalStorageUtility.hasItem(StorageKey.WriteRegion)
? LocalStorageUtility.getEntryString(StorageKey.WriteRegion)
: userContext?.databaseAccount?.properties?.writeLocations?.[0]?.locationName,
);
const [retryAttempts, setRetryAttempts] = useState<number>(
LocalStorageUtility.hasItem(StorageKey.RetryAttempts)
? LocalStorageUtility.getEntryNumber(StorageKey.RetryAttempts)
@ -180,6 +191,14 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
const shouldShowCrossPartitionOption = userContext.apiType !== "Gremlin";
const shouldShowParallelismOption = userContext.apiType !== "Gremlin";
const shouldShowPriorityLevelOption = PriorityBasedExecutionUtils.isFeatureEnabled();
const readRegionOptions = userContext?.databaseAccount?.properties?.readLocations?.map((location) => ({
key: location.locationName,
text: location.locationName,
}));
const writeRegionOptions = userContext?.databaseAccount?.properties?.writeLocations?.map((location) => ({
key: location.locationName,
text: location.locationName,
}));
const shouldShowCopilotSampleDBOption =
userContext.apiType === "SQL" &&
useQueryCopilot.getState().copilotEnabled &&
@ -265,6 +284,8 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
LocalStorageUtility.setEntryBoolean(StorageKey.RUThresholdEnabled, ruThresholdEnabled);
LocalStorageUtility.setEntryBoolean(StorageKey.QueryTimeoutEnabled, queryTimeoutEnabled);
LocalStorageUtility.setEntryString(StorageKey.ReadRegion, readRegion);
LocalStorageUtility.setEntryString(StorageKey.WriteRegion, writeRegion);
LocalStorageUtility.setEntryNumber(StorageKey.RetryAttempts, retryAttempts);
LocalStorageUtility.setEntryNumber(StorageKey.RetryInterval, retryInterval);
LocalStorageUtility.setEntryNumber(StorageKey.MaxWaitTimeInSeconds, MaxWaitTimeInSeconds);
@ -412,6 +433,16 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
setDefaultQueryResultsView(option.key as SplitterDirection);
};
const handleOnReadRegionOptionChange = (ev: React.FormEvent<HTMLInputElement>, option: IDropdownOption): void => {
// TODO: Region validation?
setReadRegion(option.text);
};
const handleOnWriteRegionOptionChange = (ev: React.FormEvent<HTMLInputElement>, option: IDropdownOption): void => {
// TODO: Region Validation?
setWriteRegion(option.text);
};
const handleOnQueryRetryAttemptsSpinButtonChange = (ev: React.MouseEvent<HTMLElement>, newValue?: string): void => {
const retryAttempts = Number(newValue);
if (!isNaN(retryAttempts)) {
@ -680,22 +711,28 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
<div className={styles.settingsSectionDescription}>
Select region for read and write operations.
</div>
<div>
<span className={styles.subHeader}>Read Region</span>
<InfoTooltip className={styles.headerIcon}>
Changes the account endpoint used to perform read operations.
</InfoTooltip>
</div>
<Dropdown
placeholder="Select Read Region"
options={[
{ key: "West US", text: "West US" },
{ key: "East US", text: "East US" },
{ key: "Central US", text: "Central US" },
]}
placeholder={readRegion}
onChange={handleOnReadRegionOptionChange}
options={readRegionOptions}
styles={{ root: { marginBottom: "10px" } }}
/>
<div>
<span className={styles.subHeader}>Write Region</span>
<InfoTooltip className={styles.headerIcon}>
Changes the account endpoint used to perform write operations.
</InfoTooltip>
</div>
<Dropdown
placeholder="Select Write Region"
options={[
{ key: "West US", text: "West US" },
{ key: "East US", text: "East US" },
{ key: "Central US", text: "Central US" },
]}
styles={{ root: { marginTop: "10px" } }}
placeholder={writeRegion}
onChange={handleOnWriteRegionOptionChange}
options={writeRegionOptions}
/>
</div>
</AccordionPanel>

2
src/Shared/StorageUtility.ts
View File

@ -11,6 +11,8 @@ export enum StorageKey {
RUThreshold,
QueryTimeoutEnabled,
QueryTimeout,
ReadRegion,
WriteRegion,
RetryAttempts,
RetryInterval,
MaxWaitTimeInSeconds,