From 1fec734054344c69a2c4bf155d7a7aa4fb6f532e Mon Sep 17 00:00:00 2001
From: Nishtha Ahuja <nishthaahuja@microsoft.com>
Date: Mon, 24 Feb 2025 15:49:02 +0530
Subject: [PATCH] icon views

---
 .../SettingsSubComponents/MaterializedViewComponent.tsx  | 6 +++---
 src/Explorer/Tree/treeNodeUtil.tsx                       | 9 +++++----
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx b/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx
index 285e124f2..73523fdc0 100644
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/MaterializedViewComponent.tsx
@@ -1,4 +1,4 @@
-import { Link, Stack, Text } from "@fluentui/react";
+import { FontIcon, Link, Stack, Text } from "@fluentui/react";
 import React from "react";
 import * as ViewModels from "../../../../Contracts/ViewModels";
 import { MaterializedViewSourceComponent } from "./MaterializedViewSourceComponent";
@@ -16,10 +16,10 @@ export const MaterializedViewComponent: React.FC<MaterializedViewComponentProps>
     <Stack tokens={{ childrenGap: 8 }} styles={{ root: { maxWidth: 600 } }}>
       <Stack horizontal verticalAlign="center" wrap tokens={{ childrenGap: 8 }}>
         <Text styles={{ root: { fontWeight: 600 } }}>This container has the following views defined for it.</Text>
-        {/* change href */}
         <Text>
-          <Link target="_blank" href="https://aka.ms/MicrosoftCopilotForAzureInCDBHowTo">
+          <Link href="https://learn.microsoft.com/en-us/azure/cosmos-db/nosql/materialized-views#defining-materialized-views">
             Learn more
+            <FontIcon iconName="NavigateExternalInline" style={{ marginLeft: "4px" }} />
           </Link>{" "}
           about how to define materialized views and how to use them.
         </Text>
diff --git a/src/Explorer/Tree/treeNodeUtil.tsx b/src/Explorer/Tree/treeNodeUtil.tsx
index 8e6c94559..533008ab3 100644
--- a/src/Explorer/Tree/treeNodeUtil.tsx
+++ b/src/Explorer/Tree/treeNodeUtil.tsx
@@ -1,4 +1,4 @@
-import { DatabaseRegular, DocumentMultipleRegular, SettingsRegular } from "@fluentui/react-icons";
+import { DatabaseRegular, DocumentMultipleRegular, EyeRegular, SettingsRegular } from "@fluentui/react-icons";
 import { TreeNode } from "Explorer/Controls/TreeComponent/TreeNodeComponent";
 import { collectionWasOpened } from "Explorer/MostRecentActivity/MostRecentActivity";
 import TabsBase from "Explorer/Tabs/TabsBase";
@@ -30,6 +30,7 @@ export const shouldShowScriptNodes = (): boolean => {
 const TreeDatabaseIcon = <DatabaseRegular fontSize={16} />;
 const TreeSettingsIcon = <SettingsRegular fontSize={16} />;
 const TreeCollectionIcon = <DocumentMultipleRegular fontSize={16} />;
+const MaterializedViewCollectionIcon = <EyeRegular fontSize={16} />; //check icon
 
 export const createSampleDataTreeNodes = (sampleDataResourceTokenCollection: ViewModels.CollectionBase): TreeNode[] => {
   const updatedSampleTree: TreeNode = {
@@ -81,7 +82,7 @@ export const createSampleDataTreeNodes = (sampleDataResourceTokenCollection: Vie
   return [updatedSampleTree];
 };
 
-export const createResourceTokenTreeNodes = (collection: ViewModels.CollectionBase): TreeNode[] => {
+export const createResourceTokenTreeNodes = (collection: ViewModels.Collection): TreeNode[] => {
   if (!collection) {
     return [
       {
@@ -111,7 +112,7 @@ export const createResourceTokenTreeNodes = (collection: ViewModels.CollectionBa
     isExpanded: true,
     children,
     className: "collectionNode",
-    iconSrc: TreeCollectionIcon,
+    iconSrc: collection.materializedViewDefinition() ? MaterializedViewCollectionIcon : TreeCollectionIcon,
     onClick: () => {
       // Rewritten version of expandCollapseCollection
       useSelectedNode.getState().setSelectedNode(collection);
@@ -229,7 +230,7 @@ export const buildCollectionNode = (
     children: children,
     className: "collectionNode",
     contextMenu: ResourceTreeContextMenuButtonFactory.createCollectionContextMenuButton(container, collection),
-    iconSrc: TreeCollectionIcon,
+    iconSrc: collection.materializedViewDefinition() ? MaterializedViewCollectionIcon : TreeCollectionIcon,
     onClick: () => {
       useSelectedNode.getState().setSelectedNode(collection);
       collection.openTab();