Support authentication

src/core/client/stream/index.tsx

@@ -18,7 +18,7 @@ const pymFeatures = [withSetCommentID];
 
 // This is called when the context is first initialized.
 async function init(context: TalkContext) {
-  await initLocalState(context.relayEnvironment);
+  await initLocalState(context.relayEnvironment, context);
   pymFeatures.forEach(f => f(context));
 }
 

src/core/client/stream/local/__snapshots__/initLocalState.spec.ts.snap

@@ -12,6 +12,7 @@ exports[`init local state 1`] = `
   \\"client:root.local\\": {
     \\"__id\\": \\"client:root.local\\",
     \\"__typename\\": \\"Local\\",
+    \\"authToken\\": \\"\\",
     \\"network\\": {
       \\"__ref\\": \\"client:root.local.network\\"
     },

src/core/client/stream/local/initLocalState.spec.ts

@@ -2,6 +2,7 @@ import { Environment, RecordSource } from "relay-runtime";
 
 import { timeout } from "talk-common/utils";
 import { LOCAL_ID } from "talk-framework/lib/relay";
+import { createInMemoryStorage } from "talk-framework/lib/storage";
 import { createRelayEnvironment } from "talk-framework/testHelpers";
 
 import initLocalState from "./initLocalState";
@@ -18,7 +19,7 @@ beforeEach(() => {
 });
 
 it("init local state", async () => {
-  initLocalState(environment);
+  initLocalState(environment, { localStorage: createInMemoryStorage() } as any);
   await timeout();
   expect(JSON.stringify(source.toJSON(), null, 2)).toMatchSnapshot();
 });
@@ -32,7 +33,7 @@ it("set assetID from query", () => {
     document.title,
     `http://localhost/?assetID=${assetID}`
   );
-  initLocalState(environment);
+  initLocalState(environment, { localStorage: createInMemoryStorage() } as any);
   expect(source.get(LOCAL_ID)!.assetID).toBe(assetID);
   window.history.replaceState(previousState, document.title, previousLocation);
 });
@@ -46,7 +47,16 @@ it("set commentID from query", () => {
     document.title,
     `http://localhost/?commentID=${commentID}`
   );
-  initLocalState(environment);
+  initLocalState(environment, { localStorage: createInMemoryStorage() } as any);
   expect(source.get(LOCAL_ID)!.commentID).toBe(commentID);
   window.history.replaceState(previousState, document.title, previousLocation);
 });
+
+it("set authToken from localStorage", () => {
+  const authToken = "auth-token";
+  const localStorage = createInMemoryStorage();
+  localStorage.setItem("authToken", authToken);
+  initLocalState(environment, { localStorage } as any);
+  expect(source.get(LOCAL_ID)!.authToken).toBe(authToken);
+  localStorage.removeItem("authToken");
+});

src/core/client/stream/local/initLocalState.ts

@@ -1,6 +1,7 @@
 import qs from "query-string";
 import { commitLocalUpdate, Environment } from "relay-runtime";
 
+import { TalkContext } from "talk-framework/lib/bootstrap";
 import {
   createAndRetain,
   LOCAL_ID,
@@ -17,7 +18,10 @@ import {
 /**
  * Initializes the local state, before we start the App.
  */
-export default async function initLocalState(environment: Environment) {
+export default async function initLocalState(
+  environment: Environment,
+  { localStorage }: TalkContext
+) {
   commitLocalUpdate(environment, s => {
     const root = s.getRoot();
 
@@ -25,6 +29,9 @@ export default async function initLocalState(environment: Environment) {
     const localRecord = createAndRetain(environment, s, LOCAL_ID, LOCAL_TYPE);
     root.setLinkedRecord(localRecord, "local");
 
+    // Set auth token
+    localRecord.setValue(localStorage.getItem("authToken") || "", "authToken");
+
     // Parse query params
     const query = qs.parse(location.search);
 

src/core/client/stream/local/local.graphql

@@ -21,6 +21,7 @@ type Local {
   assetURL: String
   commentID: String
   authPopup: AuthPopup!
+  authToken: String
 }
 
 extend type Query {