added loader

This commit is contained in:
Archie Agarwal
2025-06-26 12:59:42 +05:30
parent dfc0b5ff99
commit c0b5bf4fd4

View File

@@ -36,7 +36,7 @@ import { logConsoleProgress } from "Utils/NotificationConsoleUtils";
import create from "zustand"; import create from "zustand";
import { client } from "../../../Common/CosmosClient"; import { client } from "../../../Common/CosmosClient";
import { handleError } from "../../../Common/ErrorHandlingUtils"; import { handleError } from "../../../Common/ErrorHandlingUtils";
import { useIndexAdvisorStyles } from "./indexadv"; import { useIndexAdvisorStyles } from "./Indexadvisor";
import { ResultsViewProps } from "./QueryResultSection"; import { ResultsViewProps } from "./QueryResultSection";
enum ResultsTabs { enum ResultsTabs {
@@ -555,6 +555,7 @@ export const IndexAdvisorTab: React.FC = () => {
const [updateMessageShown, setUpdateMessageShown] = useState(false); const [updateMessageShown, setUpdateMessageShown] = useState(false);
const [included, setIncludedIndexes] = useState<IIndexMetric[]>([]); const [included, setIncludedIndexes] = useState<IIndexMetric[]>([]);
const [notIncluded, setNotIncludedIndexes] = useState<IIndexMetric[]>([]); const [notIncluded, setNotIncludedIndexes] = useState<IIndexMetric[]>([]);
const [isUpdating, setIsUpdating] = useState(false);
useEffect(() => { useEffect(() => {
async function fetchIndexMetrics() { async function fetchIndexMetrics() {
@@ -659,6 +660,7 @@ export const IndexAdvisorTab: React.FC = () => {
}; };
const handleUpdatePolicy = async () => { const handleUpdatePolicy = async () => {
setIsUpdating(true);
try { try {
const containerRef = client().database(databaseId).container(containerId); const containerRef = client().database(databaseId).container(containerId);
const { resource: containerDef } = await containerRef.read(); const { resource: containerDef } = await containerRef.read();
@@ -699,7 +701,6 @@ export const IndexAdvisorTab: React.FC = () => {
partitionKey: containerDef.partitionKey, partitionKey: containerDef.partitionKey,
indexingPolicy: updatedPolicy, indexingPolicy: updatedPolicy,
}); });
useIndexingPolicyStore.getState().setIndexingPolicyOnly(updatedPolicy); useIndexingPolicyStore.getState().setIndexingPolicyOnly(updatedPolicy);
const selectedIndexSet = new Set(selectedIndexes.map(s => s.index)); const selectedIndexSet = new Set(selectedIndexes.map(s => s.index));
const updatedNotIncluded: typeof notIncluded = []; const updatedNotIncluded: typeof notIncluded = [];
@@ -720,6 +721,8 @@ export const IndexAdvisorTab: React.FC = () => {
setUpdateMessageShown(true); setUpdateMessageShown(true);
} catch (err) { } catch (err) {
console.error("Failed to update indexing policy:", err); console.error("Failed to update indexing policy:", err);
} finally {
setIsUpdating(false);
} }
}; };
const renderImpactDots = (impact: string) => { const renderImpactDots = (impact: string) => {
@@ -856,12 +859,17 @@ export const IndexAdvisorTab: React.FC = () => {
</Table> </Table>
{selectedIndexes.length > 0 && ( {selectedIndexes.length > 0 && (
<div className={style.indexAdvisorButtonBar}> <div className={style.indexAdvisorButtonBar}>
{isUpdating ? (
<div className={style.indexAdvisorButtonSpinner}>
<Spinner size="tiny" /> </div>
) : (
<button <button
onClick={handleUpdatePolicy} onClick={handleUpdatePolicy}
className={style.indexAdvisorButton} className={style.indexAdvisorButton}
> >
Update Indexing Policy with selected index(es) Update Indexing Policy with selected index(es)
</button> </button>
)}
</div> </div>
)} )}
</div> </div>