rohit/probo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add scim bridge with connector

Browse Source 
Signed-off-by: Bryan Frimin <bryan@getprobo.com>
This commit is contained in:
Bryan Frimin
2026-01-28 23:42:06 -08:00
parent 6d7f64ebf7
commit bc5bbdae81
43 changed files with 3568 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
apps/console/src/__generated__/iam/ConnectorListFragment.graphql.ts generated Normal file
View File

@@ -0,0 +1,53 @@
/**
* @generated SignedSource<<042ba763926f3dddfcf4f9d673ae5201>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ReaderFragment } from 'relay-runtime';
import { FragmentRefs } from "relay-runtime";
export type ConnectorListFragment$data = {
readonly scimConfiguration: {
readonly " $fragmentSpreads": FragmentRefs<"GoogleWorkspaceConnectorFragment">;
} | null | undefined;
readonly " $fragmentType": "ConnectorListFragment";
};
export type ConnectorListFragment$key = {
readonly " $data"?: ConnectorListFragment$data;
readonly " $fragmentSpreads": FragmentRefs<"ConnectorListFragment">;
};
const node: ReaderFragment = {
"argumentDefinitions": [],
"kind": "Fragment",
"metadata": null,
"name": "ConnectorListFragment",
"selections": [
{
"alias": null,
"args": null,
"concreteType": "SCIMConfiguration",
"kind": "LinkedField",
"name": "scimConfiguration",
"plural": false,
"selections": [
{
"args": null,
"kind": "FragmentSpread",
"name": "GoogleWorkspaceConnectorFragment"
}
],
"storageKey": null
}
],
"type": "Organization",
"abstractKey": null
};
(node as any).hash = "32fd94ab5080bb8deba95ab24b545fc1";
export default node;

93
apps/console/src/__generated__/iam/GoogleWorkspaceConnectorDeleteMutation.graphql.ts generated Normal file
View File

@@ -0,0 +1,93 @@
/**
* @generated SignedSource<<b7e9a7b1979b5caf109266b80803fdbf>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type DeleteSCIMConfigurationInput = {
organizationId: string;
scimConfigurationId: string;
};
export type GoogleWorkspaceConnectorDeleteMutation$variables = {
input: DeleteSCIMConfigurationInput;
};
export type GoogleWorkspaceConnectorDeleteMutation$data = {
readonly deleteSCIMConfiguration: {
readonly deletedScimConfigurationId: string;
} | null | undefined;
};
export type GoogleWorkspaceConnectorDeleteMutation = {
response: GoogleWorkspaceConnectorDeleteMutation$data;
variables: GoogleWorkspaceConnectorDeleteMutation$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "input"
}
],
v1 = [
{
"alias": null,
"args": [
{
"kind": "Variable",
"name": "input",
"variableName": "input"
}
],
"concreteType": "DeleteSCIMConfigurationPayload",
"kind": "LinkedField",
"name": "deleteSCIMConfiguration",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "deletedScimConfigurationId",
"storageKey": null
}
],
"storageKey": null
}
];
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "GoogleWorkspaceConnectorDeleteMutation",
"selections": (v1/*: any*/),
"type": "Mutation",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "GoogleWorkspaceConnectorDeleteMutation",
"selections": (v1/*: any*/)
},
"params": {
"cacheID": "8fa5927c728a768a19fd163d162facac",
"id": null,
"metadata": {},
"name": "GoogleWorkspaceConnectorDeleteMutation",
"operationKind": "mutation",
"text": "mutation GoogleWorkspaceConnectorDeleteMutation(\n $input: DeleteSCIMConfigurationInput!\n) {\n deleteSCIMConfiguration(input: $input) {\n deletedScimConfigurationId\n }\n}\n"
}
};
})();
(node as any).hash = "fc1502ef215040eda187b2f782adb530";
export default node;

90
apps/console/src/__generated__/iam/GoogleWorkspaceConnectorFragment.graphql.ts generated Normal file
View File

@@ -0,0 +1,90 @@
/**
* @generated SignedSource<<2beb895d75d5cbcbd64a59387e35c281>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ReaderFragment } from 'relay-runtime';
export type ConnectorProvider = "GOOGLE_WORKSPACE" | "SLACK";
import { FragmentRefs } from "relay-runtime";
export type GoogleWorkspaceConnectorFragment$data = {
readonly bridge: {
readonly connector: {
readonly createdAt: string;
readonly id: string;
readonly provider: ConnectorProvider;
} | null | undefined;
} | null | undefined;
readonly id: string;
readonly " $fragmentType": "GoogleWorkspaceConnectorFragment";
};
export type GoogleWorkspaceConnectorFragment$key = {
readonly " $data"?: GoogleWorkspaceConnectorFragment$data;
readonly " $fragmentSpreads": FragmentRefs<"GoogleWorkspaceConnectorFragment">;
};
const node: ReaderFragment = (function(){
var v0 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
};
return {
"argumentDefinitions": [],
"kind": "Fragment",
"metadata": null,
"name": "GoogleWorkspaceConnectorFragment",
"selections": [
(v0/*: any*/),
{
"alias": null,
"args": null,
"concreteType": "SCIMBridge",
"kind": "LinkedField",
"name": "bridge",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "Connector",
"kind": "LinkedField",
"name": "connector",
"plural": false,
"selections": [
(v0/*: any*/),
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "provider",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "createdAt",
"storageKey": null
}
],
"storageKey": null
}
],
"storageKey": null
}
],
"type": "SCIMConfiguration",
"abstractKey": null
};
})();
(node as any).hash = "180a97ae989c22060d815280ec2f7b67";
export default node;

3
apps/console/src/__generated__/iam/SCIMConfigurationCreateMutation.graphql.ts generated
View File

@@ -1,5 +1,5 @@
/**
* @generated SignedSource<<481d9c3c647c11a95d68ff7e4a489a24>>
* @generated SignedSource<<29e2f3791be9e59a1c61033e31eb0134>>
* @lightSyntaxTransform
* @nogrep
*/
@@ -10,6 +10,7 @@
import { ConcreteRequest } from 'relay-runtime';
export type CreateSCIMConfigurationInput = {
connectorId?: string | null | undefined;
organizationId: string;
};
export type SCIMConfigurationCreateMutation$variables = {

83
apps/console/src/__generated__/iam/SCIMConfigurationFragment.graphql.ts generated
View File

@@ -1,5 +1,5 @@
/**
* @generated SignedSource<<17691f5400c05fd0281c9320b9fb86b9>>
* @generated SignedSource<<dfd688860df6b21ffe3a3f14bb2e2bf1>>
* @lightSyntaxTransform
* @nogrep
*/
@@ -11,8 +11,15 @@
import { ReaderFragment } from 'relay-runtime';
import { FragmentRefs } from "relay-runtime";
export type SCIMConfigurationFragment$data = {
readonly endpointUrl: string;
readonly id: string;
readonly canCreateSCIMConfiguration: boolean;
readonly canDeleteSCIMConfiguration: boolean;
readonly scimConfiguration: {
readonly bridge: {
readonly id: string;
} | null | undefined;
readonly endpointUrl: string;
readonly id: string;
} | null | undefined;
readonly " $fragmentType": "SCIMConfigurationFragment";
};
export type SCIMConfigurationFragment$key = {
@@ -20,31 +27,83 @@ export type SCIMConfigurationFragment$key = {
readonly " $fragmentSpreads": FragmentRefs<"SCIMConfigurationFragment">;
};
const node: ReaderFragment = {
const node: ReaderFragment = (function(){
var v0 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
};
return {
"argumentDefinitions": [],
"kind": "Fragment",
"metadata": null,
"name": "SCIMConfigurationFragment",
"selections": [
{
"alias": null,
"args": null,
"alias": "canCreateSCIMConfiguration",
"args": [
{
"kind": "Literal",
"name": "action",
"value": "iam:scim-configuration:create"
}
],
"kind": "ScalarField",
"name": "id",
"storageKey": null
"name": "permission",
"storageKey": "permission(action:\"iam:scim-configuration:create\")"
},
{
"alias": "canDeleteSCIMConfiguration",
"args": [
{
"kind": "Literal",
"name": "action",
"value": "iam:scim-configuration:delete"
}
],
"kind": "ScalarField",
"name": "permission",
"storageKey": "permission(action:\"iam:scim-configuration:delete\")"
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "endpointUrl",
"concreteType": "SCIMConfiguration",
"kind": "LinkedField",
"name": "scimConfiguration",
"plural": false,
"selections": [
(v0/*: any*/),
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "endpointUrl",
"storageKey": null
},
{
"alias": null,
"args": null,
"concreteType": "SCIMBridge",
"kind": "LinkedField",
"name": "bridge",
"plural": false,
"selections": [
(v0/*: any*/)
],
"storageKey": null
}
],
"storageKey": null
}
],
"type": "SCIMConfiguration",
"type": "Organization",
"abstractKey": null
};
})();
(node as any).hash = "5bd76da1abe24699f9895857cda748b1";
(node as any).hash = "5b128ae2e680a0ffe0dd931e4e86f52e";
export default node;

120
apps/console/src/__generated__/iam/SCIMSettingsPageCreateSCIMConfigurationMutation.graphql.ts generated Normal file
View File

@@ -0,0 +1,120 @@
/**
* @generated SignedSource<<4b9c832eb09c31751c1da609cda983ba>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type CreateSCIMConfigurationInput = {
connectorId?: string | null | undefined;
organizationId: string;
};
export type SCIMSettingsPageCreateSCIMConfigurationMutation$variables = {
input: CreateSCIMConfigurationInput;
};
export type SCIMSettingsPageCreateSCIMConfigurationMutation$data = {
readonly createSCIMConfiguration: {
readonly scimBridge: {
readonly id: string;
} | null | undefined;
readonly scimConfiguration: {
readonly id: string;
};
} | null | undefined;
};
export type SCIMSettingsPageCreateSCIMConfigurationMutation = {
response: SCIMSettingsPageCreateSCIMConfigurationMutation$data;
variables: SCIMSettingsPageCreateSCIMConfigurationMutation$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "input"
}
],
v1 = [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
}
],
v2 = [
{
"alias": null,
"args": [
{
"kind": "Variable",
"name": "input",
"variableName": "input"
}
],
"concreteType": "CreateSCIMConfigurationPayload",
"kind": "LinkedField",
"name": "createSCIMConfiguration",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "SCIMConfiguration",
"kind": "LinkedField",
"name": "scimConfiguration",
"plural": false,
"selections": (v1/*: any*/),
"storageKey": null
},
{
"alias": null,
"args": null,
"concreteType": "SCIMBridge",
"kind": "LinkedField",
"name": "scimBridge",
"plural": false,
"selections": (v1/*: any*/),
"storageKey": null
}
],
"storageKey": null
}
];
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "SCIMSettingsPageCreateSCIMConfigurationMutation",
"selections": (v2/*: any*/),
"type": "Mutation",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "SCIMSettingsPageCreateSCIMConfigurationMutation",
"selections": (v2/*: any*/)
},
"params": {
"cacheID": "281c9e39b96e2e56c3f4379f8dd8dc30",
"id": null,
"metadata": {},
"name": "SCIMSettingsPageCreateSCIMConfigurationMutation",
"operationKind": "mutation",
"text": "mutation SCIMSettingsPageCreateSCIMConfigurationMutation(\n $input: CreateSCIMConfigurationInput!\n) {\n createSCIMConfiguration(input: $input) {\n scimConfiguration {\n id\n }\n scimBridge {\n id\n }\n }\n}\n"
}
};
})();
(node as any).hash = "841dfdb5ce8a226c7e683090c75951f0";
export default node;

146
apps/console/src/__generated__/iam/SCIMSettingsPageQuery.graphql.ts generated
View File

@@ -1,5 +1,5 @@
/**
* @generated SignedSource<<5507ea6452d9065f29d74bf685ea3777>>
* @generated SignedSource<<8e3a5e8f3e57e3097149f28537f50e31>>
* @lightSyntaxTransform
* @nogrep
*/
@@ -16,12 +16,15 @@ export type SCIMSettingsPageQuery$variables = {
export type SCIMSettingsPageQuery$data = {
readonly organization: {
readonly __typename: "Organization";
readonly canCreateSCIMConfiguration: boolean;
readonly canDeleteSCIMConfiguration: boolean;
readonly id: string;
readonly scimConfiguration: {
readonly " $fragmentSpreads": FragmentRefs<"SCIMConfigurationFragment" | "SCIMEventListFragment">;
readonly bridge: {
readonly id: string;
} | null | undefined;
readonly id: string;
readonly " $fragmentSpreads": FragmentRefs<"SCIMEventListFragment">;
} | null | undefined;
readonly " $fragmentSpreads": FragmentRefs<"ConnectorListFragment" | "SCIMConfigurationFragment">;
} | {
// This will never be '%other', but we need some
// value in case none of the concrete values match.
@@ -63,32 +66,13 @@ v3 = {
"storageKey": null
},
v4 = {
"alias": "canCreateSCIMConfiguration",
"args": [
{
"kind": "Literal",
"name": "action",
"value": "iam:scim-configuration:create"
}
],
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "permission",
"storageKey": "permission(action:\"iam:scim-configuration:create\")"
"name": "createdAt",
"storageKey": null
},
v5 = {
"alias": "canDeleteSCIMConfiguration",
"args": [
{
"kind": "Literal",
"name": "action",
"value": "iam:scim-configuration:delete"
}
],
"kind": "ScalarField",
"name": "permission",
"storageKey": "permission(action:\"iam:scim-configuration:delete\")"
},
v6 = [
v5 = [
{
"kind": "Literal",
"name": "first",
@@ -117,8 +101,6 @@ return {
"kind": "InlineFragment",
"selections": [
(v3/*: any*/),
(v4/*: any*/),
(v5/*: any*/),
{
"alias": null,
"args": null,
@@ -127,10 +109,18 @@ return {
"name": "scimConfiguration",
"plural": false,
"selections": [
(v3/*: any*/),
{
"alias": null,
"args": null,
"kind": "FragmentSpread",
"name": "SCIMConfigurationFragment"
"concreteType": "SCIMBridge",
"kind": "LinkedField",
"name": "bridge",
"plural": false,
"selections": [
(v3/*: any*/)
],
"storageKey": null
},
{
"args": null,
@@ -139,6 +129,16 @@ return {
}
],
"storageKey": null
},
{
"args": null,
"kind": "FragmentSpread",
"name": "SCIMConfigurationFragment"
},
{
"args": null,
"kind": "FragmentSpread",
"name": "ConnectorListFragment"
}
],
"type": "Organization",
@@ -172,8 +172,6 @@ return {
{
"kind": "InlineFragment",
"selections": [
(v4/*: any*/),
(v5/*: any*/),
{
"alias": null,
"args": null,
@@ -186,13 +184,38 @@ return {
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "endpointUrl",
"concreteType": "SCIMBridge",
"kind": "LinkedField",
"name": "bridge",
"plural": false,
"selections": [
(v3/*: any*/),
{
"alias": null,
"args": null,
"concreteType": "Connector",
"kind": "LinkedField",
"name": "connector",
"plural": false,
"selections": [
(v3/*: any*/),
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "provider",
"storageKey": null
},
(v4/*: any*/)
],
"storageKey": null
}
],
"storageKey": null
},
{
"alias": null,
"args": (v6/*: any*/),
"args": (v5/*: any*/),
"concreteType": "SCIMEventConnection",
"kind": "LinkedField",
"name": "events",
@@ -250,13 +273,7 @@ return {
"name": "ipAddress",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "createdAt",
"storageKey": null
},
(v4/*: any*/),
{
"alias": null,
"args": null,
@@ -346,15 +363,48 @@ return {
},
{
"alias": null,
"args": (v6/*: any*/),
"args": (v5/*: any*/),
"filters": null,
"handle": "connection",
"key": "SCIMEventListFragment_events",
"kind": "LinkedHandle",
"name": "events"
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "endpointUrl",
"storageKey": null
}
],
"storageKey": null
},
{
"alias": "canCreateSCIMConfiguration",
"args": [
{
"kind": "Literal",
"name": "action",
"value": "iam:scim-configuration:create"
}
],
"kind": "ScalarField",
"name": "permission",
"storageKey": "permission(action:\"iam:scim-configuration:create\")"
},
{
"alias": "canDeleteSCIMConfiguration",
"args": [
{
"kind": "Literal",
"name": "action",
"value": "iam:scim-configuration:delete"
}
],
"kind": "ScalarField",
"name": "permission",
"storageKey": "permission(action:\"iam:scim-configuration:delete\")"
}
],
"type": "Organization",
@@ -366,16 +416,16 @@ return {
]
},
"params": {
"cacheID": "89bcad16c50ccf4ef4afd0345b02fe4a",
"cacheID": "eabd000a44bc720b07342557eedac872",
"id": null,
"metadata": {},
"name": "SCIMSettingsPageQuery",
"operationKind": "query",
"text": "query SCIMSettingsPageQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n ... on Organization {\n id\n canCreateSCIMConfiguration: permission(action: \"iam:scim-configuration:create\")\n canDeleteSCIMConfiguration: permission(action: \"iam:scim-configuration:delete\")\n scimConfiguration {\n ...SCIMConfigurationFragment\n ...SCIMEventListFragment\n id\n }\n }\n id\n }\n}\n\nfragment SCIMConfigurationFragment on SCIMConfiguration {\n id\n endpointUrl\n}\n\nfragment SCIMEventListFragment on SCIMConfiguration {\n events(first: 20) {\n edges {\n node {\n id\n ...SCIMEventListItemFragment\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n\nfragment SCIMEventListItemFragment on SCIMEvent {\n id\n method\n path\n statusCode\n errorMessage\n ipAddress\n createdAt\n membership {\n id\n profile {\n fullName\n id\n }\n }\n}\n"
"text": "query SCIMSettingsPageQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n ... on Organization {\n id\n scimConfiguration {\n id\n bridge {\n id\n }\n ...SCIMEventListFragment\n }\n ...SCIMConfigurationFragment\n ...ConnectorListFragment\n }\n id\n }\n}\n\nfragment ConnectorListFragment on Organization {\n scimConfiguration {\n ...GoogleWorkspaceConnectorFragment\n id\n }\n}\n\nfragment GoogleWorkspaceConnectorFragment on SCIMConfiguration {\n id\n bridge {\n connector {\n id\n provider\n createdAt\n }\n id\n }\n}\n\nfragment SCIMConfigurationFragment on Organization {\n canCreateSCIMConfiguration: permission(action: \"iam:scim-configuration:create\")\n canDeleteSCIMConfiguration: permission(action: \"iam:scim-configuration:delete\")\n scimConfiguration {\n id\n endpointUrl\n bridge {\n id\n }\n }\n}\n\nfragment SCIMEventListFragment on SCIMConfiguration {\n events(first: 20) {\n edges {\n node {\n id\n ...SCIMEventListItemFragment\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n\nfragment SCIMEventListItemFragment on SCIMEvent {\n id\n method\n path\n statusCode\n errorMessage\n ipAddress\n createdAt\n membership {\n id\n profile {\n fullName\n id\n }\n }\n}\n"
}
};
})();
(node as any).hash = "051cceb15c9eaf30694189c259b6d715";
(node as any).hash = "9db69676a14d2a6c4062fee58ce728e1";
export default node;

148
apps/console/src/pages/iam/organizations/settings/SCIMSettingsPage.tsx
View File

@@ -1,8 +1,14 @@
import { useTranslate } from "@probo/i18n";
import { graphql, type PreloadedQuery, usePreloadedQuery } from "react-relay";
import { Spinner } from "@probo/ui";
import { useEffect, useRef } from "react";
import { graphql, type PreloadedQuery,
useMutation, usePreloadedQuery } from "react-relay";
import { useSearchParams } from "react-router";
import type { SCIMSettingsPageCreateSCIMConfigurationMutation } from "#/__generated__/iam/SCIMSettingsPageCreateSCIMConfigurationMutation.graphql";
import type { SCIMSettingsPageQuery } from "#/__generated__/iam/SCIMSettingsPageQuery.graphql";
import { ConnectorList } from "./_components/ConnectorList";
import { SCIMConfiguration } from "./_components/SCIMConfiguration";
import { SCIMEventList } from "./_components/SCIMEventList";
@@ -12,17 +18,32 @@ export const scimSettingsPageQuery = graphql`
__typename
... on Organization {
id
canCreateSCIMConfiguration: permission(
action: "iam:scim-configuration:create"
)
canDeleteSCIMConfiguration: permission(
action: "iam:scim-configuration:delete"
)
scimConfiguration {
...SCIMConfigurationFragment
id
bridge {
id
}
...SCIMEventListFragment
}
...SCIMConfigurationFragment
...ConnectorListFragment
}
}
}
`;
const createSCIMConfigurationMutation = graphql`
mutation SCIMSettingsPageCreateSCIMConfigurationMutation(
$input: CreateSCIMConfigurationInput!
) {
createSCIMConfiguration(input: $input) {
scimConfiguration {
id
}
scimBridge {
id
}
}
}
@@ -33,26 +54,117 @@ export function SCIMSettingsPage(props: {
}) {
const { queryRef } = props;
const { __ } = useTranslate();
const [searchParams, setSearchParams] = useSearchParams();
const connectorId = searchParams.get("connector_id");
const mutationTriggeredRef = useRef(false);
const { organization } = usePreloadedQuery(scimSettingsPageQuery, queryRef);
if (organization.__typename !== "Organization") {
throw new Error("invalid node type");
}
const [createSCIMConfiguration]
= useMutation<SCIMSettingsPageCreateSCIMConfigurationMutation>(
createSCIMConfigurationMutation,
);
// Auto-create SCIM configuration and bridge when connector_id is in URL
useEffect(() => {
if (!connectorId || mutationTriggeredRef.current) return;
// Don't create if SCIM config already exists
if (organization.scimConfiguration?.id) {
setSearchParams((params: URLSearchParams) => {
params.delete("connector_id");
return params;
});
return;
}
mutationTriggeredRef.current = true;
createSCIMConfiguration({
variables: {
input: {
organizationId: organization.id,
connectorId: connectorId,
},
},
onCompleted: () => {
const url = new URL(window.location.href);
url.searchParams.delete("connector_id");
window.location.href = url.toString();
},
onError: (error) => {
console.error("Failed to create SCIM configuration:", error);
mutationTriggeredRef.current = false;
setSearchParams((params: URLSearchParams) => {
params.delete("connector_id");
return params;
});
},
});
}, [
connectorId,
organization.id,
organization.scimConfiguration?.id,
createSCIMConfiguration,
setSearchParams,
]);
// Show loader while creating SCIM configuration
if (connectorId) {
return (
<div className="flex items-center justify-center py-12">
<Spinner size={24} />
</div>
);
}
// Check if connected via Identity Provider (SCIM config has a bridge)
const hasIdentityProvider = !!organization.scimConfiguration?.bridge;
// Check if Manual SCIM is configured (SCIM config exists but no bridge)
const hasManualScim = !!organization.scimConfiguration && !organization.scimConfiguration.bridge;
// Show Identity Provider section when:
// - No SCIM config yet (user can connect)
// - Or SCIM config with bridge (already connected via IdP)
const showIdentityProviderSection = !organization.scimConfiguration || hasIdentityProvider;
// Show Manual SCIM section when:
// - Manual SCIM is configured (no bridge)
// - Or no SCIM config at all (user can choose to enable manual)
const showManualScimSection = hasManualScim || !organization.scimConfiguration;
// Show provisioning events when SCIM is configured (either manual or via IdP)
const showProvisioningEvents = !!organization.scimConfiguration;
return (
<div className="space-y-8">
<div className="space-y-4">
<h2 className="text-base font-medium">{__("SCIM Provisioning")}</h2>
<SCIMConfiguration
fKey={organization.scimConfiguration ?? null}
canCreate={organization.canCreateSCIMConfiguration}
canDelete={organization.canDeleteSCIMConfiguration}
/>
</div>
{showIdentityProviderSection && (
<ConnectorList fKey={organization} />
)}
{organization.scimConfiguration && (
{showManualScimSection && (
<div className="space-y-4">
<h2 className="text-base font-medium">{__("SCIM Event History")}</h2>
<h2 className="text-base font-medium">{__("Manual SCIM")}</h2>
{!hasManualScim && (
<p className="text-sm text-txt-secondary">
{__(
"Configure SCIM manually if your identity provider is not listed above. This requires setting up the SCIM endpoint URL and bearer token in your identity provider.",
)}
</p>
)}
<SCIMConfiguration fKey={organization} />
</div>
)}
{showProvisioningEvents && (
<div className="space-y-4">
<h2 className="text-base font-medium">
{__("Provisioning Event History")}
</h2>
<SCIMEventList fKey={organization.scimConfiguration} />
</div>
)}

32
apps/console/src/pages/iam/organizations/settings/_components/ConnectorList.tsx Normal file
View File

@@ -0,0 +1,32 @@
import { useTranslate } from "@probo/i18n";
import { graphql, useFragment } from "react-relay";
import type { ConnectorListFragment$key } from "#/__generated__/iam/ConnectorListFragment.graphql";
import { GoogleWorkspaceConnector } from "./GoogleWorkspaceConnector";
const connectorListFragment = graphql`
fragment ConnectorListFragment on Organization {
scimConfiguration {
...GoogleWorkspaceConnectorFragment
}
}
`;
export function ConnectorList(props: { fKey: ConnectorListFragment$key }) {
const { fKey } = props;
const data = useFragment<ConnectorListFragment$key>(connectorListFragment, fKey);
const { __ } = useTranslate();
return (
<div className="space-y-4">
<h2 className="text-base font-medium">{__("Identity Provider")}</h2>
<p className="text-sm text-txt-secondary">
{__(
"Connect your identity provider to automatically sync users to your organization. Once connected, you don't need to configure SCIM manually.",
)}
</p>
<GoogleWorkspaceConnector fKey={data.scimConfiguration ?? null} />
</div>
);
}

171
apps/console/src/pages/iam/organizations/settings/_components/GoogleWorkspaceConnector.tsx Normal file
View File

@@ -0,0 +1,171 @@
import { sprintf } from "@probo/helpers";
import { useTranslate } from "@probo/i18n";
import {
Badge,
Button,
Card,
Dialog,
DialogContent,
DialogFooter,
useDialogRef,
} from "@probo/ui";
import { graphql, useFragment } from "react-relay";
import type { GoogleWorkspaceConnectorDeleteMutation } from "#/__generated__/iam/GoogleWorkspaceConnectorDeleteMutation.graphql";
import type { GoogleWorkspaceConnectorFragment$key } from "#/__generated__/iam/GoogleWorkspaceConnectorFragment.graphql";
import { useMutationWithToasts } from "#/hooks/useMutationWithToasts";
import { useOrganizationId } from "#/hooks/useOrganizationId";
const googleWorkspaceConnectorFragment = graphql`
fragment GoogleWorkspaceConnectorFragment on SCIMConfiguration {
id
bridge {
connector {
id
createdAt
}
}
}
`;
const deleteSCIMConfigurationMutation = graphql`
mutation GoogleWorkspaceConnectorDeleteMutation(
$input: DeleteSCIMConfigurationInput!
) {
deleteSCIMConfiguration(input: $input) {
deletedScimConfigurationId
}
}
`;
export function GoogleWorkspaceConnector(props: {
fKey: GoogleWorkspaceConnectorFragment$key | null;
}) {
const { fKey } = props;
const data = useFragment<GoogleWorkspaceConnectorFragment$key>(googleWorkspaceConnectorFragment, fKey);
const connector = data?.bridge?.connector;
const scimConfigurationId = data?.id;
const organizationId = useOrganizationId();
const { __, dateTimeFormat } = useTranslate();
const dialogRef = useDialogRef();
const [deleteSCIMConfiguration, isDeleting]
= useMutationWithToasts<GoogleWorkspaceConnectorDeleteMutation>(
deleteSCIMConfigurationMutation,
{
successMessage: __("Google Workspace disconnected successfully"),
errorMessage: __("Failed to disconnect Google Workspace"),
},
);
const handleConnect = () => {
const baseUrl = import.meta.env.VITE_API_URL || window.location.origin;
const url = new URL("/api/console/v1/connectors/initiate", baseUrl);
url.searchParams.append("organization_id", organizationId);
url.searchParams.append("provider", "GOOGLE_WORKSPACE");
const continueUrl = `/organizations/${organizationId}/settings/scim`;
url.searchParams.append("continue", continueUrl);
window.location.href = url.toString();
};
const handleDisconnect = () => {
if (!connector || !scimConfigurationId) return;
void deleteSCIMConfiguration({
variables: {
input: {
organizationId: organizationId,
scimConfigurationId: scimConfigurationId,
},
},
onCompleted: () => {
dialogRef.current?.close();
},
updater: (store) => {
const organizationRecord = store.get(organizationId);
if (organizationRecord) {
organizationRecord.setValue(null, "scimConfiguration");
}
},
});
};
// Not connected state
if (!connector) {
return (
<Card padded className="flex items-center gap-3">
<div className="w-10 h-10 flex items-center justify-center bg-subtle rounded">
<img
src="/google-workspace.png"
alt="Google Workspace"
className="w-6 h-6"
/>
</div>
<div className="mr-auto">
<h3 className="font-medium">{__("Google Workspace")}</h3>
<p className="text-sm text-txt-secondary">
{__(
"Connect Google Workspace to automatically sync users via SCIM.",
)}
</p>
</div>
<Button variant="secondary" onClick={handleConnect}>
{__("Connect")}
</Button>
</Card>
);
}
// Connected state
return (
<Card padded className="flex items-center gap-3">
<div className="w-10 h-10 flex items-center justify-center bg-subtle rounded">
<img
src="/google-workspace.png"
alt="Google Workspace"
className="w-6 h-6"
/>
</div>
<div className="mr-auto">
<h3 className="font-medium">{__("Google Workspace")}</h3>
<p className="text-sm text-txt-secondary">
{sprintf(__("Connected on %s"), dateTimeFormat(connector.createdAt))}
</p>
</div>
<Badge variant="success" size="md">
{__("Connected")}
</Badge>
<Dialog
ref={dialogRef}
trigger={(
<Button variant="secondary">
{__("Disconnect")}
</Button>
)}
title={__("Disconnect Google Workspace")}
className="max-w-lg"
>
<DialogContent padded className="space-y-4">
<p className="text-txt-secondary text-sm">
{__(
"This will disconnect your Google Workspace integration. Users will no longer be automatically synced via SCIM.",
)}
</p>
<p className="text-red-600 text-sm font-medium">
{__("This action cannot be undone.")}
</p>
</DialogContent>
<DialogFooter>
<Button
variant="danger"
onClick={handleDisconnect}
disabled={isDeleting}
>
{isDeleting ? __("Disconnecting...") : __("Disconnect")}
</Button>
</DialogFooter>
</Dialog>
</Card>
);
}

55
apps/console/src/pages/iam/organizations/settings/_components/SCIMConfiguration.tsx
View File

@@ -20,9 +20,20 @@ import type { SCIMConfigurationRegenerateTokenMutation } from "#/__generated__/i
import { useOrganizationId } from "#/hooks/useOrganizationId";
const SCIMConfigurationFragment = graphql`
fragment SCIMConfigurationFragment on SCIMConfiguration {
id
endpointUrl
fragment SCIMConfigurationFragment on Organization {
canCreateSCIMConfiguration: permission(
action: "iam:scim-configuration:create"
)
canDeleteSCIMConfiguration: permission(
action: "iam:scim-configuration:delete"
)
scimConfiguration {
id
endpointUrl
bridge {
id
}
}
}
`;
@@ -75,15 +86,19 @@ const regenerateSCIMTokenMutation = graphql`
`;
export function SCIMConfiguration(props: {
fKey: SCIMConfigurationFragment$key | null;
canCreate: boolean;
canDelete: boolean;
fKey: SCIMConfigurationFragment$key;
}) {
const { canCreate, canDelete, fKey } = props;
const { fKey } = props;
const organizationId = useOrganizationId();
const scimConfiguration = useFragment(SCIMConfigurationFragment, fKey);
const organization = useFragment<SCIMConfigurationFragment$key>(SCIMConfigurationFragment, fKey);
const {
canCreateSCIMConfiguration: canCreate,
canDeleteSCIMConfiguration: canDelete,
scimConfiguration,
} = organization;
const hasIdentityProvider = !!scimConfiguration?.bridge;
const { __ } = useTranslate();
const { toast } = useToast();
@@ -117,7 +132,7 @@ export function SCIMConfiguration(props: {
variant: "error",
title: __("Error"),
description: formatError(
__("SCIM configuration creation failed"),
__("Manual SCIM configuration failed"),
e,
),
});
@@ -128,7 +143,7 @@ export function SCIMConfiguration(props: {
setToken(response.createSCIMConfiguration.token);
}
toast({
title: __("SCIM Configuration Created"),
title: __("Manual SCIM Configured"),
description: __(
"Copy the bearer token now. It will not be shown again.",
),
@@ -159,7 +174,7 @@ export function SCIMConfiguration(props: {
deleteDialogRef.current?.close();
setToken(null);
toast({
title: __("SCIM Configuration Deleted"),
title: __("Manual SCIM Configuration Deleted"),
description: __(
"All SCIM-provisioned memberships have been changed to manual source.",
),
@@ -218,14 +233,18 @@ export function SCIMConfiguration(props: {
};
if (!scimConfiguration) {
if (hasIdentityProvider) {
return null;
}
return (
<Card padded>
<div className="flex items-center justify-between">
<div>
<h3 className="font-medium">{__("SCIM is not configured")}</h3>
<h3 className="font-medium">{__("Manual SCIM is not configured")}</h3>
<p className="text-sm text-txt-secondary mt-1">
{__(
"Enable SCIM to automatically provision users from your identity provider.",
"Generate a SCIM endpoint and bearer token to configure your identity provider manually.",
)}
</p>
</div>
@@ -250,10 +269,10 @@ export function SCIMConfiguration(props: {
<div className="space-y-6">
<div className="flex items-center justify-between">
<div>
<h3 className="font-medium">{__("SCIM Provisioning Active")}</h3>
<h3 className="font-medium">{__("Manual SCIM Active")}</h3>
<p className="text-sm text-txt-secondary">
{__(
"Automatic user provisioning is enabled for this organization.",
"Use these credentials to configure SCIM in your identity provider.",
)}
</p>
</div>
@@ -328,17 +347,17 @@ export function SCIMConfiguration(props: {
<Dialog
ref={deleteDialogRef}
title={__("Delete SCIM Configuration")}
title={__("Delete Manual SCIM Configuration")}
onClose={() => deleteDialogRef.current?.close()}
>
<div className="p-4 space-y-4">
<p>
{__(
"Are you sure you want to delete the SCIM configuration? This will:",
"Are you sure you want to delete the manual SCIM configuration? This will:",
)}
</p>
<ul className="list-disc list-inside text-sm space-y-1">
<li>{__("Disable automatic user provisioning")}</li>
<li>{__("Disable manual SCIM provisioning")}</li>
<li>
{__("Change all SCIM-provisioned memberships to manual source")}
</li>

4
apps/console/vite.config.ts
View File

@@ -8,7 +8,7 @@ import { defineConfig } from "vite";
export default defineConfig({
plugins: [
react({
exclude: ["src/pages/iam/**/*"],
exclude: ["src/pages/iam/**/*", "src/components/connectors/**/*"],
babel: {
plugins: [
[
@@ -22,7 +22,7 @@ export default defineConfig({
},
}),
react({
include: ["src/pages/iam/**/*"],
include: ["src/pages/iam/**/*", "src/components/connectors/**/*"],
babel: {
plugins: [
[