diff --git a/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.spec.tsx b/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.spec.tsx index b13e8821cbc..cf28af29f70 100644 --- a/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.spec.tsx +++ b/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.spec.tsx @@ -42,6 +42,8 @@ describe('IndexesToolbar Component', function () { onIndexViewChanged={() => {}} onCreateRegularIndexClick={() => {}} onCreateSearchIndexClick={() => {}} + namespace="" + showAtlasSearchLink={false} {...props} /> diff --git a/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.tsx b/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.tsx index 8ed4eed9e16..549d00c257f 100644 --- a/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.tsx +++ b/packages/compass-indexes/src/components/indexes-toolbar/indexes-toolbar.tsx @@ -9,6 +9,7 @@ import { ErrorSummary, Tooltip, WarningSummary, + Link, css, spacing, Icon, @@ -19,9 +20,11 @@ import { SegmentedControl, SegmentedControlOption, } from '@mongodb-js/compass-components'; +import { useConnectionInfo } from '@mongodb-js/compass-connections/provider'; import type { RootState } from '../../modules'; import { createSearchIndexOpened } from '../../modules/search-indexes'; +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'; @@ -46,9 +49,11 @@ const createIndexButtonContainerStyles = css({ }); type IndexesToolbarProps = { + namespace: string; indexView: IndexView; errorMessage: string | null; hasTooManyIndexes: boolean; + showAtlasSearchLink: boolean; isRefreshing: boolean; onRefreshIndexes: () => void; onIndexViewChanged: (newView: IndexView) => void; @@ -64,6 +69,7 @@ type IndexesToolbarProps = { }; export const IndexesToolbar: React.FunctionComponent = ({ + namespace, indexView, errorMessage, isReadonlyView, @@ -73,12 +79,14 @@ export const IndexesToolbar: React.FunctionComponent = ({ isRefreshing, writeStateDescription, hasTooManyIndexes, + showAtlasSearchLink, isSearchIndexesSupported, onRefreshIndexes, onIndexViewChanged, readOnly, // preferences readOnly. }) => { const isSearchManagementActive = usePreference('enableAtlasSearchIndexes'); + const { atlasMetadata } = useConnectionInfo(); const showInsights = usePreference('showInsights') && !errorMessage; const showCreateIndexButton = !isReadonlyView && !readOnly && !errorMessage; const refreshButtonIcon = isRefreshing ? ( @@ -124,6 +132,18 @@ export const IndexesToolbar: React.FunctionComponent = ({ > Refresh + {showAtlasSearchLink && atlasMetadata && ( + + Manage your search indexes + + )} {showInsights && hasTooManyIndexes && ( ({ + namespace, isWritable, isReadonlyView, isSearchIndexesSupported, diff --git a/packages/compass-indexes/src/components/indexes/indexes.tsx b/packages/compass-indexes/src/components/indexes/indexes.tsx index 495308c8aa1..87d66ee0854 100644 --- a/packages/compass-indexes/src/components/indexes/indexes.tsx +++ b/packages/compass-indexes/src/components/indexes/indexes.tsx @@ -48,24 +48,28 @@ const containerStyles = css({ flexGrow: 1, }); -const linkTitle = 'Atlas Search.'; +const linkTitle = 'Search and Vector Search.'; const DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY = 'mongodb_compass_dismissedSearchIndexesBanner' as const; -const AtlasIndexesBanner = ({ namespace }: { namespace: string }) => { +const AtlasIndexesBanner = ({ + namespace, + dismissed, + onDismissClick, +}: { + namespace: string; + dismissed: boolean; + onDismissClick: () => void; +}) => { const { atlasMetadata } = useConnectionInfo(); - const [dismissed, setDismissed] = usePersistedState( - DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY, - false - ); if (!atlasMetadata || dismissed) { return null; } return ( - setDismissed(true)}> + Looking for search indexes? These indexes can be created and viewed under{' '} {atlasMetadata ? ( @@ -117,6 +121,11 @@ export function Indexes({ refreshRegularIndexes, refreshSearchIndexes, }: IndexesProps) { + const [atlasBannerDismissed, setDismissed] = usePersistedState( + DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY, + false + ); + const errorMessage = currentIndexesView === 'regular-indexes' ? regularIndexes.error @@ -147,12 +156,23 @@ export function Indexes({ hasTooManyIndexes={hasTooManyIndexes} isRefreshing={isRefreshing} onRefreshIndexes={onRefreshIndexes} + showAtlasSearchLink={ + !isReadonlyView && + !enableAtlasSearchIndexes && + atlasBannerDismissed + } /> } >
{!isReadonlyView && !enableAtlasSearchIndexes && ( - + { + setDismissed(true); + }} + /> )} {!isReadonlyView && currentIndexesView === 'regular-indexes' && (