diff --git a/web/packages/teleport/src/Console/Console.tsx b/web/packages/teleport/src/Console/Console.tsx
index 36cf572586dbd..e0bc17f879f4d 100644
--- a/web/packages/teleport/src/Console/Console.tsx
+++ b/web/packages/teleport/src/Console/Console.tsx
@@ -37,6 +37,7 @@ import usePageTitle from './usePageTitle';
 import useTabRouting from './useTabRouting';
 import useOnExitConfirmation from './useOnExitConfirmation';
 import useKeyboardNav from './useKeyboardNav';
+import { DocumentDb } from './DocumentDb';
 
 const POLL_INTERVAL = 5000; // every 5 sec
 
@@ -77,7 +78,9 @@ export default function Console() {
     return consoleCtx.refreshParties();
   }
 
-  const disableNewTab = storeDocs.getNodeDocuments().length > 0;
+  const disableNewTab =
+    storeDocs.getNodeDocuments().length > 0 ||
+    storeDocs.getDbDocuments().length > 0;
   const $docs = documents.map(doc => (
     <MemoizedDocument doc={doc} visible={doc.id === activeDocId} key={doc.id} />
   ));
@@ -139,6 +142,8 @@ function MemoizedDocument(props: { doc: stores.Document; visible: boolean }) {
         return <DocumentNodes doc={doc} visible={visible} />;
       case 'kubeExec':
         return <DocumentKubeExec doc={doc} visible={visible} />;
+      case 'db':
+        return <DocumentDb doc={doc} visible={visible} />;
       default:
         return <DocumentBlank doc={doc} visible={visible} />;
     }
diff --git a/web/packages/teleport/src/Console/DocumentDb/ConnectDialog.tsx b/web/packages/teleport/src/Console/DocumentDb/ConnectDialog.tsx
new file mode 100644
index 0000000000000..6d91f451fe0ae
--- /dev/null
+++ b/web/packages/teleport/src/Console/DocumentDb/ConnectDialog.tsx
@@ -0,0 +1,219 @@
+/**
+ * Teleport
+ * Copyright (C) 2024  Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import React, { useCallback, useEffect, useState } from 'react';
+import Dialog, {
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from 'design/Dialog';
+import { Box, ButtonPrimary, ButtonSecondary, Flex, Indicator } from 'design';
+
+import Validation from 'shared/components/Validation';
+import { Option } from 'shared/components/Select';
+import {
+  FieldSelect,
+  FieldSelectCreatable,
+} from 'shared/components/FieldSelect';
+
+import { Danger } from 'design/Alert';
+import { requiredField } from 'shared/components/Validation/rules';
+import { useAsync } from 'shared/hooks/useAsync';
+
+import { useTeleport } from 'teleport';
+import { Database } from 'teleport/services/databases';
+import { DbConnectData } from 'teleport/lib/term/tty';
+
+export function ConnectDialog(props: {
+  clusterId: string;
+  serviceName: string;
+  onClose(): void;
+  onConnect(data: DbConnectData): void;
+}) {
+  // Fetch database information to pre-fill the connection parameters.
+  const ctx = useTeleport();
+  const [attempt, getDatabase] = useAsync(
+    useCallback(async () => {
+      const response = await ctx.resourceService.fetchUnifiedResources(
+        props.clusterId,
+        {
+          query: `name == "${props.serviceName}"`,
+          kinds: ['db'],
+          sort: { fieldName: 'name', dir: 'ASC' },
+          limit: 1,
+        }
+      );
+
+      // TODO(gabrielcorado): Handle scenarios where there is conflict on the name.
+      if (response.agents.length !== 1 || response.agents[0].kind !== 'db') {
+        throw new Error('Unable to retrieve database information.');
+      }
+
+      return response.agents[0];
+    }, [props.clusterId, ctx.resourceService, props.serviceName])
+  );
+
+  useEffect(() => {
+    void getDatabase();
+  }, [getDatabase]);
+
+  return (
+    <Dialog
+      dialogCss={dialogCss}
+      disableEscapeKeyDown={false}
+      onClose={props.onClose}
+      open={true}
+    >
+      <DialogHeader mb={4}>
+        <DialogTitle>Connect To Database</DialogTitle>
+      </DialogHeader>
+
+      {attempt.status === 'error' && <Danger children={attempt.statusText} />}
+      {(attempt.status === '' || attempt.status === 'processing') && (
+        <Box textAlign="center" m={10}>
+          <Indicator />
+        </Box>
+      )}
+      {attempt.status === 'success' && (
+        <ConnectForm
+          db={attempt.data}
+          onConnect={props.onConnect}
+          onClose={props.onClose}
+        />
+      )}
+    </Dialog>
+  );
+}
+
+function ConnectForm(props: {
+  db: Database;
+  onConnect(data: DbConnectData): void;
+  onClose(): void;
+}) {
+  const dbUserOpts = props.db.users
+    ?.map(user => ({
+      value: user,
+      label: user,
+    }))
+    .filter(removeWildcardOption);
+  const dbNamesOpts = props.db.names
+    ?.map(name => ({
+      value: name,
+      label: name,
+    }))
+    .filter(removeWildcardOption);
+  const dbRolesOpts = props.db.roles
+    ?.map(role => ({
+      value: role,
+      label: role,
+    }))
+    .filter(removeWildcardOption);
+
+  const [selectedName, setSelectedName] = useState<Option>(dbNamesOpts?.[0]);
+  const [selectedUser, setSelectedUser] = useState<Option>(dbUserOpts?.[0]);
+  const [selectedRoles, setSelectedRoles] =
+    useState<readonly Option[]>(dbRolesOpts);
+
+  const dbConnect = () => {
+    props.onConnect({
+      serviceName: props.db.name,
+      protocol: props.db.protocol,
+      dbName: selectedName.value,
+      dbUser: selectedUser.value,
+      dbRoles: selectedRoles?.map(role => role.value),
+    });
+  };
+
+  return (
+    <Validation>
+      {({ validator }) => (
+        <form>
+          <DialogContent flex="0 0 auto">
+            <FieldSelectCreatable
+              label="Database name"
+              menuPosition="fixed"
+              onChange={option => setSelectedName(option as Option)}
+              value={selectedName}
+              options={dbNamesOpts}
+              formatCreateLabel={userInput =>
+                `Use "${userInput}" database name`
+              }
+              rule={requiredField('Database name is required')}
+            />
+            <FieldSelectCreatable
+              label="Database user"
+              menuPosition="fixed"
+              onChange={option => setSelectedUser(option as Option)}
+              value={selectedUser}
+              options={dbUserOpts}
+              formatCreateLabel={userInput =>
+                `Use "${userInput}" database user`
+              }
+              rule={requiredField('Database user is required')}
+            />
+            {dbRolesOpts?.length > 0 && (
+              <FieldSelect
+                label="Database roles"
+                menuPosition="fixed"
+                isMulti={true}
+                onChange={setSelectedRoles}
+                value={selectedRoles}
+                options={dbRolesOpts}
+                rule={requiredField('At least one database role is required')}
+              />
+            )}
+          </DialogContent>
+          <DialogFooter>
+            <Flex alignItems="center" justifyContent="space-between">
+              <ButtonSecondary
+                type="button"
+                width="45%"
+                size="large"
+                onClick={props.onClose}
+              >
+                Close
+              </ButtonSecondary>
+              <ButtonPrimary
+                type="submit"
+                width="45%"
+                size="large"
+                onClick={e => {
+                  e.preventDefault();
+                  validator.validate() && dbConnect();
+                }}
+              >
+                Connect
+              </ButtonPrimary>
+            </Flex>
+          </DialogFooter>
+        </form>
+      )}
+    </Validation>
+  );
+}
+
+function removeWildcardOption({ value }: Option): boolean {
+  return value !== '*';
+}
+
+const dialogCss = () => `
+  min-height: 200px;
+  max-width: 600px;
+  width: 100%;
+`;
diff --git a/web/packages/teleport/src/Console/DocumentDb/DocumentDb.story.tsx b/web/packages/teleport/src/Console/DocumentDb/DocumentDb.story.tsx
new file mode 100644
index 0000000000000..2be3ba4e4bb2f
--- /dev/null
+++ b/web/packages/teleport/src/Console/DocumentDb/DocumentDb.story.tsx
@@ -0,0 +1,202 @@
+/**
+ * Teleport
+ * Copyright (C) 2024  Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import React from 'react';
+
+import { createTeleportContext } from 'teleport/mocks/contexts';
+import ConsoleCtx from 'teleport/Console/consoleContext';
+
+import { ContextProvider } from 'teleport';
+import { TestLayout } from 'teleport/Console/Console.story';
+import TeleportContext from 'teleport/teleportContext';
+import * as stores from 'teleport/Console/stores/types';
+
+import { ResourcesResponse, UnifiedResource } from 'teleport/services/agents';
+
+import { DocumentDb } from './DocumentDb';
+
+export default {
+  title: 'Teleport/Console/DocumentDb',
+};
+
+export const Connect = () => {
+  const { ctx, consoleCtx } = getContexts(
+    Promise.resolve({
+      agents: [
+        {
+          kind: 'db',
+          name: 'mydb',
+          description: '',
+          type: '',
+          protocol: 'postgres',
+          labels: [],
+          names: ['users', 'orders'],
+          users: ['alice', 'bob'],
+          roles: ['reader', 'all'],
+          hostname: '',
+          supportsInteractive: true,
+        },
+      ],
+    })
+  );
+
+  return <DocumentDbWrapper ctx={ctx} consoleCtx={consoleCtx} doc={baseDoc} />;
+};
+
+export const ConnectWithoutRoles = () => {
+  const { ctx, consoleCtx } = getContexts(
+    Promise.resolve({
+      agents: [
+        {
+          kind: 'db',
+          name: 'mydb',
+          description: '',
+          type: '',
+          protocol: 'postgres',
+          labels: [],
+          names: ['users', 'orders'],
+          users: ['alice', 'bob'],
+          hostname: '',
+          supportsInteractive: true,
+        },
+      ],
+    })
+  );
+
+  return <DocumentDbWrapper ctx={ctx} consoleCtx={consoleCtx} doc={baseDoc} />;
+};
+
+export const ConnectWithoutValues = () => {
+  const { ctx, consoleCtx } = getContexts(
+    Promise.resolve({
+      agents: [
+        {
+          kind: 'db',
+          name: 'mydb',
+          description: '',
+          type: '',
+          protocol: 'postgres',
+          labels: [],
+          hostname: '',
+          supportsInteractive: true,
+        },
+      ],
+    })
+  );
+
+  return <DocumentDbWrapper ctx={ctx} consoleCtx={consoleCtx} doc={baseDoc} />;
+};
+
+export const ConnectWithWildcards = () => {
+  const { ctx, consoleCtx } = getContexts(
+    Promise.resolve({
+      agents: [
+        {
+          kind: 'db',
+          name: 'mydb',
+          description: '',
+          type: '',
+          protocol: 'postgres',
+          labels: [],
+          names: ['postgres', '*'],
+          users: ['*'],
+          hostname: '',
+          supportsInteractive: true,
+        },
+      ],
+    })
+  );
+
+  return <DocumentDbWrapper ctx={ctx} consoleCtx={consoleCtx} doc={baseDoc} />;
+};
+
+export const NotFound = () => {
+  const { ctx, consoleCtx } = getContexts(Promise.resolve({ agents: [] }));
+
+  return <DocumentDbWrapper ctx={ctx} consoleCtx={consoleCtx} doc={baseDoc} />;
+};
+
+export const Loading = () => {
+  // Resources list that never resolves.
+  const { ctx, consoleCtx } = getContexts(new Promise(() => {}));
+
+  return <DocumentDbWrapper ctx={ctx} consoleCtx={consoleCtx} doc={baseDoc} />;
+};
+
+export const LoadError = () => {
+  const { ctx, consoleCtx } = getContexts(
+    Promise.reject(new Error('failed to fetch'))
+  );
+
+  return <DocumentDbWrapper ctx={ctx} consoleCtx={consoleCtx} doc={baseDoc} />;
+};
+
+type Props = {
+  ctx: TeleportContext;
+  consoleCtx: ConsoleCtx;
+  doc: stores.DocumentDb;
+};
+
+const DocumentDbWrapper = ({ ctx, consoleCtx, doc }: Props) => {
+  return (
+    <ContextProvider ctx={ctx}>
+      <TestLayout ctx={consoleCtx}>
+        <DocumentDb doc={doc} visible={true} />
+      </TestLayout>
+    </ContextProvider>
+  );
+};
+
+function getContexts(resources: Promise<ResourcesResponse<UnifiedResource>>) {
+  const ctx = createTeleportContext();
+  ctx.resourceService.fetchUnifiedResources = () => resources;
+
+  const consoleCtx = new ConsoleCtx();
+  const tty = consoleCtx.createTty({
+    kind: 'db',
+    login: '123',
+    sid: '456',
+    namespace: '',
+    created: new Date(),
+    durationText: '',
+    serverId: '',
+    resourceName: '',
+    clusterId: '',
+    parties: [],
+    addr: '',
+    participantModes: [],
+    moderated: false,
+    command: '/bin/bash',
+  });
+  tty.connect = () => null;
+  consoleCtx.createTty = () => tty;
+  consoleCtx.storeUser = ctx.storeUser;
+
+  return { ctx, consoleCtx };
+}
+
+const baseDoc = {
+  kind: 'db',
+  status: 'connected',
+  sid: 'sid-value',
+  clusterId: 'clusterId-value',
+  serverId: 'serverId-value',
+  name: 'mydb',
+  url: 'fd',
+  created: new Date(),
+} as const;
diff --git a/web/packages/teleport/src/Console/DocumentDb/DocumentDb.test.tsx b/web/packages/teleport/src/Console/DocumentDb/DocumentDb.test.tsx
new file mode 100644
index 0000000000000..e9870cc89f3d9
--- /dev/null
+++ b/web/packages/teleport/src/Console/DocumentDb/DocumentDb.test.tsx
@@ -0,0 +1,139 @@
+/**
+ * Teleport
+ * Copyright (C) 2024  Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import React from 'react';
+import { screen } from '@testing-library/react';
+
+import '@testing-library/jest-dom';
+
+import 'jest-canvas-mock';
+
+import { act, render } from 'design/utils/testing';
+
+import { ContextProvider } from 'teleport';
+import { TestLayout } from 'teleport/Console/Console.story';
+import ConsoleCtx from 'teleport/Console/consoleContext';
+import { createTeleportContext } from 'teleport/mocks/contexts';
+
+import Tty from 'teleport/lib/term/tty';
+
+import { useDbSession, Status } from './useDbSession';
+
+import { DocumentDb } from './DocumentDb';
+
+import type { Session } from 'teleport/services/session';
+
+jest.mock('./useDbSession');
+
+const mockUseDbSession = useDbSession as jest.MockedFunction<
+  typeof useDbSession
+>;
+
+describe('DocumentDb', () => {
+  const setup = (status: Status) => {
+    mockUseDbSession.mockReturnValue({
+      tty: {
+        sendDbConnectData: jest.fn(),
+        on: jest.fn(),
+        removeListener: jest.fn(),
+        connect: jest.fn(),
+        disconnect: jest.fn(),
+        removeAllListeners: jest.fn(),
+      } as unknown as Tty,
+      status,
+      closeDocument: jest.fn(),
+      sendDbConnectData: jest.fn(),
+      session: baseSession,
+    });
+
+    const { ctx, consoleCtx } = getContexts();
+
+    render(
+      <ContextProvider ctx={ctx}>
+        <TestLayout ctx={consoleCtx}>
+          <DocumentDb doc={baseDoc} visible={true} />
+        </TestLayout>
+      </ContextProvider>
+    );
+  };
+
+  test('renders loading indicator when status is loading', () => {
+    jest.useFakeTimers();
+    setup('loading');
+
+    act(() => jest.runAllTimers());
+    expect(screen.getByTestId('indicator')).toBeInTheDocument();
+  });
+
+  test('renders terminal window when status is initialized', () => {
+    setup('initialized');
+
+    expect(screen.getByTestId('terminal')).toBeInTheDocument();
+  });
+
+  test('renders data dialog when status is waiting', () => {
+    setup('waiting');
+
+    expect(screen.getByText('Connect To Database')).toBeInTheDocument();
+  });
+
+  test('does not render data dialog when status is initialized', () => {
+    setup('initialized');
+
+    expect(screen.queryByText('Connect to Database')).not.toBeInTheDocument();
+  });
+});
+
+function getContexts() {
+  const ctx = createTeleportContext();
+  const consoleCtx = new ConsoleCtx();
+  const tty = consoleCtx.createTty(baseSession);
+  tty.connect = () => null;
+  consoleCtx.createTty = () => tty;
+  consoleCtx.storeUser = ctx.storeUser;
+
+  return { ctx, consoleCtx };
+}
+
+const baseDoc = {
+  kind: 'db',
+  sid: 'sid-value',
+  clusterId: 'clusterId-value',
+  serverId: 'serverId-value',
+  login: 'login-value',
+  url: 'fd',
+  created: new Date(),
+  name: 'mydb',
+} as const;
+
+const baseSession: Session = {
+  kind: 'db',
+  login: '123',
+  sid: '456',
+  namespace: '',
+  created: new Date(),
+  durationText: '',
+  serverId: '',
+  resourceName: '',
+  clusterId: '',
+  parties: [],
+  addr: '',
+  participantModes: [],
+  moderated: false,
+  command: '/bin/bash',
+};
diff --git a/web/packages/teleport/src/Console/DocumentDb/DocumentDb.tsx b/web/packages/teleport/src/Console/DocumentDb/DocumentDb.tsx
new file mode 100644
index 0000000000000..583fb3f5285fd
--- /dev/null
+++ b/web/packages/teleport/src/Console/DocumentDb/DocumentDb.tsx
@@ -0,0 +1,78 @@
+/**
+ * Teleport
+ * Copyright (C) 2024  Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+import React, { useRef, useEffect } from 'react';
+
+import { useTheme } from 'styled-components';
+import { Box, Indicator } from 'design';
+
+import * as stores from 'teleport/Console/stores/types';
+import { Terminal, TerminalRef } from 'teleport/Console/DocumentSsh/Terminal';
+import { useMfa } from 'teleport/lib/useMfa';
+
+import Document from 'teleport/Console/Document';
+import AuthnDialog from 'teleport/components/AuthnDialog';
+
+import { useDbSession } from './useDbSession';
+import { ConnectDialog } from './ConnectDialog';
+
+type Props = {
+  visible: boolean;
+  doc: stores.DocumentDb;
+};
+
+export function DocumentDb({ doc, visible }: Props) {
+  const terminalRef = useRef<TerminalRef>();
+  const { tty, status, closeDocument, sendDbConnectData } = useDbSession(doc);
+  const mfa = useMfa(tty);
+  useEffect(() => {
+    // when switching tabs or closing tabs, focus on visible terminal
+    terminalRef.current?.focus();
+  }, [visible, mfa.requested, status]);
+  const theme = useTheme();
+
+  return (
+    <Document visible={visible} flexDirection="column">
+      {status === 'loading' && (
+        <Box textAlign="center" m={10}>
+          <Indicator />
+        </Box>
+      )}
+      {mfa.requested && <AuthnDialog mfa={mfa} onCancel={closeDocument} />}
+
+      {status === 'waiting' && (
+        <ConnectDialog
+          clusterId={doc.clusterId}
+          serviceName={doc.name}
+          onConnect={sendDbConnectData}
+          onClose={closeDocument}
+        />
+      )}
+      {status !== 'loading' && (
+        <Terminal
+          ref={terminalRef}
+          tty={tty}
+          fontFamily={theme.fonts.mono}
+          theme={theme.colors.terminal}
+          convertEol
+          // TODO(gabrielcorado): remove this once the server can properly handle it.
+          disableCtrlC={true}
+        />
+      )}
+    </Document>
+  );
+}
diff --git a/web/packages/teleport/src/Console/DocumentDb/index.ts b/web/packages/teleport/src/Console/DocumentDb/index.ts
new file mode 100644
index 0000000000000..d4a26f608354d
--- /dev/null
+++ b/web/packages/teleport/src/Console/DocumentDb/index.ts
@@ -0,0 +1,19 @@
+/**
+ * Teleport
+ * Copyright (C) 2024 Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+export { DocumentDb } from './DocumentDb';
diff --git a/web/packages/teleport/src/Console/DocumentDb/useDbSession.tsx b/web/packages/teleport/src/Console/DocumentDb/useDbSession.tsx
new file mode 100644
index 0000000000000..908997b957448
--- /dev/null
+++ b/web/packages/teleport/src/Console/DocumentDb/useDbSession.tsx
@@ -0,0 +1,133 @@
+/**
+ * Teleport
+ * Copyright (C) 2024 Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import React from 'react';
+
+import { context, trace } from '@opentelemetry/api';
+
+import cfg from 'teleport/config';
+import { TermEvent } from 'teleport/lib/term/enums';
+import Tty, { DbConnectData } from 'teleport/lib/term/tty';
+import ConsoleContext from 'teleport/Console/consoleContext';
+import { useConsoleContext } from 'teleport/Console/consoleContextProvider';
+import { DocumentDb } from 'teleport/Console/stores';
+
+import type { Session, SessionMetadata } from 'teleport/services/session';
+
+const tracer = trace.getTracer('TTY');
+
+export function useDbSession(doc: DocumentDb) {
+  const { clusterId, sid } = doc;
+  const ctx = useConsoleContext();
+  const ttyRef = React.useRef<Tty>(null);
+  const tty = ttyRef.current;
+  const [session, setSession] = React.useState<Session>(null);
+  const [status, setStatus] = React.useState<Status>('loading');
+
+  function closeDocument() {
+    ctx.closeTab(doc);
+  }
+
+  function sendDbConnectData(data: DbConnectData): void {
+    tty.sendDbConnectData(data);
+    ctx.updateDbDocument(doc.id, {
+      title: `${data.dbUser}@${data.serviceName}`,
+    });
+    setStatus('initialized');
+  }
+
+  React.useEffect(() => {
+    const session: Session = {
+      kind: 'db',
+      clusterId,
+      sid,
+      resourceName: doc.name,
+    };
+
+    tracer.startActiveSpan(
+      'initTTY',
+      undefined, // SpanOptions
+      context.active(),
+      span => {
+        const tty = ctx.createTty(session);
+
+        // subscribe to tty events to handle connect/disconnects events
+        tty.on(TermEvent.CLOSE, () => ctx.closeTab(doc));
+
+        tty.on(TermEvent.CONN_CLOSE, () => {
+          setStatus('disconnected');
+        });
+
+        tty.on(TermEvent.SESSION, payload => {
+          const data = JSON.parse(payload);
+          data.session.kind = 'db';
+          setSession(data.session);
+          handleTtyConnect(ctx, data.session, doc.id);
+        });
+
+        // assign tty reference so it can be passed down to xterm
+        ttyRef.current = tty;
+        setSession(session);
+        setStatus('waiting');
+        span.end();
+      }
+    );
+
+    function teardownTty() {
+      ttyRef.current?.removeAllListeners();
+    }
+
+    return teardownTty;
+  }, []);
+
+  return {
+    tty,
+    status,
+    session,
+    closeDocument,
+    sendDbConnectData,
+  };
+}
+
+function handleTtyConnect(
+  ctx: ConsoleContext,
+  session: SessionMetadata,
+  docId: number
+) {
+  let { id: sid, cluster_name: clusterId, created } = session;
+
+  // The server response could not include the session ID. To avoid breaking the
+  // redirect, set a value to the session ID.
+  if (sid === '') {
+    sid = 'new';
+  }
+
+  const url = cfg.getDbSessionRoute({ clusterId, sid });
+  const createdDate = new Date(created);
+
+  ctx.updateDbDocument(docId, {
+    url,
+    created: createdDate,
+    sid,
+    clusterId,
+  });
+
+  ctx.gotoTab({ url });
+}
+
+export type Status = 'loading' | 'waiting' | 'initialized' | 'disconnected';
diff --git a/web/packages/teleport/src/Console/DocumentSsh/Terminal/Terminal.tsx b/web/packages/teleport/src/Console/DocumentSsh/Terminal/Terminal.tsx
index e235b296ac7a4..f5188c1ba507e 100644
--- a/web/packages/teleport/src/Console/DocumentSsh/Terminal/Terminal.tsx
+++ b/web/packages/teleport/src/Console/DocumentSsh/Terminal/Terminal.tsx
@@ -43,6 +43,7 @@ export interface TerminalProps {
   convertEol?: boolean;
   // terminalAddons is used to pass the tty to the parent component to enable any optional components like search or filetransfers.
   terminalAddons?: (terminalRef: XTermCtrl) => React.JSX.Element;
+  disableCtrlC?: boolean;
 }
 
 export const Terminal = forwardRef<TerminalRef, TerminalProps>((props, ref) => {
@@ -73,6 +74,10 @@ export const Terminal = forwardRef<TerminalRef, TerminalProps>((props, ref) => {
     termCtrl.open();
 
     const { unregister } = termCtrl.registerCustomKeyEventHandler(event => {
+      if (props.disableCtrlC && event.ctrlKey && event.key == 'c') {
+        return false;
+      }
+
       const { tabSwitch } = getMappedAction(event);
       if (tabSwitch) {
         return false;
diff --git a/web/packages/teleport/src/Console/consoleContext.tsx b/web/packages/teleport/src/Console/consoleContext.tsx
index e875bb557f73c..24f1d8cc4427f 100644
--- a/web/packages/teleport/src/Console/consoleContext.tsx
+++ b/web/packages/teleport/src/Console/consoleContext.tsx
@@ -23,7 +23,11 @@ import { W3CTraceContextPropagator } from '@opentelemetry/core';
 
 import webSession from 'teleport/services/websession';
 import history from 'teleport/services/history';
-import cfg, { UrlKubeExecParams, UrlSshParams } from 'teleport/config';
+import cfg, {
+  UrlDbConnectParams,
+  UrlKubeExecParams,
+  UrlSshParams,
+} from 'teleport/config';
 import { getHostName } from 'teleport/services/api';
 import Tty from 'teleport/lib/term/tty';
 import TtyAddressResolver from 'teleport/lib/term/ttyAddressResolver';
@@ -43,6 +47,7 @@ import {
   DocumentSsh,
   DocumentKubeExec,
   Document,
+  DocumentDb,
 } from './stores';
 
 const logger = Logger.create('teleport/console');
@@ -99,6 +104,10 @@ export default class ConsoleContext {
     this.storeDocs.update(id, partial);
   }
 
+  updateDbDocument(id: number, partial: Partial<DocumentDb>) {
+    this.storeDocs.update(id, partial);
+  }
+
   addNodeDocument(clusterId = cfg.proxyCluster) {
     return this.storeDocs.add({
       clusterId,
@@ -155,6 +164,19 @@ export default class ConsoleContext {
     });
   }
 
+  addDbDocument(params: UrlDbConnectParams) {
+    const url = this.getDbDocumentUrl(params);
+
+    return this.storeDocs.add({
+      kind: 'db',
+      clusterId: params.clusterId,
+      title: params.serviceName,
+      url,
+      created: new Date(),
+      name: params.serviceName,
+    });
+  }
+
   getDocuments() {
     return this.storeDocs.state.items;
   }
@@ -173,6 +195,10 @@ export default class ConsoleContext {
     return cfg.getKubeExecConnectRoute(kubeExecParams);
   }
 
+  getDbDocumentUrl(dbConnectParams: UrlDbConnectParams) {
+    return cfg.getDbConnectRoute(dbConnectParams);
+  }
+
   refreshParties() {
     return tracer.startActiveSpan('refreshParties', span => {
       // Finds unique clusterIds from all active ssh sessions
@@ -221,9 +247,7 @@ export default class ConsoleContext {
     const ctx = context.active();
 
     propagator.inject(ctx, carrier, defaultTextMapSetter);
-    const baseUrl =
-      session.kind === 'k8s' ? cfg.api.ttyKubeExecWsAddr : cfg.api.ttyWsAddr;
-
+    let baseUrl = '';
     let ttyParams = {};
     switch (session.kind) {
       case 'ssh':
@@ -233,9 +257,13 @@ export default class ConsoleContext {
           server_id: serverId,
           mode,
         };
+        baseUrl = cfg.api.ttyWsAddr;
         break;
       case 'k8s':
+        baseUrl = cfg.api.ttyKubeExecWsAddr;
         break;
+      case 'db':
+        baseUrl = cfg.api.ttyDbWsAddr;
     }
 
     const ttyUrl = baseUrl
diff --git a/web/packages/teleport/src/Console/stores/storeDocs.ts b/web/packages/teleport/src/Console/stores/storeDocs.ts
index e1febf0f2971b..dcda98f5df5d0 100644
--- a/web/packages/teleport/src/Console/stores/storeDocs.ts
+++ b/web/packages/teleport/src/Console/stores/storeDocs.ts
@@ -98,6 +98,10 @@ export default class StoreDocs extends Store<State> {
     ) as DocumentSsh[];
   }
 
+  getDbDocuments() {
+    return this.state.items.filter(doc => doc.kind === 'db');
+  }
+
   getDocuments(): Document[] {
     return this.state.items;
   }
diff --git a/web/packages/teleport/src/Console/stores/types.ts b/web/packages/teleport/src/Console/stores/types.ts
index 843ec95ad544f..5817a536850e4 100644
--- a/web/packages/teleport/src/Console/stores/types.ts
+++ b/web/packages/teleport/src/Console/stores/types.ts
@@ -23,7 +23,7 @@ interface DocumentBase {
   title?: string;
   clusterId?: string;
   url: string;
-  kind: 'terminal' | 'nodes' | 'kubeExec' | 'blank';
+  kind: 'terminal' | 'nodes' | 'kubeExec' | 'db' | 'blank';
   created: Date;
 }
 
@@ -64,10 +64,17 @@ export interface DocumentKubeExec extends DocumentBase {
   command: string;
 }
 
+export interface DocumentDb extends DocumentBase {
+  kind: 'db';
+  sid?: string;
+  name: string;
+}
+
 export type Document =
   | DocumentNodes
   | DocumentSsh
   | DocumentKubeExec
+  | DocumentDb
   | DocumentBlank;
 
 export type Parties = Record<string, Participant[]>;
diff --git a/web/packages/teleport/src/Console/useTabRouting.ts b/web/packages/teleport/src/Console/useTabRouting.ts
index b80b5203a1c59..650369d196d08 100644
--- a/web/packages/teleport/src/Console/useTabRouting.ts
+++ b/web/packages/teleport/src/Console/useTabRouting.ts
@@ -19,7 +19,11 @@
 import React from 'react';
 import { useRouteMatch, useParams, useLocation } from 'react-router';
 
-import cfg, { UrlKubeExecParams, UrlSshParams } from 'teleport/config';
+import cfg, {
+  UrlDbConnectParams,
+  UrlKubeExecParams,
+  UrlSshParams,
+} from 'teleport/config';
 import { ParticipantMode } from 'teleport/services/session';
 
 import ConsoleContext from './consoleContext';
@@ -35,6 +39,9 @@ export default function useRouting(ctx: ConsoleContext) {
   const joinSshRouteMatch = useRouteMatch<UrlSshParams>(
     cfg.routes.consoleSession
   );
+  const dbConnectMatch = useRouteMatch<UrlDbConnectParams>(
+    cfg.routes.dbConnect
+  );
 
   // Ensure that each URL has corresponding document
   React.useMemo(() => {
@@ -58,6 +65,8 @@ export default function useRouting(ctx: ConsoleContext) {
       ctx.addNodeDocument(clusterId);
     } else if (kubeExecRouteMatch) {
       ctx.addKubeExecDocument(kubeExecRouteMatch.params);
+    } else if (dbConnectMatch) {
+      ctx.addDbDocument(dbConnectMatch.params);
     }
   }, [ctx, pathname]);
 
diff --git a/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.story.tsx b/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.story.tsx
index 64c53edd97988..347254af33922 100644
--- a/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.story.tsx
+++ b/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.story.tsx
@@ -92,3 +92,15 @@ export const ConnectWithRequestId = () => {
     />
   );
 };
+
+export const ConnectDbSupportsInteractive = () => (
+  <ConnectDialog
+    username="gabriel"
+    dbName="pg"
+    dbProtocol="postgres"
+    clusterId="im-a-cluster"
+    onClose={() => null}
+    authType="local"
+    supportsInteractive={true}
+  />
+);
diff --git a/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.tsx b/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.tsx
index 20394973f0459..d499383e67081 100644
--- a/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.tsx
+++ b/web/packages/teleport/src/Databases/ConnectDialog/ConnectDialog.tsx
@@ -17,7 +17,7 @@
  */
 
 import React from 'react';
-import { Text, Box, ButtonSecondary, Link } from 'design';
+import { Text, Box, ButtonSecondary, Link, ButtonPrimary } from 'design';
 import Dialog, {
   DialogHeader,
   DialogTitle,
@@ -26,9 +26,12 @@ import Dialog, {
 } from 'design/Dialog';
 import { DbProtocol } from 'shared/services/databases';
 
+import { NewTab as NewTabIcon } from 'design/Icon';
+
 import { AuthType } from 'teleport/services/user';
 import TextSelectCopy from 'teleport/components/TextSelectCopy';
-import { generateTshLoginCommand } from 'teleport/lib/util';
+import { generateTshLoginCommand, openNewTab } from 'teleport/lib/util';
+import cfg from 'teleport/config';
 
 export default function ConnectDialog({
   username,
@@ -38,6 +41,7 @@ export default function ConnectDialog({
   authType,
   accessRequestId,
   dbProtocol,
+  supportsInteractive,
 }: Props) {
   // For dynamodb and clickhouse-http protocols, the command is `tsh proxy db --tunnel` instead of `tsh db connect`.
   let connectCommand =
@@ -72,6 +76,12 @@ export default function ConnectDialog({
       dbNameFlag = ' [--db-name=<name>]';
   }
 
+  const onConnect = () => {
+    const url = cfg.getDbConnectRoute({ clusterId, serviceName: dbName });
+    openNewTab(url);
+    onClose();
+  };
+
   return (
     <Dialog
       dialogCss={() => ({
@@ -86,6 +96,17 @@ export default function ConnectDialog({
         <DialogTitle>Connect To Database</DialogTitle>
       </DialogHeader>
       <DialogContent minHeight="240px" flex="0 0 auto">
+        {supportsInteractive && (
+          <Box borderBottom={1} mb={4} pb={4}>
+            <Text mb={3} bold>
+              Open Teleport-authenticated session in the browser:
+            </Text>
+            <ButtonPrimary size="large" gap={2} onClick={onConnect}>
+              Connect in the browser
+              <NewTabIcon />
+            </ButtonPrimary>
+          </Box>
+        )}
         <Box mb={4}>
           <Text bold as="span">
             Step 1
@@ -148,4 +169,5 @@ export type Props = {
   clusterId: string;
   authType: AuthType;
   accessRequestId?: string;
+  supportsInteractive?: boolean;
 };
diff --git a/web/packages/teleport/src/UnifiedResources/ResourceActionButton.tsx b/web/packages/teleport/src/UnifiedResources/ResourceActionButton.tsx
index 63f6661fdbe0d..e8d7a1dfe1978 100644
--- a/web/packages/teleport/src/UnifiedResources/ResourceActionButton.tsx
+++ b/web/packages/teleport/src/UnifiedResources/ResourceActionButton.tsx
@@ -284,7 +284,7 @@ const AppLaunch = ({ app }: AppLaunchProps) => {
 };
 
 function DatabaseConnect({ database }: { database: Database }) {
-  const { name, protocol } = database;
+  const { name, protocol, supportsInteractive } = database;
   const ctx = useTeleport();
   const { clusterId } = useStickyClusterId();
   const [open, setOpen] = useState(false);
@@ -312,6 +312,7 @@ function DatabaseConnect({ database }: { database: Database }) {
           onClose={() => setOpen(false)}
           authType={authType}
           accessRequestId={accessRequestId}
+          supportsInteractive={supportsInteractive}
         />
       )}
     </>
diff --git a/web/packages/teleport/src/config.ts b/web/packages/teleport/src/config.ts
index 9ed5f81675e30..ae7e6114102e3 100644
--- a/web/packages/teleport/src/config.ts
+++ b/web/packages/teleport/src/config.ts
@@ -176,6 +176,8 @@ const cfg = {
     consoleSession: '/web/cluster/:clusterId/console/session/:sid',
     kubeExec: '/web/cluster/:clusterId/console/kube/exec/:kubeId/',
     kubeExecSession: '/web/cluster/:clusterId/console/kube/exec/:sid',
+    dbConnect: '/web/cluster/:clusterId/console/db/connect/:serviceName',
+    dbSession: '/web/cluster/:clusterId/console/db/session/:sid',
     player: '/web/cluster/:clusterId/session/:sid', // ?recordingType=ssh|desktop|k8s&durationMs=1234
     login: '/web/login',
     loginSuccess: '/web/msg/info/login_success',
@@ -256,6 +258,7 @@ const cfg = {
       'wss://:fqdn/v1/webapi/sites/:clusterId/connect/ws?params=:params&traceparent=:traceparent',
     ttyKubeExecWsAddr:
       'wss://:fqdn/v1/webapi/sites/:clusterId/kube/exec/ws?params=:params&traceparent=:traceparent',
+    ttyDbWsAddr: 'wss://:fqdn/v1/webapi/sites/:clusterId/db/exec/ws',
     ttyPlaybackWsAddr:
       'wss://:fqdn/v1/webapi/sites/:clusterId/ttyplayback/:sid?access_token=:token', // TODO(zmb3): get token out of URL
     activeAndPendingSessionsPath: '/v1/webapi/sites/:clusterId/sessions',
@@ -657,6 +660,14 @@ const cfg = {
     });
   },
 
+  getDbConnectRoute(params: UrlDbConnectParams) {
+    return generatePath(cfg.routes.dbConnect, { ...params });
+  },
+
+  getDbSessionRoute({ clusterId, sid }: UrlParams) {
+    return generatePath(cfg.routes.dbSession, { clusterId, sid });
+  },
+
   getKubeExecSessionRoute(
     { clusterId, sid }: UrlParams,
     mode?: ParticipantMode
@@ -1250,6 +1261,11 @@ export interface UrlKubeExecParams {
   kubeId: string;
 }
 
+export interface UrlDbConnectParams {
+  clusterId: string;
+  serviceName: string;
+}
+
 export interface UrlSessionRecordingsParams {
   start: string;
   end: string;
diff --git a/web/packages/teleport/src/lib/term/protobuf.ts b/web/packages/teleport/src/lib/term/protobuf.ts
index 43f5f985a465c..9dbdc3517b357 100644
--- a/web/packages/teleport/src/lib/term/protobuf.ts
+++ b/web/packages/teleport/src/lib/term/protobuf.ts
@@ -33,6 +33,7 @@ export const MessageTypeEnum = {
   ERROR: 'e',
   LATENCY: 'l',
   KUBE_EXEC: 'k',
+  DB_CONNECT: 'd',
 };
 
 export const messageFields = {
@@ -62,6 +63,7 @@ export const messageFields = {
       challengeResponse: MessageTypeEnum.MFA_CHALLENGE.charCodeAt(0),
       kubeExec: MessageTypeEnum.KUBE_EXEC.charCodeAt(0),
       error: MessageTypeEnum.ERROR.charCodeAt(0),
+      dbConnect: MessageTypeEnum.DB_CONNECT.charCodeAt(0),
     },
   },
 };
@@ -95,6 +97,10 @@ export class Protobuf {
     return this.encode(messageFields.type.values.kubeExec, message);
   }
 
+  encodeDbConnectData(message) {
+    return this.encode(messageFields.type.values.dbConnect, message);
+  }
+
   encodeRawMessage(message) {
     return this.encode(messageFields.type.values.data, message);
   }
diff --git a/web/packages/teleport/src/lib/term/tty.ts b/web/packages/teleport/src/lib/term/tty.ts
index 6b28a592e659f..3e924ff466f3f 100644
--- a/web/packages/teleport/src/lib/term/tty.ts
+++ b/web/packages/teleport/src/lib/term/tty.ts
@@ -116,6 +116,12 @@ class Tty extends EventEmitterMfaSender {
     this.socket.send(bytearray);
   }
 
+  sendDbConnectData(data: DbConnectData) {
+    const encoded = this._proto.encodeDbConnectData(JSON.stringify(data));
+    const bytearray = new Uint8Array(encoded);
+    this.socket.send(bytearray);
+  }
+
   _sendFileTransferRequest(message: string) {
     const encoded = this._proto.encodeFileTransferRequest(message);
     const bytearray = new Uint8Array(encoded);
@@ -300,4 +306,12 @@ export type KubeExecData = {
   isInteractive: boolean;
 };
 
+export type DbConnectData = {
+  serviceName: string;
+  protocol: string;
+  dbName: string;
+  dbUser: string;
+  dbRoles: string[];
+};
+
 export default Tty;
diff --git a/web/packages/teleport/src/services/databases/databases.test.ts b/web/packages/teleport/src/services/databases/databases.test.ts
index 9d5f61054acaa..41a695374226c 100644
--- a/web/packages/teleport/src/services/databases/databases.test.ts
+++ b/web/packages/teleport/src/services/databases/databases.test.ts
@@ -39,6 +39,8 @@ test('correct formatting of database fetch response', async () => {
         protocol: 'postgres',
         names: [],
         users: [],
+        roles: [],
+        hostname: '',
         labels: [
           { name: 'cluster', value: 'root' },
           { name: 'env', value: 'aws' },
@@ -49,9 +51,11 @@ test('correct formatting of database fetch response', async () => {
             region: 'us-west-1',
             vpcId: 'vpc-123',
             subnets: ['sn1', 'sn2'],
+            securityGroups: [],
           },
           iamPolicyStatus: IamPolicyStatus.Success,
         },
+        supportsInteractive: false,
       },
       {
         kind: 'db',
@@ -60,7 +64,11 @@ test('correct formatting of database fetch response', async () => {
         protocol: 'postgres',
         names: [],
         users: [],
+        roles: [],
+        hostname: '',
         labels: [],
+        aws: undefined,
+        supportsInteractive: true,
       },
     ],
     startKey: mockResponse.startKey,
@@ -178,6 +186,7 @@ const mockResponse = {
       protocol: 'postgres',
       type: 'rds',
       uri: 'postgres-aurora-instance-1.c1xpjrob56xs.us-west-1.rds.amazonaws.com:5432',
+      hostname: '',
       labels: [
         { name: 'cluster', value: 'root' },
         { name: 'env', value: 'aws' },
@@ -188,6 +197,7 @@ const mockResponse = {
           region: 'us-west-1',
           vpc_id: 'vpc-123',
           subnets: ['sn1', 'sn2'],
+          security_groups: [],
         },
         iam_policy_status: 'IAM_POLICY_STATUS_SUCCESS',
       },
@@ -199,6 +209,8 @@ const mockResponse = {
       protocol: 'postgres',
       uri: 'localhost:5432',
       labels: [],
+      hostname: '',
+      supports_interactive: true,
     },
   ],
   startKey: 'mockKey',
diff --git a/web/packages/teleport/src/services/databases/makeDatabase.ts b/web/packages/teleport/src/services/databases/makeDatabase.ts
index 04b6383b6112a..72193f7c0ecbc 100644
--- a/web/packages/teleport/src/services/databases/makeDatabase.ts
+++ b/web/packages/teleport/src/services/databases/makeDatabase.ts
@@ -51,9 +51,11 @@ export function makeDatabase(json: any): Database {
     labels,
     names: json.database_names || [],
     users: json.database_users || [],
+    roles: json.database_roles || [],
     hostname: json.hostname,
     aws: madeAws,
     requiresRequest,
+    supportsInteractive: json.supports_interactive || false,
   };
 }
 
diff --git a/web/packages/teleport/src/services/databases/types.ts b/web/packages/teleport/src/services/databases/types.ts
index 6615e0bbf577e..e750dc400e58c 100644
--- a/web/packages/teleport/src/services/databases/types.ts
+++ b/web/packages/teleport/src/services/databases/types.ts
@@ -48,9 +48,11 @@ export interface Database {
   labels: ResourceLabel[];
   names?: string[];
   users?: string[];
+  roles?: string[];
   hostname: string;
   aws?: Aws;
   requiresRequest?: boolean;
+  supportsInteractive?: boolean;
 }
 
 export type DatabasesResponse = {
diff --git a/web/packages/teleport/src/services/session/types.ts b/web/packages/teleport/src/services/session/types.ts
index 60d533dab951e..27c3fe0ffbad6 100644
--- a/web/packages/teleport/src/services/session/types.ts
+++ b/web/packages/teleport/src/services/session/types.ts
@@ -23,14 +23,14 @@ export interface Participant {
 export interface Session {
   kind: SessionKind;
   sid: string;
-  namespace: string;
-  login: string;
-  created: Date;
-  durationText: string;
-  serverId: string;
+  namespace?: string;
+  login?: string;
+  created?: Date;
+  durationText?: string;
+  serverId?: string;
   clusterId: string;
-  parties: Participant[];
-  addr: string;
+  parties?: Participant[];
+  addr?: string;
   // resourceName depending on the "kind" field, is the name
   // of resource that the session is running in:
   //  - ssh: is referring to the hostname
@@ -40,11 +40,11 @@ export interface Session {
   //  - app: is referring to the app
   resourceName: string;
   // participantModes are the participant modes that are available to the user listing this session.
-  participantModes: ParticipantMode[];
+  participantModes?: ParticipantMode[];
   // whether this session requires moderation or not. this is NOT if the session is currently being actively moderated
-  moderated: boolean;
+  moderated?: boolean;
   // command is the command that was run to start this session.
-  command: string;
+  command?: string;
 }
 
 export type SessionMetadata = {