({ id: hostKey, name: $hosts[hostKey].name, icon: 'server', children: Object.keys(connection?.databases || {}).sort().map(dbKey => ({ id: dbKey, name: dbKey, icon: 'db', count: Object.keys(connection.databases[dbKey].collections || {}).length || '', children: Object.keys(connection.databases[dbKey].collections).sort().map(collKey => ({ id: collKey, name: collKey, icon: 'list', menu: [ { label: 'Export collection (JSON, CSV)…', fn: () => dispatch('exportCollection', collKey) }, { label: 'Dump collection (BSON via mongodump)…', fn: () => dispatch('dumpCollection', collKey) }, { separator: true }, { label: 'Rename collection…', fn: () => dispatch('renameCollection', collKey) }, { label: 'Truncate collection…', fn: () => truncateCollection(dbKey, collKey) }, { label: 'Drop collection…', fn: () => dropCollection(dbKey, collKey) }, { separator: true }, { label: 'New collection…', fn: () => dispatch('newCollection') }, ], })) || [], menu: [ { label: 'Drop database…', fn: () => dropDatabase(dbKey) }, { separator: true }, { label: 'New database…', fn: () => dispatch('newDatabase') }, { label: 'New collection…', fn: () => dispatch('newCollection') }, ], })), menu: [ { label: 'New database…', fn: () => dispatch('newDatabase') }, { separator: true }, { label: `Edit host ${$hosts[hostKey].name}…`, fn: () => dispatch('editHost', hostKey) }, { label: `Remove host…`, fn: () => removeHost(hostKey) }, ], }))} bind:activePath={activeGridPath} on:select={e => { const key = e.detail.itemKey; switch (e.detail?.level) { case 0: return openConnection(key); case 1: return openDatabase(key); case 2: return openCollection(key); } }} />