Compare commits
17 Commits
@nhost/das
...
@nhost/das
| Author | SHA1 | Date | |
|---|---|---|---|
|
0d43bd2c3b | ||
|
6f324afcae | ||
|
c1eff3a66b | ||
|
|
c774efee40 | ||
|
|
b36aa6041d | ||
|
|
9ed9857e17 | ||
|
|
b4b057e12c | ||
|
|
5b087257e4 | ||
|
|
f1b2117c37 | ||
|
|
c1514eb098 | ||
|
|
21bddeed6a | ||
|
|
84dd864186 | ||
|
|
e2c7741468 | ||
|
|
89fd97cbf0 | ||
|
|
f830a9d5f2 | ||
|
|
9a7e431323 | ||
|
|
1f2b0dced4 |
4
.github/workflows/ci.yaml
vendored
4
.github/workflows/ci.yaml
vendored
@@ -22,6 +22,10 @@ env:
|
||||
NHOST_TEST_DASHBOARD_URL: ${{ vars.NHOST_TEST_DASHBOARD_URL }}
|
||||
NHOST_TEST_WORKSPACE_NAME: ${{ vars.NHOST_TEST_WORKSPACE_NAME }}
|
||||
NHOST_TEST_PROJECT_NAME: ${{ vars.NHOST_TEST_PROJECT_NAME }}
|
||||
NHOST_TEST_ORGANIZATION_NAME: ${{ vars.NHOST_TEST_ORGANIZATION_NAME }}
|
||||
NHOST_TEST_ORGANIZATION_SLUG: ${{ vars.NHOST_TEST_ORGANIZATION_SLUG }}
|
||||
NHOST_TEST_PERSONAL_ORG_SLUG: ${{ vars.NHOST_TEST_PERSONAL_ORG_SLUG }}
|
||||
NHOST_TEST_PROJECT_SUBDOMAIN: ${{ vars.NHOST_TEST_PROJECT_SUBDOMAIN }}
|
||||
NHOST_PRO_TEST_PROJECT_NAME: ${{ vars.NHOST_PRO_TEST_PROJECT_NAME }}
|
||||
NHOST_TEST_USER_EMAIL: ${{ secrets.NHOST_TEST_USER_EMAIL }}
|
||||
NHOST_TEST_USER_PASSWORD: ${{ secrets.NHOST_TEST_USER_PASSWORD }}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
name: "gen: update depenendencies"
|
||||
on:
|
||||
schedule:
|
||||
- cron: '0 2 1 * *'
|
||||
- cron: '0 2 1 2,5,8,11 *'
|
||||
|
||||
jobs:
|
||||
run:
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { navigateToProject } from '@/e2e/utils';
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect, test } from '@playwright/test';
|
||||
|
||||
@@ -16,17 +12,15 @@ test.beforeAll(async ({ browser }) => {
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
await navigateToProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
orgSlug: TEST_ORGANIZATION_SLUG,
|
||||
projectSubdomain: TEST_PROJECT_SUBDOMAIN,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /ai/i })
|
||||
.click();
|
||||
const AIRoute = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/ai/assistants`;
|
||||
await page.goto(AIRoute);
|
||||
await page.waitForURL(AIRoute);
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { navigateToProject } from '@/e2e/utils';
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect, test } from '@playwright/test';
|
||||
|
||||
@@ -16,17 +12,15 @@ test.beforeAll(async ({ browser }) => {
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
await navigateToProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
orgSlug: TEST_ORGANIZATION_SLUG,
|
||||
projectSubdomain: TEST_PROJECT_SUBDOMAIN,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /ai/i })
|
||||
.click();
|
||||
const AIRoute = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/ai/auto-embeddings`;
|
||||
await page.goto(AIRoute);
|
||||
await page.waitForURL(AIRoute);
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
|
||||
@@ -1,30 +1,12 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { createUser, generateTestEmail, openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { createUser, generateTestEmail } from '@/e2e/utils';
|
||||
import { faker } from '@faker-js/faker';
|
||||
import test, { expect } from '@playwright/test';
|
||||
|
||||
test('should be able to ban and unban a user', async ({ page }) => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /auth/i })
|
||||
.click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/users`,
|
||||
);
|
||||
const authUrl = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/users`;
|
||||
await page.goto(authUrl);
|
||||
await page.waitForURL(authUrl, { waitUntil: 'networkidle' });
|
||||
|
||||
const email = generateTestEmail();
|
||||
const password = faker.internet.password();
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { createUser, generateTestEmail, openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { createUser, generateTestEmail } from '@/e2e/utils';
|
||||
import { faker } from '@faker-js/faker';
|
||||
import type { Page } from '@playwright/test';
|
||||
import test, { expect } from '@playwright/test';
|
||||
@@ -15,23 +11,9 @@ test.beforeAll(async ({ browser }) => {
|
||||
});
|
||||
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /auth/i })
|
||||
.click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/users`,
|
||||
);
|
||||
const authUrl = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/users`;
|
||||
await page.goto(authUrl);
|
||||
await page.waitForURL(authUrl, { waitUntil: 'networkidle' });
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { createUser, generateTestEmail, openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { createUser, generateTestEmail } from '@/e2e/utils';
|
||||
import { faker } from '@faker-js/faker';
|
||||
import type { Page } from '@playwright/test';
|
||||
import test, { expect } from '@playwright/test';
|
||||
@@ -15,23 +11,9 @@ test.beforeAll(async ({ browser }) => {
|
||||
});
|
||||
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /auth/i })
|
||||
.click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/users`,
|
||||
);
|
||||
const authUrl = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/users`;
|
||||
await page.goto(authUrl);
|
||||
await page.waitForURL(authUrl, { waitUntil: 'networkidle' });
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { createUser, generateTestEmail, openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { createUser, generateTestEmail } from '@/e2e/utils';
|
||||
import { faker } from '@faker-js/faker';
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect, test } from '@playwright/test';
|
||||
@@ -15,23 +11,9 @@ test.beforeAll(async ({ browser }) => {
|
||||
});
|
||||
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /auth/i })
|
||||
.click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/users`,
|
||||
);
|
||||
const authUrl = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/users`;
|
||||
await page.goto(authUrl);
|
||||
await page.waitForURL(authUrl, { waitUntil: 'networkidle' });
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { openProject, prepareTable } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { navigateToProject, prepareTable } from '@/e2e/utils';
|
||||
import { faker } from '@faker-js/faker';
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect, test } from '@playwright/test';
|
||||
@@ -18,17 +14,15 @@ test.beforeAll(async ({ browser }) => {
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
await navigateToProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
orgSlug: TEST_ORGANIZATION_SLUG,
|
||||
projectSubdomain: TEST_PROJECT_SUBDOMAIN,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /database/i })
|
||||
.click();
|
||||
const databaseRoute = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default`;
|
||||
await page.goto(databaseRoute);
|
||||
await page.waitForURL(databaseRoute);
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
@@ -55,7 +49,7 @@ test('should create a simple table', async () => {
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${tableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${tableName}`,
|
||||
);
|
||||
|
||||
await expect(
|
||||
@@ -84,7 +78,7 @@ test('should create a table with unique constraints', async () => {
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${tableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${tableName}`,
|
||||
);
|
||||
|
||||
await expect(
|
||||
@@ -113,7 +107,7 @@ test('should create a table with nullable columns', async () => {
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${tableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${tableName}`,
|
||||
);
|
||||
|
||||
await expect(
|
||||
@@ -146,7 +140,7 @@ test('should create a table with an identity column', async () => {
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${tableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${tableName}`,
|
||||
);
|
||||
|
||||
await expect(
|
||||
@@ -174,7 +168,7 @@ test('should create table with foreign key constraint', async () => {
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${firstTableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${firstTableName}`,
|
||||
);
|
||||
|
||||
await page.getByRole('button', { name: /new table/i }).click();
|
||||
@@ -219,7 +213,7 @@ test('should create table with foreign key constraint', async () => {
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${secondTableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${secondTableName}`,
|
||||
);
|
||||
|
||||
await expect(
|
||||
@@ -247,7 +241,7 @@ test('should not be able to create a table with a name that already exists', asy
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${tableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${tableName}`,
|
||||
);
|
||||
|
||||
await page.getByRole('button', { name: /new table/i }).click();
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { deleteTable, openProject, prepareTable } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import { deleteTable, navigateToProject, prepareTable } from '@/e2e/utils';
|
||||
import { faker } from '@faker-js/faker';
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect, test } from '@playwright/test';
|
||||
@@ -18,17 +14,15 @@ test.beforeAll(async ({ browser }) => {
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
await navigateToProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
orgSlug: TEST_ORGANIZATION_SLUG,
|
||||
projectSubdomain: TEST_PROJECT_SUBDOMAIN,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /database/i })
|
||||
.click();
|
||||
const databaseRoute = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default`;
|
||||
await page.goto(databaseRoute);
|
||||
await page.waitForURL(databaseRoute);
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
@@ -53,7 +47,7 @@ test('should delete a table', async () => {
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${tableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${tableName}`,
|
||||
);
|
||||
|
||||
await deleteTable({
|
||||
@@ -63,7 +57,7 @@ test('should delete a table', async () => {
|
||||
|
||||
// navigate to next URL
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/**`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/**`,
|
||||
);
|
||||
|
||||
await expect(
|
||||
@@ -91,7 +85,7 @@ test('should not be able to delete a table if other tables have foreign keys ref
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${firstTableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${firstTableName}`,
|
||||
);
|
||||
|
||||
await page.getByRole('button', { name: /new table/i }).click();
|
||||
@@ -138,7 +132,7 @@ test('should not be able to delete a table if other tables have foreign keys ref
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await page.waitForURL(
|
||||
`/${TEST_WORKSPACE_SLUG}/${PRO_TEST_PROJECT_SLUG}/database/browser/default/public/${secondTableName}`,
|
||||
`/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/database/browser/default/public/${secondTableName}`,
|
||||
);
|
||||
|
||||
await expect(
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
import slugify from 'slugify';
|
||||
|
||||
/**
|
||||
* URL of the dashboard to test against.
|
||||
*/
|
||||
@@ -8,15 +6,12 @@ export const TEST_DASHBOARD_URL = process.env.NHOST_TEST_DASHBOARD_URL;
|
||||
/**
|
||||
* Name of the workspace to test against.
|
||||
*/
|
||||
export const TEST_WORKSPACE_NAME = process.env.NHOST_TEST_WORKSPACE_NAME;
|
||||
export const TEST_ORGANIZATION_NAME = process.env.NHOST_TEST_ORGANIZATION_NAME;
|
||||
|
||||
/**
|
||||
* Slugified name of the workspace to test against.
|
||||
* Slug of the organization to test against.
|
||||
*/
|
||||
export const TEST_WORKSPACE_SLUG = slugify(TEST_WORKSPACE_NAME, {
|
||||
lower: true,
|
||||
strict: true,
|
||||
});
|
||||
export const TEST_ORGANIZATION_SLUG = process.env.NHOST_TEST_ORGANIZATION_SLUG;
|
||||
|
||||
/**
|
||||
* Name of the project to test against.
|
||||
@@ -24,25 +19,9 @@ export const TEST_WORKSPACE_SLUG = slugify(TEST_WORKSPACE_NAME, {
|
||||
export const TEST_PROJECT_NAME = process.env.NHOST_TEST_PROJECT_NAME;
|
||||
|
||||
/**
|
||||
* Name of the pro test project to test against.
|
||||
* Subdomain of the project to test against.
|
||||
*/
|
||||
export const PRO_TEST_PROJECT_NAME = process.env.NHOST_PRO_TEST_PROJECT_NAME;
|
||||
|
||||
/**
|
||||
* Slugified name of the project to test against.
|
||||
*/
|
||||
export const TEST_PROJECT_SLUG = slugify(TEST_PROJECT_NAME, {
|
||||
lower: true,
|
||||
strict: true,
|
||||
});
|
||||
|
||||
/**
|
||||
* Slugified name of the pro project to test against.
|
||||
*/
|
||||
export const PRO_TEST_PROJECT_SLUG = slugify(PRO_TEST_PROJECT_NAME, {
|
||||
lower: true,
|
||||
strict: true,
|
||||
});
|
||||
export const TEST_PROJECT_SUBDOMAIN = process.env.NHOST_TEST_PROJECT_SUBDOMAIN;
|
||||
|
||||
/**
|
||||
* Hasura admin secret of the test project to use.
|
||||
@@ -59,3 +38,5 @@ export const TEST_USER_EMAIL = process.env.NHOST_TEST_USER_EMAIL;
|
||||
* Password of the test account to use.
|
||||
*/
|
||||
export const TEST_USER_PASSWORD = process.env.NHOST_TEST_USER_PASSWORD;
|
||||
|
||||
export const TEST_PERSONAL_ORG_SLUG = process.env.NHOST_TEST_PERSONAL_ORG_SLUG;
|
||||
|
||||
@@ -1,12 +1,7 @@
|
||||
import {
|
||||
TEST_PROJECT_NAME,
|
||||
TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_NAME,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect, test } from '@playwright/test';
|
||||
import { navigateToProject } from '../utils';
|
||||
|
||||
let page: Page;
|
||||
|
||||
@@ -14,11 +9,11 @@ test.beforeAll(async ({ browser }) => {
|
||||
page = await browser.newPage();
|
||||
|
||||
await page.goto('/');
|
||||
await openProject({
|
||||
|
||||
await navigateToProject({
|
||||
page,
|
||||
projectName: TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: TEST_PROJECT_SLUG,
|
||||
orgSlug: TEST_ORGANIZATION_SLUG,
|
||||
projectSubdomain: TEST_PROJECT_SUBDOMAIN,
|
||||
});
|
||||
});
|
||||
|
||||
@@ -26,60 +21,34 @@ test.afterAll(async () => {
|
||||
await page.close();
|
||||
});
|
||||
|
||||
test('should show a sidebar with menu items', async () => {
|
||||
const navLocator = page.getByRole('navigation', { name: /main navigation/i });
|
||||
test('should show the navtree with all links visible', async () => {
|
||||
const navLocator = page.getByLabel('Navigation Tree');
|
||||
await expect(navLocator).toBeVisible();
|
||||
await expect(navLocator.getByRole('list').getByRole('listitem')).toHaveCount(
|
||||
13,
|
||||
);
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /overview/i }),
|
||||
).toBeVisible();
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /database/i }),
|
||||
).toBeVisible();
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /graphql/i }),
|
||||
).toBeVisible();
|
||||
await expect(navLocator.getByRole('link', { name: /hasura/i })).toBeVisible();
|
||||
await expect(navLocator.getByRole('link', { name: /auth/i })).toBeVisible();
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /storage/i }),
|
||||
).toBeVisible();
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /deployments/i }),
|
||||
).toBeVisible();
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /backups/i }),
|
||||
).toBeVisible();
|
||||
await expect(navLocator.getByRole('link', { name: /logs/i })).toBeVisible();
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /metrics/i }),
|
||||
).toBeVisible();
|
||||
await expect(
|
||||
navLocator.getByRole('link', { name: /settings/i }),
|
||||
).toBeVisible();
|
||||
});
|
||||
|
||||
test('should show a header with a logo, the workspace name, and the project name', async () => {
|
||||
await expect(
|
||||
page.getByRole('banner').getByRole('link', { name: TEST_WORKSPACE_NAME }),
|
||||
).toBeVisible();
|
||||
const links = [
|
||||
'Nhost Automation Test Project',
|
||||
'Overview',
|
||||
'Database',
|
||||
'GraphQL',
|
||||
'Hasura',
|
||||
'Auth',
|
||||
'Storage',
|
||||
'Run',
|
||||
'AI',
|
||||
'Deployments',
|
||||
'Backups',
|
||||
'Logs',
|
||||
'Metrics',
|
||||
'Settings',
|
||||
];
|
||||
|
||||
await expect(
|
||||
page.getByRole('banner').getByRole('link', { name: TEST_PROJECT_NAME }),
|
||||
).toBeVisible();
|
||||
});
|
||||
|
||||
test("should show the project's name, the Upgrade button and the Settings button", async () => {
|
||||
await expect(
|
||||
page.getByRole('heading', { name: TEST_PROJECT_NAME }),
|
||||
).toBeVisible();
|
||||
await expect(page.getByText(/starter/i)).toBeVisible();
|
||||
await expect(page.getByRole('button', { name: /upgrade/i })).toBeVisible();
|
||||
await expect(
|
||||
page.getByRole('main').getByRole('link', { name: /settings/i }),
|
||||
).toBeVisible();
|
||||
for (const linkName of links) {
|
||||
const link =
|
||||
linkName === 'Settings'
|
||||
? page.getByRole('link', { name: linkName }).first()
|
||||
: page.getByRole('link', { name: linkName });
|
||||
await expect(link).toBeVisible();
|
||||
}
|
||||
});
|
||||
|
||||
test("should show the project's region and subdomain", async () => {
|
||||
@@ -96,27 +65,3 @@ test('should not have a GitHub repository connected', async () => {
|
||||
page.getByRole('button', { name: /connect to github/i }).first(),
|
||||
).toBeVisible();
|
||||
});
|
||||
|
||||
test('should show metrics', async () => {
|
||||
await expect(page.getByText(/cpu usage seconds\d+/i)).toBeVisible();
|
||||
await expect(page.getByText(/total requests\d+/i)).toBeVisible();
|
||||
await expect(page.getByText(/function invocations\d+/i)).toBeVisible();
|
||||
await expect(
|
||||
page.getByText(/egress volume\d+(\.\d+)? [a-zA-Z]+/i),
|
||||
).toBeVisible();
|
||||
await expect(page.getByText(/logs\d+(\.\d+)? [a-zA-Z]+/i)).toBeVisible();
|
||||
});
|
||||
|
||||
test('should show proper limits for the free project', async () => {
|
||||
await expect(
|
||||
page.getByText(/database\d+(\.\d+)? [a-zA-Z]+ of \d+(\.\d+)? [a-zA-Z]+/i),
|
||||
).toBeVisible();
|
||||
|
||||
await expect(
|
||||
page.getByText(/storage\d+(\.\d+)? [a-zA-Z]+ of \d+(\.\d+)? [a-zA-Z]+/i),
|
||||
).toBeVisible();
|
||||
|
||||
await expect(page.getByText(/users[0-9]+ of [0-9]+/i)).toBeVisible();
|
||||
|
||||
await expect(page.getByText(/functions[0-9]+ of [0-9]+/i)).toBeVisible();
|
||||
});
|
||||
|
||||
@@ -1,11 +1,7 @@
|
||||
import {
|
||||
PRO_TEST_PROJECT_NAME,
|
||||
PRO_TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
} from '@/e2e/env';
|
||||
import { openProject } from '@/e2e/utils';
|
||||
import { TEST_ORGANIZATION_SLUG, TEST_PROJECT_SUBDOMAIN } from '@/e2e/env';
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect, test } from '@playwright/test';
|
||||
import { navigateToProject } from '../utils';
|
||||
|
||||
let page: Page;
|
||||
|
||||
@@ -16,17 +12,15 @@ test.beforeAll(async ({ browser }) => {
|
||||
test.beforeEach(async () => {
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
await navigateToProject({
|
||||
page,
|
||||
projectName: PRO_TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: PRO_TEST_PROJECT_SLUG,
|
||||
orgSlug: TEST_ORGANIZATION_SLUG,
|
||||
projectSubdomain: TEST_PROJECT_SUBDOMAIN,
|
||||
});
|
||||
|
||||
await page
|
||||
.getByRole('navigation', { name: /main navigation/i })
|
||||
.getByRole('link', { name: /run/i })
|
||||
.click();
|
||||
const runRoute = `/orgs/${TEST_ORGANIZATION_SLUG}/projects/${TEST_PROJECT_SUBDOMAIN}/run`;
|
||||
await page.goto(runRoute);
|
||||
await page.waitForURL(runRoute);
|
||||
});
|
||||
|
||||
test.afterAll(async () => {
|
||||
@@ -39,6 +33,10 @@ test('should create and delete a run service', async () => {
|
||||
await page.getByPlaceholder(/service name/i).click();
|
||||
await page.getByPlaceholder(/service name/i).fill('test');
|
||||
|
||||
await page.getByText('Nhost registry').click();
|
||||
await page.getByPlaceholder('Replicas').click();
|
||||
await page.getByPlaceholder('Replicas').fill('0');
|
||||
|
||||
await page.getByRole('button', { name: /create/i }).click();
|
||||
|
||||
await expect(
|
||||
@@ -47,12 +45,6 @@ test('should create and delete a run service', async () => {
|
||||
|
||||
await page.getByRole('button', { name: /confirm/i }).click();
|
||||
|
||||
await expect(
|
||||
page.getByRole('heading', { name: /service details/i }),
|
||||
).toBeVisible();
|
||||
|
||||
await page.getByRole('button', { name: /ok/i }).click();
|
||||
|
||||
await expect(page.getByRole('heading', { name: /test/i })).toBeVisible();
|
||||
|
||||
await page.getByLabel(/more options/i).click();
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import {
|
||||
TEST_DASHBOARD_URL,
|
||||
TEST_PERSONAL_ORG_SLUG,
|
||||
TEST_USER_EMAIL,
|
||||
TEST_USER_PASSWORD,
|
||||
} from '@/e2e/env';
|
||||
@@ -15,6 +16,9 @@ setup('authenticate user', async ({ page }) => {
|
||||
await page.getByLabel('Password').fill(TEST_USER_PASSWORD);
|
||||
await page.getByRole('button', { name: /sign in/i }).click();
|
||||
|
||||
await page.waitForURL(TEST_DASHBOARD_URL);
|
||||
await page.waitForURL(
|
||||
`${TEST_DASHBOARD_URL}/orgs/${TEST_PERSONAL_ORG_SLUG}/projects`,
|
||||
{ waitUntil: 'networkidle' },
|
||||
);
|
||||
await page.context().storageState({ path: 'e2e/.auth/user.json' });
|
||||
});
|
||||
|
||||
@@ -5,24 +5,27 @@ import type { Page } from '@playwright/test';
|
||||
* Open a project by navigating to the project's overview page.
|
||||
*
|
||||
* @param page - The Playwright page object.
|
||||
* @param workspaceSlug - The slug of the workspace that contains the project.
|
||||
* @param projectSlug - The slug of the project to open.
|
||||
* @param projectName - The name of the project to open.
|
||||
* @param orgSlug - The slug of the organization that contains the project.
|
||||
* @param projectSubdomain - The subdomain of the project to open.
|
||||
* @returns A promise that resolves when the project is opened.
|
||||
*/
|
||||
export async function openProject({
|
||||
export async function navigateToProject({
|
||||
page,
|
||||
projectName,
|
||||
workspaceSlug,
|
||||
projectSlug,
|
||||
orgSlug,
|
||||
projectSubdomain,
|
||||
}: {
|
||||
page: Page;
|
||||
workspaceSlug: string;
|
||||
projectSlug: string;
|
||||
projectName: string;
|
||||
orgSlug: string;
|
||||
projectSubdomain: string;
|
||||
}) {
|
||||
await page.getByRole('link', { name: projectName }).click();
|
||||
await page.waitForURL(`/${workspaceSlug}/${projectSlug}`);
|
||||
const projectUrl = `/orgs/${orgSlug}/projects/${projectSubdomain}`;
|
||||
|
||||
try {
|
||||
await page.goto(projectUrl, { waitUntil: 'networkidle' });
|
||||
await page.waitForURL(projectUrl, { timeout: 10000 });
|
||||
} catch (error) {
|
||||
console.error(`Failed to navigate to project URL: ${projectUrl}`, error);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
import {
|
||||
TEST_DASHBOARD_URL,
|
||||
TEST_ORGANIZATION_SLUG,
|
||||
TEST_PROJECT_ADMIN_SECRET,
|
||||
TEST_PROJECT_NAME,
|
||||
TEST_PROJECT_SLUG,
|
||||
TEST_WORKSPACE_SLUG,
|
||||
TEST_PROJECT_SUBDOMAIN,
|
||||
} from '@/e2e/env';
|
||||
import { openProject } from '@/e2e/utils';
|
||||
import { navigateToProject } from '@/e2e/utils';
|
||||
import { chromium } from '@playwright/test';
|
||||
|
||||
async function globalTeardown() {
|
||||
@@ -18,13 +17,10 @@ async function globalTeardown() {
|
||||
|
||||
const page = await context.newPage();
|
||||
|
||||
await page.goto('/');
|
||||
|
||||
await openProject({
|
||||
await navigateToProject({
|
||||
page,
|
||||
projectName: TEST_PROJECT_NAME,
|
||||
workspaceSlug: TEST_WORKSPACE_SLUG,
|
||||
projectSlug: TEST_PROJECT_SLUG,
|
||||
orgSlug: TEST_ORGANIZATION_SLUG,
|
||||
projectSubdomain: TEST_PROJECT_SUBDOMAIN,
|
||||
});
|
||||
|
||||
const pagePromise = context.waitForEvent('page');
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@nhost/dashboard",
|
||||
"version": "2.1.3",
|
||||
"version": "2.4.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"preinstall": "npx only-allow pnpm",
|
||||
@@ -42,6 +42,7 @@
|
||||
"@mui/x-date-pickers": "^5.0.20",
|
||||
"@nhost/nextjs": "workspace:*",
|
||||
"@nhost/react-apollo": "workspace:*",
|
||||
"@radix-ui/react-accordion": "^1.2.1",
|
||||
"@radix-ui/react-alert-dialog": "^1.1.2",
|
||||
"@radix-ui/react-checkbox": "^1.1.2",
|
||||
"@radix-ui/react-dialog": "^1.1.1",
|
||||
@@ -127,7 +128,7 @@
|
||||
"@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",
|
||||
"@playwright/test": "1.47.0",
|
||||
"@storybook/addon-actions": "^6.5.16",
|
||||
"@storybook/addon-essentials": "^6.5.16",
|
||||
"@storybook/addon-interactions": "^6.5.16",
|
||||
|
||||
@@ -6,7 +6,7 @@ dotenv.config({ path: path.resolve(__dirname, '.env.test') });
|
||||
|
||||
export default defineConfig({
|
||||
testDir: './e2e',
|
||||
timeout: 30 * 1000,
|
||||
timeout: 40 * 1000,
|
||||
expect: {
|
||||
timeout: 5000,
|
||||
},
|
||||
@@ -20,6 +20,9 @@ export default defineConfig({
|
||||
actionTimeout: 0,
|
||||
trace: 'on-first-retry',
|
||||
baseURL: process.env.NHOST_TEST_DASHBOARD_URL,
|
||||
launchOptions: {
|
||||
slowMo: 500,
|
||||
},
|
||||
},
|
||||
projects: [
|
||||
{
|
||||
|
||||
@@ -105,7 +105,7 @@ export default function OrgsComboBox() {
|
||||
<Button
|
||||
size="sm"
|
||||
variant="ghost"
|
||||
className="w-full justify-between gap-2 bg-background text-foreground hover:bg-accent dark:hover:bg-muted"
|
||||
className="justify-between w-full gap-2 bg-background text-foreground hover:bg-accent dark:hover:bg-muted"
|
||||
>
|
||||
{selectedItem ? (
|
||||
<div className="flex flex-row items-center justify-center">
|
||||
@@ -115,7 +115,7 @@ export default function OrgsComboBox() {
|
||||
) : (
|
||||
'Select organization / workspace'
|
||||
)}
|
||||
<ChevronsUpDown className="h-5 w-5 text-muted-foreground" />
|
||||
<ChevronsUpDown className="w-5 h-5 text-muted-foreground" />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent className="p-0" side="bottom" align="start">
|
||||
@@ -129,7 +129,7 @@ export default function OrgsComboBox() {
|
||||
keywords={[option.label]}
|
||||
key={option.value}
|
||||
value={option.value}
|
||||
className="flex items-center justify-between bg-background text-foreground dark:hover:bg-muted"
|
||||
className="flex items-center text-foreground dark:hover:bg-muted"
|
||||
onSelect={() => {
|
||||
setSelectedItem(option);
|
||||
setOpen(false);
|
||||
@@ -144,17 +144,15 @@ export default function OrgsComboBox() {
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className="flex items-center font-normal">
|
||||
<Check
|
||||
className={cn(
|
||||
'mr-2 h-4 w-4',
|
||||
selectedItem?.value === option.value
|
||||
? 'opacity-100'
|
||||
: 'opacity-0',
|
||||
)}
|
||||
/>
|
||||
<span className="max-w-52 truncate">{option.label}</span>
|
||||
</div>
|
||||
<Check
|
||||
className={cn(
|
||||
'mr-2 h-4 w-4',
|
||||
selectedItem?.value === option.value
|
||||
? 'opacity-100'
|
||||
: 'opacity-0',
|
||||
)}
|
||||
/>
|
||||
<span className="w-full truncate">{option.label}</span>
|
||||
{renderBadge(option.plan)}
|
||||
</CommandItem>
|
||||
))}
|
||||
@@ -170,7 +168,7 @@ export default function OrgsComboBox() {
|
||||
keywords={[option.label]}
|
||||
key={option.value}
|
||||
value={option.value}
|
||||
className="flex items-center justify-between bg-background text-foreground hover:bg-accent dark:hover:bg-muted"
|
||||
className="flex items-center text-foreground dark:hover:bg-muted"
|
||||
onSelect={() => {
|
||||
setSelectedItem(option);
|
||||
setOpen(false);
|
||||
@@ -185,19 +183,15 @@ export default function OrgsComboBox() {
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className="flex items-center">
|
||||
<Check
|
||||
className={cn(
|
||||
'mr-2 h-4 w-4',
|
||||
selectedItem?.value === option.value
|
||||
? 'opacity-100'
|
||||
: 'opacity-0',
|
||||
)}
|
||||
/>
|
||||
<span className="max-w-52 truncate">
|
||||
{option.label}
|
||||
</span>
|
||||
</div>
|
||||
<Check
|
||||
className={cn(
|
||||
'mr-2 h-4 w-4',
|
||||
selectedItem?.value === option.value
|
||||
? 'opacity-100'
|
||||
: 'opacity-0',
|
||||
)}
|
||||
/>
|
||||
<span className="w-full truncate">{option.label}</span>
|
||||
{renderBadge(option.plan)}
|
||||
</CommandItem>
|
||||
))}
|
||||
|
||||
@@ -68,6 +68,7 @@ const projectSettingsPages = [
|
||||
route: 'rate-limiting',
|
||||
},
|
||||
{ name: 'AI', slug: 'ai', route: 'ai' },
|
||||
{ name: 'Observability', slug: 'metrics', route: 'metrics' },
|
||||
{ name: 'Configuration Editor', slug: 'editor', route: 'editor' },
|
||||
].map((item) => ({
|
||||
label: item.name,
|
||||
|
||||
@@ -151,6 +151,7 @@ const projectSettingsPages = [
|
||||
route: 'rate-limiting',
|
||||
},
|
||||
{ name: 'AI', slug: 'ai', route: 'ai' },
|
||||
{ name: 'Observability', slug: 'metrics', route: 'metrics' },
|
||||
{ name: 'Configuration Editor', slug: 'editor', route: 'editor' },
|
||||
];
|
||||
|
||||
|
||||
@@ -17,18 +17,18 @@ export default function SettingsLayout({ children }: SettingsLayoutProps) {
|
||||
return (
|
||||
<Box
|
||||
sx={{ backgroundColor: 'background.default' }}
|
||||
className="flex w-full flex-auto flex-col overflow-y-auto overflow-x-hidden"
|
||||
className="flex flex-col flex-auto w-full overflow-x-hidden overflow-y-auto"
|
||||
>
|
||||
<Box
|
||||
sx={{ backgroundColor: 'background.default' }}
|
||||
className="flex h-full flex-col"
|
||||
className="flex flex-col h-full"
|
||||
>
|
||||
<RetryableErrorBoundary>
|
||||
<div className="flex flex-col space-y-2">
|
||||
{hasGitRepo && (
|
||||
<Alert
|
||||
severity="warning"
|
||||
className="grid grid-flow-row place-content-center gap-2"
|
||||
className="grid grid-flow-row gap-2 place-content-center"
|
||||
>
|
||||
<Text color="warning" className="text-sm">
|
||||
As you have a connected repository, make sure to synchronize
|
||||
@@ -52,9 +52,9 @@ export default function SettingsLayout({ children }: SettingsLayoutProps) {
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
href="https://docs.nhost.io/cli/overlays"
|
||||
href="https://docs.nhost.io/guides/cli/configuration-overlays#configuration-overlays"
|
||||
>
|
||||
docs.nhost.io/cli/overlays
|
||||
Configuration Overlays
|
||||
</a>{' '}
|
||||
for guidance.
|
||||
</Text>
|
||||
|
||||
58
dashboard/src/components/ui/v3/accordion.tsx
Normal file
58
dashboard/src/components/ui/v3/accordion.tsx
Normal file
@@ -0,0 +1,58 @@
|
||||
'use client';
|
||||
|
||||
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
||||
import { ChevronDown } from 'lucide-react';
|
||||
import * as React from 'react';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
const Accordion = AccordionPrimitive.Root;
|
||||
|
||||
const AccordionItem = React.forwardRef<
|
||||
React.ElementRef<typeof AccordionPrimitive.Item>,
|
||||
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<AccordionPrimitive.Item
|
||||
ref={ref}
|
||||
className={cn('border-b', className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
AccordionItem.displayName = 'AccordionItem';
|
||||
|
||||
const AccordionTrigger = React.forwardRef<
|
||||
React.ElementRef<typeof AccordionPrimitive.Trigger>,
|
||||
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
|
||||
>(({ className, children, ...props }, ref) => (
|
||||
<AccordionPrimitive.Header className="flex">
|
||||
<AccordionPrimitive.Trigger
|
||||
ref={ref}
|
||||
className={cn(
|
||||
'flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200" />
|
||||
</AccordionPrimitive.Trigger>
|
||||
</AccordionPrimitive.Header>
|
||||
));
|
||||
AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
|
||||
|
||||
const AccordionContent = React.forwardRef<
|
||||
React.ElementRef<typeof AccordionPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
|
||||
>(({ className, children, ...props }, ref) => (
|
||||
<AccordionPrimitive.Content
|
||||
ref={ref}
|
||||
className="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm transition-all"
|
||||
{...props}
|
||||
>
|
||||
<div className={cn('pb-4 pt-0', className)}>{children}</div>
|
||||
</AccordionPrimitive.Content>
|
||||
));
|
||||
|
||||
AccordionContent.displayName = AccordionPrimitive.Content.displayName;
|
||||
|
||||
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
|
||||
@@ -3,20 +3,30 @@ import * as React from 'react';
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
export interface InputProps
|
||||
extends React.InputHTMLAttributes<HTMLInputElement> {}
|
||||
extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'prefix'> {
|
||||
prefix?: React.ReactNode;
|
||||
}
|
||||
|
||||
const Input = React.forwardRef<HTMLInputElement, InputProps>(
|
||||
({ className, type, ...props }, ref) => {
|
||||
({ className, type, prefix, ...props }, ref) => {
|
||||
return (
|
||||
<input
|
||||
type={type}
|
||||
className={cn(
|
||||
'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:bg-accent',
|
||||
className,
|
||||
<div className="relative flex items-center">
|
||||
{prefix && (
|
||||
<span className="pointer-events-none absolute left-3 flex items-center text-muted-foreground">
|
||||
{prefix}
|
||||
</span>
|
||||
)}
|
||||
ref={ref}
|
||||
{...props}
|
||||
/>
|
||||
<input
|
||||
type={type}
|
||||
className={cn(
|
||||
'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:bg-accent',
|
||||
prefix && 'pl-6',
|
||||
className,
|
||||
)}
|
||||
ref={ref}
|
||||
{...props}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
@@ -9,7 +9,6 @@ import { useIsPlatform } from '@/features/projects/common/hooks/useIsPlatform';
|
||||
import { useLocalMimirClient } from '@/hooks/useLocalMimirClient';
|
||||
import { execPromiseWithErrorToast } from '@/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
@@ -30,7 +29,6 @@ export default function DisableNewUsersSettings() {
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { currentProject } = useCurrentWorkspaceAndProject();
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -42,14 +40,14 @@ export default function DisableNewUsersSettings() {
|
||||
const form = useForm<DisableNewUsersFormValues>({
|
||||
reValidateMode: 'onSubmit',
|
||||
defaultValues: {
|
||||
disabled: !data?.config?.auth?.signUp?.enabled,
|
||||
disabled: data?.config?.auth?.signUp?.disableNewUsers,
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (!loading) {
|
||||
form.reset({
|
||||
disabled: !data?.config?.auth?.signUp?.enabled,
|
||||
disabled: data?.config?.auth?.signUp?.disableNewUsers,
|
||||
});
|
||||
}
|
||||
}, [loading, data, form]);
|
||||
@@ -58,7 +56,7 @@ export default function DisableNewUsersSettings() {
|
||||
return (
|
||||
<ActivityIndicator
|
||||
delay={1000}
|
||||
label="Loading disabled sign up settings..."
|
||||
label="Loading disabled new users settings..."
|
||||
className="justify-center"
|
||||
/>
|
||||
);
|
||||
@@ -79,7 +77,7 @@ export default function DisableNewUsersSettings() {
|
||||
config: {
|
||||
auth: {
|
||||
signUp: {
|
||||
enabled: !values.disabled,
|
||||
disableNewUsers: values.disabled,
|
||||
},
|
||||
},
|
||||
},
|
||||
@@ -104,10 +102,10 @@ export default function DisableNewUsersSettings() {
|
||||
}
|
||||
},
|
||||
{
|
||||
loadingMessage: 'Disabling new user sign ups...',
|
||||
successMessage: 'New user sign ups have been disabled successfully.',
|
||||
loadingMessage: 'Disabling new users sign ins...',
|
||||
successMessage: 'New users sign ins have been disabled successfully.',
|
||||
errorMessage:
|
||||
'An error occurred while trying to disable new user sign ups.',
|
||||
'An error occurred while trying to disable new users sign ins.',
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
@@ -15,6 +15,7 @@ query GetAuthenticationSettings($appId: uuid!) {
|
||||
}
|
||||
signUp {
|
||||
enabled
|
||||
disableNewUsers
|
||||
}
|
||||
session {
|
||||
accessToken {
|
||||
|
||||
@@ -0,0 +1,27 @@
|
||||
import { Divider } from '@/components/ui/v2/Divider';
|
||||
import { BillingCycle } from './components/BillingCycle';
|
||||
import { BillingDetails } from './components/BillingDetails';
|
||||
import { Estimate } from './components/Estimate';
|
||||
import { SpendingNotifications } from './components/SpendingNotifications';
|
||||
|
||||
export default function BillingEstimate() {
|
||||
return (
|
||||
<div className="">
|
||||
<div className="flex w-full flex-col rounded-md border bg-background">
|
||||
<div className="flex w-full flex-col gap-1 p-4">
|
||||
<span className="text-xl font-medium">Billing Estimate</span>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<Divider />
|
||||
<BillingCycle />
|
||||
<Divider />
|
||||
<Estimate />
|
||||
<Divider />
|
||||
<SpendingNotifications />
|
||||
<Divider />
|
||||
<BillingDetails />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
import { Progress } from '@/components/ui/v3/progress';
|
||||
import { getBillingCycleInfo } from '@/features/orgs/components/billing/utils/getBillingCycle';
|
||||
|
||||
export default function BillingCycle() {
|
||||
const { progress, billingCycleStart, billingCycleEnd, daysLeft } =
|
||||
getBillingCycleInfo();
|
||||
|
||||
const daysText = daysLeft === 1 ? 'day' : 'days';
|
||||
|
||||
return (
|
||||
<div className="flex w-full flex-col justify-between gap-4 p-4 md:flex-row md:gap-8">
|
||||
<div className="flex basis-1/2 flex-col">
|
||||
<span className="font-medium">
|
||||
Current billing cycle ({daysLeft} {daysText} left)
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex flex-1 flex-col gap-2 pb-2">
|
||||
<div className="flex justify-between">
|
||||
<span className="text-muted-foreground">{billingCycleStart}</span>
|
||||
<span className="text-muted-foreground">{billingCycleEnd}</span>
|
||||
</div>
|
||||
<Progress value={progress} className="h-3" />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export { default as BillingCycle } from './BillingCycle';
|
||||
@@ -0,0 +1,91 @@
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import {
|
||||
Accordion,
|
||||
AccordionContent,
|
||||
AccordionItem,
|
||||
AccordionTrigger,
|
||||
} from '@/components/ui/v3/accordion';
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableFooter,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from '@/components/ui/v3/table';
|
||||
import { useCurrentOrg } from '@/features/orgs/projects/hooks/useCurrentOrg';
|
||||
import { useBillingGetNextInvoiceQuery } from '@/utils/__generated__/graphql';
|
||||
|
||||
export default function BillingDetails() {
|
||||
const { org } = useCurrentOrg();
|
||||
const { data, loading } = useBillingGetNextInvoiceQuery({
|
||||
fetchPolicy: 'cache-first',
|
||||
variables: {
|
||||
organizationID: org?.id,
|
||||
},
|
||||
skip: !org,
|
||||
});
|
||||
|
||||
const billingItems = data?.billingGetNextInvoice?.items ?? [];
|
||||
const amountDue = data?.billingGetNextInvoice?.AmountDue ?? null;
|
||||
|
||||
if (!data || loading) {
|
||||
return (
|
||||
<div className="flex flex-col">
|
||||
<div className="flex flex-col gap-4 p-4">
|
||||
<div className="flex h-32 place-content-center">
|
||||
<ActivityIndicator
|
||||
label="Loading billing details..."
|
||||
className="justify-center text-sm"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Accordion type="single" collapsible>
|
||||
<AccordionItem value="details" className="border-none">
|
||||
<AccordionTrigger className="p-4">Details</AccordionTrigger>
|
||||
<AccordionContent className="border-t-1 pb-0">
|
||||
<div className="rounded-md">
|
||||
<Table>
|
||||
<TableHeader className="w-full bg-accent">
|
||||
<TableRow>
|
||||
<TableHead colSpan={3} className="w-full rounded-tl-md">
|
||||
Item
|
||||
</TableHead>
|
||||
<TableHead className="rounded-tr-md text-right">
|
||||
Amount
|
||||
</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{billingItems.map((billingItem) => (
|
||||
<TableRow key={billingItem.Description}>
|
||||
<TableCell colSpan={3}>{billingItem.Description}</TableCell>
|
||||
<TableCell colSpan={3} className="text-right">
|
||||
${billingItem.Amount}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
<TableFooter className="bg-accent">
|
||||
<TableRow>
|
||||
<TableCell colSpan={3} className="rounded-bl-md">
|
||||
Total
|
||||
</TableCell>
|
||||
<TableCell className="rounded-br-md text-right">
|
||||
${amountDue}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableFooter>
|
||||
</Table>
|
||||
</div>
|
||||
</AccordionContent>
|
||||
</AccordionItem>
|
||||
</Accordion>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export { default as BillingDetails } from './BillingDetails';
|
||||
@@ -0,0 +1,48 @@
|
||||
import { useCurrentOrg } from '@/features/orgs/projects/hooks/useCurrentOrg';
|
||||
import { useBillingGetNextInvoiceQuery } from '@/utils/__generated__/graphql';
|
||||
import { useMemo } from 'react';
|
||||
|
||||
export default function Estimate() {
|
||||
const { org } = useCurrentOrg();
|
||||
const { data, loading } = useBillingGetNextInvoiceQuery({
|
||||
fetchPolicy: 'cache-first',
|
||||
variables: {
|
||||
organizationID: org?.id,
|
||||
},
|
||||
skip: !org,
|
||||
});
|
||||
|
||||
const amountDue = useMemo(() => {
|
||||
const amount = data?.billingGetNextInvoice?.AmountDue;
|
||||
if (!amount) {
|
||||
return 'N/A';
|
||||
}
|
||||
if (typeof amount !== 'number') {
|
||||
return 'N/A';
|
||||
}
|
||||
return amount.toLocaleString('en', {
|
||||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2,
|
||||
});
|
||||
}, [data]);
|
||||
|
||||
if (loading) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex w-full flex-col justify-between gap-2 p-4 md:flex-row md:gap-8">
|
||||
<div className="flex basis-1/2 flex-col">
|
||||
<span className="font-medium">Estimate</span>
|
||||
<span className="text-xl font-semibold">${amountDue}</span>
|
||||
</div>
|
||||
<div className="flex flex-1 flex-col gap-2">
|
||||
<p className="max-w-prose">
|
||||
This estimate reflects your estimated next invoice based on current
|
||||
usage. Please note that usage data may have a processing delay of a
|
||||
few hours.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export { default as Estimate } from './Estimate';
|
||||
@@ -0,0 +1,320 @@
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Switch } from '@/components/ui/v2/Switch';
|
||||
import { Button } from '@/components/ui/v3/button';
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from '@/components/ui/v3/form';
|
||||
import { Input } from '@/components/ui/v3/input';
|
||||
import { Progress } from '@/components/ui/v3/progress';
|
||||
import {
|
||||
Tooltip,
|
||||
TooltipContent,
|
||||
TooltipTrigger,
|
||||
} from '@/components/ui/v3/tooltip';
|
||||
import { useIsOrgAdmin } from '@/features/orgs/hooks/useIsOrgAdmin';
|
||||
import { useCurrentOrg } from '@/features/orgs/projects/hooks/useCurrentOrg';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetOrganizationSpendingNotificationDocument,
|
||||
useBillingGetNextInvoiceQuery,
|
||||
useGetOrganizationSpendingNotificationQuery,
|
||||
useUpdateOrganizationSpendingNotificationMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
import { yupResolver } from '@hookform/resolvers/yup';
|
||||
import { useEffect, useMemo, type ChangeEvent } from 'react';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import * as Yup from 'yup';
|
||||
|
||||
const validationSchema = Yup.object({
|
||||
enabled: Yup.boolean().required(),
|
||||
threshold: Yup.number().test(
|
||||
'is-valid-threshold',
|
||||
`Threshold must be greater than 110% of your plan's price`,
|
||||
(value: number, { options }) => {
|
||||
const planPrice = options?.context?.planPrice || 0;
|
||||
if (value === 0) {
|
||||
return true;
|
||||
}
|
||||
if (typeof value === 'number' && value > 1.1 * planPrice) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
),
|
||||
});
|
||||
|
||||
type SpendingNotificationsFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function SpendingNotifications() {
|
||||
const { org } = useCurrentOrg();
|
||||
|
||||
const isAdmin = useIsOrgAdmin();
|
||||
|
||||
const { data, loading } = useGetOrganizationSpendingNotificationQuery({
|
||||
fetchPolicy: 'cache-first',
|
||||
variables: { orgId: org?.id },
|
||||
skip: !org,
|
||||
});
|
||||
|
||||
const { data: nextInvoiceData, loading: loadingInvoice } =
|
||||
useBillingGetNextInvoiceQuery({
|
||||
fetchPolicy: 'cache-first',
|
||||
variables: {
|
||||
organizationID: org?.id,
|
||||
},
|
||||
skip: !org,
|
||||
});
|
||||
|
||||
const amountDue = nextInvoiceData?.billingGetNextInvoice?.AmountDue ?? null;
|
||||
|
||||
const [updateConfig] = useUpdateOrganizationSpendingNotificationMutation({
|
||||
refetchQueries: [GetOrganizationSpendingNotificationDocument],
|
||||
});
|
||||
|
||||
const { threshold } = data?.organizations[0] ?? {};
|
||||
|
||||
const form = useForm<SpendingNotificationsFormValues>({
|
||||
reValidateMode: 'onSubmit',
|
||||
defaultValues: {
|
||||
enabled: false,
|
||||
threshold: threshold ?? 0,
|
||||
},
|
||||
resolver: yupResolver(validationSchema),
|
||||
context: {
|
||||
planPrice: org?.plan?.price ?? 0,
|
||||
},
|
||||
});
|
||||
|
||||
const { watch, setValue } = form;
|
||||
|
||||
const currentThreshold = watch('threshold');
|
||||
|
||||
const handleEnabledChange = (event: ChangeEvent<HTMLInputElement>) => {
|
||||
const { checked } = event.target;
|
||||
setValue('enabled', checked, { shouldDirty: true });
|
||||
if (!checked) {
|
||||
setValue('threshold', 0, { shouldDirty: true });
|
||||
}
|
||||
};
|
||||
|
||||
const enabled = watch('enabled');
|
||||
|
||||
const progress = useMemo(() => {
|
||||
if (!enabled || threshold <= 0 || !amountDue) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
const percent = (amountDue / threshold) * 100;
|
||||
return Math.min(Math.max(percent, 0), 100);
|
||||
}, [amountDue, enabled, threshold]);
|
||||
|
||||
const handleThresholdChange = (event: ChangeEvent<HTMLInputElement>) => {
|
||||
if (event.target.value === '') {
|
||||
setValue('threshold', undefined, { shouldDirty: true });
|
||||
} else {
|
||||
setValue('threshold', Number(event.target.value), { shouldDirty: true });
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!loading) {
|
||||
form.reset({
|
||||
enabled: !!threshold,
|
||||
threshold,
|
||||
});
|
||||
}
|
||||
}, [loading, threshold, form]);
|
||||
|
||||
const onSubmit = async (values: SpendingNotificationsFormValues) => {
|
||||
const updateConfigPromise = updateConfig({
|
||||
variables: {
|
||||
id: org?.id,
|
||||
threshold: values.threshold,
|
||||
},
|
||||
});
|
||||
|
||||
await execPromiseWithErrorToast(
|
||||
async () => {
|
||||
await updateConfigPromise;
|
||||
form.reset({
|
||||
enabled: !!values.threshold,
|
||||
threshold: values.threshold,
|
||||
});
|
||||
},
|
||||
{
|
||||
loadingMessage: 'Spending notifications are being updated...',
|
||||
successMessage:
|
||||
'Spending notifications have been updated successfully.',
|
||||
errorMessage:
|
||||
'An error occurred while trying to update spending notifications.',
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
const getNotificationPercentageAmount = (factor: number) => {
|
||||
if (!threshold || threshold <= 0) {
|
||||
return '\u00A0';
|
||||
}
|
||||
const amount = threshold * factor;
|
||||
return `$${Math.round(amount)}`;
|
||||
};
|
||||
|
||||
const inputMin = useMemo(
|
||||
() => Math.ceil(1.1 * (amountDue ?? 0)),
|
||||
[amountDue],
|
||||
);
|
||||
|
||||
if (loading || loadingInvoice) {
|
||||
return (
|
||||
<div className="flex flex-col">
|
||||
<div className="flex flex-col gap-4 p-4">
|
||||
<div className="flex h-32 place-content-center">
|
||||
<ActivityIndicator
|
||||
label="Loading spending notifications..."
|
||||
className="justify-center text-sm"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Form {...form}>
|
||||
<form
|
||||
className="flex flex-col gap-4 p-4"
|
||||
onSubmit={form.handleSubmit(onSubmit)}
|
||||
>
|
||||
<div className="flex flex-1 flex-row items-end justify-between gap-8">
|
||||
<span className="font-medium">Spending Notifications</span>
|
||||
<Switch
|
||||
className="self-end"
|
||||
id="enabled"
|
||||
checked={enabled}
|
||||
onChange={handleEnabledChange}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex w-full flex-col justify-between gap-8 md:flex-row">
|
||||
<div className="flex basis-1/2 flex-col gap-2">
|
||||
<p className="max-w-prose">
|
||||
Specify a spending threshold to receive email notifications when
|
||||
your usage approaches the designated amount.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-1 flex-col gap-4">
|
||||
{enabled && (
|
||||
<>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="threshold"
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex flex-1 flex-col">
|
||||
<FormLabel className="flex flex-1 flex-row items-center gap-2">
|
||||
<span>Amount</span>
|
||||
</FormLabel>
|
||||
<FormControl>
|
||||
{isAdmin ? (
|
||||
<Input
|
||||
prefix="$"
|
||||
type="number"
|
||||
min={inputMin}
|
||||
placeholder="0"
|
||||
disabled={!enabled}
|
||||
{...field}
|
||||
onChange={handleThresholdChange}
|
||||
value={currentThreshold}
|
||||
/>
|
||||
) : (
|
||||
<Tooltip>
|
||||
<TooltipTrigger type="button">
|
||||
<Input
|
||||
prefix="$"
|
||||
type="number"
|
||||
min="0"
|
||||
placeholder="0"
|
||||
disabled
|
||||
{...field}
|
||||
onChange={handleThresholdChange}
|
||||
value={currentThreshold}
|
||||
/>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>
|
||||
Only an organization admin can change this value.
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
)}
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<div className="flex flex-1 flex-col gap-2">
|
||||
<div className="flex flex-1">
|
||||
<div className="basis-3/4" />
|
||||
<div className="flex flex-1 justify-between gap-2">
|
||||
<div className="flex basis-2/3 text-muted-foreground">
|
||||
<span className="w-13 text-center">75%</span>
|
||||
</div>
|
||||
<div className="flex basis-1/3 text-muted-foreground">
|
||||
<span className="w-13 text-center">90%</span>
|
||||
</div>
|
||||
<div className="flex basis-1/3 text-muted-foreground">
|
||||
<span className="w-13 text-center">100%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Progress value={progress} className="h-3" />
|
||||
<div className="flex flex-1">
|
||||
<div className="basis-3/4" />
|
||||
<div className="flex flex-1 justify-between gap-2">
|
||||
<div className="flex basis-2/3 text-muted-foreground">
|
||||
<span className="w-13 overflow-hidden text-ellipsis text-center">
|
||||
{getNotificationPercentageAmount(0.75) || '\u00A0'}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex basis-1/3 text-muted-foreground">
|
||||
<span className="w-13 overflow-hidden text-ellipsis text-center">
|
||||
{getNotificationPercentageAmount(0.9) || '\u00A0'}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex basis-1/3 text-muted-foreground">
|
||||
<span className="w-13 overflow-hidden text-ellipsis text-center">
|
||||
{getNotificationPercentageAmount(1) || '\u00A0'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p className="max-w-prose">
|
||||
You'll receive email alerts when your usage reaches 75%,
|
||||
90%, and 100% of your configured value. These are
|
||||
notifications only - your service will continue running
|
||||
normally.
|
||||
</p>
|
||||
</>
|
||||
)}
|
||||
<div className="flex flex-1 flex-col justify-end">
|
||||
<Button
|
||||
type="submit"
|
||||
className="h-fit self-end"
|
||||
disabled={!form.formState.isDirty || !isAdmin}
|
||||
>
|
||||
{form.formState.isSubmitting ? (
|
||||
<ActivityIndicator className="text-sm" />
|
||||
) : (
|
||||
'Save'
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export { default as SpendingNotifications } from './SpendingNotifications';
|
||||
@@ -0,0 +1 @@
|
||||
export { default as BillingEstimate } from './BillingEstimate';
|
||||
@@ -41,8 +41,8 @@ const changeOrgPlanForm = z.object({
|
||||
|
||||
export default function SubscriptionPlan() {
|
||||
const { maintenanceActive } = useUI();
|
||||
const [open, setOpen] = useState(false);
|
||||
const { org, refetch: refetchOrg } = useCurrentOrg();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [changeOrgPlan] = useBillingChangeOrganizationPlanMutation();
|
||||
const { data: { plans = [] } = {} } = useGetOrganizationPlansQuery();
|
||||
const [fetchOrganizationCustomePortalLink, { loading }] =
|
||||
@@ -102,7 +102,6 @@ export default function SubscriptionPlan() {
|
||||
|
||||
if (billingOrganizationCustomePortal) {
|
||||
const newWindow = window.open(billingOrganizationCustomePortal);
|
||||
|
||||
if (!newWindow) {
|
||||
window.location.href = billingOrganizationCustomePortal;
|
||||
}
|
||||
@@ -126,30 +125,34 @@ export default function SubscriptionPlan() {
|
||||
<div className="flex w-full flex-col gap-1 border-b p-4">
|
||||
<h4 className="font-medium">Subscription plan</h4>
|
||||
</div>
|
||||
<div className="flex flex-col border-b md:flex-row">
|
||||
<div className="flex w-full flex-col gap-4 p-4">
|
||||
<div className="flex w-full flex-col justify-between gap-8 border-b p-4 md:flex-row">
|
||||
<div className="flex basis-1/2 flex-col gap-4">
|
||||
<span className="font-medium">Organization name</span>
|
||||
<span className="font-medium">{org?.name}</span>
|
||||
</div>
|
||||
<div className="flex w-full flex-col gap-2 p-4">
|
||||
<span className="font-medium">Current plan</span>
|
||||
<span className="text-xl font-bold text-primary">
|
||||
{org?.plan?.name}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex w-full flex-col items-start justify-start gap-4 p-4 md:items-end md:justify-end">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-xl font-semibold">
|
||||
${org?.plan?.price}
|
||||
<div className="flex flex-1 flex-col gap-8 md:flex-row">
|
||||
<div className="flex flex-1 flex-col gap-2">
|
||||
<span className="font-medium">Current plan</span>
|
||||
<span className="text-xl font-bold text-primary">
|
||||
{org?.plan?.name}
|
||||
</span>
|
||||
<Slash
|
||||
className="h-5 w-5 text-muted-foreground/40"
|
||||
strokeWidth={2.5}
|
||||
/>
|
||||
<span className="text-xl font-semibold">month</span>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-1 items-start justify-start md:items-end md:justify-end">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-xl font-semibold">
|
||||
${org?.plan?.price}
|
||||
</span>
|
||||
<Slash
|
||||
className="h-5 w-5 text-muted-foreground/40"
|
||||
strokeWidth={2.5}
|
||||
/>
|
||||
<span className="text-xl font-semibold">month</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex w-full flex-col-reverse items-end justify-between gap-2 p-4 md:flex-row md:items-center md:gap-0">
|
||||
<div>
|
||||
<span>For a complete list of features, visit our </span>
|
||||
@@ -164,14 +167,18 @@ export default function SubscriptionPlan() {
|
||||
<ArrowSquareOutIcon className="mb-[2px] ml-1 h-4 w-4" />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="flex flex-row items-center justify-end gap-2">
|
||||
<div className="flex w-full flex-row items-center justify-end gap-2">
|
||||
<Button
|
||||
className="h-fit"
|
||||
className="h-fit truncate"
|
||||
variant="secondary"
|
||||
onClick={handleUpdatePaymentDetails}
|
||||
disabled={org?.plan?.isFree || maintenanceActive || loading}
|
||||
>
|
||||
{loading ? <ActivityIndicator /> : 'Stripe Customer Portal'}
|
||||
{loading ? (
|
||||
<ActivityIndicator />
|
||||
) : (
|
||||
<span className="truncate">Stripe Customer Portal</span>
|
||||
)}
|
||||
</Button>
|
||||
<Button
|
||||
disabled={org?.plan?.isFree || maintenanceActive}
|
||||
|
||||
@@ -1,97 +0,0 @@
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Progress } from '@/components/ui/v3/progress';
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableFooter,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from '@/components/ui/v3/table';
|
||||
import { getBillingCycleInfo } from '@/features/orgs/components/billing/utils/getBillingCycle';
|
||||
import { useCurrentOrg } from '@/features/orgs/projects/hooks/useCurrentOrg';
|
||||
import { useBillingGetNextInvoiceQuery } from '@/utils/__generated__/graphql';
|
||||
|
||||
export default function Usage() {
|
||||
const { org } = useCurrentOrg();
|
||||
const { billingCycleRange, progress } = getBillingCycleInfo();
|
||||
const { data, loading } = useBillingGetNextInvoiceQuery({
|
||||
fetchPolicy: 'cache-first',
|
||||
variables: {
|
||||
organizationID: org?.id,
|
||||
},
|
||||
skip: !org,
|
||||
});
|
||||
|
||||
const billingItems = data?.billingGetNextInvoice?.items ?? [];
|
||||
const amountDue = data?.billingGetNextInvoice?.AmountDue ?? null;
|
||||
|
||||
return (
|
||||
<div className="font-medium">
|
||||
<div className="flex flex-col w-full border rounded-md bg-background">
|
||||
<div className="flex flex-col w-full gap-1 p-4">
|
||||
<span>Usage</span>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<div className="flex flex-row items-center justify-between w-full p-4 border-t border-b">
|
||||
<span>Billing cycle ({billingCycleRange})</span>
|
||||
<Progress value={progress} className="h-2 max-w-xl" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-4 p-4">
|
||||
{loading && (
|
||||
<div className="flex h-32 place-content-center">
|
||||
<ActivityIndicator
|
||||
label="Loading usage stats..."
|
||||
className="justify-center text-sm"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{!loading && data && (
|
||||
<>
|
||||
<span>Breakdown</span>
|
||||
<div className="border rounded-md">
|
||||
<Table>
|
||||
<TableHeader className="w-full bg-accent">
|
||||
<TableRow>
|
||||
<TableHead colSpan={3} className="w-full rounded-tl-md">
|
||||
Item
|
||||
</TableHead>
|
||||
<TableHead className="text-right rounded-tr-md">
|
||||
Amount
|
||||
</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{billingItems.map((billingItem) => (
|
||||
<TableRow key={billingItem.Description}>
|
||||
<TableCell colSpan={3}>
|
||||
{billingItem.Description}
|
||||
</TableCell>
|
||||
<TableCell colSpan={3} className="text-right">
|
||||
${billingItem.Amount}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
<TableFooter className="bg-accent">
|
||||
<TableRow>
|
||||
<TableCell colSpan={3} className="rounded-bl-md">
|
||||
Total
|
||||
</TableCell>
|
||||
<TableCell className="text-right rounded-br-md">
|
||||
${amountDue}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableFooter>
|
||||
</Table>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
export { default as Usage } from './Usage';
|
||||
@@ -18,9 +18,13 @@ export const getBillingCycleInfo = () => {
|
||||
(now.getTime() - startOfMonth.getTime()) / (1000 * 60 * 60 * 24) + 1;
|
||||
|
||||
const progress = (daysPassed / totalDays) * 100;
|
||||
const daysLeft = Math.max(Math.ceil(totalDays - daysPassed), 0);
|
||||
|
||||
return {
|
||||
billingCycleStart,
|
||||
billingCycleEnd,
|
||||
billingCycleRange: `${billingCycleStart} - ${billingCycleEnd}`,
|
||||
progress: Math.min(Math.max(progress, 0), 100), // Ensure the value is between 0 and 100
|
||||
daysLeft,
|
||||
};
|
||||
};
|
||||
|
||||
@@ -52,9 +52,9 @@ export default function SettingsLayout({ children }: SettingsLayoutProps) {
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
href="https://docs.nhost.io/cli/overlays"
|
||||
href="https://docs.nhost.io/guides/cli/configuration-overlays#configuration-overlays"
|
||||
>
|
||||
docs.nhost.io/cli/overlays
|
||||
Configuration Overlays
|
||||
</a>{' '}
|
||||
for guidance.
|
||||
</Text>
|
||||
|
||||
@@ -3,7 +3,7 @@ import { useDialog } from '@/components/common/DialogProvider';
|
||||
import { Box } from '@/components/ui/v2/Box';
|
||||
import { Button } from '@/components/ui/v2/Button';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import { useCurrentWorkspaceAndProject } from '@/features/projects/common/hooks/useCurrentWorkspaceAndProject';
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { useIsPlatform } from '@/features/projects/common/hooks/useIsPlatform';
|
||||
import { useLocalMimirClient } from '@/hooks/useLocalMimirClient';
|
||||
import { execPromiseWithErrorToast } from '@/utils/execPromiseWithErrorToast';
|
||||
@@ -26,11 +26,12 @@ export default function DisableAIServiceConfirmationDialog({
|
||||
onCancel,
|
||||
onServiceDisabled,
|
||||
}: DisableAIServiceConfirmationDialogProps) {
|
||||
const { project } = useProject();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { openDialog, closeDialog } = useDialog();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const { currentProject } = useCurrentWorkspaceAndProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
@@ -42,7 +43,7 @@ export default function DisableAIServiceConfirmationDialog({
|
||||
async () => {
|
||||
await updateConfig({
|
||||
variables: {
|
||||
appId: currentProject.id,
|
||||
appId: project?.id,
|
||||
config: {
|
||||
ai: null,
|
||||
},
|
||||
|
||||
@@ -6,7 +6,6 @@ import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -32,13 +31,13 @@ export type AllowedEmailSettingsFormValues = Yup.InferType<
|
||||
>;
|
||||
|
||||
export default function AllowedEmailDomainsSettings() {
|
||||
const { openDialog } = useDialog();
|
||||
const { project } = useProject();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { openDialog } = useDialog();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -6,7 +6,6 @@ import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -29,13 +28,13 @@ export type AllowedRedirectURLFormValues = Yup.InferType<
|
||||
>;
|
||||
|
||||
export default function AllowedRedirectURLsSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { maintenanceActive } = useUI();
|
||||
const { project } = useProject();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -9,7 +9,6 @@ import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimi
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -25,13 +24,13 @@ const validationSchema = Yup.object({
|
||||
export type AnonymousSignInFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function AnonymousSignInSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -14,7 +14,6 @@ import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimi
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -58,13 +57,13 @@ export type AppleProviderFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function AppleProviderSettings() {
|
||||
const theme = useTheme();
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -269,7 +268,7 @@ export default function AppleProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -6,7 +6,6 @@ import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
Software_Type_Enum,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useGetSoftwareVersionsQuery,
|
||||
@@ -34,13 +33,13 @@ export type AuthServiceVersionFormValues = Yup.InferType<
|
||||
>;
|
||||
|
||||
export default function AuthServiceVersionSettings() {
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { maintenanceActive } = useUI();
|
||||
const { project } = useProject();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { openDialog } = useDialog();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -154,7 +153,7 @@ export default function AuthServiceVersionSettings() {
|
||||
}}
|
||||
docsLink="https://github.com/nhost/hasura-auth/releases"
|
||||
docsTitle="the latest releases"
|
||||
className="grid grid-flow-row px-4 gap-x-4 gap-y-2 lg:grid-cols-5"
|
||||
className="grid grid-flow-row gap-x-4 gap-y-2 px-4 lg:grid-cols-5"
|
||||
>
|
||||
<ControlledAutocomplete
|
||||
id="version"
|
||||
|
||||
@@ -15,7 +15,6 @@ import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimi
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -51,13 +50,13 @@ const validationSchema = Yup.object({
|
||||
export type AzureADProviderFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function AzureADProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { maintenanceActive } = useUI();
|
||||
const { project } = useProject();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -214,7 +213,7 @@ export default function AzureADProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -6,7 +6,6 @@ import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -30,13 +29,13 @@ const validationSchema = Yup.object({
|
||||
export type BlockedEmailFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function BlockedEmailSettings() {
|
||||
const { openDialog } = useDialog();
|
||||
const { project } = useProject();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { openDialog } = useDialog();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -6,7 +6,6 @@ import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -27,13 +26,13 @@ const validationSchema = Yup.object({
|
||||
export type ClientURLFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function ClientURLSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -5,7 +5,6 @@ import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
@@ -27,13 +26,13 @@ export type ToggleConcealErrorsFormValues = Yup.InferType<
|
||||
>;
|
||||
|
||||
export default function ConcealErrorsSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimi
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetSmtpSettingsDocument,
|
||||
useGetSmtpSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
import { useState } from 'react';
|
||||
@@ -52,16 +52,24 @@ function ConfirmDeleteSMTPSettingsModal({
|
||||
}
|
||||
|
||||
export default function DeleteSMTPSettings() {
|
||||
const { openDialog, closeDialog } = useDialog();
|
||||
|
||||
const { project } = useProject();
|
||||
const isPlatform = useIsPlatform();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { maintenanceActive } = useUI();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const { project } = useProject();
|
||||
const { openDialog, closeDialog } = useDialog();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
|
||||
const { data, refetch } = useGetSmtpSettingsQuery({
|
||||
variables: { appId: project?.id },
|
||||
fetchPolicy: 'cache-and-network',
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
const smtpSettings = data?.config?.provider?.smtp ?? {};
|
||||
|
||||
const isSMTPConfigured = Boolean(Object.keys(smtpSettings).length);
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSmtpSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -111,7 +119,10 @@ export default function DeleteSMTPSettings() {
|
||||
component: (
|
||||
<ConfirmDeleteSMTPSettingsModal
|
||||
close={closeDialog}
|
||||
onDelete={deleteSMTPSettings}
|
||||
onDelete={async () => {
|
||||
await deleteSMTPSettings();
|
||||
await refetch();
|
||||
}}
|
||||
/>
|
||||
),
|
||||
});
|
||||
@@ -132,7 +143,7 @@ export default function DeleteSMTPSettings() {
|
||||
color="error"
|
||||
className="mx-4 mt-4 justify-self-end"
|
||||
onClick={confirmDeleteSMTPSettings}
|
||||
disabled={loading || maintenanceActive}
|
||||
disabled={loading || maintenanceActive || !isSMTPConfigured}
|
||||
loading={loading}
|
||||
>
|
||||
Delete
|
||||
|
||||
@@ -5,7 +5,6 @@ import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
@@ -25,13 +24,13 @@ const validationSchema = Yup.object({
|
||||
export type DisableNewUsersFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function DisableNewUsersSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -43,14 +42,14 @@ export default function DisableNewUsersSettings() {
|
||||
const form = useForm<DisableNewUsersFormValues>({
|
||||
reValidateMode: 'onSubmit',
|
||||
defaultValues: {
|
||||
disabled: !data?.config?.auth?.signUp?.enabled,
|
||||
disabled: data?.config?.auth?.signUp?.disableNewUsers,
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (!loading) {
|
||||
form.reset({
|
||||
disabled: !data?.config?.auth?.signUp?.enabled,
|
||||
disabled: data?.config?.auth?.signUp?.disableNewUsers,
|
||||
});
|
||||
}
|
||||
}, [loading, data, form]);
|
||||
@@ -59,7 +58,7 @@ export default function DisableNewUsersSettings() {
|
||||
return (
|
||||
<ActivityIndicator
|
||||
delay={1000}
|
||||
label="Loading disabled sign up settings..."
|
||||
label="Loading disabled new users settings..."
|
||||
className="justify-center"
|
||||
/>
|
||||
);
|
||||
@@ -80,7 +79,7 @@ export default function DisableNewUsersSettings() {
|
||||
config: {
|
||||
auth: {
|
||||
signUp: {
|
||||
enabled: !values.disabled,
|
||||
disableNewUsers: values.disabled,
|
||||
},
|
||||
},
|
||||
},
|
||||
@@ -105,10 +104,10 @@ export default function DisableNewUsersSettings() {
|
||||
}
|
||||
},
|
||||
{
|
||||
loadingMessage: 'Disabling new user sign ups...',
|
||||
successMessage: 'New user sign ups have been disabled successfully.',
|
||||
loadingMessage: 'Disabling new users sign ins...',
|
||||
successMessage: 'New users sign ins have been disabled successfully.',
|
||||
errorMessage:
|
||||
'An error occurred while trying to disable new user sign ups.',
|
||||
'An error occurred while trying to disable new users sign ins.',
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
@@ -0,0 +1,134 @@
|
||||
import { ApplyLocalSettingsDialog } from '@/components/common/ApplyLocalSettingsDialog';
|
||||
import { useDialog } from '@/components/common/DialogProvider';
|
||||
import { useUI } from '@/components/common/UIProvider';
|
||||
import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import {
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
import { useEffect } from 'react';
|
||||
import { FormProvider, useForm } from 'react-hook-form';
|
||||
import * as Yup from 'yup';
|
||||
|
||||
import { useIsPlatform } from '@/features/orgs/projects/common/hooks/useIsPlatform';
|
||||
import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimirClient';
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
|
||||
const validationSchema = Yup.object({
|
||||
disabled: Yup.boolean(),
|
||||
});
|
||||
|
||||
export type DisableSignUpsFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function DisableSignUpsSettings() {
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
const { data, loading, error } = useGetAuthenticationSettingsQuery({
|
||||
variables: { appId: project?.id },
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
const form = useForm<DisableSignUpsFormValues>({
|
||||
reValidateMode: 'onSubmit',
|
||||
defaultValues: {
|
||||
disabled: !data?.config?.auth?.signUp?.enabled,
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (!loading) {
|
||||
form.reset({
|
||||
disabled: !data?.config?.auth?.signUp?.enabled,
|
||||
});
|
||||
}
|
||||
}, [loading, data, form]);
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<ActivityIndicator
|
||||
delay={1000}
|
||||
label="Loading disabled sign up settings..."
|
||||
className="justify-center"
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (error) {
|
||||
throw error;
|
||||
}
|
||||
|
||||
const { formState } = form;
|
||||
|
||||
const handleDisableSignUpsChange = async (
|
||||
values: DisableSignUpsFormValues,
|
||||
) => {
|
||||
const updateConfigPromise = updateConfig({
|
||||
variables: {
|
||||
appId: project.id,
|
||||
config: {
|
||||
auth: {
|
||||
signUp: {
|
||||
enabled: !values.disabled,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
await execPromiseWithErrorToast(
|
||||
async () => {
|
||||
await updateConfigPromise;
|
||||
form.reset(values);
|
||||
|
||||
if (!isPlatform) {
|
||||
openDialog({
|
||||
title: 'Apply your changes',
|
||||
component: <ApplyLocalSettingsDialog />,
|
||||
props: {
|
||||
PaperProps: {
|
||||
className: 'max-w-2xl',
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
{
|
||||
loadingMessage: 'Disabling new users sign ups...',
|
||||
successMessage: 'New users sign ups have been disabled successfully.',
|
||||
errorMessage:
|
||||
'An error occurred while trying to disable new users sign ups.',
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<FormProvider {...form}>
|
||||
<Form onSubmit={handleDisableSignUpsChange}>
|
||||
<SettingsContainer
|
||||
title="Disable Sign Ups"
|
||||
description="If set, new users won't be able to sign up."
|
||||
docsLink="https://docs.nhost.io/guides/auth/overview#disable-sign-ups"
|
||||
switchId="disabled"
|
||||
showSwitch
|
||||
slotProps={{
|
||||
submitButton: {
|
||||
disabled: !formState.isDirty || maintenanceActive,
|
||||
loading: formState.isSubmitting,
|
||||
},
|
||||
}}
|
||||
className="hidden"
|
||||
/>
|
||||
</Form>
|
||||
</FormProvider>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export { default as DisableSignUpsSettings } from './DisableSignUpsSettings';
|
||||
@@ -19,7 +19,6 @@ import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimi
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -30,13 +29,13 @@ import { FormProvider, useForm } from 'react-hook-form';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
export default function DiscordProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -184,7 +183,7 @@ export default function DiscordProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -8,7 +8,6 @@ import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -35,13 +34,13 @@ const validationSchema = Yup.object({
|
||||
export type EmailAndPasswordFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function EmailAndPasswordSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -14,7 +14,6 @@ import {
|
||||
baseProviderValidationSchema,
|
||||
} from '@/features/orgs/projects/authentication/settings/components/BaseProviderSettings';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -31,13 +30,13 @@ import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
|
||||
export default function FacebookProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -185,7 +184,7 @@ export default function FacebookProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -14,7 +14,6 @@ import {
|
||||
baseProviderValidationSchema,
|
||||
} from '@/features/orgs/projects/authentication/settings/components/BaseProviderSettings';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -33,13 +32,13 @@ import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWith
|
||||
|
||||
export default function GitHubProviderSettings() {
|
||||
const theme = useTheme();
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -191,7 +190,7 @@ export default function GitHubProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -14,7 +14,6 @@ import {
|
||||
baseProviderValidationSchema,
|
||||
} from '@/features/orgs/projects/authentication/settings/components/BaseProviderSettings';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -31,13 +30,13 @@ import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
|
||||
export default function GoogleProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -185,7 +184,7 @@ export default function GoogleProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -7,7 +7,6 @@ import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -35,13 +34,13 @@ const validationSchema = Yup.object({
|
||||
export type GravatarFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function GravatarSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -14,7 +14,6 @@ import {
|
||||
baseProviderValidationSchema,
|
||||
} from '@/features/orgs/projects/authentication/settings/components/BaseProviderSettings';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -31,13 +30,13 @@ import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
|
||||
export default function LinkedInProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -185,7 +184,7 @@ export default function LinkedInProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -6,7 +6,6 @@ import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -29,18 +28,19 @@ const validationSchema = Yup.object({
|
||||
export type MFASettingsFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function MFASettings() {
|
||||
const { openDialog } = useDialog();
|
||||
const { project } = useProject();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { openDialog } = useDialog();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
const { data, loading, error } = useGetAuthenticationSettingsQuery({
|
||||
variables: { appId: project?.id },
|
||||
fetchPolicy: 'cache-and-network',
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -5,7 +5,6 @@ import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -26,13 +25,13 @@ const validationSchema = Yup.object({
|
||||
export type MagicLinkFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function MagicLinkSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -5,7 +5,6 @@ import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetSmtpSettingsDocument,
|
||||
useGetSmtpSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
@@ -28,21 +27,21 @@ const validationSchema = yup
|
||||
export type PostmarkFormValues = yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function PostmarkSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const { data } = useGetSmtpSettingsQuery({
|
||||
const { data, refetch } = useGetSmtpSettingsQuery({
|
||||
variables: { appId: project?.id },
|
||||
fetchPolicy: 'cache-and-network',
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
const { sender, password } = data?.config?.provider?.smtp || {};
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSmtpSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -81,6 +80,8 @@ export default function PostmarkSettings() {
|
||||
await execPromiseWithErrorToast(
|
||||
async () => {
|
||||
await updateConfigPromise;
|
||||
form.reset({ ...values });
|
||||
await refetch();
|
||||
|
||||
if (!isPlatform) {
|
||||
openDialog({
|
||||
|
||||
@@ -9,7 +9,6 @@ import { Option } from '@/components/ui/v2/Option';
|
||||
import { Select } from '@/components/ui/v2/Select';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -50,17 +49,17 @@ const validationSchema = Yup.object({
|
||||
export type SMSSettingsFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function SMSSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
const { data, error, loading } = useGetSignInMethodsQuery({
|
||||
const { data, loading, error } = useGetSignInMethodsQuery({
|
||||
variables: { appId: project?.id },
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -6,7 +6,6 @@ import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetSmtpSettingsDocument,
|
||||
useGetSmtpSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/utils/__generated__/graphql';
|
||||
@@ -38,14 +37,15 @@ const smtpValidationSchema = yup
|
||||
export type SmtpFormValues = yup.InferType<typeof smtpValidationSchema>;
|
||||
|
||||
export default function SMTPSettings() {
|
||||
const { maintenanceActive } = useUI();
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const { data } = useGetSmtpSettingsQuery({
|
||||
const { data, refetch } = useGetSmtpSettingsQuery({
|
||||
variables: { appId: project?.id },
|
||||
fetchPolicy: 'cache-and-network',
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -83,7 +83,6 @@ export default function SMTPSettings() {
|
||||
} = form;
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSmtpSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -104,6 +103,8 @@ export default function SMTPSettings() {
|
||||
await execPromiseWithErrorToast(
|
||||
async () => {
|
||||
await updateConfigPromise;
|
||||
form.reset({ ...values });
|
||||
await refetch();
|
||||
|
||||
if (!isPlatform) {
|
||||
openDialog({
|
||||
|
||||
@@ -6,7 +6,6 @@ import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import {
|
||||
GetAuthenticationSettingsDocument,
|
||||
useGetAuthenticationSettingsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -34,13 +33,13 @@ const validationSchema = Yup.object({
|
||||
export type SessionFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function SessionSettings() {
|
||||
const { openDialog } = useDialog();
|
||||
const { project } = useProject();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { openDialog } = useDialog();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetAuthenticationSettingsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -14,7 +14,6 @@ import {
|
||||
baseProviderValidationSchema,
|
||||
} from '@/features/authentication/settings/components/BaseProviderSettings';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -31,13 +30,13 @@ import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
|
||||
export default function SpotifyProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -185,7 +184,7 @@ export default function SpotifyProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -14,7 +14,6 @@ import {
|
||||
baseProviderValidationSchema,
|
||||
} from '@/features/orgs/projects/authentication/settings/components/BaseProviderSettings';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -33,13 +32,13 @@ import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWith
|
||||
|
||||
export default function TwitchProviderSettings() {
|
||||
const theme = useTheme();
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { maintenanceActive } = useUI();
|
||||
const { project } = useProject();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -191,7 +190,7 @@ export default function TwitchProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -9,7 +9,6 @@ import { CopyIcon } from '@/components/ui/v2/icons/CopyIcon';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import { InputAdornment } from '@/components/ui/v2/InputAdornment';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -45,13 +44,13 @@ const validationSchema = Yup.object({
|
||||
export type TwitterProviderFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function TwitterProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -217,7 +216,7 @@ export default function TwitterProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -5,7 +5,6 @@ import { Form } from '@/components/form/Form';
|
||||
import { SettingsContainer } from '@/components/layout/SettingsContainer';
|
||||
import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -26,13 +25,13 @@ const validationSchema = Yup.object({
|
||||
export type WebAuthnFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function WebAuthnSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { maintenanceActive } = useUI();
|
||||
const { project } = useProject();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
|
||||
@@ -14,7 +14,6 @@ import {
|
||||
baseProviderValidationSchema,
|
||||
} from '@/features/orgs/projects/authentication/settings/components/BaseProviderSettings';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -31,13 +30,13 @@ import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
|
||||
export default function WindowsLiveProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -183,7 +182,7 @@ export default function WindowsLiveProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -15,7 +15,6 @@ import { useLocalMimirClient } from '@/features/orgs/projects/hooks/useLocalMimi
|
||||
import { useProject } from '@/features/orgs/projects/hooks/useProject';
|
||||
import { execPromiseWithErrorToast } from '@/features/orgs/utils/execPromiseWithErrorToast';
|
||||
import {
|
||||
GetSignInMethodsDocument,
|
||||
useGetSignInMethodsQuery,
|
||||
useUpdateConfigMutation,
|
||||
} from '@/generated/graphql';
|
||||
@@ -57,13 +56,13 @@ const validationSchema = Yup.object({
|
||||
export type WorkOsProviderFormValues = Yup.InferType<typeof validationSchema>;
|
||||
|
||||
export default function WorkOsProviderSettings() {
|
||||
const { project } = useProject();
|
||||
const { openDialog } = useDialog();
|
||||
const isPlatform = useIsPlatform();
|
||||
const { maintenanceActive } = useUI();
|
||||
const localMimirClient = useLocalMimirClient();
|
||||
const { project } = useProject();
|
||||
|
||||
const [updateConfig] = useUpdateConfigMutation({
|
||||
refetchQueries: [GetSignInMethodsDocument],
|
||||
...(!isPlatform ? { client: localMimirClient } : {}),
|
||||
});
|
||||
|
||||
@@ -244,7 +243,7 @@ export default function WorkOsProviderSettings() {
|
||||
);
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="w-4 h-4" />
|
||||
<CopyIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
</InputAdornment>
|
||||
}
|
||||
|
||||
@@ -15,6 +15,7 @@ query GetAuthenticationSettings($appId: uuid!) {
|
||||
}
|
||||
signUp {
|
||||
enabled
|
||||
disableNewUsers
|
||||
}
|
||||
session {
|
||||
accessToken {
|
||||
|
||||
@@ -159,9 +159,6 @@ export default function TOMLEditor() {
|
||||
height="100%"
|
||||
width="100%"
|
||||
theme={theme.palette.mode === 'light' ? bbedit : githubDark}
|
||||
basicSetup={{
|
||||
searchKeymap: false,
|
||||
}}
|
||||
extensions={[StreamLanguage.define(toml)]}
|
||||
onChange={onChange}
|
||||
/>
|
||||
|
||||
@@ -11,12 +11,12 @@ import { Text } from '@/components/ui/v2/Text';
|
||||
import type {
|
||||
ColumnType,
|
||||
DatabaseColumn,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import {
|
||||
identityTypes,
|
||||
postgresFunctions,
|
||||
postgresTypeGroups,
|
||||
} from '@/features/database/dataGrid/utils/postgresqlConstants';
|
||||
} from '@/features/orgs/projects/database/dataGrid/utils/postgresqlConstants';
|
||||
import type { DialogFormProps } from '@/types/common';
|
||||
import clsx from 'clsx';
|
||||
import { useEffect, useState } from 'react';
|
||||
@@ -102,7 +102,7 @@ export default function BaseColumnForm({
|
||||
return (
|
||||
<Form
|
||||
onSubmit={handleExternalSubmit}
|
||||
className="flex flex-col content-between flex-auto overflow-hidden border-t-1"
|
||||
className="flex flex-auto flex-col content-between overflow-hidden border-t-1"
|
||||
>
|
||||
<div className="flex-auto overflow-y-auto">
|
||||
<section className="grid grid-cols-8 px-6 py-3">
|
||||
@@ -184,7 +184,7 @@ export default function BaseColumnForm({
|
||||
</Text>
|
||||
</span>
|
||||
}
|
||||
className="w-full col-span-8 py-3 m-0 sm:col-span-6 sm:col-start-3 sm:ml-1"
|
||||
className="col-span-8 m-0 w-full py-3 sm:col-span-6 sm:col-start-3 sm:ml-1"
|
||||
onChange={(_event, checked) => {
|
||||
if (checked) {
|
||||
setDefaultValueInputText('');
|
||||
@@ -197,7 +197,7 @@ export default function BaseColumnForm({
|
||||
|
||||
<Box
|
||||
component="section"
|
||||
className="grid grid-cols-8 px-6 py-3 border-t-1"
|
||||
className="grid grid-cols-8 border-t-1 px-6 py-3"
|
||||
>
|
||||
<ControlledAutocomplete
|
||||
id="defaultValue"
|
||||
@@ -249,7 +249,7 @@ export default function BaseColumnForm({
|
||||
/>
|
||||
|
||||
<ControlledCheckbox
|
||||
className="w-full col-span-8 py-3 m-0 sm:col-span-6 sm:col-start-3 sm:ml-1"
|
||||
className="col-span-8 m-0 w-full py-3 sm:col-span-6 sm:col-start-3 sm:ml-1"
|
||||
name="isNullable"
|
||||
label={
|
||||
<span className="inline-grid grid-flow-row">
|
||||
@@ -269,7 +269,7 @@ export default function BaseColumnForm({
|
||||
/>
|
||||
|
||||
<ControlledCheckbox
|
||||
className="w-full col-span-8 py-3 m-0 sm:col-span-6 sm:col-start-3 sm:ml-1"
|
||||
className="col-span-8 m-0 w-full py-3 sm:col-span-6 sm:col-start-3 sm:ml-1"
|
||||
name="isUnique"
|
||||
label={
|
||||
<span className="inline-grid grid-flow-row">
|
||||
@@ -306,7 +306,7 @@ export default function BaseColumnForm({
|
||||
</Box>
|
||||
</div>
|
||||
|
||||
<Box className="grid justify-between flex-shrink-0 grid-flow-col gap-3 p-2 border-t-1">
|
||||
<Box className="grid flex-shrink-0 grid-flow-col justify-between gap-3 border-t-1 p-2">
|
||||
<Button
|
||||
variant="borderless"
|
||||
color="secondary"
|
||||
|
||||
@@ -5,9 +5,9 @@ import { ArrowRightIcon } from '@/components/ui/v2/icons/ArrowRightIcon';
|
||||
import { LinkIcon } from '@/components/ui/v2/icons/LinkIcon';
|
||||
import { InputLabel } from '@/components/ui/v2/InputLabel';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import { CreateForeignKeyForm } from '@/features/database/dataGrid/components/CreateForeignKeyForm';
|
||||
import { EditForeignKeyForm } from '@/features/database/dataGrid/components/EditForeignKeyForm';
|
||||
import type { DatabaseColumn } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import { CreateForeignKeyForm } from '@/features/orgs/projects/database/dataGrid/components/CreateForeignKeyForm';
|
||||
import { EditForeignKeyForm } from '@/features/orgs/projects/database/dataGrid/components/EditForeignKeyForm';
|
||||
import type { DatabaseColumn } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import type { ForwardedRef } from 'react';
|
||||
import { forwardRef, useRef } from 'react';
|
||||
import { useFormContext, useWatch } from 'react-hook-form';
|
||||
@@ -106,7 +106,7 @@ const ForeignKeyEditorInput = forwardRef(
|
||||
});
|
||||
}}
|
||||
variant="borderless"
|
||||
className="min-w-[initial] py-1 px-2"
|
||||
className="min-w-[initial] px-2 py-1"
|
||||
>
|
||||
Edit
|
||||
</Button>
|
||||
@@ -114,7 +114,7 @@ const ForeignKeyEditorInput = forwardRef(
|
||||
<Button
|
||||
onClick={() => setValue('foreignKeyRelation', null)}
|
||||
variant="borderless"
|
||||
className="min-w-[initial] py-1 px-2"
|
||||
className="min-w-[initial] px-2 py-1"
|
||||
>
|
||||
Delete
|
||||
</Button>
|
||||
|
||||
@@ -6,11 +6,11 @@ import { Button } from '@/components/ui/v2/Button';
|
||||
import { Divider } from '@/components/ui/v2/Divider';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import { useDatabaseQuery } from '@/features/database/dataGrid/hooks/useDatabaseQuery';
|
||||
import { useDatabaseQuery } from '@/features/orgs/projects/database/dataGrid/hooks/useDatabaseQuery';
|
||||
import type {
|
||||
DatabaseColumn,
|
||||
ForeignKeyRelation,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import type { DialogFormProps } from '@/types/common';
|
||||
import { useRouter } from 'next/router';
|
||||
import { useEffect } from 'react';
|
||||
@@ -107,9 +107,9 @@ export default function BaseForeignKeyForm({
|
||||
selectedColumn?.isPrimary || selectedColumn?.isUnique || false,
|
||||
});
|
||||
}}
|
||||
className="flex flex-col content-between flex-auto pb-4 overflow-hidden"
|
||||
className="flex flex-auto flex-col content-between overflow-hidden pb-4"
|
||||
>
|
||||
<Box className="grid flex-auto grid-flow-row gap-4 py-4 overflow-y-auto border-t-1">
|
||||
<Box className="grid flex-auto grid-flow-row gap-4 overflow-y-auto border-t-1 py-4">
|
||||
<Box component="section" className="grid grid-flow-row gap-4 px-6">
|
||||
<Text variant="h3">From</Text>
|
||||
|
||||
@@ -185,7 +185,7 @@ export default function BaseForeignKeyForm({
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box className="grid flex-shrink-0 grid-flow-row gap-2 px-6 pt-4 border-t-1">
|
||||
<Box className="grid flex-shrink-0 grid-flow-row gap-2 border-t-1 px-6 pt-4">
|
||||
<Button loading={isSubmitting} disabled={isSubmitting} type="submit">
|
||||
{submitButtonText}
|
||||
</Button>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { ControlledSelect } from '@/components/form/ControlledSelect';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import { useTableQuery } from '@/features/database/dataGrid/hooks/useTableQuery';
|
||||
import { useTableQuery } from '@/features/orgs/projects/database/dataGrid/hooks/useTableQuery';
|
||||
import { useFormState, useWatch } from 'react-hook-form';
|
||||
|
||||
export default function ReferencedColumnSelect() {
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import type { ControlledSelectProps } from '@/components/form/ControlledSelect';
|
||||
import { ControlledSelect } from '@/components/form/ControlledSelect';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import type { NormalizedQueryDataRow } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import type { NormalizedQueryDataRow } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import type { ForwardedRef, PropsWithoutRef } from 'react';
|
||||
import { forwardRef } from 'react';
|
||||
import { useFormContext, useFormState } from 'react-hook-form';
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { ControlledSelect } from '@/components/form/ControlledSelect';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import type { NormalizedQueryDataRow } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import type { NormalizedQueryDataRow } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { useFormContext, useFormState, useWatch } from 'react-hook-form';
|
||||
import type { BaseForeignKeyFormValues } from './BaseForeignKeyForm';
|
||||
|
||||
|
||||
@@ -2,11 +2,11 @@ import { useDialog } from '@/components/common/DialogProvider';
|
||||
import { Form } from '@/components/form/Form';
|
||||
import { Box } from '@/components/ui/v2/Box';
|
||||
import { Button } from '@/components/ui/v2/Button';
|
||||
import { DatabaseRecordInputGroup } from '@/features/database/dataGrid/components/DatabaseRecordInputGroup';
|
||||
import { DatabaseRecordInputGroup } from '@/features/orgs/projects/database/dataGrid/components/DatabaseRecordInputGroup';
|
||||
import type {
|
||||
ColumnInsertOptions,
|
||||
DataBrowserGridColumn,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import type { DialogFormProps } from '@/types/common';
|
||||
import { useEffect } from 'react';
|
||||
import { useFormContext } from 'react-hook-form';
|
||||
|
||||
@@ -4,11 +4,11 @@ import { Box } from '@/components/ui/v2/Box';
|
||||
import { Button } from '@/components/ui/v2/Button';
|
||||
import { Input } from '@/components/ui/v2/Input';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import { baseColumnValidationSchema } from '@/features/database/dataGrid/components/BaseColumnForm';
|
||||
import { baseColumnValidationSchema } from '@/features/orgs/projects/database/dataGrid/components/BaseColumnForm';
|
||||
import type {
|
||||
DatabaseTable,
|
||||
ForeignKeyRelation,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import type { DialogFormProps } from '@/types/common';
|
||||
import { useEffect } from 'react';
|
||||
import { useFormContext, useFormState } from 'react-hook-form';
|
||||
@@ -152,17 +152,17 @@ export default function BaseTableForm({
|
||||
className="flex flex-auto flex-col content-between overflow-hidden border-t-1"
|
||||
>
|
||||
<div className="flex-auto overflow-y-auto pb-4">
|
||||
<Box component="section" className="grid grid-cols-8 py-3 px-6">
|
||||
<Box component="section" className="grid grid-cols-8 px-6 py-3">
|
||||
<NameInput />
|
||||
</Box>
|
||||
|
||||
<Box
|
||||
component="section"
|
||||
className="grid grid-cols-8 border-t-1 py-3 px-6"
|
||||
className="grid grid-cols-8 border-t-1 px-6 py-3"
|
||||
>
|
||||
<Text
|
||||
variant="h2"
|
||||
className="col-span-8 mt-3 mb-1.5 text-sm+ font-bold"
|
||||
className="col-span-8 mb-1.5 mt-3 text-sm+ font-bold"
|
||||
>
|
||||
Columns
|
||||
</Text>
|
||||
|
||||
@@ -10,12 +10,12 @@ import { OptionBase } from '@/components/ui/v2/Option';
|
||||
import type {
|
||||
ColumnType,
|
||||
ForeignKeyRelation,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import {
|
||||
identityTypes,
|
||||
postgresFunctions,
|
||||
postgresTypeGroups,
|
||||
} from '@/features/database/dataGrid/utils/postgresqlConstants';
|
||||
} from '@/features/orgs/projects/database/dataGrid/utils/postgresqlConstants';
|
||||
import clsx from 'clsx';
|
||||
import type { PropsWithoutRef } from 'react';
|
||||
import { memo, useEffect, useState } from 'react';
|
||||
|
||||
@@ -3,7 +3,7 @@ import { Button } from '@/components/ui/v2/Button';
|
||||
import { ArrowRightIcon } from '@/components/ui/v2/icons/ArrowRightIcon';
|
||||
import { LinkIcon } from '@/components/ui/v2/icons/LinkIcon';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import type { ForeignKeyRelation } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import type { ForeignKeyRelation } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { useWatch } from 'react-hook-form';
|
||||
|
||||
export interface ForeignKeyEditorRowProps {
|
||||
@@ -50,7 +50,7 @@ export default function ForeignKeyEditorRow({
|
||||
<Button
|
||||
onClick={onEdit}
|
||||
variant="borderless"
|
||||
className="min-w-[initial] py-1 px-2"
|
||||
className="min-w-[initial] px-2 py-1"
|
||||
>
|
||||
Edit
|
||||
</Button>
|
||||
@@ -58,7 +58,7 @@ export default function ForeignKeyEditorRow({
|
||||
<Button
|
||||
onClick={onDelete}
|
||||
variant="borderless"
|
||||
className="min-w-[initial] py-1 px-2"
|
||||
className="min-w-[initial] px-2 py-1"
|
||||
>
|
||||
Delete
|
||||
</Button>
|
||||
|
||||
@@ -3,13 +3,13 @@ import { Button } from '@/components/ui/v2/Button';
|
||||
import { PlusIcon } from '@/components/ui/v2/icons/PlusIcon';
|
||||
import { InputLabel } from '@/components/ui/v2/InputLabel';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import type { BaseForeignKeyFormValues } from '@/features/database/dataGrid/components/BaseForeignKeyForm';
|
||||
import { CreateForeignKeyForm } from '@/features/database/dataGrid/components/CreateForeignKeyForm';
|
||||
import { EditForeignKeyForm } from '@/features/database/dataGrid/components/EditForeignKeyForm';
|
||||
import type { BaseForeignKeyFormValues } from '@/features/orgs/projects/database/dataGrid/components/BaseForeignKeyForm';
|
||||
import { CreateForeignKeyForm } from '@/features/orgs/projects/database/dataGrid/components/CreateForeignKeyForm';
|
||||
import { EditForeignKeyForm } from '@/features/orgs/projects/database/dataGrid/components/EditForeignKeyForm';
|
||||
import type {
|
||||
DatabaseColumn,
|
||||
ForeignKeyRelation,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { useFieldArray, useFormContext, useWatch } from 'react-hook-form';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
import ForeignKeyEditorRow from './ForeignKeyEditorRow';
|
||||
|
||||
@@ -3,8 +3,8 @@ import { Option } from '@/components/ui/v2/Option';
|
||||
import type {
|
||||
ColumnType,
|
||||
DatabaseColumn,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import { identityTypes } from '@/features/database/dataGrid/utils/postgresqlConstants';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { identityTypes } from '@/features/orgs/projects/database/dataGrid/utils/postgresqlConstants';
|
||||
import { useMemo } from 'react';
|
||||
import { useFormContext, useFormState, useWatch } from 'react-hook-form';
|
||||
import type { BaseTableFormValues } from './BaseTableForm';
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { ControlledSelect } from '@/components/form/ControlledSelect';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import type { DatabaseColumn } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import type { DatabaseColumn } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { useMemo } from 'react';
|
||||
import { useFormState, useWatch } from 'react-hook-form';
|
||||
|
||||
|
||||
@@ -11,8 +11,8 @@ import { List } from '@/components/ui/v2/List';
|
||||
import { OptionBase } from '@/components/ui/v2/Option';
|
||||
import { OptionGroupBase } from '@/components/ui/v2/OptionGroup';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import { useMetadataQuery } from '@/features/database/dataGrid/hooks/useMetadataQuery';
|
||||
import { useTableQuery } from '@/features/database/dataGrid/hooks/useTableQuery';
|
||||
import { useMetadataQuery } from '@/features/orgs/projects/database/dataGrid/hooks/useMetadataQuery';
|
||||
import { useTableQuery } from '@/features/orgs/projects/database/dataGrid/hooks/useTableQuery';
|
||||
import { getTruncatedText } from '@/utils/getTruncatedText';
|
||||
import type { AutocompleteGroupedOption } from '@mui/base/useAutocomplete';
|
||||
import { useAutocomplete } from '@mui/base/useAutocomplete';
|
||||
@@ -210,7 +210,6 @@ function ColumnAutocomplete(
|
||||
]);
|
||||
}
|
||||
|
||||
|
||||
const options = useColumnGroups({
|
||||
selectedSchema,
|
||||
selectedTable,
|
||||
@@ -243,20 +242,20 @@ function ColumnAutocomplete(
|
||||
onChange: handleChange,
|
||||
});
|
||||
|
||||
|
||||
function handleInputValueChange(event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) {
|
||||
const {value} = event.target
|
||||
setInputValue(value)
|
||||
function handleInputValueChange(
|
||||
event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
|
||||
) {
|
||||
const { value } = event.target;
|
||||
setInputValue(value);
|
||||
|
||||
setSelectedColumn(
|
||||
{
|
||||
value,
|
||||
label: value,
|
||||
metadata: selectedColumn?.metadata || {
|
||||
table_schema: selectedSchema,
|
||||
table_name: selectedTable,
|
||||
}
|
||||
});
|
||||
setSelectedColumn({
|
||||
value,
|
||||
label: value,
|
||||
metadata: selectedColumn?.metadata || {
|
||||
table_schema: selectedSchema,
|
||||
table_name: selectedTable,
|
||||
},
|
||||
});
|
||||
|
||||
onChange?.(event, {
|
||||
value:
|
||||
@@ -395,11 +394,11 @@ function ColumnAutocomplete(
|
||||
);
|
||||
}}
|
||||
>
|
||||
<ArrowLeftIcon className="w-4 h-4" />
|
||||
<ArrowLeftIcon className="h-4 w-4" />
|
||||
</IconButton>
|
||||
)}
|
||||
|
||||
<Text className="text-left truncate direction-rtl">
|
||||
<Text className="direction-rtl truncate text-left">
|
||||
<Text component="span" color="disabled">
|
||||
{defaultTable}
|
||||
</Text>
|
||||
@@ -433,7 +432,7 @@ function ColumnAutocomplete(
|
||||
>
|
||||
{(
|
||||
groupedOptions as AutocompleteGroupedOption<
|
||||
typeof options[number]
|
||||
(typeof options)[number]
|
||||
>[]
|
||||
).map((optionGroup) =>
|
||||
renderGroup({
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import type { AutocompleteOption } from '@/components/ui/v2/Autocomplete';
|
||||
import type { FetchMetadataReturnType } from '@/features/database/dataGrid/hooks/useMetadataQuery';
|
||||
import type { FetchTableReturnType } from '@/features/database/dataGrid/hooks/useTableQuery';
|
||||
import type { HasuraMetadataTable } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import type { FetchMetadataReturnType } from '@/features/orgs/projects/database/dataGrid/hooks/useMetadataQuery';
|
||||
import type { FetchTableReturnType } from '@/features/orgs/projects/database/dataGrid/hooks/useTableQuery';
|
||||
import type { HasuraMetadataTable } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
export interface UseAsyncValueOptions {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import type { AutocompleteOption } from '@/components/ui/v2/Autocomplete';
|
||||
import type { FetchMetadataReturnType } from '@/features/database/dataGrid/hooks/useMetadataQuery';
|
||||
import type { FetchTableReturnType } from '@/features/database/dataGrid/hooks/useTableQuery';
|
||||
import type { FetchMetadataReturnType } from '@/features/orgs/projects/database/dataGrid/hooks/useMetadataQuery';
|
||||
import type { FetchTableReturnType } from '@/features/orgs/projects/database/dataGrid/hooks/useTableQuery';
|
||||
|
||||
export interface UseColumnGroupsOptions {
|
||||
/**
|
||||
@@ -65,44 +65,47 @@ export default function useColumnGroups({
|
||||
const objectAndArrayRelationships = [
|
||||
...(object_relationships || []),
|
||||
...(array_relationships || []),
|
||||
].reduce((relationships, currentRelationship) => {
|
||||
const { foreign_key_constraint_on, manual_configuration } =
|
||||
currentRelationship?.using || {};
|
||||
].reduce(
|
||||
(relationships, currentRelationship) => {
|
||||
const { foreign_key_constraint_on, manual_configuration } =
|
||||
currentRelationship?.using || {};
|
||||
|
||||
if (manual_configuration) {
|
||||
return [
|
||||
...relationships,
|
||||
...Object.keys(manual_configuration.column_mapping).map((column) => ({
|
||||
schema: manual_configuration.remote_table?.schema || 'public',
|
||||
table: manual_configuration.remote_table?.name,
|
||||
column,
|
||||
name: currentRelationship.name,
|
||||
})),
|
||||
];
|
||||
}
|
||||
if (manual_configuration) {
|
||||
return [
|
||||
...relationships,
|
||||
...Object.keys(manual_configuration.column_mapping).map((column) => ({
|
||||
schema: manual_configuration.remote_table?.schema || 'public',
|
||||
table: manual_configuration.remote_table?.name,
|
||||
column,
|
||||
name: currentRelationship.name,
|
||||
})),
|
||||
];
|
||||
}
|
||||
|
||||
if (typeof foreign_key_constraint_on === 'string') {
|
||||
return [
|
||||
...relationships,
|
||||
{
|
||||
schema: selectedSchema,
|
||||
table: selectedTable,
|
||||
column: foreign_key_constraint_on,
|
||||
name: currentRelationship.name,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
if (typeof foreign_key_constraint_on === 'string') {
|
||||
return [
|
||||
...relationships,
|
||||
{
|
||||
schema: selectedSchema,
|
||||
table: selectedTable,
|
||||
column: foreign_key_constraint_on,
|
||||
schema: foreign_key_constraint_on.table.schema,
|
||||
table: foreign_key_constraint_on.table.name,
|
||||
column: foreign_key_constraint_on.column,
|
||||
name: currentRelationship.name,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
return [
|
||||
...relationships,
|
||||
{
|
||||
schema: foreign_key_constraint_on.table.schema,
|
||||
table: foreign_key_constraint_on.table.name,
|
||||
column: foreign_key_constraint_on.column,
|
||||
name: currentRelationship.name,
|
||||
},
|
||||
];
|
||||
}, [] as { schema: string; table: string; column: string; name: string }[]);
|
||||
},
|
||||
[] as { schema: string; table: string; column: string; name: string }[],
|
||||
);
|
||||
|
||||
return [
|
||||
...columnOptions,
|
||||
|
||||
@@ -3,11 +3,11 @@ import { Button } from '@/components/ui/v2/Button';
|
||||
import type {
|
||||
BaseForeignKeyFormProps,
|
||||
BaseForeignKeyFormValues,
|
||||
} from '@/features/database/dataGrid/components/BaseForeignKeyForm';
|
||||
} from '@/features/orgs/projects/database/dataGrid/components/BaseForeignKeyForm';
|
||||
import {
|
||||
BaseForeignKeyForm,
|
||||
baseForeignKeyValidationSchema,
|
||||
} from '@/features/database/dataGrid/components/BaseForeignKeyForm';
|
||||
} from '@/features/orgs/projects/database/dataGrid/components/BaseForeignKeyForm';
|
||||
import { yupResolver } from '@hookform/resolvers/yup';
|
||||
import { useState } from 'react';
|
||||
import { FormProvider, useForm } from 'react-hook-form';
|
||||
|
||||
@@ -7,9 +7,9 @@ import { Input } from '@/components/ui/v2/Input';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import { Select } from '@/components/ui/v2/Select';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import type { DataBrowserGridColumn } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import { getInputType } from '@/features/database/dataGrid/utils/inputHelpers';
|
||||
import { normalizeDefaultValue } from '@/features/database/dataGrid/utils/normalizeDefaultValue';
|
||||
import type { DataBrowserGridColumn } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { getInputType } from '@/features/orgs/projects/database/dataGrid/utils/inputHelpers';
|
||||
import { normalizeDefaultValue } from '@/features/orgs/projects/database/dataGrid/utils/normalizeDefaultValue';
|
||||
import { Controller, useFormContext } from 'react-hook-form';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
@@ -82,7 +82,7 @@ export default function DatabaseRecordInputGroup({
|
||||
return (
|
||||
<Box component="section" className={twMerge('py-3', className)} {...props}>
|
||||
{title && (
|
||||
<Text variant="h2" className="mt-3 mb-1.5 text-sm+ font-bold">
|
||||
<Text variant="h2" className="mb-1.5 mt-3 text-sm+ font-bold">
|
||||
{title}
|
||||
</Text>
|
||||
)}
|
||||
|
||||
@@ -3,12 +3,12 @@ import { Button } from '@/components/ui/v2/Button';
|
||||
import type {
|
||||
BaseForeignKeyFormProps,
|
||||
BaseForeignKeyFormValues,
|
||||
} from '@/features/database/dataGrid/components/BaseForeignKeyForm';
|
||||
} from '@/features/orgs/projects/database/dataGrid/components/BaseForeignKeyForm';
|
||||
import {
|
||||
BaseForeignKeyForm,
|
||||
baseForeignKeyValidationSchema,
|
||||
} from '@/features/database/dataGrid/components/BaseForeignKeyForm';
|
||||
import type { ForeignKeyRelation } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/components/BaseForeignKeyForm';
|
||||
import type { ForeignKeyRelation } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { yupResolver } from '@hookform/resolvers/yup';
|
||||
import { useState } from 'react';
|
||||
import { FormProvider, useForm } from 'react-hook-form';
|
||||
|
||||
@@ -3,9 +3,9 @@ import { ActivityIndicator } from '@/components/ui/v2/ActivityIndicator';
|
||||
import { Button } from '@/components/ui/v2/Button';
|
||||
import { Checkbox } from '@/components/ui/v2/Checkbox';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import type { RolePermissionEditorFormValues } from '@/features/database/dataGrid/components/EditPermissionsForm/RolePermissionEditorForm';
|
||||
import { useTableQuery } from '@/features/database/dataGrid/hooks/useTableQuery';
|
||||
import type { DatabaseAction } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import type { RolePermissionEditorFormValues } from '@/features/orgs/projects/database/dataGrid/components/EditPermissionsForm/RolePermissionEditorForm';
|
||||
import { useTableQuery } from '@/features/orgs/projects/database/dataGrid/hooks/useTableQuery';
|
||||
import type { DatabaseAction } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import { useFormContext, useWatch } from 'react-hook-form';
|
||||
import PermissionSettingsSection from './PermissionSettingsSection';
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@ import { ControlledSwitch } from '@/components/form/ControlledSwitch';
|
||||
import { Button } from '@/components/ui/v2/Button';
|
||||
import { Checkbox } from '@/components/ui/v2/Checkbox';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import type { RolePermissionEditorFormValues } from '@/features/database/dataGrid/components/EditPermissionsForm/RolePermissionEditorForm';
|
||||
import type { RolePermissionEditorFormValues } from '@/features/orgs/projects/database/dataGrid/components/EditPermissionsForm/RolePermissionEditorForm';
|
||||
import { useFormContext, useWatch } from 'react-hook-form';
|
||||
import PermissionSettingsSection from './PermissionSettingsSection';
|
||||
|
||||
|
||||
@@ -3,12 +3,12 @@ import { Input } from '@/components/ui/v2/Input';
|
||||
import { Radio } from '@/components/ui/v2/Radio';
|
||||
import { RadioGroup } from '@/components/ui/v2/RadioGroup';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import type { RolePermissionEditorFormValues } from '@/features/database/dataGrid/components/EditPermissionsForm/RolePermissionEditorForm';
|
||||
import { RuleGroupEditor } from '@/features/database/dataGrid/components/RuleGroupEditor';
|
||||
import type { RolePermissionEditorFormValues } from '@/features/orgs/projects/database/dataGrid/components/EditPermissionsForm/RolePermissionEditorForm';
|
||||
import { RuleGroupEditor } from '@/features/orgs/projects/database/dataGrid/components/RuleGroupEditor';
|
||||
import type {
|
||||
DatabaseAction,
|
||||
RuleGroup,
|
||||
} from '@/features/database/dataGrid/types/dataBrowser';
|
||||
} from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import type { FocusEvent } from 'react';
|
||||
import { useState } from 'react';
|
||||
import { useFormContext } from 'react-hook-form';
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import type { DatabaseAction } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import type { DatabaseAction } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import * as Yup from 'yup';
|
||||
|
||||
const ruleSchema = Yup.object().shape({
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import { ControlledSelect } from '@/components/form/ControlledSelect';
|
||||
import { Option } from '@/components/ui/v2/Option';
|
||||
import { Text } from '@/components/ui/v2/Text';
|
||||
import { ColumnAutocomplete } from '@/features/database/dataGrid/components/ColumnAutocomplete';
|
||||
import type { HasuraOperator } from '@/features/database/dataGrid/types/dataBrowser';
|
||||
import { ColumnAutocomplete } from '@/features/orgs/projects/database/dataGrid/components/ColumnAutocomplete';
|
||||
import type { HasuraOperator } from '@/features/orgs/projects/database/dataGrid/types/dataBrowser';
|
||||
import type { DetailedHTMLProps, HTMLProps } from 'react';
|
||||
import { useState } from 'react';
|
||||
import { useController, useFormContext } from 'react-hook-form';
|
||||
@@ -74,7 +74,7 @@ function renderOption({
|
||||
value,
|
||||
label,
|
||||
helperText,
|
||||
}: typeof commonOperators[number]) {
|
||||
}: (typeof commonOperators)[number]) {
|
||||
return (
|
||||
<Option key={value} value={value} className="grid grid-flow-col gap-2">
|
||||
<Text component="span" className="inline-block w-16">
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user