Add slack integration
Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>
This commit is contained in:
Sacha Al Himdani
@@ -0,0 +1,87 @@
|
||||
import { Badge, Button, Card } from "@probo/ui";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { sprintf } from "@probo/helpers";
|
||||
import type { TrustCenterGraphQuery$data } from "/hooks/graph/__generated__/TrustCenterGraphQuery.graphql";
|
||||
|
||||
type Props = {
|
||||
organizationId: string;
|
||||
slackConnections: NonNullable<TrustCenterGraphQuery$data["organization"]["slackConnections"]>["edges"][number]["node"][];
|
||||
};
|
||||
|
||||
export function SlackConnections({ organizationId, slackConnections: connectedSlackConnections }: Props) {
|
||||
const { __, dateTimeFormat } = useTranslate();
|
||||
|
||||
const slackConnectionDefinitions = [
|
||||
{
|
||||
id: "SLACK",
|
||||
name: "Slack",
|
||||
protocol: "OAUTH2",
|
||||
description: __("Manage your trust center access with slack"),
|
||||
},
|
||||
];
|
||||
|
||||
const slackConnections = slackConnectionDefinitions.map((def) => {
|
||||
const connected = connectedSlackConnections.find((c) => c.id);
|
||||
return {
|
||||
...def,
|
||||
createdAt: connected?.createdAt,
|
||||
channel: connected?.channel,
|
||||
channelId: connected?.channelId,
|
||||
};
|
||||
});
|
||||
|
||||
const getUrl = (provider: string) => {
|
||||
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", provider);
|
||||
const trustCenterUrl = `/organizations/${organizationId}/trust-center`;
|
||||
url.searchParams.append("continue", trustCenterUrl);
|
||||
const finalUrl = url.toString();
|
||||
return finalUrl;
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-2">
|
||||
{slackConnections.map((slackConnection) => (
|
||||
<Card key={slackConnection.id} padded className="flex items-center gap-3">
|
||||
<div>
|
||||
<img src={`/${slackConnection.id.toLowerCase()}.png`} alt="" />
|
||||
</div>
|
||||
<div className="mr-auto">
|
||||
<h3 className="text-base font-semibold">{slackConnection.name}</h3>
|
||||
<p className="text-sm text-txt-tertiary">
|
||||
{slackConnection.createdAt ? (
|
||||
<>
|
||||
{sprintf(
|
||||
__("Connected on %s"),
|
||||
dateTimeFormat(slackConnection.createdAt)
|
||||
)}
|
||||
{slackConnection.channel && (
|
||||
<>
|
||||
{" • "}
|
||||
{sprintf(__("Channel: %s"), slackConnection.channel)}
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
slackConnection.description
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
{slackConnection.createdAt ? (
|
||||
<div>
|
||||
<Badge variant="success" size="md">
|
||||
{__("Connected")}
|
||||
</Badge>
|
||||
</div>
|
||||
) : (
|
||||
<Button variant="secondary" asChild>
|
||||
<a href={getUrl(slackConnection.id)}>{__("Connect")}</a>
|
||||
</Button>
|
||||
)}
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -57,6 +57,17 @@ export const trustCenterQuery = graphql`
|
||||
}
|
||||
}
|
||||
}
|
||||
slackConnections(first: 100) {
|
||||
edges {
|
||||
node {
|
||||
id
|
||||
channel
|
||||
channelId
|
||||
createdAt
|
||||
updatedAt
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* @generated SignedSource<<e08c5c7fa8cd8bec9755ef2afe810797>>
|
||||
* @generated SignedSource<<e961390ac138b066af89b5b02169d66e>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
@@ -72,29 +72,22 @@ v6 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "type",
|
||||
"name": "createdAt",
|
||||
"storageKey": null
|
||||
},
|
||||
v7 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "createdAt",
|
||||
"storageKey": null
|
||||
},
|
||||
v8 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "updatedAt",
|
||||
"storageKey": null
|
||||
},
|
||||
v9 = {
|
||||
v8 = {
|
||||
"kind": "Literal",
|
||||
"name": "first",
|
||||
"value": 20
|
||||
},
|
||||
v10 = {
|
||||
v9 = {
|
||||
"kind": "Literal",
|
||||
"name": "orderBy",
|
||||
"value": {
|
||||
@@ -102,39 +95,39 @@ v10 = {
|
||||
"field": "CREATED_AT"
|
||||
}
|
||||
},
|
||||
v11 = [
|
||||
(v9/*: any*/),
|
||||
(v10/*: any*/)
|
||||
v10 = [
|
||||
(v8/*: any*/),
|
||||
(v9/*: any*/)
|
||||
],
|
||||
v12 = {
|
||||
v11 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "totalCount",
|
||||
"storageKey": null
|
||||
},
|
||||
v13 = {
|
||||
v12 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "fullName",
|
||||
"storageKey": null
|
||||
},
|
||||
v14 = {
|
||||
v13 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "role",
|
||||
"storageKey": null
|
||||
},
|
||||
v15 = {
|
||||
v14 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "cursor",
|
||||
"storageKey": null
|
||||
},
|
||||
v16 = {
|
||||
v15 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "PageInfo",
|
||||
@@ -173,7 +166,7 @@ v16 = {
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
v17 = {
|
||||
v16 = {
|
||||
"kind": "ClientExtension",
|
||||
"selections": [
|
||||
{
|
||||
@@ -185,7 +178,7 @@ v17 = {
|
||||
}
|
||||
]
|
||||
},
|
||||
v18 = [
|
||||
v17 = [
|
||||
{
|
||||
"kind": "Literal",
|
||||
"name": "filter",
|
||||
@@ -196,8 +189,8 @@ v18 = [
|
||||
]
|
||||
}
|
||||
},
|
||||
(v9/*: any*/),
|
||||
(v10/*: any*/)
|
||||
(v8/*: any*/),
|
||||
(v9/*: any*/)
|
||||
];
|
||||
return {
|
||||
"fragment": {
|
||||
@@ -332,7 +325,13 @@ return {
|
||||
"name": "dnsRecords",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
(v6/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "type",
|
||||
"storageKey": null
|
||||
},
|
||||
(v3/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
@@ -358,8 +357,8 @@ return {
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v6/*: any*/),
|
||||
(v7/*: any*/),
|
||||
(v8/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -370,60 +369,17 @@ return {
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v6/*: any*/),
|
||||
(v7/*: any*/),
|
||||
(v8/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": [
|
||||
{
|
||||
"kind": "Literal",
|
||||
"name": "first",
|
||||
"value": 100
|
||||
}
|
||||
],
|
||||
"concreteType": "ConnectorConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "connectors",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ConnectorEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Connector",
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
(v3/*: any*/),
|
||||
(v6/*: any*/),
|
||||
(v7/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": "connectors(first:100)"
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v11/*: any*/),
|
||||
"args": (v10/*: any*/),
|
||||
"concreteType": "MembershipConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "memberships",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v12/*: any*/),
|
||||
(v11/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -441,7 +397,7 @@ return {
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
(v13/*: any*/),
|
||||
(v12/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -449,24 +405,24 @@ return {
|
||||
"name": "emailAddress",
|
||||
"storageKey": null
|
||||
},
|
||||
(v14/*: any*/),
|
||||
(v7/*: any*/),
|
||||
(v13/*: any*/),
|
||||
(v6/*: any*/),
|
||||
(v4/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v15/*: any*/)
|
||||
(v14/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v16/*: any*/),
|
||||
(v17/*: any*/)
|
||||
(v15/*: any*/),
|
||||
(v16/*: any*/)
|
||||
],
|
||||
"storageKey": "memberships(first:20,orderBy:{\"direction\":\"ASC\",\"field\":\"CREATED_AT\"})"
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v11/*: any*/),
|
||||
"args": (v10/*: any*/),
|
||||
"filters": [
|
||||
"orderBy"
|
||||
],
|
||||
@@ -477,13 +433,13 @@ return {
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v18/*: any*/),
|
||||
"args": (v17/*: any*/),
|
||||
"concreteType": "InvitationConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "invitations",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v12/*: any*/),
|
||||
(v11/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -502,8 +458,8 @@ return {
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
(v5/*: any*/),
|
||||
(v12/*: any*/),
|
||||
(v13/*: any*/),
|
||||
(v14/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -525,23 +481,23 @@ return {
|
||||
"name": "acceptedAt",
|
||||
"storageKey": null
|
||||
},
|
||||
(v7/*: any*/),
|
||||
(v6/*: any*/),
|
||||
(v4/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v15/*: any*/)
|
||||
(v14/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v16/*: any*/),
|
||||
(v17/*: any*/)
|
||||
(v15/*: any*/),
|
||||
(v16/*: any*/)
|
||||
],
|
||||
"storageKey": "invitations(filter:{\"statuses\":[\"PENDING\",\"EXPIRED\"]},first:20,orderBy:{\"direction\":\"ASC\",\"field\":\"CREATED_AT\"})"
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v18/*: any*/),
|
||||
"args": (v17/*: any*/),
|
||||
"filters": [
|
||||
"orderBy",
|
||||
"filter"
|
||||
@@ -561,12 +517,12 @@ return {
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "daa371367edee014ac05cb9712ce360d",
|
||||
"cacheID": "3d38000d9d2105ef8ae3d56edf31b372",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "OrganizationGraph_ViewQuery",
|
||||
"operationKind": "query",
|
||||
"text": "query OrganizationGraph_ViewQuery(\n $organizationId: ID!\n) {\n node(id: $organizationId) {\n __typename\n ... on Organization {\n id\n name\n ...SettingsPageFragment\n ...SettingsPageMembershipsFragment\n ...SettingsPageInvitationsFragment\n }\n id\n }\n}\n\nfragment SettingsPageFragment on Organization {\n id\n name\n logoUrl\n horizontalLogoUrl\n description\n websiteUrl\n email\n headquarterAddress\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 }\n createdAt\n updatedAt\n connectors(first: 100) {\n edges {\n node {\n id\n name\n type\n createdAt\n }\n }\n }\n}\n\nfragment SettingsPageInvitationsFragment on Organization {\n invitations(first: 20, orderBy: {direction: ASC, field: CREATED_AT}, filter: {statuses: [PENDING, EXPIRED]}) {\n totalCount\n edges {\n node {\n id\n email\n fullName\n role\n status\n expiresAt\n acceptedAt\n createdAt\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n\nfragment SettingsPageMembershipsFragment on Organization {\n memberships(first: 20, orderBy: {direction: ASC, field: CREATED_AT}) {\n totalCount\n edges {\n node {\n id\n fullName\n emailAddress\n role\n createdAt\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n"
|
||||
"text": "query OrganizationGraph_ViewQuery(\n $organizationId: ID!\n) {\n node(id: $organizationId) {\n __typename\n ... on Organization {\n id\n name\n ...SettingsPageFragment\n ...SettingsPageMembershipsFragment\n ...SettingsPageInvitationsFragment\n }\n id\n }\n}\n\nfragment SettingsPageFragment on Organization {\n id\n name\n logoUrl\n horizontalLogoUrl\n description\n websiteUrl\n email\n headquarterAddress\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 }\n createdAt\n updatedAt\n}\n\nfragment SettingsPageInvitationsFragment on Organization {\n invitations(first: 20, orderBy: {direction: ASC, field: CREATED_AT}, filter: {statuses: [PENDING, EXPIRED]}) {\n totalCount\n edges {\n node {\n id\n email\n fullName\n role\n status\n expiresAt\n acceptedAt\n createdAt\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n\nfragment SettingsPageMembershipsFragment on Organization {\n memberships(first: 20, orderBy: {direction: ASC, field: CREATED_AT}) {\n totalCount\n edges {\n node {\n id\n fullName\n emailAddress\n role\n createdAt\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* @generated SignedSource<<8e92507c4ea06441e81f19bdcd6d4feb>>
|
||||
* @generated SignedSource<<6d55d37aa2ddfae16f8fc829840113d4>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
@@ -37,6 +37,17 @@ export type TrustCenterGraphQuery$data = {
|
||||
};
|
||||
readonly id?: string;
|
||||
readonly name?: string;
|
||||
readonly slackConnections?: {
|
||||
readonly edges: ReadonlyArray<{
|
||||
readonly node: {
|
||||
readonly channel: string | null | undefined;
|
||||
readonly channelId: string | null | undefined;
|
||||
readonly createdAt: any;
|
||||
readonly id: string;
|
||||
readonly updatedAt: any;
|
||||
};
|
||||
}>;
|
||||
};
|
||||
readonly trustCenter?: {
|
||||
readonly active: boolean;
|
||||
readonly createdAt: any;
|
||||
@@ -248,6 +259,56 @@ v10 = [
|
||||
(v7/*: any*/)
|
||||
],
|
||||
v11 = {
|
||||
"alias": null,
|
||||
"args": (v10/*: any*/),
|
||||
"concreteType": "SlackConnectionConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "slackConnections",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "SlackConnectionEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "SlackConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "channel",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "channelId",
|
||||
"storageKey": null
|
||||
},
|
||||
(v5/*: any*/),
|
||||
(v6/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": "slackConnections(first:100)"
|
||||
},
|
||||
v12 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
@@ -392,7 +453,8 @@ return {
|
||||
}
|
||||
],
|
||||
"storageKey": "vendors(first:100)"
|
||||
}
|
||||
},
|
||||
(v11/*: any*/)
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
@@ -472,7 +534,7 @@ return {
|
||||
"name": "documentType",
|
||||
"storageKey": null
|
||||
},
|
||||
(v11/*: any*/),
|
||||
(v12/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": [
|
||||
@@ -589,7 +651,7 @@ return {
|
||||
"name": "state",
|
||||
"storageKey": null
|
||||
},
|
||||
(v11/*: any*/),
|
||||
(v12/*: any*/),
|
||||
(v5/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
@@ -650,7 +712,8 @@ return {
|
||||
}
|
||||
],
|
||||
"storageKey": "vendors(first:100)"
|
||||
}
|
||||
},
|
||||
(v11/*: any*/)
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
@@ -661,16 +724,16 @@ return {
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "89f1657de6e2c073609a2c69d7b2d747",
|
||||
"cacheID": "06cd2015e9fc2e65d35ae3153e587c58",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "TrustCenterGraphQuery",
|
||||
"operationKind": "query",
|
||||
"text": "query TrustCenterGraphQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n ... on Organization {\n id\n name\n customDomain {\n id\n domain\n }\n trustCenter {\n id\n active\n ndaFileName\n ndaFileUrl\n createdAt\n updatedAt\n references(first: 100, orderBy: {field: CREATED_AT, direction: DESC}) {\n edges {\n node {\n id\n name\n description\n websiteUrl\n logoUrl\n createdAt\n updatedAt\n }\n }\n }\n }\n documents(first: 100) {\n edges {\n node {\n id\n ...TrustCenterDocumentsCardFragment\n }\n }\n }\n audits(first: 100) {\n edges {\n node {\n id\n ...TrustCenterAuditsCardFragment\n }\n }\n }\n vendors(first: 100) {\n edges {\n node {\n id\n ...TrustCenterVendorsCardFragment\n }\n }\n }\n }\n id\n }\n}\n\nfragment TrustCenterAuditsCardFragment on Audit {\n id\n name\n framework {\n name\n id\n }\n validFrom\n validUntil\n state\n trustCenterVisibility\n createdAt\n}\n\nfragment TrustCenterDocumentsCardFragment on Document {\n id\n title\n createdAt\n documentType\n trustCenterVisibility\n versions(first: 1) {\n edges {\n node {\n id\n status\n }\n }\n }\n}\n\nfragment TrustCenterVendorsCardFragment on Vendor {\n id\n name\n category\n description\n showOnTrustCenter\n createdAt\n}\n"
|
||||
"text": "query TrustCenterGraphQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n ... on Organization {\n id\n name\n customDomain {\n id\n domain\n }\n trustCenter {\n id\n active\n ndaFileName\n ndaFileUrl\n createdAt\n updatedAt\n references(first: 100, orderBy: {field: CREATED_AT, direction: DESC}) {\n edges {\n node {\n id\n name\n description\n websiteUrl\n logoUrl\n createdAt\n updatedAt\n }\n }\n }\n }\n documents(first: 100) {\n edges {\n node {\n id\n ...TrustCenterDocumentsCardFragment\n }\n }\n }\n audits(first: 100) {\n edges {\n node {\n id\n ...TrustCenterAuditsCardFragment\n }\n }\n }\n vendors(first: 100) {\n edges {\n node {\n id\n ...TrustCenterVendorsCardFragment\n }\n }\n }\n slackConnections(first: 100) {\n edges {\n node {\n id\n channel\n channelId\n createdAt\n updatedAt\n }\n }\n }\n }\n id\n }\n}\n\nfragment TrustCenterAuditsCardFragment on Audit {\n id\n name\n framework {\n name\n id\n }\n validFrom\n validUntil\n state\n trustCenterVisibility\n createdAt\n}\n\nfragment TrustCenterDocumentsCardFragment on Document {\n id\n title\n createdAt\n documentType\n trustCenterVisibility\n versions(first: 1) {\n edges {\n node {\n id\n status\n }\n }\n }\n}\n\nfragment TrustCenterVendorsCardFragment on Vendor {\n id\n name\n category\n description\n showOnTrustCenter\n createdAt\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "60725f4e10d6e720a09a883430854ada";
|
||||
(node as any).hash = "7ef9a5adc70dff604a149ea156e52edc";
|
||||
|
||||
export default node;
|
||||
|
||||
@@ -32,10 +32,7 @@ import { organizationViewQuery } from "/hooks/graph/OrganizationGraph";
|
||||
import { graphql } from "relay-runtime";
|
||||
import { SortableTable, SortableTh } from "/components/SortableTable";
|
||||
import clsx from "clsx";
|
||||
import type {
|
||||
SettingsPageFragment$data,
|
||||
SettingsPageFragment$key,
|
||||
} from "./__generated__/SettingsPageFragment.graphql";
|
||||
import type { SettingsPageFragment$key } from "./__generated__/SettingsPageFragment.graphql";
|
||||
import type {
|
||||
SettingsPageMembershipsFragment$data,
|
||||
SettingsPageMembershipsFragment$key
|
||||
@@ -98,16 +95,6 @@ const organizationFragment = graphql`
|
||||
}
|
||||
createdAt
|
||||
updatedAt
|
||||
connectors(first: 100) {
|
||||
edges {
|
||||
node {
|
||||
id
|
||||
name
|
||||
type
|
||||
createdAt
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -702,17 +689,6 @@ export default function SettingsPage({ queryRef }: Props) {
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
{/* Integrations */}
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-base font-medium">{__("Integrations")}</h2>
|
||||
<Card padded>
|
||||
<Connectors
|
||||
organizationId={organization.id}
|
||||
connectors={organization.connectors.edges.map((edge) => edge.node)}
|
||||
/>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-base font-medium">{__("Custom Domain")}</h2>
|
||||
<CustomDomainManager
|
||||
@@ -752,80 +728,6 @@ export default function SettingsPage({ queryRef }: Props) {
|
||||
);
|
||||
}
|
||||
|
||||
function Connectors(props: {
|
||||
organizationId: string;
|
||||
connectors: NodeOf<SettingsPageFragment$data["connectors"]>[];
|
||||
}) {
|
||||
const { __, dateTimeFormat } = useTranslate();
|
||||
const fakeconnectors = [
|
||||
{
|
||||
id: "github",
|
||||
name: "GitHub",
|
||||
type: "oauth2",
|
||||
createdAt: new Date(),
|
||||
},
|
||||
] satisfies typeof props.connectors;
|
||||
const connectors = [
|
||||
{
|
||||
id: "github",
|
||||
name: "GitHub",
|
||||
type: "oauth2",
|
||||
description: __("Connect to GitHub repositories and issues"),
|
||||
...fakeconnectors.find((connector) => connector.id === "github"),
|
||||
},
|
||||
{
|
||||
id: "slack",
|
||||
name: "Slack",
|
||||
type: "oauth2",
|
||||
description: __("Connect to Slack workspace and channels"),
|
||||
...fakeconnectors.find((connector) => connector.id === "slack"),
|
||||
},
|
||||
];
|
||||
|
||||
const getUrl = (connectorId: string) => {
|
||||
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", props.organizationId);
|
||||
url.searchParams.append("connector_id", connectorId);
|
||||
url.searchParams.append("continue", window.location.href);
|
||||
return url.toString();
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-2">
|
||||
{connectors.map((connector) => (
|
||||
<Card key={connector.id} padded className="flex items-center gap-3">
|
||||
<div>
|
||||
<img src={`/${connector.id}.png`} alt="" />
|
||||
</div>
|
||||
<div className="mr-auto">
|
||||
<h3 className="text-base font-semibold">{connector.name}</h3>
|
||||
<p className="text-sm text-txt-tertiary">
|
||||
{connector.createdAt
|
||||
? sprintf(
|
||||
__("Connected on %s"),
|
||||
dateTimeFormat(connector.createdAt)
|
||||
)
|
||||
: connector.description}
|
||||
</p>
|
||||
</div>
|
||||
{connector.createdAt ? (
|
||||
<div>
|
||||
<Badge variant="success" size="md">
|
||||
{__("Connected")}
|
||||
</Badge>
|
||||
</div>
|
||||
) : (
|
||||
<Button variant="secondary" asChild>
|
||||
<a href={getUrl(connector.id)}>{__("Connect")}</a>
|
||||
</Button>
|
||||
)}
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const removeMemberMutation = graphql`
|
||||
mutation SettingsPage_RemoveMemberMutation(
|
||||
$input: RemoveMemberInput!
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* @generated SignedSource<<8477f42a02a102a4ce8540b794ac4289>>
|
||||
* @generated SignedSource<<cf0ce3993d747999dfbe2ca60b509023>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
@@ -12,16 +12,6 @@ import { ReaderFragment } from 'relay-runtime';
|
||||
export type SSLStatus = "ACTIVE" | "EXPIRED" | "FAILED" | "PENDING" | "PROVISIONING" | "RENEWING";
|
||||
import { FragmentRefs } from "relay-runtime";
|
||||
export type SettingsPageFragment$data = {
|
||||
readonly connectors: {
|
||||
readonly edges: ReadonlyArray<{
|
||||
readonly node: {
|
||||
readonly createdAt: any;
|
||||
readonly id: string;
|
||||
readonly name: string;
|
||||
readonly type: string;
|
||||
};
|
||||
}>;
|
||||
};
|
||||
readonly createdAt: any;
|
||||
readonly customDomain: {
|
||||
readonly createdAt: any;
|
||||
@@ -70,20 +60,13 @@ v1 = {
|
||||
"storageKey": null
|
||||
},
|
||||
v2 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "type",
|
||||
"storageKey": null
|
||||
},
|
||||
v3 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "createdAt",
|
||||
"storageKey": null
|
||||
},
|
||||
v4 = {
|
||||
v3 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
@@ -171,7 +154,13 @@ return {
|
||||
"name": "dnsRecords",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "type",
|
||||
"storageKey": null
|
||||
},
|
||||
(v1/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
@@ -197,8 +186,8 @@ return {
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v2/*: any*/),
|
||||
(v3/*: any*/),
|
||||
(v4/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -209,57 +198,14 @@ return {
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
(v3/*: any*/),
|
||||
(v4/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": [
|
||||
{
|
||||
"kind": "Literal",
|
||||
"name": "first",
|
||||
"value": 100
|
||||
}
|
||||
],
|
||||
"concreteType": "ConnectorConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "connectors",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ConnectorEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Connector",
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v0/*: any*/),
|
||||
(v1/*: any*/),
|
||||
(v2/*: any*/),
|
||||
(v3/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": "connectors(first:100)"
|
||||
}
|
||||
(v2/*: any*/),
|
||||
(v3/*: any*/)
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "b3b152b507befd6b6918a12972e05f14";
|
||||
(node as any).hash = "1e64bcccf8ef3a8ead79b3446e8a3ccd";
|
||||
|
||||
export default node;
|
||||
|
||||
@@ -20,6 +20,7 @@ import { useState } from "react";
|
||||
import { useOrganizationId } from "/hooks/useOrganizationId";
|
||||
import { Outlet, useLocation, Link } from "react-router";
|
||||
import { TrustCenterReferencesSection } from "/components/trustCenter/TrustCenterReferencesSection";
|
||||
import { SlackConnections } from "../../../components/organizations/SlackConnection";
|
||||
|
||||
type Props = {
|
||||
queryRef: PreloadedQuery<TrustCenterGraphQuery>;
|
||||
@@ -257,6 +258,16 @@ export default function TrustCenterPage({ queryRef }: Props) {
|
||||
<TrustCenterReferencesSection trustCenterId={organization.trustCenter.id} />
|
||||
)}
|
||||
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-base font-medium">{__("Integrations")}</h2>
|
||||
<Card padded>
|
||||
<SlackConnections
|
||||
organizationId={organization.id!}
|
||||
slackConnections={organization.slackConnections?.edges.map((edge) => edge.node) ?? []}
|
||||
/>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<Tabs>
|
||||
<TabItem
|
||||
|
||||
Reference in New Issue
Block a user