From 468a391e0c9dfa567d59105b124c7a3fea28271b Mon Sep 17 00:00:00 2001
From: Nishtha Ahuja <nishthaahuja@microsoft.com>
Date: Mon, 17 Feb 2025 14:44:43 +0530
Subject: [PATCH] identified containers with MV

---
 .../Controls/Settings/SettingsComponent.tsx    | 18 ++++++++++++++++++
 .../MaterializedViewComponent.tsx              | 13 +++++++++++++
 .../Controls/Settings/SettingsUtils.tsx        |  3 +++
 3 files changed, 34 insertions(+)
 create mode 100644 src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx

diff --git a/src/Explorer/Controls/Settings/SettingsComponent.tsx b/src/Explorer/Controls/Settings/SettingsComponent.tsx
index 720bef874..2c97b8fe9 100644
--- a/src/Explorer/Controls/Settings/SettingsComponent.tsx
+++ b/src/Explorer/Controls/Settings/SettingsComponent.tsx
@@ -45,6 +45,10 @@ import {
   ConflictResolutionComponentProps,
 } from "./SettingsSubComponents/ConflictResolutionComponent";
 import { IndexingPolicyComponent, IndexingPolicyComponentProps } from "./SettingsSubComponents/IndexingPolicyComponent";
+import {
+  MaterializedViewComponent,
+  MaterializedViewComponentProps,
+} from "./SettingsSubComponents/MaterializedViewComponent";
 import {
   MongoIndexingPolicyComponent,
   MongoIndexingPolicyComponentProps,
@@ -162,6 +166,7 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
   private shouldShowComputedPropertiesEditor: boolean;
   private shouldShowIndexingPolicyEditor: boolean;
   private shouldShowPartitionKeyEditor: boolean;
+  private isMaterializedView: boolean;
   private isVectorSearchEnabled: boolean;
   private isFullTextSearchEnabled: boolean;
   private totalThroughputUsed: number;
@@ -179,6 +184,8 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
       this.shouldShowComputedPropertiesEditor = userContext.apiType === "SQL";
       this.shouldShowIndexingPolicyEditor = userContext.apiType !== "Cassandra" && userContext.apiType !== "Mongo";
       this.shouldShowPartitionKeyEditor = userContext.apiType === "SQL" && isRunningOnPublicCloud();
+      this.isMaterializedView = !!this.collection?.materializedViewDefinition();
+      console.log("Is Materialized View:", this.isMaterializedView);
       this.isVectorSearchEnabled = isVectorSearchEnabled() && !hasDatabaseSharedThroughput(this.collection);
       this.isFullTextSearchEnabled = isFullTextSearchEnabled() && !hasDatabaseSharedThroughput(this.collection);
 
@@ -1272,6 +1279,10 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
       explorer: this.props.settingsTab.getContainer(),
     };
 
+    const materializedViewComponentProps: MaterializedViewComponentProps = {
+      collection: this.collection,
+    };
+
     const tabs: SettingsV2TabInfo[] = [];
     if (!hasDatabaseSharedThroughput(this.collection) && this.offer) {
       tabs.push({
@@ -1335,6 +1346,13 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
       });
     }
 
+    if (this.isMaterializedView) {
+      tabs.push({
+        tab: SettingsV2TabTypes.MaterializedViewTab,
+        content: <MaterializedViewComponent {...materializedViewComponentProps} />,
+      });
+    }
+
     const pivotProps: IPivotProps = {
       onLinkClick: this.onPivotChange,
       selectedKey: SettingsV2TabTypes[this.state.selectedTab],
diff --git a/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx b/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx
new file mode 100644
index 000000000..3b07706ff
--- /dev/null
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx
@@ -0,0 +1,13 @@
+import { Text } from "@fluentui/react";
+import React from "react";
+import * as ViewModels from "../../../../Contracts/ViewModels";
+
+export interface MaterializedViewComponentProps {
+  collection: ViewModels.Collection;
+}
+
+export const MaterializedViewComponent: React.FC<MaterializedViewComponentProps> = ({ collection }) => {
+  console.log("collection", collection);
+  const sourceId = collection.materializedViewDefinition()?.sourceCollectionId;
+  return <Text>{`Source ID: ${sourceId}`}</Text>;
+};
diff --git a/src/Explorer/Controls/Settings/SettingsUtils.tsx b/src/Explorer/Controls/Settings/SettingsUtils.tsx
index 900ad6ab0..da3785622 100644
--- a/src/Explorer/Controls/Settings/SettingsUtils.tsx
+++ b/src/Explorer/Controls/Settings/SettingsUtils.tsx
@@ -57,6 +57,7 @@ export enum SettingsV2TabTypes {
   ComputedPropertiesTab,
   ContainerVectorPolicyTab,
   ThroughputBucketsTab,
+  MaterializedViewTab,
 }
 
 export enum ContainerPolicyTabTypes {
@@ -171,6 +172,8 @@ export const getTabTitle = (tab: SettingsV2TabTypes): string => {
       return "Container Policies";
     case SettingsV2TabTypes.ThroughputBucketsTab:
       return "Throughput Buckets";
+    case SettingsV2TabTypes.MaterializedViewTab:
+      return "Materialized Views (Preview)";
     default:
       throw new Error(`Unknown tab ${tab}`);
   }