show only non-composite aliases in drop down (#1947)

* show only non-composite aliases in drop down

* fix type errors in test

* snapshots

* correct type

* fix alias default value

* update snapshots

Author: OskarDamkjaer

src/browser/modules/DBMSInfo/DBMSInfo.tsx

@@ -42,7 +42,8 @@ import {
   forceCount,
   getCountAutomaticRefreshLoading,
   getCountAutomaticRefreshEnabled,
-  getUniqueDatbases
+  getUniqueDatabases,
+  getAliases
 } from 'shared/modules/dbMeta/dbMetaDuck'
 import { getGraphStyleData } from 'shared/modules/grass/grassDuck'
 import { Button } from '@neo4j-ndl/react'
@@ -73,14 +74,22 @@ export function DBMSInfo(props: any): JSX.Element {
     nodes,
     relationships
   } = props.meta
-  const { user, onItemClick, onDbSelect, useDb, uniqueDatabases = [] } = props
+  const {
+    user,
+    onItemClick,
+    onDbSelect,
+    useDb,
+    uniqueDatabases = [],
+    aliases
+  } = props
 
   return (
     <Drawer id="db-drawer">
       <DrawerHeader>Database Information</DrawerHeader>
       <DrawerBody>
         <DatabaseSelector
           uniqueDatabases={uniqueDatabases}
+          aliases={aliases}
           selectedDb={useDb ?? ''}
           onChange={onDbSelect}
         />
@@ -141,14 +150,16 @@ const mapStateToProps = (state: any) => {
   const countAutoRefreshing = getCountAutomaticRefreshEnabled(state)
   const countLoading = getCountAutomaticRefreshLoading(state)
 
-  const uniqueDatabases = getUniqueDatbases(state)
+  const uniqueDatabases = getUniqueDatabases(state)
+  const aliases = getAliases(state)
 
   return {
     graphStyleData: getGraphStyleData(state),
     meta: state.meta,
     user: getCurrentUser(state),
     useDb,
     uniqueDatabases,
+    aliases,
     countAutoRefreshing,
     countLoading
   }

src/browser/modules/DBMSInfo/DatabaseSelector.test.tsx

@@ -45,7 +45,11 @@ describe('DatabaseSelector', () => {
 
     // When
     const { container } = render(
-      <DatabaseSelector selectedDb="" uniqueDatabases={databases} />
+      <DatabaseSelector
+        selectedDb=""
+        uniqueDatabases={databases}
+        aliases={[]}
+      />
     )
 
     // Then
@@ -58,7 +62,11 @@ describe('DatabaseSelector', () => {
 
     // When
     const { getByDisplayValue, queryByDisplayValue, rerender } = render(
-      <DatabaseSelector uniqueDatabases={databases} selectedDb={selected} />
+      <DatabaseSelector
+        uniqueDatabases={databases}
+        selectedDb={selected}
+        aliases={[]}
+      />
     )
 
     // Then
@@ -68,7 +76,11 @@ describe('DatabaseSelector', () => {
     // When
     selected = 'molly'
     rerender(
-      <DatabaseSelector uniqueDatabases={databases} selectedDb={selected} />
+      <DatabaseSelector
+        uniqueDatabases={databases}
+        selectedDb={selected}
+        aliases={[]}
+      />
     )
 
     // Then
@@ -78,7 +90,11 @@ describe('DatabaseSelector', () => {
     // When
     selected = ''
     rerender(
-      <DatabaseSelector uniqueDatabases={databases} selectedDb={selected} />
+      <DatabaseSelector
+        uniqueDatabases={databases}
+        selectedDb={selected}
+        aliases={[]}
+      />
     )
 
     // Then select db text should be shown
@@ -97,6 +113,7 @@ describe('DatabaseSelector', () => {
         uniqueDatabases={databases}
         selectedDb=""
         onChange={onChange}
+        aliases={[]}
       />
     )
     const select = getByTestId(testId)
@@ -126,6 +143,7 @@ describe('DatabaseSelector', () => {
         selectedDb=""
         uniqueDatabases={databases}
         onChange={onChange}
+        aliases={[]}
       />
     )
     const select = getByTestId(testId)

src/browser/modules/DBMSInfo/DatabaseSelector.tsx

@@ -26,7 +26,7 @@ import {
   DrawerSubHeader
 } from 'browser-components/drawer/drawer-styled'
 import { escapeCypherIdentifier } from 'services/utils'
-import { Database } from 'shared/modules/dbMeta/dbMetaDuck'
+import { Alias, Database } from 'shared/modules/dbMeta/dbMetaDuck'
 
 const Select = styled.select`
   width: 100%;
@@ -43,10 +43,12 @@ type DatabaseSelectorProps = {
   uniqueDatabases?: Database[]
   selectedDb: string
   onChange?: (dbName: string) => void
+  aliases: Alias[]
 }
 export const DatabaseSelector = ({
   uniqueDatabases = [],
   selectedDb,
+  aliases,
   onChange = () => undefined
 }: DatabaseSelectorProps): JSX.Element | null => {
   if (uniqueDatabases.length === 0) {
@@ -64,15 +66,23 @@ export const DatabaseSelector = ({
     uniqueDatabases.find(db => db.home) ||
     uniqueDatabases.find(db => db.default)
 
-  const aliasList = uniqueDatabases.flatMap(db =>
-    db.aliases
-      ? db.aliases.map(alias => ({
-          databaseName: db.name,
-          name: alias,
-          status: db.status
-        }))
-      : []
-  )
+  const aliasList = aliases.flatMap(alias => {
+    const aliasedDb = uniqueDatabases.find(db => db.name === alias.database)
+
+    // Don't show composite aliases since they can't be queried directly
+    if (alias.composite) {
+      return []
+    }
+
+    if (aliasedDb === undefined) {
+      return []
+    }
+
+    return {
+      name: alias.name,
+      status: aliasedDb.status
+    }
+  })
 
   const databasesAndAliases = [...aliasList, ...uniqueDatabases].sort((a, b) =>
     a.name.localeCompare(b.name)

src/shared/modules/dbMeta/__snapshots__/dbMetaDuck.test.ts.snap

@@ -2,6 +2,7 @@
 
 exports[`hydrating state can CLEAR to reset state 1`] = `
 Object {
+  "aliases": Array [],
   "countAutomaticRefresh": Object {
     "enabled": true,
     "loading": false,
@@ -69,6 +70,7 @@ Object {
 
 exports[`hydrating state should merge inital state and state on load 1`] = `
 Object {
+  "aliases": Array [],
   "countAutomaticRefresh": Object {
     "enabled": true,
     "loading": false,

src/shared/modules/dbMeta/dbMetaDuck.ts

@@ -206,6 +206,7 @@ export const initialState = {
     storeSize: null
   },
   databases: [],
+  aliases: [],
   serverConfigDone: false,
   settings: initialClientSettings,
   countAutomaticRefresh: {
@@ -229,6 +230,14 @@ export type Database = {
   status: string
 }
 
+export const ALIAS_COMPOSITE_FIELD_FIRST_VERSION = '5.11.0'
+export type Alias = {
+  name: string
+  database: string
+  location: string
+  composite?: string | null // introduced in neo4j 5.11
+}
+
 // Selectors
 export function findDatabaseByNameOrAlias(
   state: GlobalState,
@@ -249,7 +258,7 @@ export function findDatabaseByNameOrAlias(
   )
 }
 
-export function getUniqueDatbases(state: GlobalState): Database[] {
+export function getUniqueDatabases(state: GlobalState): Database[] {
   const uniqueDatabaseNames = uniq(
     state[NAME].databases.map((db: Database) => db.name)
   )
@@ -335,6 +344,10 @@ export const getMetricsPrefix = (state: GlobalState): string =>
 
 export const getDatabases = (state: any): Database[] =>
   (state[NAME] || initialState).databases
+
+export const getAliases = (state: any): null | Alias[] =>
+  (state[NAME] || initialState).aliases
+
 export const getActiveDbName = (state: any) =>
   ((state[NAME] || {}).settings || {})['dbms.active_database']
 

src/shared/modules/dbMeta/dbMetaEpics.ts

@@ -135,6 +135,27 @@ async function databaseList(store: any) {
   } catch {}
 }
 
+async function aliasList(store: any) {
+  try {
+    const hasMultidb = supportsMultiDb(store.getState())
+    if (!hasMultidb) {
+      return
+    }
+
+    const res = await bolt.backgroundWorkerlessRoutedRead(
+      'SHOW ALIASES FOR DATABASE',
+      { useDb: SYSTEM_DB },
+      store
+    )
+
+    if (!res) return
+
+    const aliases = res.records.map((record: any) => record.toObject())
+
+    store.dispatch(update({ aliases }))
+  } catch {}
+}
+
 async function getLabelsAndTypes(store: any) {
   const db = getCurrentDatabase(store.getState())
 
@@ -395,7 +416,8 @@ async function pollDbMeta(store: any) {
   await Promise.all([
     getFunctionsAndProcedures(store),
     clusterRole(store),
-    databaseList(store)
+    databaseList(store),
+    aliasList(store)
   ])
 }