diff --git a/package-lock.json b/package-lock.json index 220c6f663c1..9b42384e893 100644 --- a/package-lock.json +++ b/package-lock.json @@ -43825,7 +43825,6 @@ "version": "3.22.2", "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.2.tgz", "integrity": "sha512-wvWkphh5WQsJbVk1tbx1l1Ly4yg+XecD+Mq280uBGt9wa5BKSWf4Mhp6GmrkPixhMxmabYY7RbzlwVP32pbGCg==", - "dev": true, "funding": { "url": "https://github.com/sponsors/colinhacks" } @@ -46896,8 +46895,7 @@ "@mongodb-js/compass-logging": "^1.1.9", "@mongodb-js/mongodb-redux-common": "^2.0.11", "bson": "^6.0.0", - "compass-preferences-model": "^2.13.0", - "ejson-shell-parser": "^1.2.4" + "compass-preferences-model": "^2.13.0" }, "devDependencies": { "@mongodb-js/eslint-config-compass": "^1.0.9", @@ -46909,6 +46907,7 @@ "@testing-library/user-event": "^13.5.0", "chai": "^4.2.0", "depcheck": "^1.4.1", + "ejson-shell-parser": "^1.2.4", "electron": "^24.8.2", "enzyme": "^3.11.0", "eslint": "^7.25.0", @@ -48729,10 +48728,17 @@ "name": "@mongodb-js/connection-storage", "version": "0.4.0", "license": "SSPL", - "devDependencies": { + "dependencies": { "@mongodb-js/compass-logging": "^1.1.9", "@mongodb-js/compass-user-data": "^0.1.1", "@mongodb-js/compass-utils": "^0.3.5", + "bson": "^6.0.0", + "keytar": "^7.9.0", + "lodash": "^4.17.21", + "mongodb-connection-string-url": "^2.6.0", + "zod": "^3.22.2" + }, + "devDependencies": { "@mongodb-js/eslint-config-compass": "^1.0.9", "@mongodb-js/mocha-config-compass": "^1.3.1", "@mongodb-js/prettier-config-compass": "^1.0.1", @@ -48740,22 +48746,17 @@ "@types/chai": "^4.2.21", "@types/mocha": "^9.0.0", "@types/sinon-chai": "^3.2.5", - "bson": "^6.0.0", "chai": "^4.3.6", "depcheck": "^1.4.1", "electron": "^24.8.2", "eslint": "^7.25.0", - "keytar": "^7.9.0", - "lodash": "^4.17.21", "mocha": "^10.2.0", "mongodb": "^6.0.0", - "mongodb-connection-string-url": "^2.6.0", "mongodb-data-service": "^22.10.0", "nyc": "^15.1.0", "prettier": "^2.7.1", "sinon": "^9.2.3", - "typescript": "^5.0.4", - "zod": "^3.22.2" + "typescript": "^5.0.4" } }, "packages/connection-storage/node_modules/diff": { @@ -59880,7 +59881,7 @@ "chai": "^4.2.0", "compass-preferences-model": "^2.13.0", "depcheck": "^1.4.1", - "ejson-shell-parser": "*", + "ejson-shell-parser": "^1.2.4", "electron": "^24.8.2", "enzyme": "^3.11.0", "eslint": "^7.25.0", @@ -94761,8 +94762,7 @@ "zod": { "version": "3.22.2", "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.2.tgz", - "integrity": "sha512-wvWkphh5WQsJbVk1tbx1l1Ly4yg+XecD+Mq280uBGt9wa5BKSWf4Mhp6GmrkPixhMxmabYY7RbzlwVP32pbGCg==", - "dev": true + "integrity": "sha512-wvWkphh5WQsJbVk1tbx1l1Ly4yg+XecD+Mq280uBGt9wa5BKSWf4Mhp6GmrkPixhMxmabYY7RbzlwVP32pbGCg==" } } } diff --git a/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.spec.tsx b/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.spec.tsx index aaea7781dba..fe4b8783a1f 100644 --- a/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.spec.tsx +++ b/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.spec.tsx @@ -78,6 +78,13 @@ describe('SearchIndexesTable Component', function () { ]) { expect(within(indexRow).getByTestId(indexCell)).to.exist; } + + // Renders status badges + const badge = within(indexRow).getByTestId( + `search-indexes-status-${index.name}` + ); + expect(badge).to.exist; + expect(badge).to.have.text(index.status); } }); } diff --git a/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.tsx b/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.tsx index 780a8ce3048..f958235bacf 100644 --- a/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.tsx +++ b/packages/compass-indexes/src/components/search-indexes-table/search-indexes-table.tsx @@ -1,9 +1,15 @@ import React from 'react'; import { connect } from 'react-redux'; -import type { SearchIndex } from 'mongodb-data-service'; +import type { SearchIndex, SearchIndexStatus } from 'mongodb-data-service'; import { withPreferences } from 'compass-preferences-model'; -import { EmptyContent, Button, Link } from '@mongodb-js/compass-components'; +import { BadgeVariant } from '@mongodb-js/compass-components'; +import { + EmptyContent, + Button, + Link, + Badge, +} from '@mongodb-js/compass-components'; import type { SearchSortColumn } from '../../modules/search-indexes'; import { @@ -64,6 +70,29 @@ function ZeroState({ openCreateModal }: { openCreateModal: () => void }) { ); } +const statusBadgeVariants: Record = { + BUILDING: BadgeVariant.Blue, + FAILED: BadgeVariant.Red, + PENDING: BadgeVariant.Yellow, + READY: BadgeVariant.Green, + STALE: BadgeVariant.LightGray, +}; + +function IndexStatus({ + status, + 'data-testid': dataTestId, +}: { + status: SearchIndexStatus; + 'data-testid': string; +}) { + const variant = statusBadgeVariants[status]; + return ( + + {status} + + ); +} + export const SearchIndexesTable: React.FunctionComponent< SearchIndexesTableProps > = ({ @@ -100,7 +129,12 @@ export const SearchIndexesTable: React.FunctionComponent< }, { 'data-testid': 'status-field', - children: index.status, // TODO(COMPASS-7205): show some badge, not just text + children: ( + + ), }, ], diff --git a/packages/data-service/src/index.ts b/packages/data-service/src/index.ts index eca0eb506b5..cb7e5b87074 100644 --- a/packages/data-service/src/index.ts +++ b/packages/data-service/src/index.ts @@ -14,4 +14,7 @@ export { export type { ReauthenticationHandler } from './connect-mongo-client'; export type { ExplainExecuteOptions } from './data-service'; export type { IndexDefinition } from './index-detail-helper'; -export type { SearchIndex } from './search-index-detail-helper'; +export type { + SearchIndex, + SearchIndexStatus, +} from './search-index-detail-helper'; diff --git a/packages/data-service/src/search-index-detail-helper.ts b/packages/data-service/src/search-index-detail-helper.ts index 13885868d86..d7aaf5b7caa 100644 --- a/packages/data-service/src/search-index-detail-helper.ts +++ b/packages/data-service/src/search-index-detail-helper.ts @@ -1,9 +1,16 @@ import type { Document } from 'mongodb'; +export type SearchIndexStatus = + | 'BUILDING' + | 'FAILED' + | 'PENDING' + | 'READY' + | 'STALE'; + export type SearchIndex = { id: string; name: string; - status: 'BUILDING' | 'FAILED' | 'PENDING' | 'READY' | 'STALE'; + status: SearchIndexStatus; queryable: boolean; latestDefinition: Document; };