Fix: Add remoteAuthS3 type to DiscussionEmbedConfig Interface

README.md

@@ -43,7 +43,9 @@ This component is limited to one instance in the DOM at a time and will handle u
 
 ### DiscussionEmbed with SSO
 
-This is an example for setting up the DiscussionEmbed component with SSO.  This example config is also used on the Disqus React SSO example found here: https://disqus-sso-react-demo.glitch.me/.
+This is an example for setting up the DiscussionEmbed component with SSO.  Access to SSO is currently available as an add-on for users with a Business level subscription.  This example config is also used on the [Disqus React SSO example](https://disqus-sso-react-demo.glitch.me/), and more information about SSO can be found in [our SSO documentation](https://help.disqus.com/customer/en/articles/1717160-integrating-single-sign-on).
+
+Note: The `config.sso` object is not required for publishers integrating SSO only because `config.sso` is only used when the SSO login is present alongside the Disqus login.
 
 ```js
 import { DiscussionEmbed } from 'disqus-react';
@@ -55,8 +57,9 @@ import { DiscussionEmbed } from 'disqus-react';
             url: this.props.article.url,
             identifier: this.props.article.id,
             title: this.props.article.title,
-            language: 'zh_TW', //e.g. for Traditional Chinese (Taiwan)
-            apiKey: '',
+            language: 'zh_TW',
+            remoteAuthS3: '', // Generated by your server (see https://help.disqus.com/customer/en/articles/1717160-integrating-single-sign-on for more details)
+            apiKey: '', // Your Disqus API key that can be generated or referenced at https://disqus.com/api/applications/
             sso: {
                 name: 'SampleNews',
                 button: 'http://example.com/images/samplenews.gif',

tests/DiscussionEmbed.js

@@ -17,7 +17,13 @@ const DISQUS_CONFIG = {
     identifier: 'tester',
 };
 
-// This is the SSO config that is used on the Disqus SSO example found here: https://disqus-sso-demo.glitch.me/
+const DISQUS_CONFIG_WITH_SSO_AUTH = {
+    ...DISQUS_CONFIG,
+    remoteAuthS3: 'remoteAuthS3String',
+    apiKey: 'apiKeyString',
+};
+
+// This config is only used when the SSO login is present alongside the Disqus login.
 const SSO_CONFIG = {
     name: 'SampleNews',
     button: 'http://example.com/images/samplenews.gif',
@@ -52,8 +58,7 @@ test('Creates window.disqus_config', () => {
 });
 
 test('Creates window.disqus_config when passed an SSO config', () => {
-    const TEST_CONFIG = DISQUS_CONFIG;
-    TEST_CONFIG.sso = SSO_CONFIG;
+    const TEST_CONFIG = { ...DISQUS_CONFIG, sso: SSO_CONFIG };
     render(<Component config={TEST_CONFIG} />);
     expect(global.window.disqus_config).toBeTruthy();
 });
@@ -67,9 +72,16 @@ test('Inserts the script correctly', () => {
     expect(scriptQuery[0].src).toEqual('https://testing.disqus.com/embed.js');
 });
 
-test('Inserts the script correctly when passed an SSO config', () => {
-    const TEST_CONFIG = DISQUS_CONFIG;
-    TEST_CONFIG.sso = SSO_CONFIG;
+test('Inserts the script correctly when passed a remoteAuthS3 string and API Key with an SSO config', () => {
+    const TEST_CONFIG = { ...DISQUS_CONFIG_WITH_SSO_AUTH, sso: SSO_CONFIG };
+    const { baseElement } = render(<Component config={TEST_CONFIG}/>);
+    const scriptQuery = baseElement.querySelectorAll(`#${EMBED_SCRIPT_ID}`);
+    expect(scriptQuery.length).toEqual(1);
+    expect(scriptQuery[0].src).toEqual('https://testing.disqus.com/embed.js');
+});
+
+test('Inserts the script correctly when passed a remoteAuthS3 string and API Key without an SSO config', () => {
+    const TEST_CONFIG = DISQUS_CONFIG_WITH_SSO_AUTH;
     const { baseElement } = render(<Component config={TEST_CONFIG}/>);
     const scriptQuery = baseElement.querySelectorAll(`#${EMBED_SCRIPT_ID}`);
     expect(scriptQuery.length).toEqual(1);

types/index.d.ts

@@ -9,6 +9,7 @@ interface DisqusConfig {
 interface DiscussionEmbedConfig extends DisqusConfig {
   categoryID?: string;
   language?: string;
+  remoteAuthS3?: string;
   apiKey?: string;
   sso?: {
     name?: string;