chore: update versions (#2701)

This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## @nhost/apollo@7.0.1

### Patch Changes

-   @nhost/nhost-js@3.1.1

## @nhost/react-apollo@11.0.3

### Patch Changes

-   @nhost/apollo@7.0.1
-   @nhost/react@3.4.3

## @nhost/react-urql@8.0.3

### Patch Changes

-   @nhost/react@3.4.3

## @nhost/hasura-storage-js@2.5.1

### Patch Changes

- 8512a7f: fix: fix types StorageGetUrlParams and
StorageGetPresignedUrlParams to include missing StorageHeadersParam

## @nhost/nextjs@2.1.12

### Patch Changes

-   @nhost/react@3.4.3

## @nhost/nhost-js@3.1.1

### Patch Changes

-   Updated dependencies [8512a7f]
    -   @nhost/hasura-storage-js@2.5.1

## @nhost/react@3.4.3

### Patch Changes

-   @nhost/nhost-js@3.1.1

## @nhost/vue@2.5.3

### Patch Changes

-   @nhost/nhost-js@3.1.1

## @nhost/dashboard@1.15.1

### Patch Changes

-   @nhost/react-apollo@11.0.3
-   @nhost/nextjs@2.1.12

## @nhost-examples/cli@0.3.3

### Patch Changes

-   @nhost/nhost-js@3.1.1

## @nhost-examples/codegen-react-apollo@0.4.3

### Patch Changes

-   @nhost/react@3.4.3
-   @nhost/react-apollo@11.0.3

## @nhost-examples/codegen-react-query@0.4.3

### Patch Changes

-   @nhost/react@3.4.3

## @nhost-examples/codegen-react-urql@0.3.3

### Patch Changes

-   @nhost/react@3.4.3
-   @nhost/react-urql@8.0.3

## @nhost-examples/multi-tenant-one-to-many@2.2.3

### Patch Changes

-   @nhost/nhost-js@3.1.1

## @nhost-examples/nextjs@0.3.3

### Patch Changes

-   @nhost/react@3.4.3
-   @nhost/react-apollo@11.0.3
-   @nhost/nextjs@2.1.12

## @nhost-examples/node-storage@0.2.3

### Patch Changes

-   @nhost/nhost-js@3.1.1

## @nhost-examples/nextjs-server-components@0.4.3

### Patch Changes

-   @nhost/nhost-js@3.1.1

## @nhost-examples/react-apollo@0.8.3

### Patch Changes

-   @nhost/react@3.4.3
-   @nhost/react-apollo@11.0.3

## @nhost-examples/react-gqty@1.2.3

### Patch Changes

-   @nhost/react@3.4.3

## @nhost-examples/vue-apollo@0.6.3

### Patch Changes

-   @nhost/nhost-js@3.1.1
-   @nhost/apollo@7.0.1
-   @nhost/vue@2.5.3

## @nhost-examples/vue-quickstart@0.2.3

### Patch Changes

-   @nhost/apollo@7.0.1
-   @nhost/vue@2.5.3

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

.changeset/config.json

@@ -5,6 +5,5 @@
   "linked": [],
   "access": "restricted",
   "baseBranch": "main",
-  "updateInternalDependencies": "patch",
-  "ignore": ["@nhost-examples/sveltekit"]
+  "updateInternalDependencies": "patch"
 }

.github/CODEOWNERS

@@ -1,14 +1,14 @@
 # Documentation
 # https://help.github.com/en/articles/about-code-owners
 
-/packages                                @szilarddoro
-/packages/docgen                         @szilarddoro
-/integrations/stripe-graphql-js          @elitan
-/.github                                 @szilarddoro
-/dashboard/                              @szilarddoro
-/docs/                                   @elitan
-/config/                                 @szilarddoro
-/examples/                               @szilarddoro
-/examples/codegen-react-apollo           @elitan @szilarddoro
-/examples/codegen-react-query            @elitan @szilarddoro
-/examples/react-apollo-crm               @elitan @szilarddoro
+/packages                                @nunopato @onehassan
+/packages/docgen                         @nunopato @onehassan
+/integrations/stripe-graphql-js          @nunopato @onehassan
+/.github                                 @nunopato @onehassan
+/dashboard/                              @nunopato @onehassan
+/docs/                                   @nunopato @onehassan
+/config/                                 @nunopato @onehassan
+/examples/                               @nunopato @onehassan
+/examples/codegen-react-apollo           @nunopato @onehassan
+/examples/codegen-react-query            @nunopato @onehassan
+/examples/react-apollo-crm               @nunopato @onehassan

.github/actions/install-dependencies/action.yaml

@@ -14,7 +14,7 @@ runs:
   steps:
     - uses: pnpm/action-setup@v2.2.4
       with:
-        version: 8.6.2
+        version: 8.10.5
         run_install: false
     - name: Get pnpm cache directory
       id: pnpm-cache-dir

.github/labeler.yml

@@ -4,7 +4,6 @@ dashboard:
 documentation:
   - any:
       - docs/**/*
-      - '!docs/docs/reference/docgen/**/*'
 
 examples:
   - examples/**/*

.github/renovate.json

@@ -1,23 +0,0 @@
-{
-  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": [
-    "config:base"
-  ],
-  "docker-compose": {
-    "enabled": true
-  },
-  "ignoreDeps": [
-    "pnpm",
-    "node",
-    "@types/node"
-  ],
-  "labels": [
-    "dependencies"
-  ],
-  "enabledManagers": [
-    "npm",
-    "dockerfile",
-    "docker-compose",
-    "github-actions"
-  ]
-}

.github/workflows/changesets.yaml

@@ -42,6 +42,7 @@ jobs:
           commit: 'chore: update versions'
           title: 'chore: update versions'
           publish: pnpm run release
+          createGithubReleases: false
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
@@ -62,12 +63,39 @@ jobs:
     uses: ./.github/workflows/dashboard.yaml
     secrets: inherit
 
+  publish-vercel:
+    name: Publish to Vercel
+    runs-on: ubuntu-latest
+    needs:
+      - test
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - name: Install Node and dependencies
+        uses: ./.github/actions/install-dependencies
+        with:
+          TURBO_TOKEN: ${{ env.TURBO_TOKEN }}
+          TURBO_TEAM: ${{ env.TURBO_TEAM }}
+      - name: Setup Vercel CLI
+        run: pnpm add -g vercel
+      - name: Trigger a Vercel deployment
+        env:
+          VERCEL_ORG_ID: ${{ secrets.DASHBOARD_VERCEL_TEAM_ID }}
+          VERCEL_PROJECT_ID: ${{ secrets.DASHBOARD_VERCEL_PROJECT_ID }}
+        run: |
+          vercel pull --environment=production --token=${{ secrets.DASHBOARD_VERCEL_DEPLOY_TOKEN }}
+          vercel build --prod --token=${{ secrets.DASHBOARD_VERCEL_DEPLOY_TOKEN }}
+          vercel deploy --prebuilt --prod --token=${{ secrets.DASHBOARD_VERCEL_DEPLOY_TOKEN }}
+
   publish-docker:
     name: Publish to Docker Hub
     runs-on: ubuntu-latest
     needs:
       - test
       - version
+      - publish-vercel
     steps:
       - name: Checkout repository
         uses: actions/checkout@v3
@@ -113,42 +141,6 @@ jobs:
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
           push: true
-      - name: Create GitHub Release
-        uses: taiki-e/create-gh-release-action@v1
-        with:
-          changelog: dashboard/CHANGELOG.md
-          token: ${{ secrets.GITHUB_TOKEN }}
-          prefix: ${{ env.DASHBOARD_PACKAGE }}@
-          ref: refs/tags/${{ env.DASHBOARD_PACKAGE }}@${{ needs.version.outputs.dashboardVersion }}
-      - name: Remove tag on failure
-        if: failure()
-        run: git push --delete origin ${{ env.DASHBOARD_PACKAGE }}@${{ needs.version.outputs.dashboardVersion }}
-
-  publish-vercel:
-    name: Publish to Vercel
-    runs-on: ubuntu-latest
-    needs:
-      - publish-docker
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-      - name: Install Node and dependencies
-        uses: ./.github/actions/install-dependencies
-        with:
-          TURBO_TOKEN: ${{ env.TURBO_TOKEN }}
-          TURBO_TEAM: ${{ env.TURBO_TEAM }}
-      - name: Setup Vercel CLI
-        run: pnpm add -g vercel
-      - name: Trigger a Vercel deployment
-        env:
-          VERCEL_ORG_ID: ${{ secrets.DASHBOARD_VERCEL_TEAM_ID }}
-          VERCEL_PROJECT_ID: ${{ secrets.DASHBOARD_VERCEL_PROJECT_ID }}
-        run: |
-          vercel pull --environment=production --token=${{ secrets.DASHBOARD_VERCEL_DEPLOY_TOKEN }}
-          vercel build --prod --token=${{ secrets.DASHBOARD_VERCEL_DEPLOY_TOKEN }}
-          vercel deploy --prebuilt --prod --token=${{ secrets.DASHBOARD_VERCEL_DEPLOY_TOKEN }}
 
   bump-cli:
     name: Bump Dashboard version in the Nhost CLI

.github/workflows/ci.yaml

@@ -106,6 +106,8 @@ jobs:
       # * Run every `lint` script in the workspace . Dependencies build is cached by Turborepo
       - name: Lint
         run: pnpm run lint:all
+      - name: Audit for vulnerabilities
+        run: pnpx audit-ci --config ./audit-ci.jsonc
 
   e2e:
     name: 'E2E (Package: ${{ matrix.package.path }})'
@@ -146,7 +148,7 @@ jobs:
         run: echo "NHOST_TEST_DASHBOARD_URL=https://${{ steps.fetch-dashboard-preview-url.outputs.preview_url }}" >> $GITHUB_ENV
       # * Run the `ci` script of the current package of the matrix. Dependencies build is cached by Turborepo
       - name: Run e2e tests
-        timeout-minutes: 15
+        timeout-minutes: 20
         run: pnpm --filter="${{ matrix.package.name }}" run e2e
       - id: file-name
         if: ${{ failure() }}

.github/workflows/gen_schedule_update_deps.yaml

@@ -0,0 +1,82 @@
+---
+name: "gen: update depenendencies"
+on:
+  schedule:
+    - cron: '0 2 1 * *'
+
+jobs:
+  run:
+    runs-on: ubuntu-latest
+
+    permissions:
+      id-token: write
+      contents: write
+      pull-requests: write
+
+    steps:
+    - name: Check out repository
+      uses: actions/checkout@v4
+      with:
+        fetch-depth: 0
+
+    - name: Configure aws
+      uses: aws-actions/configure-aws-credentials@v4
+      with:
+        role-to-assume: arn:aws:iam::${{ secrets.AWS_PRODUCTION_CORE_ACCOUNT_ID }}:role/github-actions-nhost-${{ github.event.repository.name }}
+        aws-region: eu-central-1
+
+    - uses: nixbuild/nix-quick-install-action@v26
+      with:
+        nix_version: 2.16.2
+        nix_conf: |
+          experimental-features = nix-command flakes
+          sandbox = false
+          access-tokens = github.com=${{ secrets.GITHUB_TOKEN }}
+          substituters = https://cache.nixos.org/?priority=40 s3://nhost-nix-cache?region=eu-central-1&priority=50
+          trusted-public-keys = cache.nixos.org-1:6NCHdD59X431o0gWypbMrAURkbJ16ZPMQFGspcDShjY= ${{ secrets.NIX_CACHE_PUB_KEY }}
+
+    - name: Cache nix store
+      uses: actions/cache@v4
+      with:
+        path: /nix
+        key: nix-update-deps-${{ hashFiles('flakes.nix', 'flake.lock') }}
+
+    - name: Update nix flakes
+      run: nix flake update
+
+    - name: Update dependencies
+      run: |
+        nix develop -c bash -c "
+          pnpm dedupe
+          pnpm update -r
+          pnpm dedupe
+        "
+
+    - name: Create Pull Request
+      uses: peter-evans/create-pull-request@v6
+      with:
+        token: ${{ secrets.GITHUB_TOKEN }}
+        commit-message: Update dependencies
+        committer: GitHub <noreply@github.com>
+        author: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
+        signoff: false
+        branch: automated/update-deps
+        delete-branch: true
+        title: '[Scheduled] Update dependencies'
+        body: |
+          Dependencies updated
+
+          Note - If you see this PR and the checks haven't run, close and reopen the PR. See https://github.com/peter-evans/create-pull-request/blob/main/docs/concepts-guidelines.md#triggering-further-workflow-runs
+        labels: |
+          dependencies
+        draft: false
+
+    - name: "Cache nix store on s3"
+      run: |
+        echo ${{ secrets.NIX_CACHE_PRIV_KEY }} > cache-priv-key.pem
+        nix build .\#devShells.x86_64-linux.default
+        nix store sign --key-file cache-priv-key.pem --all
+        nix copy --to s3://nhost-nix-cache\?region=eu-central-1 .\#devShells.x86_64-linux.default
+
+    - run: rm cache-priv-key.pem
+      if: always()

.gitignore

@@ -19,11 +19,11 @@ logs/
 coverage/
 dist/
 umd/
-node_modules/
+node_modules
 tmp/
 .pnpm-store
 .turbo
-.env
+.env*
 .secrets
 out/
 

.npmrc

@@ -1 +1,2 @@
-prefer-workspace-packages = true
+prefer-workspace-packages = true
+auto-install-peers = false

.vscode/settings.json

@@ -1,6 +0,0 @@
-{
-  "editor.codeActionsOnSave": {
-    "source.organizeImports": true
-  },
-  "eslint.workingDirectories": ["./dashboard"]
-}

SECURITY.md

@@ -0,0 +1,7 @@
+# Security Policy
+
+## Reporting a Vulnerability
+
+At Nhost, we take security vulnerabilities seriously and appreciate the assistance of the community in bringing any issues to our attention. If you discover a security vulnerability, please use the GitHub Security Advisory ["Report a Vulnerability"](https://github.com/nhost/nhost/security/advisories/new) tab.
+
+Once you have submitted the report, we will promptly conduct a thorough investigation within 72 hours. In case we need further information, we may contact you for additional details. Rest assured that addressing the reported vulnerability in a timely manner is our top priority.

audit-ci.jsonc

@@ -0,0 +1,6 @@
+{
+  // $schema provides code completion hints to IDEs.
+  "$schema": "https://github.com/IBM/audit-ci/raw/main/docs/schema.json",
+  "moderate": true,
+  "allowlist": ["trim-newlines"]
+}

config/.husky/pre-commit

@@ -1,4 +1,7 @@
 #!/bin/sh
+#
+[ -n "$CI" ] && exit 0
+
 . "$(dirname "$0")/_/husky.sh"
 
 pnpm dlx lint-staged --config config/.lintstagedrc.js

dashboard/.env.example

@@ -16,3 +16,6 @@ NEXT_PUBLIC_STRIPE_PK=<nhost_stripe_public_key>
 NEXT_PUBLIC_GITHUB_APP_INSTALL_URL=<github_app_install_url>
 NEXT_PUBLIC_ANALYTICS_WRITE_KEY=<analytics_write_key>
 NEXT_PUBLIC_NHOST_BRAGI_WEBSOCKET=<nhost_bragi_websocket>
+
+CODEGEN_GRAPHQL_URL=https://local.graphql.nhost.run/v1
+CODEGEN_HASURA_ADMIN_SECRET=nhost-admin-secret

dashboard/CHANGELOG.md

@@ -1,5 +1,408 @@
 # @nhost/dashboard
 
+## 1.15.1
+
+### Patch Changes
+
+- @nhost/react-apollo@11.0.3
+- @nhost/nextjs@2.1.12
+
+## 1.15.0
+
+### Minor Changes
+
+- a7bde37: feat: send metadata in the edit form
+
+### Patch Changes
+
+- 1bc615b: feat: improve error message handling in `ErrorToast` component
+  - @nhost/react-apollo@11.0.2
+  - @nhost/nextjs@2.1.11
+
+## 1.14.0
+
+### Minor Changes
+
+- a448d7d: feat: allow configuring postmark and delete SMTP settings
+
+## 1.13.3
+
+### Patch Changes
+
+- 5924bc3: fix: include password in `GetSmtpSettings` query
+- c5ad634: fix: resolved an issue where one-click install links were broken on Safari
+- 7278991: fix: update graphql auto-embeddings configuration to use String type for model field
+
+## 1.13.2
+
+### Patch Changes
+
+- 026f84f: fix: use configuration server URL from environment variable
+
+## 1.13.1
+
+### Patch Changes
+
+- 7e9a2ce: fix: resolve issue where run services form fails to open
+
+## 1.13.0
+
+### Minor Changes
+
+- dd5d262: feat: add model field to the auto-embeddings form
+- 09962be: feat: enable settings and run services when running the dashboard locally
+- 9cdecb6: feat: enable users to update their email address from the account settings page
+
+## 1.12.2
+
+### Patch Changes
+
+- c195c51: fix: send email upon signin for unverified users
+
+## 1.12.1
+
+### Patch Changes
+
+- 93ebdf8: fix: use service urls when initilizaing NhostClient running local dashboard
+  - @nhost/react-apollo@11.0.1
+  - @nhost/nextjs@2.1.10
+
+## 1.12.0
+
+### Minor Changes
+
+- f242e4b: feat: add connect with github to the user's account settings
+- 768ca17: chore: update dependencies
+- d62bd0f: fix: "Track this" option within the SQL editor now correctly updates the metadata
+- 91c2bb6: feat: refactor sign-in and sign-up pages to enforce email verification
+
+### Patch Changes
+
+- 943831f: fix: resolve an error toast issue when unpausing a project
+- Updated dependencies [768ca17]
+  - @nhost/react-apollo@11.0.0
+  - @nhost/nextjs@2.1.9
+
+## 1.11.2
+
+### Patch Changes
+
+- @nhost/react-apollo@10.0.2
+- @nhost/nextjs@2.1.8
+
+## 1.11.1
+
+### Patch Changes
+
+- 981404f: fix: set default value for healthCheck field validation
+
+## 1.11.0
+
+### Minor Changes
+
+- 7789469: chore: upgrade dependency `@graphql-codegen/cli` to `5.0.2` to address vulnerability
+- 6c11b75: feat: add update user displayName section in account settings
+
+### Patch Changes
+
+- @nhost/react-apollo@10.0.1
+- @nhost/nextjs@2.1.7
+
+## 1.10.0
+
+### Minor Changes
+
+- 49a80c2: chore: update dependencies
+- 150c04a: feat: add healthcheck config to run services
+
+### Patch Changes
+
+- e03f141: fix: allow insert, update and delete on tables in `auth` and `storage` schemas
+- 28676f4: feat: add min postgres version check to enable the ai service
+- Updated dependencies [49a80c2]
+  - @nhost/react-apollo@10.0.0
+  - @nhost/nextjs@2.1.6
+
+## 1.9.0
+
+### Minor Changes
+
+- d86e5c9: feat: add support for filtering the logs using a RegExp
+
+## 1.8.3
+
+### Patch Changes
+
+- @nhost/react-apollo@9.0.3
+- @nhost/nextjs@2.1.5
+
+## 1.8.2
+
+### Patch Changes
+
+- 6df4f02: fix: use custom error toast and show correct message when sending an invite
+
+## 1.8.1
+
+### Patch Changes
+
+- @nhost/react-apollo@9.0.2
+- @nhost/nextjs@2.1.4
+
+## 1.8.0
+
+### Minor Changes
+
+- 713d53c: feat: add catch-all route for workspace/project - useful for documentation
+
+### Patch Changes
+
+- 3db2999: fix: refresh table list after running SQL using the editor
+- 3c4dd55: fix: handle `Error` objects properly in the `ErrorToast` component
+- 92b434e: fix: resolve an issue where the checkbox in the data-grid header did not select all rows
+  - @nhost/react-apollo@9.0.1
+  - @nhost/nextjs@2.1.3
+
+## 1.7.0
+
+### Minor Changes
+
+- 0d8d0eb: Update docs and dashboard references
+
+## 1.6.9
+
+### Patch Changes
+
+- @nhost/react-apollo@9.0.0
+- @nhost/nextjs@2.1.2
+
+## 1.6.8
+
+### Patch Changes
+
+- @nhost/react-apollo@8.0.1
+- @nhost/nextjs@2.1.1
+
+## 1.6.7
+
+### Patch Changes
+
+- 5ef5189: fix: update `@apollo/client` to `3.9.4` to fix a cache bug
+
+## 1.6.6
+
+### Patch Changes
+
+- 3ba485e: fix: added discord.com to connect-src
+- e5bab6a: chore: update dependencies
+- Updated dependencies [b19ffed]
+- Updated dependencies [e5bab6a]
+  - @nhost/nextjs@2.1.0
+  - @nhost/react-apollo@8.0.0
+
+## 1.6.5
+
+### Patch Changes
+
+- ba73bb4: fix: update ErrorToast component to show the internal graphql error
+- d5337ff: fix: utilize accumulator in the creation of validation schema within data grid utils
+
+## 1.6.4
+
+### Patch Changes
+
+- 7c2a1c2: feat: show error and debug info in the error toast
+
+## 1.6.3
+
+### Patch Changes
+
+- 6b8aad5: fix: add bare nhost.run to CSP
+
+## 1.6.2
+
+### Patch Changes
+
+- b18edc0: feat: added CSP and X-Frame-Options
+
+## 1.6.1
+
+### Patch Changes
+
+- 8d91f71: chore: update deps and enable pnpm audit
+- 3b8473b: chore: update turbo to `1.11.3` and pnpm to `8.10.5` in Dockerfile
+- Updated dependencies [8d91f71]
+  - @nhost/react-apollo@7.0.2
+  - @nhost/nextjs@2.0.2
+
+## 1.6.0
+
+### Minor Changes
+
+- 3ff1c2b53: fix: show upgrade option for pro projects
+
+## 1.5.0
+
+### Minor Changes
+
+- c2ef17c0a: feat: add support for new Team plan
+
+## 1.4.0
+
+### Minor Changes
+
+- 7883bbcbd: feat: don't show deprecated plans
+- 44be6dc0a: feat: set redirectTo during sign-in to support preview environments
+
+### Patch Changes
+
+- 3c3594898: fix: allow access to graphite when configured running in local dashboard
+- 32c246b7a: chore: update docs icon
+
+## 1.3.2
+
+### Patch Changes
+
+- 174b4165b: chore: use env variables when running graphql codegen
+- 7c977e714: chore: change `Allowed Roles` to `Default Allowed Roles`
+- 46f028b9f: fix: remove hardcoded ai version setting
+
+## 1.3.1
+
+### Patch Changes
+
+- af33c21d1: chore: remove backendUrl deprecation notice and remove all references to `providersUpdated`
+
+## 1.3.0
+
+### Minor Changes
+
+- 04784d880: Fix graphite's default version
+
+## 1.2.0
+
+### Minor Changes
+
+- 5733162ed: feat: add settings and ui for graphite
+
+## 1.1.0
+
+### Minor Changes
+
+- e2b79b5ec: chore: remove sharp from deps
+
+## 1.0.1
+
+### Patch Changes
+
+- @nhost/react-apollo@7.0.1
+- @nhost/nextjs@2.0.1
+
+## 1.0.0
+
+### Major Changes
+
+- bc9eff6e4: chore: remove support for using backendUrl when instantiating the Nhost client
+
+### Patch Changes
+
+- Updated dependencies [bc9eff6e4]
+  - @nhost/nextjs@2.0.0
+  - @nhost/react-apollo@7.0.0
+
+## 0.21.1
+
+### Patch Changes
+
+- 97ced73a3: fix(dashboard): prevent dashboard from resolving secrets
+
+## 0.21.0
+
+### Minor Changes
+
+- ed1a8d458: Update alert message on increasing PostgreSQL's volume capacity
+- 2e2248fd4: feat(dashboard): add SQL editor
+
+## 0.20.28
+
+### Patch Changes
+
+- 7c2c31082: feat: add support for users to delete their account
+  - @nhost/react-apollo@6.0.1
+  - @nhost/nextjs@1.13.40
+
+## 0.20.27
+
+### Patch Changes
+
+- fa79b7709: chore(dashboard): tweaks and fixes to the service form and dialog
+- 8df84d782: fix(dashboard): allow resetting custom domains
+  - @nhost/react-apollo@6.0.0
+  - @nhost/nextjs@1.13.39
+
+## 0.20.26
+
+### Patch Changes
+
+- 331ba0376: feat(dashboard): add postgres storage capacity modifier in the settings
+- b7f801874: feat(dashboard): add new settings page for custom domains
+
+## 0.20.25
+
+### Patch Changes
+
+- @nhost/react-apollo@5.0.38
+
+## 0.20.24
+
+### Patch Changes
+
+- e10389ecf: fix(dashboard): disable run tab when developing locally
+  - @nhost/react-apollo@5.0.37
+
+## 0.20.23
+
+### Patch Changes
+
+- c01568a7d: chore(dashboard): show alert to update oauth providers
+
+## 0.20.22
+
+### Patch Changes
+
+- c3efb7ec8: feat(dashboard): query latest announcement from platform
+
+## 0.20.21
+
+### Patch Changes
+
+- 3e46d3873: chore: update link to node18 announcement
+
+## 0.20.20
+
+### Patch Changes
+
+- @nhost/react-apollo@5.0.36
+- @nhost/nextjs@1.13.38
+
+## 0.20.19
+
+### Patch Changes
+
+- 75c4c8ae3: feat(dashboard): make env value input multiline
+
+## 0.20.18
+
+### Patch Changes
+
+- 425d485f8: fix(dashboard): make sure dedicated resources pricing follows total resources
+
+## 0.20.17
+
+### Patch Changes
+
+- ae324f67f: fix(dashboard): remove unused graphql fields
+
 ## 0.20.16
 
 ### Patch Changes

dashboard/Dockerfile

@@ -1,13 +1,13 @@
-FROM node:16-alpine AS pruner
+FROM node:18-alpine AS pruner
 RUN apk add --no-cache libc6-compat
 RUN apk update
 WORKDIR /app
 
-RUN yarn global add turbo@1.10.11
+RUN yarn global add turbo@1.11.3
 COPY . .
 RUN turbo prune --scope="@nhost/dashboard" --docker
 
-FROM node:16-alpine AS builder
+FROM node:18-alpine AS builder
 ARG TURBO_TOKEN
 ARG TURBO_TEAM
 
@@ -28,8 +28,9 @@ ENV NEXT_PUBLIC_NHOST_STORAGE_URL __NEXT_PUBLIC_NHOST_STORAGE_URL__
 ENV NEXT_PUBLIC_NHOST_HASURA_CONSOLE_URL __NEXT_PUBLIC_NHOST_HASURA_CONSOLE_URL__
 ENV NEXT_PUBLIC_NHOST_HASURA_MIGRATIONS_API_URL __NEXT_PUBLIC_NHOST_HASURA_MIGRATIONS_API_URL__
 ENV NEXT_PUBLIC_NHOST_HASURA_API_URL __NEXT_PUBLIC_NHOST_HASURA_API_URL__
+ENV NEXT_PUBLIC_NHOST_CONFIGSERVER_URL __NEXT_PUBLIC_NHOST_CONFIGSERVER_URL__
 
-RUN yarn global add pnpm@8.6.2
+RUN yarn global add pnpm@8.10.5
 COPY .gitignore .gitignore
 COPY --from=pruner /app/out/json/ .
 COPY --from=pruner /app/out/pnpm-*.yaml .
@@ -40,7 +41,7 @@ COPY turbo.json turbo.json
 COPY config/ config/
 RUN pnpm build:dashboard
 
-FROM node:16-alpine AS runner
+FROM node:18-alpine AS runner
 WORKDIR /app
 
 RUN addgroup --system --gid 1001 nodejs

dashboard/docker-entrypoint.sh

@@ -21,5 +21,6 @@ find dashboard -type f -exec sed -i "s~__NEXT_PUBLIC_NHOST_STORAGE_URL__~${NEXT_
 find dashboard -type f -exec sed -i "s~__NEXT_PUBLIC_NHOST_HASURA_CONSOLE_URL__~${NEXT_PUBLIC_NHOST_HASURA_CONSOLE_URL}~g" {} +
 find dashboard -type f -exec sed -i "s~__NEXT_PUBLIC_NHOST_HASURA_MIGRATIONS_API_URL__~${NEXT_PUBLIC_NHOST_HASURA_MIGRATIONS_API_URL}~g" {} +
 find dashboard -type f -exec sed -i "s~__NEXT_PUBLIC_NHOST_HASURA_API_URL__~${NEXT_PUBLIC_NHOST_HASURA_API_URL}~g" {} +
+find dashboard -type f -exec sed -i "s~__NEXT_PUBLIC_NHOST_CONFIGSERVER_URL__~${NEXT_PUBLIC_NHOST_CONFIGSERVER_URL}~g" {} +
 
 exec "$@"

dashboard/e2e/account/pat/manage-pat.test.ts

@@ -27,7 +27,7 @@ test('should be able to create then delete a personal access token', async () =>
   const patName = faker.lorem.slug(3);
 
   await page.getByRole('textbox', { name: /name/i }).fill(patName);
-  await page.getByRole('button', { name: /expiration/i }).click();
+  await page.getByLabel('Expiration').click();
   await page.getByRole('option', { name: /7 days/i }).click();
   await page.getByRole('button', { name: /create/i }).click();
 

dashboard/e2e/database/create-table.test.ts

@@ -138,7 +138,8 @@ test('should create a table with an identity column', async () => {
     ],
   });
 
-  await page.getByRole('button', { name: /identity/i }).click();
+  // await page.getByRole('button', { name: /identity/i }).click();
+  await page.getByLabel('Identity').click();
   await page.getByRole('option', { name: /id/i }).click();
 
   // create table
@@ -194,26 +195,18 @@ test('should create table with foreign key constraint', async () => {
 
   await page.getByRole('button', { name: /add foreign key/i }).click();
 
-  // select column in current table
-  await page
-    .getByRole('button', { name: /column/i })
-    .first()
-    .click();
+  await page.locator('#columnName').click();
   await page.getByRole('option', { name: /author_id/i }).click();
 
   // select reference schema
-  await page.getByRole('button', { name: /schema/i }).click();
+  await page.getByLabel('Schema').click();
   await page.getByRole('option', { name: /public/i }).click();
 
   // select reference table
-  await page.getByRole('button', { name: /table/i }).click();
+  await page.getByLabel('Table').click();
   await page.getByRole('option', { name: firstTableName, exact: true }).click();
 
-  // select reference column
-  await page
-    .getByRole('button', { name: /column/i })
-    .nth(1)
-    .click();
+  await page.locator('#referencedColumn').click();
   await page.getByRole('option', { name: /id/i }).click();
 
   await page.getByRole('button', { name: /add/i }).click();

dashboard/e2e/database/delete-table.test.ts

@@ -113,27 +113,21 @@ test('should not be able to delete a table if other tables have foreign keys ref
   await page.getByRole('button', { name: /add foreign key/i }).click();
 
   // select column in current table
-  await page
-    .getByRole('button', { name: /column/i })
-    .first()
-    .click();
+  await page.locator('#columnName').click();
+
   await page.getByRole('option', { name: /author_id/i }).click();
 
   // select reference schema
-  await page.getByRole('button', { name: /schema/i }).click();
+  await page.getByLabel('Schema').click();
   await page.getByRole('option', { name: /public/i }).click();
 
   // select reference table
-  await page.getByRole('button', { name: /table/i }).click();
+  await page.getByLabel('Table').click();
   await page.getByRole('option', { name: firstTableName, exact: true }).click();
 
   // select reference column
-  await page
-    .getByRole('button', { name: /column/i })
-    .nth(1)
-    .click();
+  await page.locator('#referencedColumn').click();
   await page.getByRole('option', { name: /id/i }).click();
-
   await page.getByRole('button', { name: /add/i }).click();
 
   await expect(

dashboard/e2e/e2e-tests-project/.gitignore

@@ -0,0 +1,2 @@
+.secrets
+.nhost

dashboard/e2e/e2e-tests-project/nhost/config.yaml

@@ -0,0 +1 @@
+version: 3

dashboard/e2e/e2e-tests-project/nhost/emails/bg/email-confirm-change/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Потвърдете смяната на вашия имейл</h2>
+  <p>Използвайте посочения линк, за да повърдите смяната на имейл:</p>
+  <p>
+    <a href="${link}">
+      Смени имейл
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/bg/email-confirm-change/subject.txt

@@ -0,0 +1 @@
+Потвърждение за смяна на имейл

dashboard/e2e/e2e-tests-project/nhost/emails/bg/email-verify/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Потвърдете вашия имейл</h2>
+  <p>Използвайте посочения линк, за да потвърдите вашия имейл:</p>
+  <p>
+    <a href="${link}">
+      Потвърдете имейл
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/bg/email-verify/subject.txt

@@ -0,0 +1 @@
+Потвърждаване на имейл

dashboard/e2e/e2e-tests-project/nhost/emails/bg/password-reset/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Смяна на парола</h2>
+  <p>Използвайте посочения линк, за да смените вашата парола:</p>
+  <p>
+    <a href="${link}">
+      Смяна на парола
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/bg/password-reset/subject.txt

@@ -0,0 +1 @@
+Смяна на парола

dashboard/e2e/e2e-tests-project/nhost/emails/bg/signin-passwordless-sms/body.txt

@@ -0,0 +1 @@
+Вашият код е ${code}.

dashboard/e2e/e2e-tests-project/nhost/emails/bg/signin-passwordless/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Магически линк за вход</h2>
+  <p>Използвайте посочения линк за защитен и бърз вход:</p>
+  <p>
+    <a href="${link}">
+      Вход
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/bg/signin-passwordless/subject.txt

@@ -0,0 +1 @@
+Магически линк за вход

dashboard/e2e/e2e-tests-project/nhost/emails/cs/email-confirm-change/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Potvrzení změny emailové adresy</h2>
+  <p>Použijte tento odkaz k potvrzení změny emailové adresy:</p>
+  <p>
+    <a href="${link}">
+      Změnit email
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/cs/email-confirm-change/subject.txt

@@ -0,0 +1 @@
+Změna vaší emailové adresy

dashboard/e2e/e2e-tests-project/nhost/emails/cs/email-verify/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Ověření emailové adresy</h2>
+  <p>Použijte tento odkaz k ověření vaší emailové adresy:</p>
+  <p>
+    <a href="${link}">
+      Ověřit emailovou adresu
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/cs/email-verify/subject.txt

@@ -0,0 +1 @@
+Ověření vaší emailové adresy

dashboard/e2e/e2e-tests-project/nhost/emails/cs/password-reset/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Obnova hesla</h2>
+  <p>Použijte tento odkaz k obnovení vašeho hesla:</p>
+  <p>
+    <a href="${link}">
+      Obnova hesla
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/cs/password-reset/subject.txt

@@ -0,0 +1 @@
+Obnova hesla

dashboard/e2e/e2e-tests-project/nhost/emails/cs/signin-passwordless-sms/body.txt

@@ -0,0 +1 @@
+Váš kód je ${code}.

dashboard/e2e/e2e-tests-project/nhost/emails/cs/signin-passwordless/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Magický odkaz</h2>
+  <p>Použijte tento odkaz k bezpečnému přihlášení:</p>
+  <p>
+    <a href="${link}">
+      Přihlášení
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/cs/signin-passwordless/subject.txt

@@ -0,0 +1 @@
+Bezpečný odkaz k přihlášení

dashboard/e2e/e2e-tests-project/nhost/emails/en/email-confirm-change/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Confirm Email Change</h2>
+  <p>Use this link to confirm changing email:</p>
+  <p>
+    <a href="${link}">
+      Change email
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/en/email-confirm-change/subject.txt

@@ -0,0 +1 @@
+Change your email address

dashboard/e2e/e2e-tests-project/nhost/emails/en/email-verify/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Verify Email</h2>
+  <p>Use this link to verify your email:</p>
+  <p>
+    <a href="${link}">
+      Verify Email
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/en/email-verify/subject.txt

@@ -0,0 +1 @@
+Verify your email

dashboard/e2e/e2e-tests-project/nhost/emails/en/password-reset/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Reset Password</h2>
+  <p>Use this link to reset your password:</p>
+  <p>
+    <a href="${link}">
+      Reset password
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/en/password-reset/subject.txt

@@ -0,0 +1 @@
+Reset your password

dashboard/e2e/e2e-tests-project/nhost/emails/en/signin-passwordless-sms/body.txt

@@ -0,0 +1 @@
+Your code is ${code}.

dashboard/e2e/e2e-tests-project/nhost/emails/en/signin-passwordless/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Magic Link</h2>
+  <p>Use this link to securely sign in:</p>
+  <p>
+    <a href="${link}">
+      Sign In
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/en/signin-passwordless/subject.txt

@@ -0,0 +1 @@
+Secure sign-in link

dashboard/e2e/e2e-tests-project/nhost/emails/es/email-confirm-change/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Confirmar cambio de correo electrónico</h2>
+  <p>Utiliza el siguiente enlace para confirmar el cambio de correo:</p>
+  <p>
+    <a href="${link}">
+      Cambiar correo electrónico
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/es/email-confirm-change/subject.txt

@@ -0,0 +1 @@
+Cambiar dirección de correo electrónico

dashboard/e2e/e2e-tests-project/nhost/emails/es/email-verify/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Verificar correo electrónico</h2>
+  <p>Utilza el siguiente enlace para verificar tu correo:</p>
+  <p>
+    <a href="${link}">
+      Verificar correo electrónico
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/es/email-verify/subject.txt

@@ -0,0 +1 @@
+Verifica tu correo electrónico

dashboard/e2e/e2e-tests-project/nhost/emails/es/password-reset/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Recuperar contraseña</h2>
+  <p>Utiliza el siguiente enlace para recuperar tu contraseña:</p>
+  <p>
+    <a href="${link}">
+      Recuperar contraseña
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/es/password-reset/subject.txt

@@ -0,0 +1 @@
+Recuperar contraseña

dashboard/e2e/e2e-tests-project/nhost/emails/es/signin-passwordless-sms/body.txt

@@ -0,0 +1 @@
+Tu código es ${code}.

dashboard/e2e/e2e-tests-project/nhost/emails/es/signin-passwordless/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Enlace mágico</h2>
+  <p>Utiliza este enlace para iniciar sesión de forma segura:</p>
+  <p>
+    <a href="${link}">
+      Iniciar sesión
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/es/signin-passwordless/subject.txt

@@ -0,0 +1 @@
+Enlace de acceso seguro

dashboard/e2e/e2e-tests-project/nhost/emails/fr/email-confirm-change/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Confirmer changement de courriel</h2>
+  <p>Utilisez ce lien pour confirmer le changement de courriel :</p>
+  <p>
+    <a href="${link}">
+      Changer courriel
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/fr/email-confirm-change/subject.txt

@@ -0,0 +1 @@
+Changez votre adresse courriel

dashboard/e2e/e2e-tests-project/nhost/emails/fr/email-verify/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>V&eacute;rifiez votre courriel</h2>
+  <p>Utilisez ce lien pour v&eacute;rifier votre courriel :</p>
+  <p>
+    <a href="${link}">
+      V&eacute;rifier courriel
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/fr/email-verify/subject.txt

@@ -0,0 +1 @@
+Vérifier votre courriel

dashboard/e2e/e2e-tests-project/nhost/emails/fr/password-reset/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>R&eacute;initialiser votre mot de passe</h2>
+  <p>Utilisez ce lien pour r&eacute;initialiser votre mot de passe :</p>
+  <p>
+    <a href="${link}">
+      R&eacute;initialiser mot de passe
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/fr/password-reset/subject.txt

@@ -0,0 +1 @@
+Réinitialiser votre mot de passe

dashboard/e2e/e2e-tests-project/nhost/emails/fr/signin-passwordless-sms/body.txt

@@ -0,0 +1 @@
+Votre code est ${code}.

dashboard/e2e/e2e-tests-project/nhost/emails/fr/signin-passwordless/body.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+</head>
+
+<body>
+  <h2>Lien magique</h2>
+  <p>Utilisez ce lien pour vous connecter de fa&ccedil;on s&eacute;curisée :</p>
+  <p>
+    <a href="${link}">
+      Connexion
+    </a>
+  </p>
+</body>
+
+</html>

dashboard/e2e/e2e-tests-project/nhost/emails/fr/signin-passwordless/subject.txt

@@ -0,0 +1 @@
+Lien de connexion sécurisé

dashboard/e2e/e2e-tests-project/nhost/emails/test/email-verify/body.html

@@ -0,0 +1,8 @@
+${link},
+${displayName},
+${email},
+${ticket},
+${redirectTo},
+${serverUrl},
+${clientUrl},
+${locale},

dashboard/e2e/e2e-tests-project/nhost/emails/test/email-verify/subject.txt

@@ -0,0 +1 @@
+${link}, ${displayName}, ${email}, ${ticket}, ${redirectTo}, ${serverUrl}, ${clientUrl}, ${locale}

dashboard/e2e/e2e-tests-project/nhost/nhost.toml

@@ -0,0 +1,151 @@
+[global]
+
+[hasura]
+version = 'v2.33.4-ce'
+adminSecret = '{{ secrets.HASURA_GRAPHQL_ADMIN_SECRET }}'
+webhookSecret = '{{ secrets.NHOST_WEBHOOK_SECRET }}'
+
+[[hasura.jwtSecrets]]
+type = 'HS256'
+key = '{{ secrets.HASURA_GRAPHQL_JWT_SECRET }}'
+
+[hasura.settings]
+corsDomain = ['*']
+devMode = true
+enableAllowList = false
+enableConsole = true
+enableRemoteSchemaPermissions = false
+enabledAPIs = ['metadata', 'graphql', 'pgdump', 'config']
+liveQueriesMultiplexedRefetchInterval = 1000
+stringifyNumericTypes = false
+
+[hasura.logs]
+level = 'warn'
+
+[hasura.events]
+httpPoolSize = 100
+
+[functions]
+[functions.node]
+version = 18
+
+[auth]
+version = '0.24.1'
+
+[auth.elevatedPrivileges]
+mode = 'disabled'
+
+[auth.redirections]
+clientUrl = 'http://localhost:3000'
+
+[auth.signUp]
+enabled = true
+disableNewUsers = false
+
+[auth.user]
+[auth.user.roles]
+default = 'user'
+allowed = ['user', 'me']
+
+[auth.user.locale]
+default = 'en'
+allowed = ['en']
+
+[auth.user.gravatar]
+enabled = true
+default = 'blank'
+rating = 'g'
+
+[auth.user.email]
+
+[auth.user.emailDomains]
+
+[auth.session]
+[auth.session.accessToken]
+expiresIn = 900
+
+[auth.session.refreshToken]
+expiresIn = 2592000
+
+[auth.method]
+[auth.method.anonymous]
+enabled = false
+
+[auth.method.emailPasswordless]
+enabled = false
+
+[auth.method.emailPassword]
+hibpEnabled = false
+emailVerificationRequired = true
+passwordMinLength = 9
+
+[auth.method.smsPasswordless]
+enabled = false
+
+[auth.method.oauth]
+[auth.method.oauth.apple]
+enabled = false
+
+[auth.method.oauth.azuread]
+tenant = 'common'
+enabled = false
+
+[auth.method.oauth.bitbucket]
+enabled = false
+
+[auth.method.oauth.discord]
+enabled = false
+
+[auth.method.oauth.facebook]
+enabled = false
+
+[auth.method.oauth.github]
+enabled = false
+
+[auth.method.oauth.gitlab]
+enabled = false
+
+[auth.method.oauth.google]
+enabled = false
+
+[auth.method.oauth.linkedin]
+enabled = false
+
+[auth.method.oauth.spotify]
+enabled = false
+
+[auth.method.oauth.strava]
+enabled = false
+
+[auth.method.oauth.twitch]
+enabled = false
+
+[auth.method.oauth.twitter]
+enabled = false
+
+[auth.method.oauth.windowslive]
+enabled = false
+
+[auth.method.oauth.workos]
+enabled = false
+
+[auth.method.webauthn]
+enabled = false
+
+[auth.method.webauthn.attestation]
+timeout = 60000
+
+[auth.totp]
+enabled = false
+
+[postgres]
+version = '14.6-20240129-1'
+
+[provider]
+
+[storage]
+version = '0.6.0'
+
+[observability]
+[observability.grafana]
+adminPassword = '{{ secrets.GRAFANA_ADMIN_PASSWORD }}'

dashboard/e2e/overview/overview.test.ts

@@ -30,7 +30,7 @@ test('should show a sidebar with menu items', async () => {
   const navLocator = page.getByRole('navigation', { name: /main navigation/i });
   await expect(navLocator).toBeVisible();
   await expect(navLocator.getByRole('list').getByRole('listitem')).toHaveCount(
-    12,
+    13,
   );
   await expect(
     navLocator.getByRole('link', { name: /overview/i }),
@@ -93,7 +93,7 @@ test("should show the project's region and subdomain", async () => {
 
 test('should not have a GitHub repository connected', async () => {
   await expect(
-    page.getByRole('button', { name: /connect to github/i }),
+    page.getByRole('button', { name: /connect to github/i }).first(),
   ).toBeVisible();
 });
 

dashboard/e2e/utils.ts

@@ -116,7 +116,8 @@ export async function prepareTable({
   );
 
   // select the first column as primary key
-  await page.getByRole('button', { name: /primary key/i }).click();
+  // await page.getByRole('button', { name: /primary key/i }).click();
+  await page.getByLabel('Primary Key').click();
   await page.getByRole('option', { name: primaryKey, exact: true }).click();
 }
 

dashboard/graphite.graphql.config.yaml

@@ -0,0 +1,14 @@
+schema:
+  - https://local.graphql.nhost.run/v1:
+      headers:
+        x-hasura-admin-secret: nhost-admin-secret
+generates:
+  src/utils/__generated__/graphite.graphql.ts:
+    documents:
+      - 'src/gql/graphite/**/*.gql'
+    plugins:
+      - 'typescript'
+      - 'typescript-operations'
+      - 'typescript-react-apollo'
+    config:
+      withRefetchFn: true

dashboard/graphql.config.yaml

@@ -1,12 +1,13 @@
 schema:
-  - https://local.graphql.nhost.run/v1:
+  - ${CODEGEN_GRAPHQL_URL}:
       headers:
-        x-hasura-admin-secret: nhost-admin-secret
+        x-hasura-admin-secret: ${CODEGEN_HASURA_ADMIN_SECRET}
 generates:
   src/utils/__generated__/graphql.ts:
     documents:
       - 'src/**/*.graphql'
       - 'src/**/*.gql'
+      - '!src/gql/graphite/**/*.gql'
     plugins:
       - 'typescript'
       - 'typescript-operations'

dashboard/hypertune.graphql

@@ -1,5 +0,0 @@
-query InitQuery {
-  root {
-    enableServices
-  }
-}

dashboard/hypertune.json

@@ -1,5 +0,0 @@
-{
-  "projectId": 2596,
-  "token": "U2FsdGVkX19+V8BJnVR0xLEC+42OW5qZl/A0i6beAaRmJoIhFh5Yf6eIKBzLbV9h",
-  "outputDirectoryPath": "src/hypertune"
-}

dashboard/next.config.js

@@ -4,6 +4,20 @@ const withBundleAnalyzer = require('@next/bundle-analyzer')({
 });
 const { version } = require('./package.json');
 
+const cspHeader = `
+    default-src 'self' *.nhost.run ws://*.nhost.run nhost.run ws://nhost.run;
+    script-src 'self' 'unsafe-eval' 'unsafe-inline' cdn.segment.com js.stripe.com;
+    connect-src 'self' *.nhost.run ws://*.nhost.run nhost.run ws://nhost.run discord.com;
+    style-src 'self' 'unsafe-inline';
+    img-src 'self' blob: data: avatars.githubusercontent.com s.gravatar.com *.nhost.run nhost.run;
+    font-src 'self' data:;
+    object-src 'none';
+    base-uri 'self';
+    form-action 'self';
+    frame-ancestors 'none';
+    frame-src 'self' js.stripe.com;
+`;
+
 module.exports = withBundleAnalyzer({
   reactStrictMode: true,
   swcMinify: false,
@@ -17,6 +31,19 @@ module.exports = withBundleAnalyzer({
   eslint: {
     dirs: ['src'],
   },
+  async headers() {
+    return [
+      {
+        source: '/(.*)',
+        headers: [
+          {
+            key: 'X-Frame-Options',
+            value: 'SAMEORIGIN',
+          },
+        ],
+      },
+    ];
+  },
   async redirects() {
     return [
       {

dashboard/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/dashboard",
-  "version": "0.20.16",
+  "version": "1.15.1",
   "private": true,
   "scripts": {
     "preinstall": "npx only-allow pnpm",
@@ -10,150 +10,159 @@
     "start": "next start",
     "lint": "next lint --max-warnings 0",
     "test": "vitest",
-    "codegen": "graphql-codegen --config graphql.config.yaml --errors-only",
+    "codegen": "DOTENV_CONFIG_PATH=./.env.local graphql-codegen -r dotenv/config --config graphql.config.yaml --errors-only",
+    "codegen-graphite": "graphql-codegen --config graphite.graphql.config.yaml --errors-only",
     "format": "prettier --write \"src/**/*.{js,ts,tsx,jsx,json,md}\" --plugin-search-dir=.",
     "storybook": "start-storybook -p 6006 -s public",
     "build-storybook": "build-storybook",
-    "install-browsers": "pnpm dlx playwright@1.31.0 install --with-deps",
-    "e2e": "pnpm install-browsers && pnpm dlx playwright@1.31.0 test"
+    "install-browsers": "pnpm playwright install && pnpm playwright install-deps",
+    "e2e": "pnpm install-browsers && pnpm playwright test"
   },
   "dependencies": {
-    "@apollo/client": "^3.7.10",
-    "@codemirror/language": "^6.3.0",
-    "@emotion/cache": "^11.10.5",
-    "@emotion/react": "^11.10.5",
-    "@emotion/server": "^11.4.0",
-    "@emotion/styled": "^11.10.5",
-    "@fontsource/inter": "^5.0.0",
-    "@fontsource/roboto-mono": "^5.0.0",
-    "@graphiql/react": "^0.18.0",
-    "@graphiql/toolkit": "^0.8.2",
-    "@headlessui/react": "^1.6.5",
+    "@apollo/client": "^3.9.9",
+    "@codemirror/lang-sql": "^6.6.2",
+    "@emotion/cache": "^11.11.0",
+    "@emotion/react": "^11.11.4",
+    "@emotion/server": "^11.11.0",
+    "@emotion/styled": "^11.11.5",
+    "@fontsource/inter": "^5.0.17",
+    "@fontsource/roboto-mono": "^5.0.17",
+    "@graphiql/react": "^0.20.3",
+    "@graphiql/toolkit": "^0.9.1",
+    "@headlessui/react": "^1.7.18",
     "@heroicons/react": "^1.0.6",
-    "@hookform/resolvers": "^3.0.0",
-    "@mui/base": "^5.0.0-alpha.106",
-    "@mui/material": "^5.10.14",
-    "@mui/system": "^5.10.14",
-    "@mui/x-date-pickers": "^5.0.8",
+    "@hookform/resolvers": "^3.3.4",
+    "@mui/base": "5.0.0-beta.31",
+    "@mui/material": "^5.15.14",
+    "@mui/system": "^5.15.14",
+    "@mui/x-date-pickers": "^5.0.20",
     "@nhost/nextjs": "workspace:*",
     "@nhost/react-apollo": "workspace:*",
-    "@segment/snippet": "^4.15.3",
-    "@stripe/react-stripe-js": "^2.0.0",
-    "@stripe/stripe-js": "^1.35.0",
-    "@tailwindcss/forms": "^0.5.3",
-    "@tanstack/react-query": "^4.16.1",
-    "@tanstack/react-table": "^8.5.30",
-    "@tanstack/react-virtual": "^3.0.0-beta.23",
+    "@segment/snippet": "^4.16.2",
+    "@stripe/react-stripe-js": "^2.6.2",
+    "@stripe/stripe-js": "^1.54.2",
+    "@tailwindcss/forms": "^0.5.7",
+    "@tanstack/react-query": "^4.36.1",
+    "@tanstack/react-table": "^8.15.3",
+    "@tanstack/react-virtual": "^3.2.0",
+    "@uiw/codemirror-theme-github": "^4.21.25",
+    "@uiw/react-codemirror": "^4.21.25",
     "analytics-node": "^6.2.0",
     "bcryptjs": "^2.4.3",
     "clsx": "^1.2.1",
-    "date-fns": "^2.29.3",
-    "generate-password": "^1.7.0",
-    "graphiql": "^3.0.0",
-    "graphql": "^16.6.0",
-    "graphql-request": "^6.0.0",
+    "date-fns": "^2.30.0",
+    "framer-motion": "^10.18.0",
+    "generate-password": "^1.7.1",
+    "graphiql": "^3.1.1",
+    "graphql": "16.8.1",
+    "graphql-request": "^6.1.0",
     "graphql-tag": "^2.12.6",
-    "graphql-ws": "^5.11.2",
-    "hypertune": "^1.4.4",
-    "just-kebab-case": "^4.1.1",
+    "graphql-ws": "^5.16.0",
+    "just-kebab-case": "^4.2.0",
     "lodash.debounce": "^4.0.8",
-    "next": "^12.3.1",
-    "next-seo": "^6.0.0",
+    "next": "^14.1.4",
+    "next-seo": "^6.5.0",
     "node-pg-format": "^1.3.5",
     "pluralize": "^8.0.0",
     "react": "18.2.0",
+    "react-children-utilities": "^2.10.0",
     "react-dom": "18.2.0",
-    "react-error-boundary": "^4.0.0",
-    "react-hook-form": "^7.42.1",
-    "react-hot-toast": "^2.4.0",
-    "react-intersection-observer": "^9.5.2",
+    "react-error-boundary": "^4.0.13",
+    "react-hook-form": "^7.51.2",
+    "react-hot-toast": "^2.4.1",
+    "react-intersection-observer": "^9.8.1",
     "react-is": "18.2.0",
     "react-loading-skeleton": "^2.2.0",
+    "react-markdown": "^9.0.1",
     "react-merge-refs": "^1.1.0",
-    "react-syntax-highlighter": "^15.4.5",
+    "react-resizable-layout": "^0.7.2",
     "react-table": "^7.8.0",
-    "sharp": "^0.32.0",
+    "recoil": "^0.7.7",
+    "recoil-persist": "^5.1.0",
+    "rehype-highlight": "^7.0.0",
+    "remark-gfm": "^4.0.0",
     "shell-quote": "^1.8.1",
-    "slugify": "^1.6.5",
+    "slugify": "^1.6.6",
     "stripe": "^10.17.0",
-    "tailwind-merge": "^1.8.0",
-    "utility-types": "^3.10.0",
-    "validator": "^13.7.0",
-    "yup": "^1.0.2",
+    "tailwind-merge": "^1.14.0",
+    "utility-types": "^3.11.0",
+    "validator": "^13.11.0",
+    "yup": "^1.4.0",
     "yup-password": "^0.2.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.20.2",
+    "@babel/core": "^7.24.3",
     "@faker-js/faker": "^7.6.0",
-    "@graphql-codegen/cli": "^3.0.0",
-    "@graphql-codegen/typescript": "^3.0.0",
-    "@graphql-codegen/typescript-operations": "^3.0.0",
-    "@graphql-codegen/typescript-react-apollo": "^3.3.1",
-    "@next/bundle-analyzer": "^12.3.1",
-    "@playwright/test": "1.31.0",
-    "@storybook/addon-actions": "^6.5.14",
-    "@storybook/addon-essentials": "^6.5.14",
-    "@storybook/addon-interactions": "^6.5.14",
-    "@storybook/addon-links": "^6.5.14",
+    "@graphql-codegen/cli": "^5.0.2",
+    "@graphql-codegen/typescript": "^3.0.4",
+    "@graphql-codegen/typescript-operations": "^3.0.4",
+    "@graphql-codegen/typescript-react-apollo": "^3.3.7",
+    "@next/bundle-analyzer": "^12.3.4",
+    "@playwright/test": "1.41.0",
+    "@storybook/addon-actions": "^6.5.16",
+    "@storybook/addon-essentials": "^6.5.16",
+    "@storybook/addon-interactions": "^6.5.16",
+    "@storybook/addon-links": "^6.5.16",
     "@storybook/addon-postcss": "^2.0.0",
-    "@storybook/builder-webpack5": "^6.5.14",
-    "@storybook/manager-webpack5": "^6.5.14",
-    "@storybook/react": "^6.5.14",
-    "@storybook/testing-library": "^0.2.0",
-    "@testing-library/dom": "^9.0.0",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^14.0.0",
-    "@testing-library/user-event": "^14.4.3",
+    "@storybook/builder-webpack5": "^6.5.16",
+    "@storybook/manager-webpack5": "^6.5.16",
+    "@storybook/react": "^7.6.17",
+    "@storybook/testing-library": "^0.2.2",
+    "@tailwindcss/typography": "^0.5.12",
+    "@testing-library/dom": "^9.3.4",
+    "@testing-library/jest-dom": "^5.17.0",
+    "@testing-library/react": "^14.2.2",
+    "@testing-library/user-event": "^14.5.2",
     "@types/ace": "^0.0.48",
-    "@types/bcryptjs": "^2.4.2",
-    "@types/jest": "^29.5.3",
-    "@types/lodash.debounce": "^4.0.7",
-    "@types/node": "^16.11.7",
+    "@types/bcryptjs": "^2.4.6",
+    "@types/jest": "^29.5.12",
+    "@types/lodash.debounce": "^4.0.9",
+    "@types/node": "^16.18.93",
     "@types/pluralize": "^0.0.30",
-    "@types/react": "^18.2.14",
-    "@types/react-dom": "^18.2.6",
-    "@types/react-table": "^7.7.12",
-    "@types/shell-quote": "^1.7.1",
-    "@types/testing-library__jest-dom": "^5.14.5",
-    "@types/validator": "^13.7.10",
-    "@typescript-eslint/eslint-plugin": "^5.43.0",
-    "@typescript-eslint/parser": "^5.43.0",
-    "@vitejs/plugin-react": "^4.0.0",
-    "@vitest/coverage-v8": "^0.32.0",
-    "autoprefixer": "^10.4.13",
+    "@types/react": "^18.2.73",
+    "@types/react-dom": "^18.2.23",
+    "@types/react-table": "^7.7.20",
+    "@types/shell-quote": "^1.7.5",
+    "@types/testing-library__jest-dom": "^5.14.9",
+    "@types/validator": "^13.11.9",
+    "@typescript-eslint/eslint-plugin": "^6.21.0",
+    "@typescript-eslint/parser": "^6.21.0",
+    "@vitejs/plugin-react": "^4.2.1",
+    "@vitest/coverage-v8": "^0.32.4",
+    "autoprefixer": "^10.4.19",
     "babel-loader": "^8.3.0",
     "babel-plugin-transform-remove-console": "^6.9.4",
-    "csstype": "^3.0.10",
-    "dotenv": "^16.0.3",
+    "csstype": "^3.1.3",
+    "dotenv": "^16.4.5",
     "encoding": "^0.1.13",
-    "eslint": "^8.28.0",
+    "eslint": "^8.57.0",
     "eslint-config-airbnb": "19.0.4",
-    "eslint-config-airbnb-typescript": "^17.0.0",
-    "eslint-config-next": "^13.0.2",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jsx-a11y": "^6.6.1",
-    "eslint-plugin-react": "^7.31.11",
+    "eslint-config-airbnb-typescript": "^17.1.0",
+    "eslint-config-next": "^13.5.6",
+    "eslint-config-prettier": "^8.10.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-react": "^7.34.1",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "jsdom": "^22.0.0",
-    "lint-staged": ">=13",
-    "msw": "^1.0.1",
-    "msw-storybook-addon": "^1.6.3",
-    "node-fetch": "^3.3.0",
-    "postcss": "^8.4.19",
-    "prettier": "^2.7.1",
-    "prettier-plugin-organize-imports": "^3.2.0",
-    "prettier-plugin-tailwindcss": "^0.4.0",
+    "jsdom": "^22.1.0",
+    "lint-staged": "^15.2.2",
+    "msw": "^1.3.3",
+    "msw-storybook-addon": "^1.10.0",
+    "node-fetch": "^3.3.2",
+    "postcss": "^8.4.38",
+    "prettier": "^2.8.8",
+    "prettier-plugin-organize-imports": "^3.2.4",
+    "prettier-plugin-tailwindcss": "^0.4.1",
     "react-date-fns-hooks": "^0.9.4",
     "require-from-string": "^2.0.2",
     "snake-case": "^3.0.4",
-    "storybook-addon-next-router": "^4.0.1",
-    "tailwindcss": "^3.1.2",
-    "ts-node": "^10.9.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "vite": "^4.0.2",
-    "vite-tsconfig-paths": "^4.0.3",
-    "vitest": "^0.32.0"
+    "storybook-addon-next-router": "^4.0.2",
+    "tailwindcss": "^3.4.3",
+    "ts-node": "^10.9.2",
+    "tsconfig-paths-webpack-plugin": "^4.1.0",
+    "vite": "^5.2.7",
+    "vite-tsconfig-paths": "^4.3.2",
+    "vitest": "^0.32.4"
   },
   "browserslist": {
     "production": [

dashboard/public/logos/Note.svg

@@ -0,0 +1,7 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 6H10" stroke="#21324B" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6 8H10" stroke="#21324B" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6 10H8" stroke="#21324B" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M9.79289 13.5H3C2.86739 13.5 2.74021 13.4473 2.64645 13.3536C2.55268 13.2598 2.5 13.1326 2.5 13V3C2.5 2.86739 2.55268 2.74021 2.64645 2.64645C2.74021 2.55268 2.86739 2.5 3 2.5H13C13.1326 2.5 13.2598 2.55268 13.3536 2.64645C13.4473 2.74021 13.5 2.86739 13.5 3V9.79289C13.5 9.85855 13.4871 9.92357 13.4619 9.98423C13.4368 10.0449 13.4 10.1 13.3536 10.1464L10.1464 13.3536C10.1 13.4 10.0449 13.4368 9.98423 13.4619C9.92357 13.4871 9.85855 13.5 9.79289 13.5V13.5Z" stroke="#21324B" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M13.4548 9.99948H10V13.4545" stroke="#21324B" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

dashboard/public/logos/light/Note.svg

@@ -0,0 +1,7 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 6H10" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6 8H10" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6 10H8" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M9.79289 13.5H3C2.86739 13.5 2.74021 13.4473 2.64645 13.3536C2.55268 13.2598 2.5 13.1326 2.5 13V3C2.5 2.86739 2.55268 2.74021 2.64645 2.64645C2.74021 2.55268 2.86739 2.5 3 2.5H13C13.1326 2.5 13.2598 2.55268 13.3536 2.64645C13.4473 2.74021 13.5 2.86739 13.5 3V9.79289C13.5 9.85855 13.4871 9.92357 13.4619 9.98423C13.4368 10.0449 13.4 10.1 13.3536 10.1464L10.1464 13.3536C10.1 13.4 10.0449 13.4368 9.98423 13.4619C9.92357 13.4871 9.85855 13.5 9.79289 13.5V13.5Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M13.4548 9.99948H10V13.4545" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

dashboard/src/components/common/Announcement/Announcement.tsx

@@ -1,62 +0,0 @@
-import { Button } from '@/components/ui/v2/Button';
-import { ArrowRightIcon } from '@/components/ui/v2/icons/ArrowRightIcon';
-import { XIcon } from '@/components/ui/v2/icons/XIcon';
-import { Text } from '@/components/ui/v2/Text';
-import { forwardRef, type ForwardedRef } from 'react';
-import { twMerge } from 'tailwind-merge';
-import AnnouncementContainer, {
-  type AnnouncementContainerProps,
-} from './AnnouncementContainer';
-
-export interface AnnouncementProps extends AnnouncementContainerProps {
-  /**
-   * Function called when the announcement is closed.
-   */
-  onClose?: VoidFunction;
-  /**
-   * The href to use for the announcement link.
-   */
-  href: string;
-}
-
-function Announcement(
-  { children, slotProps, onClose, href, ...props }: AnnouncementProps,
-  ref: ForwardedRef<HTMLDivElement>,
-) {
-  return (
-    <AnnouncementContainer
-      {...props}
-      ref={ref}
-      className="grid grid-flow-col justify-between gap-4"
-      slotProps={{
-        root: {
-          ...(slotProps?.root || {}),
-          className: twMerge('w-full py-1.5', slotProps?.root?.className),
-        },
-      }}
-    >
-      <span />
-
-      <div className="flex items-center self-center truncate">
-        <a href={href}>
-          <Text className="cursor-pointer truncate hover:underline">
-            {children}
-          </Text>
-        </a>
-        <ArrowRightIcon className="ml-1 h-4 w-4 text-white" />
-      </div>
-
-      <Button
-        variant="borderless"
-        onClick={onClose}
-        aria-label="Close announcement"
-        size="small"
-        className="rounded-sm p-1"
-      >
-        <XIcon className="opacity-65 h-4 w-4" />
-      </Button>
-    </AnnouncementContainer>
-  );
-}
-
-export default forwardRef(Announcement);

dashboard/src/components/common/Announcement/AnnouncementContainer.tsx

@@ -1,66 +0,0 @@
-import {
-  createElement,
-  forwardRef,
-  type DetailedHTMLProps,
-  type ElementType,
-  type ForwardedRef,
-  type HTMLProps,
-  type PropsWithoutRef,
-} from 'react';
-import { twMerge } from 'tailwind-merge';
-
-export interface AnnouncementContainerProps
-  extends PropsWithoutRef<
-    DetailedHTMLProps<HTMLProps<HTMLDivElement>, HTMLDivElement>
-  > {
-  /**
-   * Custom component to render as.
-   */
-  component?: ElementType<any>;
-  /**
-   * Props passed to component slots.
-   */
-  slotProps?: {
-    /**
-     * Props passed to the root component.
-     */
-    root?: DetailedHTMLProps<HTMLProps<HTMLDivElement>, HTMLDivElement>;
-    /**
-     * Props passed to the content component.
-     */
-    content?: DetailedHTMLProps<HTMLProps<HTMLDivElement>, HTMLDivElement>;
-  };
-}
-
-function AnnouncementContainer(
-  {
-    component = 'div',
-    className,
-    children,
-    slotProps,
-    ...props
-  }: AnnouncementContainerProps,
-  ref: ForwardedRef<HTMLDivElement>,
-) {
-  return createElement(
-    component,
-    {
-      ...props,
-      ...(slotProps?.root || {}),
-      ref,
-      className: twMerge('w-full overflow-hidden', slotProps?.root?.className),
-    },
-    <div
-      {...(slotProps?.content || {})}
-      className={twMerge(
-        'mx-auto max-w-7xl px-5',
-        className,
-        slotProps?.content?.className,
-      )}
-    >
-      {children}
-    </div>,
-  );
-}
-
-export default forwardRef(AnnouncementContainer);

dashboard/src/components/common/Announcement/AnnouncementProvider.tsx

@@ -1,92 +0,0 @@
-import { Divider } from '@/components/ui/v2/Divider';
-import {
-  createContext,
-  useEffect,
-  useMemo,
-  useState,
-  type PropsWithChildren,
-  type ReactNode,
-} from 'react';
-import { useInView } from 'react-intersection-observer';
-import Announcement from './Announcement';
-
-interface AnnouncementType {
-  id: string;
-  content: ReactNode;
-  href: string;
-}
-
-export interface AnnouncementContextProps {
-  /**
-   * The announcement to show.
-   */
-  announcement?: AnnouncementType;
-  /**
-   * Whether or not to show the announcement.
-   */
-  showAnnouncement?: boolean;
-  /**
-   * Function to close the announcement.
-   */
-  handleClose?: () => void;
-  /**
-   * Whether or not the announcement is in view.
-   */
-  inView?: boolean;
-}
-
-// Note: You can define the active announcement here.
-const announcement: AnnouncementType = {
-  id: 'node-18',
-  href: 'https://github.com/nhost/nhost/discussions/2239',
-  content:
-    "Starting October 1st, we're upgrading to Node.js 18 for improved performance, security, and stability. Learn more.",
-};
-
-export const AnnouncementContext = createContext<AnnouncementContextProps>({});
-
-export default function AnnouncementProvider({ children }: PropsWithChildren) {
-  const { ref, inView } = useInView();
-  const [showAnnouncement, setShowAnnouncement] = useState(false);
-
-  useEffect(() => {
-    if (
-      typeof window === 'undefined' ||
-      !announcement ||
-      window.localStorage.getItem(announcement.id) === '1'
-    ) {
-      return;
-    }
-
-    setShowAnnouncement(true);
-  }, []);
-
-  function handleClose() {
-    setShowAnnouncement(false);
-    window.localStorage.setItem(announcement?.id, '1');
-  }
-
-  const announcementValue = useMemo(
-    () => ({ showAnnouncement, announcement, handleClose, inView }),
-    [inView, showAnnouncement],
-  );
-
-  return (
-    <AnnouncementContext.Provider value={announcementValue}>
-      {announcement && showAnnouncement && (
-        <>
-          <Announcement
-            ref={ref}
-            href={announcement.href}
-            onClose={handleClose}
-          >
-            {announcement.content}
-          </Announcement>
-          <Divider />
-        </>
-      )}
-
-      {children}
-    </AnnouncementContext.Provider>
-  );
-}

dashboard/src/components/common/Announcement/index.ts

@@ -1,3 +0,0 @@
-export * from './Announcement';
-export * from './AnnouncementProvider';
-export { default as useAnnouncement } from './useAnnouncement';

dashboard/src/components/common/Announcement/useAnnouncement.ts

@@ -1,14 +0,0 @@
-import { useContext } from 'react';
-import { AnnouncementContext } from './AnnouncementProvider';
-
-export default function useAnnouncement() {
-  const context = useContext(AnnouncementContext);
-
-  if (!context) {
-    throw new Error(
-      'useAnnouncement must be used within an AnnouncementProvider',
-    );
-  }
-
-  return context;
-}

dashboard/src/components/common/ApplyLocalSettingsDialog/ApplyLocalSettingsDialog.tsx

@@ -0,0 +1,30 @@
+import { useDialog } from '@/components/common/DialogProvider';
+import { Button } from '@/components/ui/v2/Button';
+import { Text } from '@/components/ui/v2/Text';
+
+export default function ApplyLocalSettingsDialog() {
+  const { closeDialog } = useDialog();
+
+  return (
+    <div className="flex flex-col gap-4 px-6 pb-6">
+      <div className="flex flex-col gap-2">
+        <Text color="secondary">
+          Run{' '}
+          <code className="px-1 py-px mx-1 rounded-md bg-slate-500 text-slate-100">
+            $ nhost up
+          </code>{' '}
+          using the cli to apply your changes
+        </Text>
+      </div>
+
+      <Button
+        className="w-full"
+        color="primary"
+        onClick={() => closeDialog()}
+        autoFocus
+      >
+        OK
+      </Button>
+    </div>
+  );
+}

dashboard/src/components/common/ApplyLocalSettingsDialog/index.ts

@@ -0,0 +1 @@
+export { default as ApplyLocalSettingsDialog } from './ApplyLocalSettingsDialog';

dashboard/src/components/common/ContactUs/ContactUs.tsx

@@ -4,9 +4,17 @@ import type { DetailedHTMLProps, HTMLProps } from 'react';
 import { twMerge } from 'tailwind-merge';
 
 export interface ContactUsProps
-  extends DetailedHTMLProps<HTMLProps<HTMLDivElement>, HTMLDivElement> {}
+  extends DetailedHTMLProps<HTMLProps<HTMLDivElement>, HTMLDivElement> {
+  isTeam?: boolean;
+  isOwner?: boolean;
+}
 
-export default function FeedbackForm({ className, ...props }: ContactUsProps) {
+export default function FeedbackForm({
+  className,
+  isTeam,
+  isOwner,
+  ...props
+}: ContactUsProps) {
   return (
     <div
       className={twMerge(
@@ -19,6 +27,30 @@ export default function FeedbackForm({ className, ...props }: ContactUsProps) {
         Contact us
       </Text>
 
+      {isTeam && isOwner && (
+        <Text>
+          If this is a new Team project, or you need to manage members, reach
+          out to us on discord or via email at{' '}
+          <Link
+            href="mailto:support@nhost.io"
+            target="_blank"
+            rel="noopener noreferrer"
+            underline="hover"
+          >
+            support@nhost.io
+          </Link>{' '}
+          so we can have your dedicated channel set up.
+        </Text>
+      )}
+
+      {isTeam && !isOwner && (
+        <Text>
+          As part of a team plan you can reach out to us on the private channel
+          for this workspace. If you haven&apos;t been added to the channel, ask
+          the workspace owner to add you.
+        </Text>
+      )}
+
       <Text>
         To report issues with Nhost, please open a GitHub issue in the{' '}
         <Link

dashboard/src/components/common/NavLink/NavLink.tsx

@@ -17,7 +17,7 @@ function NavLink(
   ref: ForwardedRef<HTMLAnchorElement>,
 ) {
   return (
-    <NextLink href={href} passHref>
+    <NextLink href={href} passHref legacyBehavior>
       <Link className={twMerge('font-display', className)} ref={ref} {...props}>
         {children}
       </Link>

dashboard/src/components/common/ThemeSwitcher/ThemeSwitcher.tsx

@@ -26,7 +26,7 @@ export default function ThemeSwitcher({
         listbox: { className: 'min-w-0 w-full' },
         popper: {
           disablePortal: false,
-          className: 'z-[10000] w-[270px] w-full',
+          className: 'z-[10000] w-[270px]',
         },
       }}
     >

dashboard/src/components/common/UpgradeToProBanner/UpgradeToProBanner.tsx

@@ -0,0 +1,104 @@
+import { useDialog } from '@/components/common/DialogProvider';
+import { NhostIcon } from '@/components/presentational/NhostIcon';
+import { Box } from '@/components/ui/v2/Box';
+import { Button } from '@/components/ui/v2/Button';
+import { ArrowSquareOutIcon } from '@/components/ui/v2/icons/ArrowSquareOutIcon';
+import { Link } from '@/components/ui/v2/Link';
+import { Text } from '@/components/ui/v2/Text';
+import { ChangePlanModal } from '@/features/projects/common/components/ChangePlanModal';
+import { useIsCurrentUserOwner } from '@/features/projects/common/hooks/useIsCurrentUserOwner';
+
+import Image from 'next/image';
+import { type ReactNode } from 'react';
+
+interface UpgradeToProBannerProps {
+  title: string;
+  description: string | ReactNode;
+}
+
+export default function UpgradeToProBanner({
+  title,
+  description,
+}: UpgradeToProBannerProps) {
+  const { openDialog, openAlertDialog } = useDialog();
+  const isOwner = useIsCurrentUserOwner();
+
+  return (
+    <Box
+      sx={{ backgroundColor: 'primary.light' }}
+      className="flex flex-col justify-between p-4 space-y-4 rounded-md lg:flex-row lg:items-center lg:space-y-0"
+    >
+      <div className="flex flex-col justify-between space-y-4">
+        <div className="space-y-2">
+          <div className="flex flex-col space-y-2 xs:flex-row xs:space-y-0 xs:space-x-2">
+            <Text>Available with</Text>
+            <div className="flex flex-row space-x-2">
+              <NhostIcon />
+              <Text sx={{ color: 'primary.main' }} className="font-semibold">
+                Nhost Pro
+              </Text>
+            </div>
+          </div>
+          <Text variant="h3">{title}</Text>
+          {typeof description === 'string' ? (
+            <Text>{description}</Text>
+          ) : (
+            description
+          )}
+        </div>
+
+        <div className="flex flex-col space-y-2 lg:flex-row lg:items-center lg:space-y-0 lg:space-x-2">
+          <Button
+            className="rounded-md"
+            onClick={() => {
+              if (isOwner) {
+                openDialog({
+                  component: <ChangePlanModal />,
+                  props: {
+                    PaperProps: { className: 'p-0 max-w-xl w-full' },
+                  },
+                });
+              } else {
+                openAlertDialog({
+                  title: "You can't upgrade this project",
+                  payload: (
+                    <Text variant="subtitle1" component="span">
+                      Ask an owner of this workspace to upgrade the project.
+                    </Text>
+                  ),
+                  props: {
+                    secondaryButtonText: 'I understand',
+                    hidePrimaryAction: true,
+                  },
+                });
+              }
+            }}
+          >
+            Upgrade to Pro
+          </Button>
+          <Link
+            href="https://nhost.io/pricing"
+            target="_blank"
+            rel="noopener noreferrer"
+            underline="hover"
+            className="font-medium text-center"
+            sx={{
+              color: 'text.secondary',
+            }}
+          >
+            See all features
+            <ArrowSquareOutIcon className="w-4 h-4 ml-1" />
+          </Link>
+        </div>
+      </div>
+
+      <Image
+        src="/illustration-unbox.png"
+        width={300}
+        height={140}
+        objectFit="contain"
+        alt='Upgrade to Pro illustration'
+      />
+    </Box>
+  );
+}

dashboard/src/components/common/UpgradeToProBanner/index.ts

@@ -0,0 +1 @@
+export { default as UpgradeToProBanner } from './UpgradeToProBanner';

dashboard/src/components/dataGrid/DataGridBody/DataGridBody.tsx

@@ -35,7 +35,7 @@ function InsertPlaceholderTableRow({
   ...props
 }: InsertPlaceholderTableRowProps) {
   return (
-    <Box className="h-12 border-r-1 border-b-1" {...props}>
+    <Box className="h-12 border-b-1 border-r-1" {...props}>
       <Button
         onClick={onInsertRow}
         variant="borderless"
@@ -209,7 +209,7 @@ export default function DataGridBody<T extends object>({
             />
           ) : (
             <Box
-              className="inline-flex h-12 items-center border-b-1 border-r-1 py-1.5 px-2 text-xs"
+              className="inline-flex h-12 items-center border-b-1 border-r-1 px-2 py-1.5 text-xs"
               sx={{ color: 'text.secondary' }}
               style={{
                 width: allowInsertColumn
@@ -281,8 +281,8 @@ export default function DataGridBody<T extends object>({
                     }}
                     className={twMerge(
                       'h-12 font-display text-xs motion-safe:transition-colors',
-                      'border-r-1 border-b-1',
-                      'scroll-mt-[57px] scroll-ml-8',
+                      'border-b-1 border-r-1',
+                      'scroll-ml-8 scroll-mt-[57px]',
                       column.id === 'selection' &&
                         'sticky left-0 z-20 justify-center px-0',
                     )}
@@ -296,7 +296,7 @@ export default function DataGridBody<T extends object>({
               })}
 
               {allowInsertColumn && (
-                <Box className="h-12 w-25 border-r-1 border-b-1" />
+                <Box className="h-12 w-25 border-b-1 border-r-1" />
               )}
             </div>
 

dashboard/src/components/dataGrid/DataGridCell/DataGridCell.tsx

@@ -8,7 +8,15 @@ import type {
   DataBrowserGridCellProps,
 } from '@/features/database/dataGrid/types/dataBrowser';
 import { triggerToast } from '@/utils/toast';
-import type { FocusEvent, KeyboardEvent, MouseEvent } from 'react';
+import type {
+  FocusEvent,
+  JSXElementConstructor,
+  KeyboardEvent,
+  MouseEvent,
+  ReactElement,
+  ReactNode,
+  ReactPortal,
+} from 'react';
 import {
   Children,
   cloneElement,
@@ -308,7 +316,7 @@ function DataGridCellContent<TData extends object = {}, TValue = unknown>({
         isEditable &&
           'focus-within:outline-none focus-within:ring-0 focus:ring-0',
         isSelected && 'shadow-outline',
-        isEditing ? 'p-0.5 shadow-outline-dark' : 'py-1.5 px-2',
+        isEditing ? 'p-0.5 shadow-outline-dark' : 'px-2 py-1.5',
         className,
       )}
       onFocus={handleFocus}
@@ -320,20 +328,28 @@ function DataGridCellContent<TData extends object = {}, TValue = unknown>({
       sx={{ backgroundColor: 'transparent' }}
       {...props}
     >
-      {Children.map(children, (child) => {
-        if (!isValidElement(child)) {
-          return null;
-        }
+      {Children.map(
+        children,
+        (
+          child:
+            | ReactNode
+            | ReactPortal
+            | ReactElement<unknown, string | JSXElementConstructor<any>>,
+        ) => {
+          if (!isValidElement(child)) {
+            return null;
+          }
 
-        return cloneElement(child, {
-          ...child.props,
-          onSave: handleSave,
-          optimisticValue,
-          onOptimisticValueChange: setOptimisticValue,
-          temporaryValue,
-          onTemporaryValueChange: setTemporaryValue,
-        });
-      })}
+          return cloneElement(child, {
+            ...child.props,
+            onSave: handleSave,
+            optimisticValue,
+            onOptimisticValueChange: setOptimisticValue,
+            temporaryValue,
+            onTemporaryValueChange: setTemporaryValue,
+          });
+        },
+      )}
     </Box>
   );
 

dashboard/src/components/dataGrid/DataGridHeader/DataGridHeader.tsx

@@ -96,45 +96,52 @@ export default function DataGridHeader<T extends object>({
             }}
             key={column.id}
           >
-            <Dropdown.Trigger
-              className={twMerge(
-                'focus:outline-none motion-safe:transition-colors',
-              )}
-              disabled={
-                column.isDisabled ||
-                column.id === 'selection' ||
-                (column.disableSortBy && !onRemoveColumn)
-              }
-              hideChevron
-            >
+            {column.id === 'selection' ? (
               <span
                 {...headerProps}
                 className="relative grid w-full grid-flow-col items-center justify-between p-2"
               >
                 {column.render('Header')}
-
-                {allowSort && (
-                  <Box component="span" sx={{ color: 'text.primary' }}>
-                    {column.isSorted && !column.isSortedDesc && (
-                      <ArrowUpIcon className="h-3 w-3" />
-                    )}
-
-                    {column.isSorted && column.isSortedDesc && (
-                      <ArrowDownIcon className="h-3 w-3" />
-                    )}
-                  </Box>
-                )}
               </span>
-
-              {allowResize && !column.disableResizing && (
+            ) : (
+              <Dropdown.Trigger
+                className={twMerge(
+                  'focus:outline-none motion-safe:transition-colors',
+                )}
+                disabled={
+                  column.isDisabled || (column.disableSortBy && !onRemoveColumn)
+                }
+                hideChevron
+              >
                 <span
-                  {...column.getResizerProps({
-                    onClick: (event: Event) => event.stopPropagation(),
-                  })}
-                  className="absolute top-0 bottom-0 -right-0.5 z-10 h-full w-1.5 group-hover:bg-slate-900 group-hover:bg-opacity-20 group-active:bg-slate-900 group-active:bg-opacity-20 motion-safe:transition-colors"
-                />
-              )}
-            </Dropdown.Trigger>
+                  {...headerProps}
+                  className="relative grid w-full grid-flow-col items-center justify-between p-2"
+                >
+                  {column.render('Header')}
+
+                  {allowSort && (
+                    <Box component="span" sx={{ color: 'text.primary' }}>
+                      {column.isSorted && !column.isSortedDesc && (
+                        <ArrowUpIcon className="h-3 w-3" />
+                      )}
+
+                      {column.isSorted && column.isSortedDesc && (
+                        <ArrowDownIcon className="h-3 w-3" />
+                      )}
+                    </Box>
+                  )}
+                </span>
+
+                {allowResize && !column.disableResizing && (
+                  <span
+                    {...column.getResizerProps({
+                      onClick: (event: Event) => event.stopPropagation(),
+                    })}
+                    className="absolute -right-0.5 bottom-0 top-0 z-10 h-full w-1.5 group-hover:bg-slate-900 group-hover:bg-opacity-20 group-active:bg-slate-900 group-active:bg-opacity-20 motion-safe:transition-colors"
+                  />
+                )}
+              </Dropdown.Trigger>
+            )}
 
             <Dropdown.Content
               menu

dashboard/src/components/layout/AILayout/AILayout.tsx

@@ -0,0 +1,46 @@
+import { AISidebar } from '@/components/layout/AISidebar';
+import type { ProjectLayoutProps } from '@/components/layout/ProjectLayout';
+import { ProjectLayout } from '@/components/layout/ProjectLayout';
+import type { SettingsSidebarProps } from '@/components/layout/SettingsSidebar';
+import { RetryableErrorBoundary } from '@/components/presentational/RetryableErrorBoundary';
+import { Box } from '@/components/ui/v2/Box';
+import { twMerge } from 'tailwind-merge';
+
+export interface AILayoutProps extends ProjectLayoutProps {
+  /**
+   * Props passed to the sidebar component.
+   */
+  sidebarProps?: SettingsSidebarProps;
+}
+
+export default function AILayout({
+  children,
+  mainContainerProps: {
+    className: mainContainerClassName,
+    ...mainContainerProps
+  } = {},
+  sidebarProps: { className: sidebarClassName, ...sidebarProps } = {},
+  ...props
+}: AILayoutProps) {
+  return (
+    <ProjectLayout
+      mainContainerProps={{
+        className: twMerge('flex h-full', mainContainerClassName),
+        ...mainContainerProps,
+      }}
+      {...props}
+    >
+      <AISidebar
+        className={twMerge('w-full max-w-sidebar', sidebarClassName)}
+        {...sidebarProps}
+      />
+
+      <Box
+        sx={{ backgroundColor: 'background.default' }}
+        className="flex w-full flex-auto flex-col overflow-scroll overflow-x-hidden"
+      >
+        <RetryableErrorBoundary>{children}</RetryableErrorBoundary>
+      </Box>
+    </ProjectLayout>
+  );
+}

dashboard/src/components/layout/AILayout/index.ts

@@ -0,0 +1,2 @@
+export * from './AILayout';
+export { default as SettingsLayout } from './AILayout';

dashboard/src/components/layout/AISidebar/AISidebar.tsx

@@ -0,0 +1,143 @@
+import { NavLink } from '@/components/common/NavLink';
+import { Backdrop } from '@/components/ui/v2/Backdrop';
+import type { BoxProps } from '@/components/ui/v2/Box';
+import { Box } from '@/components/ui/v2/Box';
+import { IconButton } from '@/components/ui/v2/IconButton';
+import { List } from '@/components/ui/v2/List';
+import type { ListItemButtonProps } from '@/components/ui/v2/ListItem';
+import { ListItem } from '@/components/ui/v2/ListItem';
+import { useCurrentWorkspaceAndProject } from '@/features/projects/common/hooks/useCurrentWorkspaceAndProject';
+import Image from 'next/image';
+import { useRouter } from 'next/router';
+import { useEffect, useState } from 'react';
+import { twMerge } from 'tailwind-merge';
+
+export interface AISidebarProps extends Omit<BoxProps, 'children'> {}
+
+interface AINavLinkProps extends ListItemButtonProps {
+  /**
+   * Link to navigate to.
+   */
+  href: string;
+  /**
+   * Determines whether or not the link should be active if it's href exactly
+   * matches the current route.
+   *
+   * @default true
+   */
+  exact?: boolean;
+}
+
+function AINavLink({ exact = true, href, children, ...props }: AINavLinkProps) {
+  const router = useRouter();
+  const baseUrl = `/${router.query.workspaceSlug}/${router.query.appSlug}/ai`;
+  const finalUrl = href && href !== '/' ? `${baseUrl}${href}` : baseUrl;
+
+  const active = exact
+    ? router.asPath === finalUrl
+    : router.asPath.startsWith(finalUrl);
+
+  return (
+    <ListItem.Root>
+      <ListItem.Button
+        dense
+        href={finalUrl}
+        component={NavLink}
+        selected={active}
+        {...props}
+      >
+        <ListItem.Text>{children}</ListItem.Text>
+      </ListItem.Button>
+    </ListItem.Root>
+  );
+}
+
+export default function AISidebar({ className, ...props }: AISidebarProps) {
+  const [expanded, setExpanded] = useState(false);
+  const { currentProject } = useCurrentWorkspaceAndProject();
+
+  function toggleExpanded() {
+    setExpanded(!expanded);
+  }
+
+  function handleSelect() {
+    setExpanded(false);
+  }
+
+  function closeSidebarWhenEscapeIsPressed(event: KeyboardEvent) {
+    if (event.key === 'Escape') {
+      setExpanded(false);
+    }
+  }
+
+  useEffect(() => {
+    if (typeof document !== 'undefined') {
+      document.addEventListener('keydown', closeSidebarWhenEscapeIsPressed);
+    }
+
+    return () =>
+      document.removeEventListener('keydown', closeSidebarWhenEscapeIsPressed);
+  }, []);
+
+  if (!currentProject) {
+    return null;
+  }
+
+  return (
+    <>
+      <Backdrop
+        open={expanded}
+        className="absolute top-0 left-0 bottom-0 right-0 z-[34] md:hidden"
+        role="button"
+        tabIndex={-1}
+        onClick={() => setExpanded(false)}
+        aria-label="Close sidebar overlay"
+        onKeyDown={(event) => {
+          if (event.key !== 'Enter' && event.key !== ' ') {
+            return;
+          }
+
+          setExpanded(false);
+        }}
+      />
+
+      <Box
+        component="aside"
+        className={twMerge(
+          'absolute top-0 z-[35] h-full w-full overflow-auto border-r-1 px-2 pt-2 pb-17 motion-safe:transition-transform md:relative md:z-0 md:h-full md:py-2.5 md:transition-none',
+          expanded ? 'translate-x-0' : '-translate-x-full md:translate-x-0',
+          className,
+        )}
+        {...props}
+      >
+        <nav aria-label="Settings navigation">
+          <List className="grid gap-2">
+            <AINavLink
+              href="/auto-embeddings"
+              exact={false}
+              onClick={handleSelect}
+            >
+              Auto-Embeddings
+            </AINavLink>
+            <AINavLink href="/assistants" exact={false} onClick={handleSelect}>
+              Assistants
+            </AINavLink>
+          </List>
+        </nav>
+      </Box>
+
+      <IconButton
+        className="absolute bottom-4 left-4 z-[38] h-11 w-11 rounded-full md:hidden"
+        onClick={toggleExpanded}
+        aria-label="Toggle sidebar"
+      >
+        <Image
+          width={16}
+          height={16}
+          src="/assets/table.svg"
+          alt="A monochrome table"
+        />
+      </IconButton>
+    </>
+  );
+}