wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-10 00:18:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

[CORL-965] Experimental Notice on Webhooks (#2880)

Browse Source 
* fix: added experimental callout message to webhooks

* fix: copy/design review
This commit is contained in:
Wyatt Johnson
2020-03-12 17:03:27 +00:00
committed by GitHub
parent 2057b750f3
commit 2b2ff7b9c4
8 changed files with 216 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/admin/components/ExperimentalCallOut.css
+10
View File
@@ -0,0 +1,10 @@
.icon {
margin-right: var(--spacing-1);
}
.title {
font-weight: bold;
display: block;
margin-bottom: 5px;
}
src/core/client/admin/components/ExperimentalCallOut.tsx
+22
View File
@@ -0,0 +1,22 @@
import { Localized } from "@fluent/react/compat";
import React, { FunctionComponent } from "react";
import { CallOut, Flex, Icon } from "coral-ui/components/v2";
import styles from "./ExperimentalCallOut.css";
const ExperimentalCallOut: FunctionComponent = ({ children }) => (
<CallOut color="primary" fullWidth>
<Flex>
<Icon size="md" className={styles.icon}>
new_releases
</Icon>
<Localized id="configure-experimentalFeature">
<span className={styles.title}>Experimental Feature</span>
</Localized>
</Flex>
<span>{children}</span>
</CallOut>
);
export default ExperimentalCallOut;
src/core/client/admin/routes/Configure/sections/WebhookEndpoints/AddWebhookEndpoint/AddWebhookEndpointContainer.tsx
+2
View File
@@ -11,6 +11,7 @@ import { HorizontalGutter } from "coral-ui/components/v2";
import { AddWebhookEndpointContainer_settings } from "coral-admin/__generated__/AddWebhookEndpointContainer_settings.graphql";
import { ConfigureWebhookEndpointForm } from "../ConfigureWebhookEndpointForm";
import ExperimentalWebhooksCallOut from "../ExperimentalWebhooksCallOut";
interface Props {
router: Router;
@@ -28,6 +29,7 @@ const AddWebhookEndpointContainer: FunctionComponent<Props> = ({
return (
<HorizontalGutter size="double">
<ExperimentalWebhooksCallOut />
<ConfigBox
title={
<Localized id="configure-webhooks-addEndpoint">
src/core/client/admin/routes/Configure/sections/WebhookEndpoints/ConfigureWebhookEndpoint/ConfigureWebhookEndpointContainer.tsx
+2
View File
@@ -9,6 +9,7 @@ import { HorizontalGutter } from "coral-ui/components/v2";
import { ConfigureWebhookEndpointContainer_settings } from "coral-admin/__generated__/ConfigureWebhookEndpointContainer_settings.graphql";
import { ConfigureWebhookEndpointContainer_webhookEndpoint } from "coral-admin/__generated__/ConfigureWebhookEndpointContainer_webhookEndpoint.graphql";
import ExperimentalWebhooksCallOut from "../ExperimentalWebhooksCallOut";
import EndpointDangerZone from "./EndpointDangerZone";
import EndpointDetails from "./EndpointDetails";
import EndpointStatus from "./EndpointStatus";
@@ -24,6 +25,7 @@ const ConfigureWebhookEndpointContainer: FunctionComponent<Props> = ({
}) => {
return (
<HorizontalGutter size="double" data-testid="webhook-endpoint-container">
<ExperimentalWebhooksCallOut />
<ConfigBox
title={
<Localized id="configure-webhooks-configureWebhookEndpoint">
src/core/client/admin/routes/Configure/sections/WebhookEndpoints/ExperimentalWebhooksCallOut.tsx
+23
View File
@@ -0,0 +1,23 @@
import { Localized } from "@fluent/react/compat";
import React, { FunctionComponent } from "react";
import ExperimentalCallOut from "coral-admin/components/ExperimentalCallOut";
import { ExternalLink } from "coral-framework/lib/i18n/components";
const ExperimentalWebhooksCallOut: FunctionComponent = () => (
<Localized
id="configure-webhooks-experimentalFeature"
ContactUsLink={<ExternalLink href="https://coralproject.net/contact/" />}
>
<ExperimentalCallOut>
The webhook feature is currently in active development. Events may be
added or removed. Please{" "}
<ExternalLink href="https://coralproject.net/contact/">
contact us with any feedback or requests
</ExternalLink>
.
</ExperimentalCallOut>
</Localized>
);
export default ExperimentalWebhooksCallOut;
src/core/client/admin/routes/Configure/sections/WebhookEndpoints/WebhookEndpointsConfigContainer.tsx
+4 -2
View File
@@ -22,6 +22,7 @@ import { WebhookEndpointsConfigContainer_settings } from "coral-admin/__generate
import ConfigBox from "../../ConfigBox";
import Header from "../../Header";
import Subheader from "../../Subheader";
import ExperimentalWebhooksCallOut from "./ExperimentalWebhooksCallOut";
import WebhookEndpointRow from "./WebhookEndpointRow";
interface Props {
@@ -33,6 +34,7 @@ const WebhookEndpointsConfigContainer: FunctionComponent<Props> = ({
}) => {
return (
<HorizontalGutter size="double" data-testid="webhooks-container">
<ExperimentalWebhooksCallOut />
<ConfigBox
title={
<Localized id="configure-webhooks-header-title">
@@ -43,14 +45,14 @@ const WebhookEndpointsConfigContainer: FunctionComponent<Props> = ({
<Localized
id="configure-webhooks-description"
externalLink={
<ExternalLink href="https://docs.coralproject.net/coral/v5/integrating/webhooks/" />
<ExternalLink href="https://github.com/coralproject/talk/blob/master/WEBHOOKS.md" />
}
>
<FormFieldDescription>
Configure an endpoint to send events to when events occur within
Coral. These events will be JSON encoded and signed. To learn more
about webhook signing, visit our{" "}
<ExternalLink href="https://docs.coralproject.net/coral/v5/integrating/webhooks/">
<ExternalLink href="https://github.com/coralproject/talk/blob/master/WEBHOOKS.md">
our docs
</ExternalLink>
.
src/core/client/admin/test/configure/__snapshots__/webhooks.spec.tsx.snap
+148 -4
View File
@@ -5,6 +5,42 @@ exports[`displays a list of webhook endpoints that have been configured 1`] = `
className="Box-root HorizontalGutter-root HorizontalGutter-double"
data-testid="webhooks-container"
>
<div
className="CallOut-root CallOut-colorPrimary CallOut-fullWidth"
>
<div
className="CallOut-inner"
>
<div
className="Box-root Flex-root Flex-flex"
>
<i
aria-hidden="true"
className="Icon-root Icon-md ExperimentalCallOut-icon"
>
new_releases
</i>
<span
className="ExperimentalCallOut-title"
>
Experimental Feature
</span>
</div>
<span>
The webhook feature is currently in active development. Events may be
added or removed. Please
<a
className="ExternalLink-root"
href="https://coralproject.net/contact/"
rel="noopener noreferrer"
target="_blank"
>
contact us with any feedback or requests
</a>
.
</span>
</div>
</div>
<div
className="Box-root ConfigBox-root"
>
@@ -35,7 +71,7 @@ Coral. These events will be JSON encoded and signed. To learn more
about webhook signing, visit our
<a
className="ExternalLink-root"
href="https://docs.coralproject.net/coral/v5/integrating/webhooks/"
href="https://github.com/coralproject/talk/blob/master/WEBHOOKS.md"
rel="noopener noreferrer"
target="_blank"
>
@@ -206,6 +242,42 @@ exports[`goes to add new webhook endpoint when clicking add 1`] = `
className="Box-root HorizontalGutter-root HorizontalGutter-double"
data-testid="webhooks-container"
>
<div
className="CallOut-root CallOut-colorPrimary CallOut-fullWidth"
>
<div
className="CallOut-inner"
>
<div
className="Box-root Flex-root Flex-flex"
>
<i
aria-hidden="true"
className="Icon-root Icon-md ExperimentalCallOut-icon"
>
new_releases
</i>
<span
className="ExperimentalCallOut-title"
>
Experimental Feature
</span>
</div>
<span>
The webhook feature is currently in active development. Events may be
added or removed. Please
<a
className="ExternalLink-root"
href="https://coralproject.net/contact/"
rel="noopener noreferrer"
target="_blank"
>
contact us with any feedback or requests
</a>
.
</span>
</div>
</div>
<div
className="Box-root ConfigBox-root"
>
@@ -236,7 +308,7 @@ Coral. These events will be JSON encoded and signed. To learn more
about webhook signing, visit our
<a
className="ExternalLink-root"
href="https://docs.coralproject.net/coral/v5/integrating/webhooks/"
href="https://github.com/coralproject/talk/blob/master/WEBHOOKS.md"
rel="noopener noreferrer"
target="_blank"
>
@@ -291,6 +363,42 @@ exports[`goes to the webhook endpoint configuration page when selected 1`] = `
className="Box-root HorizontalGutter-root HorizontalGutter-double"
data-testid="webhooks-container"
>
<div
className="CallOut-root CallOut-colorPrimary CallOut-fullWidth"
>
<div
className="CallOut-inner"
>
<div
className="Box-root Flex-root Flex-flex"
>
<i
aria-hidden="true"
className="Icon-root Icon-md ExperimentalCallOut-icon"
>
new_releases
</i>
<span
className="ExperimentalCallOut-title"
>
Experimental Feature
</span>
</div>
<span>
The webhook feature is currently in active development. Events may be
added or removed. Please
<a
className="ExternalLink-root"
href="https://coralproject.net/contact/"
rel="noopener noreferrer"
target="_blank"
>
contact us with any feedback or requests
</a>
.
</span>
</div>
</div>
<div
className="Box-root ConfigBox-root"
>
@@ -321,7 +429,7 @@ Coral. These events will be JSON encoded and signed. To learn more
about webhook signing, visit our
<a
className="ExternalLink-root"
href="https://docs.coralproject.net/coral/v5/integrating/webhooks/"
href="https://github.com/coralproject/talk/blob/master/WEBHOOKS.md"
rel="noopener noreferrer"
target="_blank"
>
@@ -444,6 +552,42 @@ exports[`renders webhooks 1`] = `
className="Box-root HorizontalGutter-root HorizontalGutter-double"
data-testid="webhooks-container"
>
<div
className="CallOut-root CallOut-colorPrimary CallOut-fullWidth"
>
<div
className="CallOut-inner"
>
<div
className="Box-root Flex-root Flex-flex"
>
<i
aria-hidden="true"
className="Icon-root Icon-md ExperimentalCallOut-icon"
>
new_releases
</i>
<span
className="ExperimentalCallOut-title"
>
Experimental Feature
</span>
</div>
<span>
The webhook feature is currently in active development. Events may be
added or removed. Please
<a
className="ExternalLink-root"
href="https://coralproject.net/contact/"
rel="noopener noreferrer"
target="_blank"
>
contact us with any feedback or requests
</a>
.
</span>
</div>
</div>
<div
className="Box-root ConfigBox-root"
>
@@ -474,7 +618,7 @@ Coral. These events will be JSON encoded and signed. To learn more
about webhook signing, visit our
<a
className="ExternalLink-root"
href="https://docs.coralproject.net/coral/v5/integrating/webhooks/"
href="https://github.com/coralproject/talk/blob/master/WEBHOOKS.md"
rel="noopener noreferrer"
target="_blank"
>
src/locales/en-US/admin.ftl
+5
View File
@@ -136,6 +136,8 @@ linkAccount-useDifferentEmail = Use a different email address
## Configure
configure-experimentalFeature = Experimental Feature
configure-unsavedInputWarning =
You have unsaved changes. Are you sure you want to continue?
@@ -157,6 +159,9 @@ configure-radioButton-allow = Allow
configure-radioButton-dontAllow = Don't allow
### Webhooks
configure-webhooks-experimentalFeature =
The webhook feature is currently in active development. Events may be
added or removed. Please <ContactUsLink>contact us with any feedback or requests</ContactUsLink>.
configure-webhooks-webhookEndpointNotFound = Webhook endpoint not found
configure-webhooks-header-title = Configure webhook endpoint
configure-webhooks-description =