pr review changes

Author: DarshanaVenkatesh

packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect } from 'react';
+import React, { useCallback } from 'react';
 import { connect } from 'react-redux';
 import {
   usePreference,
@@ -28,6 +28,7 @@ import { getAtlasSearchIndexesLink } from '../../utils/atlas-search-indexes-link
 import { createIndexOpened } from '../../modules/create-index';
 import type { IndexView } from '../../modules/index-view';
 import { indexViewChanged } from '../../modules/index-view';
+import { compareVersionForViewCompatibility } from '../indexes/indexes';
 
 const toolbarButtonsContainer = css({
   display: 'flex',
@@ -106,13 +107,10 @@ export const IndexesToolbar: React.FunctionComponent<IndexesToolbarProps> = ({
   readOnly, // preferences readOnly.
 }) => {
   const isSearchManagementActive = usePreference('enableAtlasSearchIndexes');
-  const mongoDBMajorVersion = parseFloat(
-    serverVersion.split('.').slice(0, 2).join('.')
-  );
   const { atlasMetadata } = useConnectionInfo();
   const showInsights = usePreference('showInsights') && !errorMessage;
   const showCreateIndexButton =
-    (!isReadonlyView || mongoDBMajorVersion > 8.0) &&
+    (!isReadonlyView || compareVersionForViewCompatibility(serverVersion)) &&
     !readOnly &&
     !errorMessage;
   const refreshButtonIcon = isRefreshing ? (
@@ -123,19 +121,13 @@ export const IndexesToolbar: React.FunctionComponent<IndexesToolbarProps> = ({
     <Icon glyph="Refresh" title="Refresh Indexes" />
   );
 
-  useEffect(() => {
-    // If the view is readonly, set the default tab to 'search-indexes'
-    if (isReadonlyView && indexView !== 'search-indexes') {
-      onIndexViewChanged('search-indexes'); // Update redux state
-    }
-  }, [indexView, isReadonlyView, onIndexViewChanged]);
-
   return (
     <div
       className={indexesToolbarContainerStyles}
       data-testid="indexes-toolbar-container"
     >
-      {(!isReadonlyView || mongoDBMajorVersion > 8.0) && (
+      {(!isReadonlyView ||
+        compareVersionForViewCompatibility(serverVersion)) && (
         <div data-testid="indexes-toolbar">
           <div className={toolbarButtonsContainer}>
             {showCreateIndexButton && (

packages/compass-indexes/src/components/indexes/indexes.tsx

@@ -32,6 +32,7 @@ import { getAtlasSearchIndexesLink } from '../../utils/atlas-search-indexes-link
 import CreateIndexModal from '../create-index-modal/create-index-modal';
 import { ZeroGraphic } from '../search-indexes-table/zero-graphic';
 import { ViewVersionIncompatibleBanner } from '../view-version-incompatible-banners/view-version-incompatible-banners';
+import semver from 'semver';
 
 // This constant is used as a trigger to show an insight whenever number of
 // indexes in a collection is more than what is specified here.
@@ -51,14 +52,31 @@ const linkTitle = 'Search and Vector Search.';
 const DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY =
   'mongodb_compass_dismissedSearchIndexesBanner' as const;
 
+const MIN_VERSION_FOR_VIEW_SEARCH_COMPATIBILITY_COMPASS = '8.1.0';
+export const compareVersionForViewCompatibility = (
+  //default to 8.1+
+  serverVersion: string,
+  comparator: 'gt' | 'gte' | 'lt' | 'lte' = 'gte',
+  compareVersion: string = MIN_VERSION_FOR_VIEW_SEARCH_COMPATIBILITY_COMPASS
+) => {
+  try {
+    return semver[comparator](serverVersion, compareVersion);
+  } catch {
+    return false;
+  }
+};
+
 const ViewVersionIncompatibleEmptyState = ({
-  mongoDBMajorVersion,
+  serverVersion,
   enableAtlasSearchIndexes,
 }: {
-  mongoDBMajorVersion: number;
+  serverVersion: string;
   enableAtlasSearchIndexes: boolean;
 }) => {
-  if (mongoDBMajorVersion > 8.0 && enableAtlasSearchIndexes) {
+  if (
+    compareVersionForViewCompatibility(serverVersion) &&
+    enableAtlasSearchIndexes
+  ) {
     return null;
   }
   return (
@@ -176,9 +194,6 @@ export function Indexes({
       : refreshSearchIndexes;
 
   const enableAtlasSearchIndexes = usePreference('enableAtlasSearchIndexes');
-  const mongoDBMajorVersion = parseFloat(
-    serverVersion.split('.').slice(0, 2).join('.')
-  );
   const { atlasMetadata } = useConnectionInfo();
 
   return (
@@ -202,12 +217,12 @@ export function Indexes({
           {isReadonlyView && (
             <ViewVersionIncompatibleBanner
               serverVersion={serverVersion}
-              mongoDBMajorVersion={mongoDBMajorVersion}
               enableAtlasSearchIndexes={enableAtlasSearchIndexes}
               atlasMetadata={atlasMetadata}
             />
           )}
-          {(!isReadonlyView || mongoDBMajorVersion >= 8.0) &&
+          {(!isReadonlyView ||
+            compareVersionForViewCompatibility(serverVersion, 'gte')) &&
             !enableAtlasSearchIndexes && (
               <AtlasIndexesBanner
                 namespace={namespace}
@@ -220,11 +235,12 @@ export function Indexes({
           {!isReadonlyView && currentIndexesView === 'regular-indexes' && (
             <RegularIndexesTable />
           )}
-          {(!isReadonlyView || mongoDBMajorVersion > 8.0) &&
+          {(!isReadonlyView ||
+            compareVersionForViewCompatibility(serverVersion)) &&
             currentIndexesView === 'search-indexes' && <SearchIndexesTable />}
           {isReadonlyView && searchIndexes.indexes.length === 0 && (
             <ViewVersionIncompatibleEmptyState
-              mongoDBMajorVersion={mongoDBMajorVersion}
+              serverVersion={serverVersion}
               enableAtlasSearchIndexes={enableAtlasSearchIndexes}
             />
           )}

packages/compass-indexes/src/components/view-version-incompatible-banners/view-version-incompatible-banners.tsx

@@ -7,6 +7,7 @@ import {
 import { getAtlasUpgradeClusterLink } from '../../utils/atlas-upgrade-cluster-link';
 import React from 'react';
 import type { AtlasClusterMetadata } from '@mongodb-js/connection-info';
+import { compareVersionForViewCompatibility } from '../indexes/indexes';
 
 const viewContentStyles = css({
   display: 'flex',
@@ -17,26 +18,25 @@ const viewContentStyles = css({
 
 export const ViewVersionIncompatibleBanner = ({
   serverVersion,
-  mongoDBMajorVersion,
   enableAtlasSearchIndexes,
   atlasMetadata,
 }: {
   serverVersion: string;
-  mongoDBMajorVersion: number;
   enableAtlasSearchIndexes: boolean;
   atlasMetadata: AtlasClusterMetadata | undefined;
 }) => {
   const searchIndexOnViewsVersion = enableAtlasSearchIndexes ? '8.1' : '8.0';
 
   if (
-    mongoDBMajorVersion > 8.0 ||
-    (mongoDBMajorVersion === 8.0 && !enableAtlasSearchIndexes)
+    compareVersionForViewCompatibility(serverVersion) ||
+    (compareVersionForViewCompatibility(serverVersion, 'gte', '8.0.0') &&
+      !enableAtlasSearchIndexes)
   ) {
     // return if 8.1+ on compass or 8.0+ for data explorer
     return null;
   }
 
-  if (mongoDBMajorVersion < 8.0) {
+  if (compareVersionForViewCompatibility(serverVersion, 'lt', '8.0.0')) {
     // data explorer <8.0 and compass <8.0
     return (
       <Banner
@@ -72,7 +72,11 @@ export const ViewVersionIncompatibleBanner = ({
     );
   }
 
-  if (mongoDBMajorVersion === 8.0 && enableAtlasSearchIndexes) {
+  if (
+    compareVersionForViewCompatibility(serverVersion, 'gte', '8.0.0') &&
+    compareVersionForViewCompatibility(serverVersion, 'lt', '8.1.0') &&
+    enableAtlasSearchIndexes
+  ) {
     // compass 8.0
     return (
       <Banner

packages/compass-indexes/src/modules/index-view.ts

@@ -18,10 +18,11 @@ export type IndexViewChangedAction = {
   view: IndexView;
 };
 
-export const INITIAL_STATE: IndexView = 'regular-indexes';
+export const COLL_INITIAL_STATE: IndexView = 'regular-indexes';
+export const VIEW_INITIAL_STATE: IndexView = 'search-indexes';
 
 export default function reducer(
-  state = INITIAL_STATE,
+  state = COLL_INITIAL_STATE,
   action: AnyAction
 ): IndexView {
   // The create index button has a dropdown where you can select regular or

packages/compass-indexes/src/modules/search-indexes.ts

@@ -17,13 +17,27 @@ import type { FetchReason } from '../utils/fetch-reason';
 import type { IndexesThunkAction } from '.';
 import { switchToSearchIndexes } from './index-view';
 import type { IndexViewChangedAction } from './index-view';
+import semver from 'semver';
 
 const ATLAS_SEARCH_SERVER_ERRORS: Record<string, string> = {
   InvalidIndexSpecificationOption: 'Invalid index definition.',
   IndexAlreadyExists:
     'This index name is already in use. Please choose another one.',
 };
 
+const MIN_VERSION_FOR_VIEW_SEARCH_COMPATIBILITY_COMPASS = '8.1.0';
+
+const isVersionSearchCompatibleForViews = (serverVersion: string) => {
+  try {
+    return semver.gte(
+      serverVersion,
+      MIN_VERSION_FOR_VIEW_SEARCH_COMPATIBILITY_COMPASS
+    );
+  } catch {
+    return false;
+  }
+};
+
 export enum ActionTypes {
   // Fetch indexes
   FetchSearchIndexesStarted = 'compass-indexes/search-indexes/fetch-search-indexes-started',
@@ -606,11 +620,11 @@ const fetchIndexes = (
       searchIndexes: { status },
     } = getState();
 
-    const mongoDBMajorVersion = parseFloat(
-      serverVersion.split('.').slice(0, 2).join('.')
-    );
-    if ((isReadonlyView && mongoDBMajorVersion < 8.1) || !isWritable) {
-      return; // fetch for views 8.1+
+    if (
+      (isReadonlyView && !isVersionSearchCompatibleForViews(serverVersion)) ||
+      !isWritable
+    ) {
+      return; // return if view is not search compatible
     }
 
     // If we are already fetching indexes, we will wait for that

packages/compass-indexes/src/stores/store.ts

@@ -5,7 +5,8 @@ import reducer from '../modules';
 import thunk from 'redux-thunk';
 import { writeStateChanged } from '../modules/is-writable';
 import { getDescription } from '../modules/description';
-import { INITIAL_STATE as INDEX_LIST_INITIAL_STATE } from '../modules/index-view';
+import { COLL_INITIAL_STATE, VIEW_INITIAL_STATE } from '../modules/index-view';
+
 import { createIndexOpened } from '../modules/create-index';
 import {
   fetchRegularIndexes,
@@ -106,7 +107,7 @@ export function activateIndexesPlugin(
       serverVersion: options.serverVersion,
       isReadonlyView: options.isReadonly,
       isSearchIndexesSupported: options.isSearchIndexesSupported,
-      indexView: INDEX_LIST_INITIAL_STATE,
+      indexView: options.isReadonly ? VIEW_INITIAL_STATE : COLL_INITIAL_STATE,
       collectionStats: extractCollectionStats(collectionModel),
     },
     applyMiddleware(