Merge pull request #1861 from nhost/changeset-release/main

fix(dashboard): filter projects by workspace

dashboard/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @nhost/dashboard
 
+## 0.15.2
+
+### Patch Changes
+
+- 84b84ab7: fix(projects): filter projects by workspace
+
+## 0.15.1
+
+### Patch Changes
+
+- 2faf7907: chore(deps): bump `graphql-request` to v6
+- f1b5a944: chore(deps): bump `@vitejs/plugin-react` to v4
+- 7f1785ac: chore(deps): bump `@types/react` to v18.0.37
+  - @nhost/react-apollo@5.0.19
+
 ## 0.15.0
 
 ### Minor Changes

dashboard/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/dashboard",
-  "version": "0.15.0",
+  "version": "0.15.2",
   "private": true,
   "scripts": {
     "preinstall": "npx only-allow pnpm",
@@ -51,7 +51,7 @@
     "generate-password": "^1.7.0",
     "graphiql": "^2.4.0",
     "graphql": "^16.6.0",
-    "graphql-request": "^4.3.0",
+    "graphql-request": "^6.0.0",
     "graphql-tag": "^2.12.6",
     "graphql-ws": "^5.11.2",
     "just-kebab-case": "^4.1.1",
@@ -105,14 +105,14 @@
     "@types/lodash.debounce": "^4.0.7",
     "@types/node": "^16.11.7",
     "@types/pluralize": "^0.0.29",
-    "@types/react": "18.0.34",
+    "@types/react": "18.0.37",
     "@types/react-dom": "18.0.11",
     "@types/react-table": "^7.7.12",
     "@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": "^3.0.0",
+    "@vitejs/plugin-react": "^4.0.0",
     "@vitest/coverage-c8": "^0.30.0",
     "autoprefixer": "^10.4.13",
     "babel-loader": "^8.3.0",

dashboard/src/components/overview/OverviewDeployments/OverviewDeployments.test.tsx

@@ -1,7 +1,5 @@
+import { mockApplication, mockWorkspace } from '@/tests/mocks';
 import { queryClient, render, screen } from '@/tests/testUtils';
-import type { Project } from '@/types/application';
-import { ApplicationStatus } from '@/types/application';
-import type { Workspace } from '@/types/workspace';
 import { rest } from 'msw';
 import { setupServer } from 'msw/node';
 import { afterAll, beforeAll, vi } from 'vitest';
@@ -35,43 +33,6 @@ vi.mock('next/router', () => ({
   }),
 }));
 
-const mockApplication: Project = {
-  id: '1',
-  name: 'Test Application',
-  slug: 'test-application',
-  appStates: [],
-  subdomain: '',
-  isProvisioned: true,
-  region: {
-    awsName: 'us-east-1',
-    city: 'New York',
-    countryCode: 'US',
-    id: '1',
-  },
-  createdAt: new Date().toISOString(),
-  deployments: [],
-  desiredState: ApplicationStatus.Live,
-  featureFlags: [],
-  providersUpdated: true,
-  githubRepository: { fullName: 'test/git-project' },
-  repositoryProductionBranch: null,
-  nhostBaseFolder: null,
-  plan: null,
-  config: {
-    hasura: {
-      adminSecret: 'nhost-admin-secret',
-    },
-  },
-};
-
-const mockWorkspace: Workspace = {
-  id: '1',
-  name: 'Test Workspace',
-  slug: 'test-workspace',
-  members: [],
-  applications: [mockApplication],
-};
-
 const server = setupServer(
   rest.get('https://local.graphql.nhost.run/v1', (_req, res, ctx) =>
     res(ctx.status(200)),

dashboard/src/gql/app/getWorkspaceAndProject.graphql

@@ -2,7 +2,4 @@ query GetWorkspaceAndProject($workspaceSlug: String!, $projectSlug: String) {
   workspaces(where: { slug: { _eq: $workspaceSlug } }) {
     ...Workspace
   }
-  projects: apps(where: { slug: { _eq: $projectSlug } }) {
-    ...Project
-  }
 }

dashboard/src/hooks/v2/useCurrentWorkspaceAndProject/useCurrentWorkspaceAndProject.ts

@@ -6,6 +6,7 @@ import { getHasuraAdminSecret } from '@/utils/env';
 import { useNhostClient, useUserData } from '@nhost/nextjs';
 import { useQuery } from '@tanstack/react-query';
 import { useRouter } from 'next/router';
+import { useMemo } from 'react';
 
 export interface UseCurrentWorkspaceAndProjectReturnType {
   /**
@@ -48,14 +49,12 @@ export default function useCurrentWorkspaceAndProject(): UseCurrentWorkspaceAndP
     isFetching,
     refetch,
   } = useQuery(
-    ['currentWorkspaceAndProject', workspaceSlug, appSlug],
+    ['currentWorkspaceAndProject', workspaceSlug],
     () =>
       client.graphql.request<{
         workspaces: Workspace[];
-        projects?: Project[];
       }>(GetWorkspaceAndProjectDocument, {
         workspaceSlug: (workspaceSlug as string) || '',
-        projectSlug: (appSlug as string) || '',
       }),
     {
       keepPreviousData: true,
@@ -66,6 +65,18 @@ export default function useCurrentWorkspaceAndProject(): UseCurrentWorkspaceAndP
     },
   );
 
+  // Return the current workspace and project if using the Nhost backend
+  const [currentWorkspace] = response?.data?.workspaces || [];
+  const currentProject = useMemo(
+    () =>
+      appSlug
+        ? currentWorkspace?.projects?.find(
+            (project) => project.slug === appSlug,
+          )
+        : null,
+    [appSlug, currentWorkspace?.projects],
+  );
+
   // Return a default project if working locally
   if (!isPlatform) {
     const localProject: Project = {
@@ -117,9 +128,6 @@ export default function useCurrentWorkspaceAndProject(): UseCurrentWorkspaceAndP
     };
   }
 
-  // Return the current workspace and project if using the Nhost backend
-  const [currentWorkspace] = response?.data?.workspaces || [];
-  const [currentProject] = response?.data?.projects || [];
   const error = Array.isArray(response?.error || {})
     ? response?.error[0]
     : response?.error;

dashboard/src/tests/mocks.ts

@@ -1,6 +1,5 @@
-import type { Project } from '@/types/application';
+import type { Project, Workspace } from '@/types/application';
 import { ApplicationStatus } from '@/types/application';
-import type { Workspace } from '@/types/workspace';
 import { faker } from '@faker-js/faker';
 import type { NhostSession } from '@nhost/nextjs';
 import type { NextRouter } from 'next/router';
@@ -67,8 +66,8 @@ export const mockWorkspace: Workspace = {
   id: '1',
   name: 'Test Workspace',
   slug: 'test-workspace',
-  members: [],
-  applications: [mockApplication],
+  workspaceMembers: [],
+  projects: [mockApplication],
 };
 
 export const mockSession: NhostSession = {

dashboard/src/types/workspace.ts

@@ -1,12 +0,0 @@
-import type { WorkspaceMembers } from '@/utils/__generated__/graphql';
-import type { Project } from './application';
-
-export type Workspace = {
-  id: string;
-  name: string;
-  slug: string;
-  creatorUserId?: string;
-  members: WorkspaceMembers[];
-  applications: Project[];
-  default?: boolean;
-};

docs/docs/platform/compute.mdx

@@ -0,0 +1,38 @@
+---
+title: 'Compute Resources'
+sidebar_position: 1
+image: /img/og/platform/compute-resources.png
+---
+
+Compute resources are the fundamental units that represent the processing power and memory available to your Nhost projects. The primary compute resources are vCPU and RAM. This documentation outlines the key aspects of compute resources in the context of the Nhost Cloud Platform.
+
+
+## Shared vs Dedicated Compute
+
+Free Projects are given a total of 2 shared vCPUs and 1 GiB of RAM:
+	
+ - Postgres: 0.5 vCPU / 256 MiB
+ - Hasura GraphQL: 0.5 vCPU / 384 MiB
+ - Auth: 0.5 vCPU / 256 MiB
+ - Storage: 0.5 vCPU / 128 MiB
+
+Pro Projects are given a total of 2 shared vCPUs and 2 GiB of RAM:
+	
+ - Postgres: 0.5 vCPU / 512 MiB
+ - Hasura GraphQL: 0.5 vCPU / 768 MiB
+ - Auth: 0.5 vCPU / 384 MiB
+ - Storage: 0.5 vCPU / 384 MiB
+
+This is fine if your apps mostly run at low to medium load, occasionally burst for brief periods of time, and can tolerate drops in performance. It is important to understand that the availability of CPU time is not guaranteed.
+
+### Dedicated Compute
+
+On the other hand, for high production workloads where latency is important, or variable performance is not at all tolerable, you should consider configuring your project to use dedicated compute resources. 
+With dedicated compute, resources are guaranteed for your project so you don't have to contend for them.
+
+In addition to the resources fully dedicated to the project, apps are allowed to burst if demand requires it and resources are available. If properly sized, dedicated resources should guarantee the performance of your application while allowing for occassional burts.
+
+To configure dedicated compute to your projects, all you have to do is navigate to the project's settings, and click on "Compute Resources" (see image below). There you will be able to choose the total amount of resources you want to dedicate, and spread those resources amongst all services.
+
+
+![Compute Resources](/img/platform/compute-resources/dashboard-slider.png)

examples/codegen-react-query/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nhost-examples/codegen-react-query
 
+## 0.1.9
+
+### Patch Changes
+
+- 2faf7907: chore(deps): bump `graphql-request` to v6
+
 ## 0.1.8
 
 ### Patch Changes

examples/codegen-react-query/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost-examples/codegen-react-query",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "private": true,
   "scripts": {
     "codegen": "graphql-codegen",
@@ -20,7 +20,7 @@
     "@tanstack/react-query-devtools": "^4.2.3",
     "clsx": "^1.2.1",
     "graphql": "15.7.2",
-    "graphql-request": "^5.1.0",
+    "graphql-request": "^6.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

integrations/apollo/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nhost/apollo
 
+## 5.2.3
+
+### Patch Changes
+
+- 117398f5: Adds async headers that waits for valid token before establishing connection to backend.
+
 ## 5.2.2
 
 ### Patch Changes

integrations/apollo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/apollo",
-  "version": "5.2.2",
+  "version": "5.2.3",
   "description": "Nhost Apollo Client library",
   "license": "MIT",
   "keywords": [

integrations/apollo/src/index.ts

@@ -11,7 +11,7 @@ import {
 import { setContext } from '@apollo/client/link/context'
 import { GraphQLWsLink } from '@apollo/client/link/subscriptions'
 import { getMainDefinition } from '@apollo/client/utilities'
-import { NhostClient } from '@nhost/nhost-js'
+import { AuthContext, NhostClient } from '@nhost/nhost-js'
 
 import { createRestartableClient } from './ws'
 const isBrowser = typeof window !== 'undefined'
@@ -56,9 +56,33 @@ export const createApolloClient = ({
   const uri = backendUrl
   const interpreter = nhost?.auth.client.interpreter
 
-  let token: string | null = null
+  let accessToken: AuthContext['accessToken'] | null = null
+
+  const isTokenValid = () =>
+    !!accessToken?.value && !!accessToken?.expiresAt && accessToken?.expiresAt > new Date()
+
+  const isTokenValidOrNull = () => !accessToken || isTokenValid()
+
+  const awaitValidTokenOrNull = () => {
+    if (isTokenValidOrNull()) {
+      return
+    }
+
+    return new Promise((resolve) => {
+      // doing this as an interval to avoid race conditions.
+      const interval = setInterval(() => {
+        if (isTokenValidOrNull()) {
+          clearInterval(interval)
+          resolve(true)
+        }
+      }, 100)
+    })
+  }
+
+  const getAuthHeaders = async () => {
+    // wait for valid access token
+    await awaitValidTokenOrNull()
 
-  function getAuthHeaders() {
     // add headers
     const resHeaders = {
       ...headers,
@@ -67,8 +91,8 @@ export const createApolloClient = ({
 
     // add auth headers if signed in
     // or add 'public' role if not signed in
-    if (token) {
-      resHeaders.authorization = `Bearer ${token}`
+    if (accessToken) {
+      resHeaders.authorization = `Bearer ${accessToken.value}`
     } else {
       // ? Not sure it changes anything for Hasura
       resHeaders.role = publicRole
@@ -97,10 +121,10 @@ export const createApolloClient = ({
             )
           )
         },
-        connectionParams: () => ({
+        connectionParams: async () => ({
           headers: {
             ...headers,
-            ...getAuthHeaders()
+            ...(await getAuthHeaders())
           }
         })
       })
@@ -108,12 +132,14 @@ export const createApolloClient = ({
 
   const wsLink = wsClient ? new GraphQLWsLink(wsClient) : null
 
-  const httpLink = setContext((_, { headers }) => ({
-    headers: {
-      ...headers,
-      ...getAuthHeaders()
+  const httpLink = setContext(async (_, { headers }) => {
+    return {
+      headers: {
+        ...headers,
+        ...(await getAuthHeaders())
+      }
     }
-  })).concat(createHttpLink({ uri }))
+  }).concat(createHttpLink({ uri }))
 
   const splitLink = wsLink
     ? split(
@@ -162,7 +188,7 @@ export const createApolloClient = ({
   interpreter?.onTransition(async (state, event) => {
     if (['SIGNOUT', 'SIGNED_IN', 'TOKEN_CHANGED'].includes(event.type)) {
       if (event.type === 'SIGNOUT') {
-        token = null
+        accessToken = null
 
         try {
           await client.resetStore()
@@ -175,7 +201,7 @@ export const createApolloClient = ({
       }
 
       // update token
-      token = state.context.accessToken.value
+      accessToken = state.context.accessToken
 
       if (!isBrowser || !wsClient?.isOpen()) {
         return

integrations/google-translation/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nhost/google-translation
 
+## 0.0.4
+
+### Patch Changes
+
+- 2faf7907: chore(deps): bump `graphql-request` to v6
+
 ## 0.0.3
 
 ### Patch Changes

integrations/google-translation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/google-translation",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Google Translation GraphQL API",
   "license": "MIT",
   "keywords": [
@@ -45,7 +45,7 @@
     "@graphql-yoga/node": "^2.13.13",
     "@pothos/core": "^3.22.5",
     "graphql": "^16.6.0",
-    "graphql-request": "^5.0.0"
+    "graphql-request": "^6.0.0"
   },
   "devDependencies": {
     "@types/node": "^16.11.7",

integrations/react-apollo/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nhost/react-apollo
 
+## 5.0.19
+
+### Patch Changes
+
+- Updated dependencies [117398f5]
+  - @nhost/apollo@5.2.3
+
 ## 5.0.18
 
 ### Patch Changes

integrations/react-apollo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/react-apollo",
-  "version": "5.0.18",
+  "version": "5.0.19",
   "description": "Nhost React Apollo client",
   "license": "MIT",
   "keywords": [

package.json

@@ -61,7 +61,7 @@
     "@types/node": "^16.11.7",
     "@typescript-eslint/eslint-plugin": "^5.42.1",
     "@typescript-eslint/parser": "^5.42.1",
-    "@vitejs/plugin-react": "^3.0.0",
+    "@vitejs/plugin-react": "^4.0.0",
     "@vitest/coverage-c8": "^0.30.0",
     "eslint": "^8.26.0",
     "eslint-config-react-app": "^7.0.1",
@@ -76,7 +76,7 @@
     "husky": "^8.0.1",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.7.1",
-    "turbo": "1.8.8",
+    "turbo": "1.9.3",
     "typedoc": "^0.22.18",
     "typescript": "4.9.5",
     "vite": "^4.0.2",

packages/vue/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nhost/vue
 
+## 1.13.21
+
+### Patch Changes
+
+- a5b895a8: chore(deps): bump `@vueuse/core` to v10
+
 ## 1.13.20
 
 ### Patch Changes

packages/vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/vue",
-  "version": "1.13.20",
+  "version": "1.13.21",
   "description": "Nhost Vue library",
   "license": "MIT",
   "keywords": [
@@ -65,7 +65,7 @@
   },
   "dependencies": {
     "@nhost/nhost-js": "workspace:*",
-    "@vueuse/core": "^9.0.0",
+    "@vueuse/core": "^10.0.0",
     "@xstate/vue": "^2.0.0",
     "jwt-decode": "^3.1.2"
   },