From 8f0124b4b2c8e90f9cc667f4e0d6a778c1144a62 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89mile=20R=C3=A9?= Date: Thu, 29 Jan 2026 13:11:29 +0400 Subject: [PATCH] Move custom domain to compliance page tabs MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Émile Ré --- ...mpliancePageDomainCardFragment.graphql.ts} | 20 ++--- ...liancePageDomainDialogFragment.graphql.ts} | 32 ++------ ... CompliancePageDomainPageQuery.graphql.ts} | 73 +++++++------------ ...liancePageDomainDialogMutation.graphql.ts} | 24 +++--- ...liancePageDomainDialogMutation.graphql.ts} | 24 +++--- .../organizations/settings/SettingsLayout.tsx | 5 -- .../compliance-page/CompliancePageLayout.tsx | 4 + .../domain/CompliancePageDomainPage.tsx} | 28 ++++--- .../domain/CompliancePageDomainPageLoader.tsx | 39 ++++++++++ .../_components/CompliancePageDomainCard.tsx} | 22 +++--- .../CompliancePageDomainDialog.tsx} | 12 ++- .../DeleteCompliancePageDomainDialog.tsx} | 10 +-- .../NewCompliancePageDomainDialog.tsx} | 8 +- .../organizations/compliance-page/routes.ts | 8 ++ .../settings/DomainSettingsPageLoader.tsx | 40 ---------- apps/console/src/routes.tsx | 7 -- 16 files changed, 158 insertions(+), 198 deletions(-) rename apps/console/src/__generated__/core/{DomainCardFragment.graphql.ts => CompliancePageDomainCardFragment.graphql.ts} (66%) rename apps/console/src/__generated__/core/{DomainDialogFragment.graphql.ts => CompliancePageDomainDialogFragment.graphql.ts} (75%) rename apps/console/src/__generated__/core/{DomainSettingsPageQuery.graphql.ts => CompliancePageDomainPageQuery.graphql.ts} (75%) rename apps/console/src/__generated__/core/{DeleteDomainDialogMutation.graphql.ts => DeleteCompliancePageDomainDialogMutation.graphql.ts} (63%) rename apps/console/src/__generated__/core/{NewDomainDialogMutation.graphql.ts => NewCompliancePageDomainDialogMutation.graphql.ts} (81%) rename apps/console/src/pages/organizations/{settings/DomainSettingsPage.tsx => compliance-page/domain/CompliancePageDomainPage.tsx} (64%) create mode 100644 apps/console/src/pages/organizations/compliance-page/domain/CompliancePageDomainPageLoader.tsx rename apps/console/src/pages/organizations/{settings/_components/DomainCard.tsx => compliance-page/domain/_components/CompliancePageDomainCard.tsx} (65%) rename apps/console/src/pages/organizations/{settings/_components/DomainDialog.tsx => compliance-page/domain/_components/CompliancePageDomainDialog.tsx} (92%) rename apps/console/src/pages/organizations/{settings/_components/DeleteDomainDialog.tsx => compliance-page/domain/_components/DeleteCompliancePageDomainDialog.tsx} (85%) rename apps/console/src/pages/organizations/{settings/_components/NewDomainDialog.tsx => compliance-page/domain/_components/NewCompliancePageDomainDialog.tsx} (91%) delete mode 100644 apps/console/src/pages/organizations/settings/DomainSettingsPageLoader.tsx diff --git a/apps/console/src/__generated__/core/DomainCardFragment.graphql.ts b/apps/console/src/__generated__/core/CompliancePageDomainCardFragment.graphql.ts similarity index 66% rename from apps/console/src/__generated__/core/DomainCardFragment.graphql.ts rename to apps/console/src/__generated__/core/CompliancePageDomainCardFragment.graphql.ts index 939004dbb..1c381cd0f 100644 --- a/apps/console/src/__generated__/core/DomainCardFragment.graphql.ts +++ b/apps/console/src/__generated__/core/CompliancePageDomainCardFragment.graphql.ts @@ -1,5 +1,5 @@ /** - * @generated SignedSource<> + * @generated SignedSource<<0e36707d7a08e91112f9f44e787b4844>> * @lightSyntaxTransform * @nogrep */ @@ -11,23 +11,23 @@ import { ReaderFragment } from 'relay-runtime'; export type SSLStatus = "ACTIVE" | "EXPIRED" | "FAILED" | "PENDING" | "PROVISIONING" | "RENEWING"; import { FragmentRefs } from "relay-runtime"; -export type DomainCardFragment$data = { +export type CompliancePageDomainCardFragment$data = { readonly canDelete: boolean; readonly domain: string; readonly sslStatus: SSLStatus; - readonly " $fragmentSpreads": FragmentRefs<"DomainDialogFragment">; - readonly " $fragmentType": "DomainCardFragment"; + readonly " $fragmentSpreads": FragmentRefs<"CompliancePageDomainDialogFragment">; + readonly " $fragmentType": "CompliancePageDomainCardFragment"; }; -export type DomainCardFragment$key = { - readonly " $data"?: DomainCardFragment$data; - readonly " $fragmentSpreads": FragmentRefs<"DomainCardFragment">; +export type CompliancePageDomainCardFragment$key = { + readonly " $data"?: CompliancePageDomainCardFragment$data; + readonly " $fragmentSpreads": FragmentRefs<"CompliancePageDomainCardFragment">; }; const node: ReaderFragment = { "argumentDefinitions": [], "kind": "Fragment", "metadata": null, - "name": "DomainCardFragment", + "name": "CompliancePageDomainCardFragment", "selections": [ { "alias": null, @@ -59,13 +59,13 @@ const node: ReaderFragment = { { "args": null, "kind": "FragmentSpread", - "name": "DomainDialogFragment" + "name": "CompliancePageDomainDialogFragment" } ], "type": "CustomDomain", "abstractKey": null }; -(node as any).hash = "91cc7871d5ac257f2540568a9a10ce0f"; +(node as any).hash = "db079748369f6103bb263de4e8921c76"; export default node; diff --git a/apps/console/src/__generated__/core/DomainDialogFragment.graphql.ts b/apps/console/src/__generated__/core/CompliancePageDomainDialogFragment.graphql.ts similarity index 75% rename from apps/console/src/__generated__/core/DomainDialogFragment.graphql.ts rename to apps/console/src/__generated__/core/CompliancePageDomainDialogFragment.graphql.ts index 036636dbb..9bdc7cb6e 100644 --- a/apps/console/src/__generated__/core/DomainDialogFragment.graphql.ts +++ b/apps/console/src/__generated__/core/CompliancePageDomainDialogFragment.graphql.ts @@ -1,5 +1,5 @@ /** - * @generated SignedSource<<1d007308b8b70962ddfe217cf3534dab>> + * @generated SignedSource<> * @lightSyntaxTransform * @nogrep */ @@ -11,8 +11,7 @@ import { ReaderFragment } from 'relay-runtime'; export type SSLStatus = "ACTIVE" | "EXPIRED" | "FAILED" | "PENDING" | "PROVISIONING" | "RENEWING"; import { FragmentRefs } from "relay-runtime"; -export type DomainDialogFragment$data = { - readonly createdAt: string; +export type CompliancePageDomainDialogFragment$data = { readonly dnsRecords: ReadonlyArray<{ readonly name: string; readonly purpose: string; @@ -23,19 +22,18 @@ export type DomainDialogFragment$data = { readonly domain: string; readonly sslExpiresAt: string | null | undefined; readonly sslStatus: SSLStatus; - readonly updatedAt: string; - readonly " $fragmentType": "DomainDialogFragment"; + readonly " $fragmentType": "CompliancePageDomainDialogFragment"; }; -export type DomainDialogFragment$key = { - readonly " $data"?: DomainDialogFragment$data; - readonly " $fragmentSpreads": FragmentRefs<"DomainDialogFragment">; +export type CompliancePageDomainDialogFragment$key = { + readonly " $data"?: CompliancePageDomainDialogFragment$data; + readonly " $fragmentSpreads": FragmentRefs<"CompliancePageDomainDialogFragment">; }; const node: ReaderFragment = { "argumentDefinitions": [], "kind": "Fragment", "metadata": null, - "name": "DomainDialogFragment", + "name": "CompliancePageDomainDialogFragment", "selections": [ { "alias": null, @@ -97,20 +95,6 @@ const node: ReaderFragment = { ], "storageKey": null }, - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "createdAt", - "storageKey": null - }, - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "updatedAt", - "storageKey": null - }, { "alias": null, "args": null, @@ -123,6 +107,6 @@ const node: ReaderFragment = { "abstractKey": null }; -(node as any).hash = "0aec5615023dde2d23901fec9e43ed9b"; +(node as any).hash = "0275b6b52781473cb3dac5a631488e2f"; export default node; diff --git a/apps/console/src/__generated__/core/DomainSettingsPageQuery.graphql.ts b/apps/console/src/__generated__/core/CompliancePageDomainPageQuery.graphql.ts similarity index 75% rename from apps/console/src/__generated__/core/DomainSettingsPageQuery.graphql.ts rename to apps/console/src/__generated__/core/CompliancePageDomainPageQuery.graphql.ts index 6d04c53f3..65402da16 100644 --- a/apps/console/src/__generated__/core/DomainSettingsPageQuery.graphql.ts +++ b/apps/console/src/__generated__/core/CompliancePageDomainPageQuery.graphql.ts @@ -1,5 +1,5 @@ /** - * @generated SignedSource<> + * @generated SignedSource<> * @lightSyntaxTransform * @nogrep */ @@ -10,27 +10,25 @@ import { ConcreteRequest } from 'relay-runtime'; import { FragmentRefs } from "relay-runtime"; -export type DomainSettingsPageQuery$variables = { +export type CompliancePageDomainPageQuery$variables = { organizationId: string; }; -export type DomainSettingsPageQuery$data = { +export type CompliancePageDomainPageQuery$data = { readonly organization: { readonly __typename: "Organization"; readonly canCreateCustomDomain: boolean; readonly customDomain: { - readonly domain: string; - readonly " $fragmentSpreads": FragmentRefs<"DomainCardFragment">; + readonly " $fragmentSpreads": FragmentRefs<"CompliancePageDomainCardFragment">; } | null | undefined; - readonly id: string; } | { // This will never be '%other', but we need some // value in case none of the concrete values match. readonly __typename: "%other"; }; }; -export type DomainSettingsPageQuery = { - response: DomainSettingsPageQuery$data; - variables: DomainSettingsPageQuery$variables; +export type CompliancePageDomainPageQuery = { + response: CompliancePageDomainPageQuery$data; + variables: CompliancePageDomainPageQuery$variables; }; const node: ConcreteRequest = (function(){ @@ -56,13 +54,6 @@ v2 = { "storageKey": null }, v3 = { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "id", - "storageKey": null -}, -v4 = { "alias": "canCreateCustomDomain", "args": [ { @@ -75,11 +66,11 @@ v4 = { "name": "permission", "storageKey": "permission(action:\"core:custom-domain:create\")" }, -v5 = { +v4 = { "alias": null, "args": null, "kind": "ScalarField", - "name": "domain", + "name": "id", "storageKey": null }; return { @@ -87,7 +78,7 @@ return { "argumentDefinitions": (v0/*: any*/), "kind": "Fragment", "metadata": null, - "name": "DomainSettingsPageQuery", + "name": "CompliancePageDomainPageQuery", "selections": [ { "alias": "organization", @@ -102,7 +93,6 @@ return { "kind": "InlineFragment", "selections": [ (v3/*: any*/), - (v4/*: any*/), { "alias": null, "args": null, @@ -111,11 +101,10 @@ return { "name": "customDomain", "plural": false, "selections": [ - (v5/*: any*/), { "args": null, "kind": "FragmentSpread", - "name": "DomainCardFragment" + "name": "CompliancePageDomainCardFragment" } ], "storageKey": null @@ -135,7 +124,7 @@ return { "operation": { "argumentDefinitions": (v0/*: any*/), "kind": "Operation", - "name": "DomainSettingsPageQuery", + "name": "CompliancePageDomainPageQuery", "selections": [ { "alias": "organization", @@ -146,11 +135,10 @@ return { "plural": false, "selections": [ (v2/*: any*/), - (v3/*: any*/), { "kind": "InlineFragment", "selections": [ - (v4/*: any*/), + (v3/*: any*/), { "alias": null, "args": null, @@ -159,7 +147,13 @@ return { "name": "customDomain", "plural": false, "selections": [ - (v5/*: any*/), + { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "domain", + "storageKey": null + }, { "alias": null, "args": null, @@ -226,20 +220,6 @@ return { ], "storageKey": null }, - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "createdAt", - "storageKey": null - }, - { - "alias": null, - "args": null, - "kind": "ScalarField", - "name": "updatedAt", - "storageKey": null - }, { "alias": null, "args": null, @@ -247,30 +227,31 @@ return { "name": "sslExpiresAt", "storageKey": null }, - (v3/*: any*/) + (v4/*: any*/) ], "storageKey": null } ], "type": "Organization", "abstractKey": null - } + }, + (v4/*: any*/) ], "storageKey": null } ] }, "params": { - "cacheID": "36529612fbe4366a7344b405031da1d1", + "cacheID": "f916852f512fa1e1b06d73c608acad3a", "id": null, "metadata": {}, - "name": "DomainSettingsPageQuery", + "name": "CompliancePageDomainPageQuery", "operationKind": "query", - "text": "query DomainSettingsPageQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n ... on Organization {\n id\n canCreateCustomDomain: permission(action: \"core:custom-domain:create\")\n customDomain {\n domain\n ...DomainCardFragment\n id\n }\n }\n id\n }\n}\n\nfragment DomainCardFragment on CustomDomain {\n domain\n sslStatus\n canDelete: permission(action: \"core:custom-domain:delete\")\n ...DomainDialogFragment\n}\n\nfragment DomainDialogFragment on CustomDomain {\n sslStatus\n domain\n dnsRecords {\n type\n name\n value\n ttl\n purpose\n }\n createdAt\n updatedAt\n sslExpiresAt\n}\n" + "text": "query CompliancePageDomainPageQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n ... on Organization {\n canCreateCustomDomain: permission(action: \"core:custom-domain:create\")\n customDomain {\n ...CompliancePageDomainCardFragment\n id\n }\n }\n id\n }\n}\n\nfragment CompliancePageDomainCardFragment on CustomDomain {\n domain\n sslStatus\n canDelete: permission(action: \"core:custom-domain:delete\")\n ...CompliancePageDomainDialogFragment\n}\n\nfragment CompliancePageDomainDialogFragment on CustomDomain {\n sslStatus\n domain\n dnsRecords {\n type\n name\n value\n ttl\n purpose\n }\n sslExpiresAt\n}\n" } }; })(); -(node as any).hash = "75275e2fc7e7156cdf3059b8f0d4f60d"; +(node as any).hash = "86eb03a06b0217c125eadf8cf661e384"; export default node; diff --git a/apps/console/src/__generated__/core/DeleteDomainDialogMutation.graphql.ts b/apps/console/src/__generated__/core/DeleteCompliancePageDomainDialogMutation.graphql.ts similarity index 63% rename from apps/console/src/__generated__/core/DeleteDomainDialogMutation.graphql.ts rename to apps/console/src/__generated__/core/DeleteCompliancePageDomainDialogMutation.graphql.ts index 4309d09f2..5a2a70db0 100644 --- a/apps/console/src/__generated__/core/DeleteDomainDialogMutation.graphql.ts +++ b/apps/console/src/__generated__/core/DeleteCompliancePageDomainDialogMutation.graphql.ts @@ -1,5 +1,5 @@ /** - * @generated SignedSource<<4f27f16c09a86fda0f17b4d33866fcb2>> + * @generated SignedSource<<12b5695d6b5f46a7d4231abe93301a0b>> * @lightSyntaxTransform * @nogrep */ @@ -12,17 +12,17 @@ import { ConcreteRequest } from 'relay-runtime'; export type DeleteCustomDomainInput = { organizationId: string; }; -export type DeleteDomainDialogMutation$variables = { +export type DeleteCompliancePageDomainDialogMutation$variables = { input: DeleteCustomDomainInput; }; -export type DeleteDomainDialogMutation$data = { +export type DeleteCompliancePageDomainDialogMutation$data = { readonly deleteCustomDomain: { readonly deletedCustomDomainId: string; }; }; -export type DeleteDomainDialogMutation = { - response: DeleteDomainDialogMutation$data; - variables: DeleteDomainDialogMutation$variables; +export type DeleteCompliancePageDomainDialogMutation = { + response: DeleteCompliancePageDomainDialogMutation$data; + variables: DeleteCompliancePageDomainDialogMutation$variables; }; const node: ConcreteRequest = (function(){ @@ -64,7 +64,7 @@ return { "argumentDefinitions": (v0/*: any*/), "kind": "Fragment", "metadata": null, - "name": "DeleteDomainDialogMutation", + "name": "DeleteCompliancePageDomainDialogMutation", "selections": (v1/*: any*/), "type": "Mutation", "abstractKey": null @@ -73,20 +73,20 @@ return { "operation": { "argumentDefinitions": (v0/*: any*/), "kind": "Operation", - "name": "DeleteDomainDialogMutation", + "name": "DeleteCompliancePageDomainDialogMutation", "selections": (v1/*: any*/) }, "params": { - "cacheID": "68e7fb0109af8d99c9947e5ef2314ad2", + "cacheID": "1d5e88cc48c7ce90d9110de6d4c6a4d9", "id": null, "metadata": {}, - "name": "DeleteDomainDialogMutation", + "name": "DeleteCompliancePageDomainDialogMutation", "operationKind": "mutation", - "text": "mutation DeleteDomainDialogMutation(\n $input: DeleteCustomDomainInput!\n) {\n deleteCustomDomain(input: $input) {\n deletedCustomDomainId\n }\n}\n" + "text": "mutation DeleteCompliancePageDomainDialogMutation(\n $input: DeleteCustomDomainInput!\n) {\n deleteCustomDomain(input: $input) {\n deletedCustomDomainId\n }\n}\n" } }; })(); -(node as any).hash = "4ff39445b000bd5416e04e1460f11571"; +(node as any).hash = "d65e8b9b66367509071b9349c828f5d0"; export default node; diff --git a/apps/console/src/__generated__/core/NewDomainDialogMutation.graphql.ts b/apps/console/src/__generated__/core/NewCompliancePageDomainDialogMutation.graphql.ts similarity index 81% rename from apps/console/src/__generated__/core/NewDomainDialogMutation.graphql.ts rename to apps/console/src/__generated__/core/NewCompliancePageDomainDialogMutation.graphql.ts index 6f12b98d8..37aa4b313 100644 --- a/apps/console/src/__generated__/core/NewDomainDialogMutation.graphql.ts +++ b/apps/console/src/__generated__/core/NewCompliancePageDomainDialogMutation.graphql.ts @@ -1,5 +1,5 @@ /** - * @generated SignedSource<> + * @generated SignedSource<<2884e6469123701242f24cd275f8551b>> * @lightSyntaxTransform * @nogrep */ @@ -14,10 +14,10 @@ export type CreateCustomDomainInput = { domain: string; organizationId: string; }; -export type NewDomainDialogMutation$variables = { +export type NewCompliancePageDomainDialogMutation$variables = { input: CreateCustomDomainInput; }; -export type NewDomainDialogMutation$data = { +export type NewCompliancePageDomainDialogMutation$data = { readonly createCustomDomain: { readonly customDomain: { readonly canDelete: boolean; @@ -37,9 +37,9 @@ export type NewDomainDialogMutation$data = { }; }; }; -export type NewDomainDialogMutation = { - response: NewDomainDialogMutation$data; - variables: NewDomainDialogMutation$variables; +export type NewCompliancePageDomainDialogMutation = { + response: NewCompliancePageDomainDialogMutation$data; + variables: NewCompliancePageDomainDialogMutation$variables; }; const node: ConcreteRequest = (function(){ @@ -186,7 +186,7 @@ return { "argumentDefinitions": (v0/*: any*/), "kind": "Fragment", "metadata": null, - "name": "NewDomainDialogMutation", + "name": "NewCompliancePageDomainDialogMutation", "selections": (v1/*: any*/), "type": "Mutation", "abstractKey": null @@ -195,20 +195,20 @@ return { "operation": { "argumentDefinitions": (v0/*: any*/), "kind": "Operation", - "name": "NewDomainDialogMutation", + "name": "NewCompliancePageDomainDialogMutation", "selections": (v1/*: any*/) }, "params": { - "cacheID": "39d421d36a6418d0ee687d43b9d7a7ee", + "cacheID": "6f012080388b3c7dfd3bfc8c69b5d549", "id": null, "metadata": {}, - "name": "NewDomainDialogMutation", + "name": "NewCompliancePageDomainDialogMutation", "operationKind": "mutation", - "text": "mutation NewDomainDialogMutation(\n $input: CreateCustomDomainInput!\n) {\n createCustomDomain(input: $input) {\n customDomain {\n id\n domain\n sslStatus\n dnsRecords {\n type\n name\n value\n ttl\n purpose\n }\n createdAt\n updatedAt\n sslExpiresAt\n canDelete: permission(action: \"core:custom-domain:delete\")\n }\n }\n}\n" + "text": "mutation NewCompliancePageDomainDialogMutation(\n $input: CreateCustomDomainInput!\n) {\n createCustomDomain(input: $input) {\n customDomain {\n id\n domain\n sslStatus\n dnsRecords {\n type\n name\n value\n ttl\n purpose\n }\n createdAt\n updatedAt\n sslExpiresAt\n canDelete: permission(action: \"core:custom-domain:delete\")\n }\n }\n}\n" } }; })(); -(node as any).hash = "37ef764ab4f78a6898f06d00374347ee"; +(node as any).hash = "7a1b76dbca18a3a0dbd2b1123e324b99"; export default node; diff --git a/apps/console/src/pages/iam/organizations/settings/SettingsLayout.tsx b/apps/console/src/pages/iam/organizations/settings/SettingsLayout.tsx index 0b19e3835..6baa46b08 100644 --- a/apps/console/src/pages/iam/organizations/settings/SettingsLayout.tsx +++ b/apps/console/src/pages/iam/organizations/settings/SettingsLayout.tsx @@ -4,7 +4,6 @@ import { IconLock, IconPeopleAdd, IconSettingsGear2, - IconStore, PageHeader, TabLink, Tabs, @@ -30,10 +29,6 @@ export default function SettingsLayout() { {__("Members")} - - - {__("Domain")} - {__("SAML SSO")} diff --git a/apps/console/src/pages/organizations/compliance-page/CompliancePageLayout.tsx b/apps/console/src/pages/organizations/compliance-page/CompliancePageLayout.tsx index f327c20bd..ea2f355a5 100644 --- a/apps/console/src/pages/organizations/compliance-page/CompliancePageLayout.tsx +++ b/apps/console/src/pages/organizations/compliance-page/CompliancePageLayout.tsx @@ -52,6 +52,10 @@ export function CompliancePageLayout(props: { queryRef: PreloadedQuery {__("Overview")} + + + {__("Domain")} + {__("References")} diff --git a/apps/console/src/pages/organizations/settings/DomainSettingsPage.tsx b/apps/console/src/pages/organizations/compliance-page/domain/CompliancePageDomainPage.tsx similarity index 64% rename from apps/console/src/pages/organizations/settings/DomainSettingsPage.tsx rename to apps/console/src/pages/organizations/compliance-page/domain/CompliancePageDomainPage.tsx index 47c997f00..95fc9644c 100644 --- a/apps/console/src/pages/organizations/settings/DomainSettingsPage.tsx +++ b/apps/console/src/pages/organizations/compliance-page/domain/CompliancePageDomainPage.tsx @@ -3,36 +3,34 @@ import { Button, Card, IconPlusLarge } from "@probo/ui"; import { type PreloadedQuery, usePreloadedQuery } from "react-relay"; import { graphql } from "relay-runtime"; -import type { DomainSettingsPageQuery } from "#/__generated__/core/DomainSettingsPageQuery.graphql"; +import type { CompliancePageDomainPageQuery } from "#/__generated__/core/CompliancePageDomainPageQuery.graphql"; -import { DomainCard } from "./_components/DomainCard"; -import { NewDomainDialog } from "./_components/NewDomainDialog"; +import { CompliancePageDomainCard } from "./_components/CompliancePageDomainCard"; +import { NewCompliancePageDomainDialog } from "./_components/NewCompliancePageDomainDialog"; -export const domainSettingsPageQuery = graphql` - query DomainSettingsPageQuery($organizationId: ID!) { +export const compliancePageDomainPageQuery = graphql` + query CompliancePageDomainPageQuery($organizationId: ID!) { organization: node(id: $organizationId) { __typename ... on Organization { - id canCreateCustomDomain: permission(action: "core:custom-domain:create") customDomain { - domain - ...DomainCardFragment + ...CompliancePageDomainCardFragment } } } } `; -export function DomainSettingsPage(props: { - queryRef: PreloadedQuery; +export function CompliancePageDomainPage(props: { + queryRef: PreloadedQuery; }) { const { queryRef } = props; const { __ } = useTranslate(); - const { organization } = usePreloadedQuery( - domainSettingsPageQuery, + const { organization } = usePreloadedQuery( + compliancePageDomainPageQuery, queryRef, ); if (organization.__typename !== "Organization") { @@ -44,7 +42,7 @@ export function DomainSettingsPage(props: {

{__("Custom Domain")}

{organization.customDomain ? ( - + ) : ( @@ -59,9 +57,9 @@ export function DomainSettingsPage(props: {

{organization.canCreateCustomDomain && ( - + - + )}
diff --git a/apps/console/src/pages/organizations/compliance-page/domain/CompliancePageDomainPageLoader.tsx b/apps/console/src/pages/organizations/compliance-page/domain/CompliancePageDomainPageLoader.tsx new file mode 100644 index 000000000..203507208 --- /dev/null +++ b/apps/console/src/pages/organizations/compliance-page/domain/CompliancePageDomainPageLoader.tsx @@ -0,0 +1,39 @@ +import { useEffect } from "react"; +import { useQueryLoader } from "react-relay"; + +import type { CompliancePageDomainPageQuery } from "#/__generated__/core/CompliancePageDomainPageQuery.graphql"; +import { LinkCardSkeleton } from "#/components/skeletons/LinkCardSkeleton"; +import { useOrganizationId } from "#/hooks/useOrganizationId"; +import { CoreRelayProvider } from "#/providers/CoreRelayProvider"; + +import { + CompliancePageDomainPage, + compliancePageDomainPageQuery, +} from "./CompliancePageDomainPage"; + +function CompliancePageDomainPageQueryLoader() { + const organizationId = useOrganizationId(); + const [queryRef, loadQuery] = useQueryLoader( + compliancePageDomainPageQuery, + ); + + useEffect(() => { + loadQuery({ + organizationId, + }); + }, [loadQuery, organizationId]); + + if (!queryRef) { + return ; + } + + return ; +} + +export default function CompliancePageDomainPageLoader() { + return ( + + + + ); +} diff --git a/apps/console/src/pages/organizations/settings/_components/DomainCard.tsx b/apps/console/src/pages/organizations/compliance-page/domain/_components/CompliancePageDomainCard.tsx similarity index 65% rename from apps/console/src/pages/organizations/settings/_components/DomainCard.tsx rename to apps/console/src/pages/organizations/compliance-page/domain/_components/CompliancePageDomainCard.tsx index 3a89e10c7..9b290ed85 100644 --- a/apps/console/src/pages/organizations/settings/_components/DomainCard.tsx +++ b/apps/console/src/pages/organizations/compliance-page/domain/_components/CompliancePageDomainCard.tsx @@ -7,26 +7,26 @@ import { Badge, Button, Card } from "@probo/ui"; import { useFragment } from "react-relay"; import { graphql } from "relay-runtime"; -import type { DomainCardFragment$key } from "#/__generated__/core/DomainCardFragment.graphql"; +import type { CompliancePageDomainCardFragment$key } from "#/__generated__/core/CompliancePageDomainCardFragment.graphql"; -import { DeleteDomainDialog } from "./DeleteDomainDialog"; -import { DomainDialog } from "./DomainDialog"; +import { CompliancePageDomainDialog } from "./CompliancePageDomainDialog"; +import { DeleteCompliancePageDomainDialog } from "./DeleteCompliancePageDomainDialog"; const fragment = graphql` - fragment DomainCardFragment on CustomDomain { + fragment CompliancePageDomainCardFragment on CustomDomain { domain sslStatus canDelete: permission(action: "core:custom-domain:delete") - ...DomainDialogFragment + ...CompliancePageDomainDialogFragment } `; -export function DomainCard(props: { fKey: DomainCardFragment$key }) { +export function CompliancePageDomainCard(props: { fKey: CompliancePageDomainCardFragment$key }) { const { fKey } = props; const { __ } = useTranslate(); - const domain = useFragment(fragment, fKey); + const domain = useFragment(fragment, fKey); return ( @@ -49,14 +49,14 @@ export function DomainCard(props: { fKey: DomainCardFragment$key }) {
- + - + {domain.canDelete && ( - + - + )}
diff --git a/apps/console/src/pages/organizations/settings/_components/DomainDialog.tsx b/apps/console/src/pages/organizations/compliance-page/domain/_components/CompliancePageDomainDialog.tsx similarity index 92% rename from apps/console/src/pages/organizations/settings/_components/DomainDialog.tsx rename to apps/console/src/pages/organizations/compliance-page/domain/_components/CompliancePageDomainDialog.tsx index e735a5833..fa9e40afd 100644 --- a/apps/console/src/pages/organizations/settings/_components/DomainDialog.tsx +++ b/apps/console/src/pages/organizations/compliance-page/domain/_components/CompliancePageDomainDialog.tsx @@ -15,10 +15,10 @@ import type { PropsWithChildren } from "react"; import { useFragment } from "react-relay"; import { graphql } from "relay-runtime"; -import type { DomainDialogFragment$key } from "#/__generated__/core/DomainDialogFragment.graphql"; +import type { CompliancePageDomainDialogFragment$key } from "#/__generated__/core/CompliancePageDomainDialogFragment.graphql"; const fragment = graphql` - fragment DomainDialogFragment on CustomDomain { + fragment CompliancePageDomainDialogFragment on CustomDomain { sslStatus domain dnsRecords { @@ -28,15 +28,13 @@ const fragment = graphql` ttl purpose } - createdAt - updatedAt sslExpiresAt } `; -type DomainDialogProps = PropsWithChildren<{ fKey: DomainDialogFragment$key }>; +type CompliancePageDomainDialogProps = PropsWithChildren<{ fKey: CompliancePageDomainDialogFragment$key }>; -export function DomainDialog(props: DomainDialogProps) { +export function CompliancePageDomainDialog(props: CompliancePageDomainDialogProps) { const { children, fKey } = props; const { __ } = useTranslate(); @@ -52,7 +50,7 @@ export function DomainDialog(props: DomainDialogProps) { }); }; - const domain = useFragment(fragment, fKey); + const domain = useFragment(fragment, fKey); return ( ; -export function DeleteDomainDialog(props: DeleteDomainDialogProps) { +export function DeleteCompliancePageDomainDialog(props: DeleteCompliancePageDomainDialogProps) { const { children, domain } = props; const organizationId = useOrganizationId(); @@ -37,7 +37,7 @@ export function DeleteDomainDialog(props: DeleteDomainDialogProps) { const [inputValue, setInputValue] = useState(""); const [deleteCustomDomain, isDeleting] - = useMutationWithToasts( + = useMutationWithToasts( deleteCustomDomainMutation, { successMessage: __("Domain deleted successfully"), diff --git a/apps/console/src/pages/organizations/settings/_components/NewDomainDialog.tsx b/apps/console/src/pages/organizations/compliance-page/domain/_components/NewCompliancePageDomainDialog.tsx similarity index 91% rename from apps/console/src/pages/organizations/settings/_components/NewDomainDialog.tsx rename to apps/console/src/pages/organizations/compliance-page/domain/_components/NewCompliancePageDomainDialog.tsx index 30e67d1a0..4c3d5b696 100644 --- a/apps/console/src/pages/organizations/settings/_components/NewDomainDialog.tsx +++ b/apps/console/src/pages/organizations/compliance-page/domain/_components/NewCompliancePageDomainDialog.tsx @@ -12,13 +12,13 @@ import type { PropsWithChildren } from "react"; import { graphql } from "relay-runtime"; import { z } from "zod"; -import type { NewDomainDialogMutation } from "#/__generated__/core/NewDomainDialogMutation.graphql"; +import type { NewCompliancePageDomainDialogMutation } from "#/__generated__/core/NewCompliancePageDomainDialogMutation.graphql"; import { useFormWithSchema } from "#/hooks/useFormWithSchema"; import { useMutationWithToasts } from "#/hooks/useMutationWithToasts"; import { useOrganizationId } from "#/hooks/useOrganizationId"; const createCustomDomainMutation = graphql` - mutation NewDomainDialogMutation($input: CreateCustomDomainInput!) { + mutation NewCompliancePageDomainDialogMutation($input: CreateCustomDomainInput!) { createCustomDomain(input: $input) { customDomain { id @@ -50,7 +50,7 @@ const schema = z.object({ ), }); -export function NewDomainDialog(props: PropsWithChildren) { +export function NewCompliancePageDomainDialog(props: PropsWithChildren) { const { children } = props; const organizationId = useOrganizationId(); @@ -67,7 +67,7 @@ export function NewDomainDialog(props: PropsWithChildren) { ); const [createCustomDomain, isCreating] - = useMutationWithToasts(createCustomDomainMutation, { + = useMutationWithToasts(createCustomDomainMutation, { successMessage: __( "Domain added successfully. Configure the DNS records to verify and activate your domain.", ), diff --git a/apps/console/src/pages/organizations/compliance-page/routes.ts b/apps/console/src/pages/organizations/compliance-page/routes.ts index 81240a69d..7fc03a133 100644 --- a/apps/console/src/pages/organizations/compliance-page/routes.ts +++ b/apps/console/src/pages/organizations/compliance-page/routes.ts @@ -14,6 +14,14 @@ export const compliancePageRoutes = [ Fallback: LinkCardSkeleton, Component: lazy(() => import("#/pages/organizations/compliance-page/overview/CompliancePageOverviewPageLoader")), }, + { + path: "domain", + Fallback: LinkCardSkeleton, + Component: lazy( + () => + import("#/pages/organizations/compliance-page/domain/CompliancePageDomainPageLoader"), + ), + }, { path: "references", Fallback: LinkCardSkeleton, diff --git a/apps/console/src/pages/organizations/settings/DomainSettingsPageLoader.tsx b/apps/console/src/pages/organizations/settings/DomainSettingsPageLoader.tsx deleted file mode 100644 index 12bb069a3..000000000 --- a/apps/console/src/pages/organizations/settings/DomainSettingsPageLoader.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import { Suspense, useEffect } from "react"; -import { useQueryLoader } from "react-relay"; - -import type { DomainSettingsPageQuery } from "#/__generated__/core/DomainSettingsPageQuery.graphql"; -import { useOrganizationId } from "#/hooks/useOrganizationId"; -import { CoreRelayProvider } from "#/providers/CoreRelayProvider"; - -import { - DomainSettingsPage, - domainSettingsPageQuery, -} from "./DomainSettingsPage"; - -function DomainSettingsPageQueryLoader() { - const organizationId = useOrganizationId(); - const [queryRef, loadQuery] = useQueryLoader( - domainSettingsPageQuery, - ); - - useEffect(() => { - loadQuery({ - organizationId, - }); - }, [loadQuery, organizationId]); - - if (!queryRef) { - return null; - } - - return ; -} - -export default function DomainSettingsPageLoader() { - return ( - - - - - - ); -} diff --git a/apps/console/src/routes.tsx b/apps/console/src/routes.tsx index 3c0379f39..cfa9825d9 100644 --- a/apps/console/src/routes.tsx +++ b/apps/console/src/routes.tsx @@ -208,13 +208,6 @@ const routes = [ import("./pages/iam/organizations/settings/MembersPageLoader"), ), }, - { - path: "domain", - Component: lazy( - () => - import("./pages/organizations/settings/DomainSettingsPageLoader"), - ), - }, { path: "saml-sso", Component: lazy(