mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2025-10-13 23:38:45 +01:00
refresh part is fixed
This commit is contained in:
Archie Agarwal
parent
d7130b4332
commit
ab1f515613
3
.vscode/settings.json
vendored
3
.vscode/settings.json
vendored
@ -27,5 +27,8 @@
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode",
|
||||
"[typescriptreact]": {
|
||||
"editor.defaultFormatter": "vscode.typescript-language-features"
|
||||
},
|
||||
"[typescript]": {
|
||||
"editor.defaultFormatter": "vscode.typescript-language-features"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import { IPivotItemProps, IPivotProps, Pivot, PivotItem } from "@fluentui/react";
|
||||
import { readCollection } from "Common/dataAccess/readCollection";
|
||||
import {
|
||||
ComputedPropertiesComponent,
|
||||
ComputedPropertiesComponentProps,
|
||||
@ -11,6 +12,7 @@ import {
|
||||
ThroughputBucketsComponent,
|
||||
ThroughputBucketsComponentProps,
|
||||
} from "Explorer/Controls/Settings/SettingsSubComponents/ThroughputInputComponents/ThroughputBucketsComponent";
|
||||
import { useIndexingPolicyStore } from "Explorer/Tabs/QueryTab/ResultsView";
|
||||
import { useDatabases } from "Explorer/useDatabases";
|
||||
import { isFabricNative } from "Platform/Fabric/FabricUtil";
|
||||
import { isVectorSearchEnabled } from "Utils/CapabilityUtils";
|
||||
@ -70,7 +72,6 @@ import {
|
||||
parseConflictResolutionMode,
|
||||
parseConflictResolutionProcedure,
|
||||
} from "./SettingsUtils";
|
||||
|
||||
interface SettingsV2TabInfo {
|
||||
tab: SettingsV2TabTypes;
|
||||
content: JSX.Element;
|
||||
@ -173,7 +174,7 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
private totalThroughputUsed: number;
|
||||
private throughputBucketsEnabled: boolean;
|
||||
public mongoDBCollectionResource: MongoDBCollectionResource;
|
||||
|
||||
private unsubscribe: () => void;
|
||||
constructor(props: SettingsComponentProps) {
|
||||
super(props);
|
||||
|
||||
@ -303,8 +304,13 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
if (this.props.settingsTab.isActive()) {
|
||||
useCommandBar.getState().setContextButtons(this.getTabsButtons());
|
||||
}
|
||||
this.unsubscribe = useIndexingPolicyStore.subscribe((state) => {
|
||||
this.refreshCollectionData();
|
||||
});
|
||||
}
|
||||
componentWillUnmount(): void {
|
||||
if (this.unsubscribe) this.unsubscribe();
|
||||
}
|
||||
|
||||
componentDidUpdate(): void {
|
||||
if (this.props.settingsTab.isActive()) {
|
||||
useCommandBar.getState().setContextButtons(this.getTabsButtons());
|
||||
@ -777,7 +783,6 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
{ name: "name_of_property", query: "query_to_compute_property" },
|
||||
] as DataModels.ComputedProperties;
|
||||
}
|
||||
|
||||
const throughputBuckets = this.offer?.throughputBuckets;
|
||||
|
||||
return {
|
||||
@ -852,9 +857,8 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
const numberOfRegions = userContext.databaseAccount?.properties.locations?.length || 1;
|
||||
const throughputDelta = (newThroughput - this.offer.autoscaleMaxThroughput) * numberOfRegions;
|
||||
if (throughputCap && throughputCap !== -1 && throughputCap - this.totalThroughputUsed < throughputDelta) {
|
||||
throughputError = `Your account is currently configured with a total throughput limit of ${throughputCap} RU/s. This update isn't possible because it would increase the total throughput to ${
|
||||
this.totalThroughputUsed + throughputDelta
|
||||
} RU/s. Change total throughput limit in cost management.`;
|
||||
throughputError = `Your account is currently configured with a total throughput limit of ${throughputCap} RU/s. This update isn't possible because it would increase the total throughput to ${this.totalThroughputUsed + throughputDelta
|
||||
} RU/s. Change total throughput limit in cost management.`;
|
||||
}
|
||||
this.setState({ autoPilotThroughput: newThroughput, throughputError });
|
||||
};
|
||||
@ -865,9 +869,8 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
const numberOfRegions = userContext.databaseAccount?.properties.locations?.length || 1;
|
||||
const throughputDelta = (newThroughput - this.offer.manualThroughput) * numberOfRegions;
|
||||
if (throughputCap && throughputCap !== -1 && throughputCap - this.totalThroughputUsed < throughputDelta) {
|
||||
throughputError = `Your account is currently configured with a total throughput limit of ${throughputCap} RU/s. This update isn't possible because it would increase the total throughput to ${
|
||||
this.totalThroughputUsed + throughputDelta
|
||||
} RU/s. Change total throughput limit in cost management.`;
|
||||
throughputError = `Your account is currently configured with a total throughput limit of ${throughputCap} RU/s. This update isn't possible because it would increase the total throughput to ${this.totalThroughputUsed + throughputDelta
|
||||
} RU/s. Change total throughput limit in cost management.`;
|
||||
}
|
||||
this.setState({ throughput: newThroughput, throughputError });
|
||||
};
|
||||
@ -929,10 +932,20 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
startKey,
|
||||
);
|
||||
};
|
||||
|
||||
private refreshCollectionData = async (): Promise<void> => {
|
||||
// Fetch the latest collection data from backend
|
||||
const latestCollection = await readCollection(this.collection.databaseId, this.collection.id());
|
||||
// Update the observable and state
|
||||
this.collection.rawDataModel = latestCollection;
|
||||
this.collection.indexingPolicy(latestCollection.indexingPolicy);
|
||||
console.log("Fetched latest indexing policy:", latestCollection.indexingPolicy);
|
||||
this.setState({
|
||||
indexingPolicyContent: latestCollection.indexingPolicy,
|
||||
indexingPolicyContentBaseline: latestCollection.indexingPolicy,
|
||||
});
|
||||
};
|
||||
private saveCollectionSettings = async (startKey: number): Promise<void> => {
|
||||
const newCollection: DataModels.Collection = { ...this.collection.rawDataModel };
|
||||
|
||||
if (
|
||||
this.state.isSubSettingsSaveable ||
|
||||
this.state.isContainerPolicyDirty ||
|
||||
@ -966,8 +979,8 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
newCollection.changeFeedPolicy =
|
||||
this.changeFeedPolicyVisible && this.state.changeFeedPolicy === ChangeFeedPolicyState.On
|
||||
? {
|
||||
retentionDuration: Constants.BackendDefaults.maxChangeFeedRetentionDuration,
|
||||
}
|
||||
retentionDuration: Constants.BackendDefaults.maxChangeFeedRetentionDuration,
|
||||
}
|
||||
: undefined;
|
||||
|
||||
newCollection.analyticalStorageTtl = this.getAnalyticalStorageTtl();
|
||||
@ -1128,6 +1141,7 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
},
|
||||
startKey,
|
||||
);
|
||||
// console.log("coll", newCollection.indexingPolicy);
|
||||
};
|
||||
|
||||
public getMongoIndexTabContent = (
|
||||
@ -1161,7 +1175,7 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
|
||||
onScaleDiscardableChange: this.onScaleDiscardableChange,
|
||||
throughputError: this.state.throughputError,
|
||||
};
|
||||
|
||||
// console.log("Rendering IndexingPolicyComponent with:", this.state.indexingPolicyContent); // <-- Add this
|
||||
if (!this.isCollectionSettingsTab) {
|
||||
return (
|
||||
<div className="settingsV2MainContainer">
|
||||
|
||||
@ -33,7 +33,7 @@ export class IndexingPolicyComponent extends React.Component<
|
||||
private shouldCheckComponentIsDirty = true;
|
||||
private indexingPolicyDiv = React.createRef<HTMLDivElement>();
|
||||
private indexingPolicyEditor: monaco.editor.IStandaloneCodeEditor;
|
||||
|
||||
private unsubscribeFromStore: () => void;
|
||||
constructor(props: IndexingPolicyComponentProps) {
|
||||
super(props);
|
||||
this.state = {
|
||||
@ -42,6 +42,7 @@ export class IndexingPolicyComponent extends React.Component<
|
||||
}
|
||||
|
||||
componentDidUpdate(): void {
|
||||
// const { indexingPolicy } = useIndexingPolicyStore.getState();
|
||||
if (this.props.shouldDiscardIndexingPolicy) {
|
||||
this.resetIndexingPolicyEditor();
|
||||
this.props.resetShouldDiscardIndexingPolicy();
|
||||
@ -50,6 +51,7 @@ export class IndexingPolicyComponent extends React.Component<
|
||||
}
|
||||
|
||||
componentDidMount(): void {
|
||||
// const { indexingPolicy, baselinePolicy } = useIndexingPolicyStore.getState();
|
||||
this.resetIndexingPolicyEditor();
|
||||
this.onComponentUpdate();
|
||||
}
|
||||
@ -74,16 +76,16 @@ export class IndexingPolicyComponent extends React.Component<
|
||||
this.shouldCheckComponentIsDirty = true;
|
||||
return;
|
||||
}
|
||||
// const isDirtyState = isDirty(storeIndexingPolicy, this.props.indexingPolicyContentBaseline);
|
||||
// this.props.onIndexingPolicyDirtyChange(isDirtyState && this.state.indexingPolicyContentIsValid);
|
||||
// this.shouldCheckComponentIsDirty = false;
|
||||
this.props.onIndexingPolicyDirtyChange(this.IsComponentDirty());
|
||||
this.shouldCheckComponentIsDirty = false;
|
||||
};
|
||||
|
||||
public IsComponentDirty = (): boolean => {
|
||||
const { indexingPolicy, baselinePolicy } = useIndexingPolicyStore.getState();
|
||||
// const { policies, baselines } = useIndexingPolicyStore.getState();
|
||||
// const { containerId } = useQueryMetadataStore();
|
||||
if (
|
||||
isDirty(indexingPolicy || this.props.indexingPolicyContent, baselinePolicy || this.props.indexingPolicyContentBaseline) &&
|
||||
isDirty(this.props.indexingPolicyContent, this.props.indexingPolicyContentBaseline) &&
|
||||
this.state.indexingPolicyContentIsValid
|
||||
) {
|
||||
return true;
|
||||
@ -94,11 +96,10 @@ export class IndexingPolicyComponent extends React.Component<
|
||||
|
||||
private async createIndexingPolicyEditor(): Promise<void> {
|
||||
const { indexingPolicy, baselinePolicy } = useIndexingPolicyStore.getState();
|
||||
// const { policies, baselines } = useIndexingPolicyStore.getState();
|
||||
const policyToUse = indexingPolicy ?? this.props.indexingPolicyContent;
|
||||
const policyToUse = this.props.indexingPolicyContent;
|
||||
|
||||
const value: string = JSON.stringify(policyToUse, undefined, 4);
|
||||
// const value: string = JSON.stringify(this.props.indexingPolicyContent, undefined, 4);
|
||||
// const value: string = JSON.stringify(policyToUse, undefined, 4);
|
||||
const value: string = JSON.stringify(this.props.indexingPolicyContent, undefined, 4);
|
||||
const monaco = await loadMonaco();
|
||||
this.indexingPolicyEditor = monaco.editor.create(this.indexingPolicyDiv.current, {
|
||||
value: value,
|
||||
@ -113,14 +114,15 @@ export class IndexingPolicyComponent extends React.Component<
|
||||
}
|
||||
console.log("compp", indexingPolicy);
|
||||
console.log("Accessed policy from Zustand store:", useIndexingPolicyStore.getState().indexingPolicy);
|
||||
console.log("actual indexing content", this.props.indexingPolicyContent);
|
||||
console.log("baseline", this.props.indexingPolicyContentBaseline);
|
||||
}
|
||||
|
||||
private onEditorContentChange = (): void => {
|
||||
const indexingPolicyEditorModel = this.indexingPolicyEditor.getModel();
|
||||
try {
|
||||
const newIndexingPolicyContent = JSON.parse(indexingPolicyEditorModel.getValue()) as DataModels.IndexingPolicy;
|
||||
useIndexingPolicyStore.getState().setIndexingPolicyOnly(newIndexingPolicyContent);
|
||||
// useIndexingPolicyStore.getState().setIndexingPolicyOnly(this.props.containerId, newIndexingPolicyContent);
|
||||
// useIndexingPolicyStore.getState().setIndexingPolicyOnly(newIndexingPolicyContent);
|
||||
this.props.onIndexingPolicyContentChange(newIndexingPolicyContent);
|
||||
this.setState({ indexingPolicyContentIsValid: true });
|
||||
// console.log("editor", newIndexingPolicyContent);
|
||||
@ -130,7 +132,6 @@ export class IndexingPolicyComponent extends React.Component<
|
||||
};
|
||||
|
||||
public render(): JSX.Element {
|
||||
// const { indexingPolicy, baselinePolicy } = useIndexingPolicyStore.getState();
|
||||
return (
|
||||
<Stack {...titleAndInputStackProps}>
|
||||
<IndexingPolicyRefreshComponent
|
||||
|
||||
@ -692,6 +692,14 @@ const IndexAdvisorTab: React.FC<IndexAdvisorTabProps> = ({ onPolicyUpdated }) =>
|
||||
...(containerDef.indexingPolicy?.compositeIndexes || []),
|
||||
...newCompositeIndexes,
|
||||
],
|
||||
spatialIndexes: [
|
||||
...(containerDef.indexingPolicy?.spatialIndexes || []),
|
||||
// ...newSpatialIndexes,
|
||||
],
|
||||
vectorIndexes: [
|
||||
...(containerDef.indexingPolicy?.vectorIndexes || []),
|
||||
// ...newVectorIndexes,
|
||||
],
|
||||
};
|
||||
|
||||
await client()
|
||||
@ -941,13 +949,13 @@ export const ResultsView: React.FC<ResultsViewProps> = ({ isMongoDB, queryResult
|
||||
const [activeTab, setActiveTab] = useState<ResultsTabs>(ResultsTabs.Results);
|
||||
const [indexingPolicy, setIndexingPolicy] = useState<DataModels.IndexingPolicy | null>(null);
|
||||
const [baselinePolicy, setBaselinePolicy] = useState<DataModels.IndexingPolicy | null>(null);
|
||||
const { containerId } = useQueryMetadataStore();
|
||||
const { setIndexingPolicies } = useIndexingPolicyStore.getState();
|
||||
|
||||
const onTabSelect = useCallback((event: SelectTabEvent, data: SelectTabData) => {
|
||||
setActiveTab(data.value as ResultsTabs);
|
||||
}, []);
|
||||
// console.log("value", indexingPolicy);
|
||||
console.log("indeing", indexingPolicy);
|
||||
console.log("baseline", baselinePolicy);
|
||||
|
||||
return (
|
||||
<div data-test="QueryTab/ResultsPane/ResultsView" className={styles.queryResultsTabPanel}>
|
||||
@ -991,7 +999,6 @@ export const ResultsView: React.FC<ResultsViewProps> = ({ isMongoDB, queryResult
|
||||
setIndexingPolicy(freshPolicy);
|
||||
setBaselinePolicy(freshPolicy);
|
||||
setIndexingPolicies(freshPolicy, freshPolicy);
|
||||
// setIndexingPolicies(containerId, freshPolicy, freshPolicy);
|
||||
}
|
||||
}
|
||||
/>}
|
||||
@ -1020,19 +1027,6 @@ export interface IndexingPolicyStore {
|
||||
baselinePolicy: DataModels.IndexingPolicy
|
||||
) => void;
|
||||
setIndexingPolicyOnly: (indexingPolicy: DataModels.IndexingPolicy) => void;
|
||||
// policies: Record<string, DataModels.IndexingPolicy | null>;
|
||||
// baselines: Record<string, DataModels.IndexingPolicy | null>;
|
||||
// setIndexingPolicies: (
|
||||
// containerId: string,
|
||||
// indexingPolicy: DataModels.IndexingPolicy,
|
||||
// baselinePolicy: DataModels.IndexingPolicy
|
||||
// ) => void;
|
||||
// setIndexingPolicyOnly: (
|
||||
// containerId: string,
|
||||
// indexingPolicy: DataModels.IndexingPolicy
|
||||
// ) => void;
|
||||
// getIndexingPolicy: (containerId: string) => DataModels.IndexingPolicy | null;
|
||||
// getBaselinePolicy: (containerId: string) => DataModels.IndexingPolicy | null;
|
||||
}
|
||||
|
||||
export const useIndexingPolicyStore = create<IndexingPolicyStore>((set) => ({
|
||||
@ -1043,34 +1037,7 @@ export const useIndexingPolicyStore = create<IndexingPolicyStore>((set) => ({
|
||||
// setIndexingPolicyOnly: (indexingPolicy) =>
|
||||
// set((state) => ({ indexingPolicy })),
|
||||
setIndexingPolicyOnly: (indexingPolicy) =>
|
||||
set(() => ({ indexingPolicy: { ...indexingPolicy } })),
|
||||
set((state) => ({ indexingPolicy: { ...indexingPolicy } })),
|
||||
}));
|
||||
// export const useIndexingPolicyStore = create<IndexingPolicyStore>((set, get) => ({
|
||||
// policies: {},
|
||||
// baselines: {},
|
||||
|
||||
// setIndexingPolicies: (containerId, indexingPolicy, baselinePolicy) =>
|
||||
// set((state) => ({
|
||||
// policies: {
|
||||
// ...state.policies,
|
||||
// [containerId]: { ...indexingPolicy },
|
||||
// },
|
||||
// baselines: {
|
||||
// ...state.baselines,
|
||||
// [containerId]: { ...baselinePolicy },
|
||||
// },
|
||||
// })),
|
||||
|
||||
// setIndexingPolicyOnly: (containerId, indexingPolicy) =>
|
||||
// set((state) => ({
|
||||
// policies: {
|
||||
// ...state.policies,
|
||||
// [containerId]: { ...indexingPolicy },
|
||||
// },
|
||||
// })),
|
||||
|
||||
// getIndexingPolicy: (containerId: string) => get().policies[containerId] ?? null,
|
||||
// getBaselinePolicy: (containerId: string) => get().baselines[containerId] ?? null,
|
||||
// }));
|
||||
|
||||
|
||||
|
||||
@ -46,7 +46,6 @@ import DocumentId from "./DocumentId";
|
||||
import StoredProcedure from "./StoredProcedure";
|
||||
import Trigger from "./Trigger";
|
||||
import UserDefinedFunction from "./UserDefinedFunction";
|
||||
|
||||
export default class Collection implements ViewModels.Collection {
|
||||
public nodeKind: string;
|
||||
public container: Explorer;
|
||||
@ -123,6 +122,55 @@ export default class Collection implements ViewModels.Collection {
|
||||
this.vectorEmbeddingPolicy = ko.observable(data.vectorEmbeddingPolicy);
|
||||
this.fullTextPolicy = ko.observable(data.fullTextPolicy);
|
||||
this.indexingPolicy = ko.observable(data.indexingPolicy);
|
||||
// // console.log("Indexing policy changed data.indexngpolicy:", data.indexingPolicy);
|
||||
|
||||
// this.indexingPolicy(data.indexingPolicy);
|
||||
// this.indexingPolicy.subscribe(async (newPolicy) => {
|
||||
// console.log("Indexing policy changed via KO:", newPolicy);
|
||||
|
||||
// // Sync with Zustand (React side, if needed)
|
||||
// useIndexingPolicyStore.getState().setIndexingPolicyOnly(newPolicy);
|
||||
|
||||
// // Prepare a new collection object based on raw data
|
||||
// const updatedCollection: DataModels.Collection = {
|
||||
// ...this.rawDataModel,
|
||||
// indexingPolicy: newPolicy,
|
||||
// };
|
||||
|
||||
// try {
|
||||
// // Send update to backend
|
||||
// const updated = await updateCollection(
|
||||
// this.databaseId,
|
||||
// this.id(),
|
||||
// updatedCollection
|
||||
// );
|
||||
// console.log("updatedcollection", updatedCollection);
|
||||
// // Update the local view model with backend-confirmed values
|
||||
// this.rawDataModel = updated;
|
||||
// this.defaultTtl(updated.defaultTtl);
|
||||
// this.analyticalStorageTtl(updated.analyticalStorageTtl);
|
||||
// this.id(updated.id);
|
||||
// this.indexingPolicy(updated.indexingPolicy);
|
||||
// this.conflictResolutionPolicy(updated.conflictResolutionPolicy);
|
||||
// this.changeFeedPolicy(updated.changeFeedPolicy);
|
||||
// this.geospatialConfig(updated.geospatialConfig);
|
||||
// this.computedProperties(updated.computedProperties);
|
||||
// this.vectorEmbeddingPolicy(updated.vectorEmbeddingPolicy);
|
||||
// this.fullTextPolicy(updated.fullTextPolicy);
|
||||
|
||||
// console.log("✅ Indexing policy update persisted and view model refreshed.");
|
||||
// } catch (error) {
|
||||
// console.error("❌ Failed to update indexing policy:", error);
|
||||
// }
|
||||
// });
|
||||
|
||||
// this.indexingPolicy.subscribe((newPolicy) => {
|
||||
// console.log("Indexing policy changed via KO:", newPolicy);
|
||||
// //func to tigger
|
||||
// useIndexingPolicyStore.getState().setIndexingPolicyOnly(newPolicy);
|
||||
|
||||
// }); console.log(useIndexingPolicyStore.getState().indexingPolicy);
|
||||
|
||||
this.usageSizeInKB = ko.observable();
|
||||
this.offer = ko.observable();
|
||||
this.conflictResolutionPolicy = ko.observable(data.conflictResolutionPolicy);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user