hypothes.is authentication is fully functional, no longer need to manually input username/api key

5 files changed, 29 insertions, 23 deletions

diff --git a/src/client/apis/HypothesisAuthenticationManager.tsx b/src/client/apis/HypothesisAuthenticationManager.tsx
index b299f233e..f995dee3b 100644
--- a/src/client/apis/HypothesisAuthenticationManager.tsx
+++ b/src/client/apis/HypothesisAuthenticationManager.tsx
@@ -19,7 +19,7 @@ export default class HypothesisAuthenticationManager extends React.Component<{}>
     @observable private showPasteTargetState = false;
     @observable private success: Opt<boolean> = undefined;
     @observable private displayLauncher = true;
-    @observable private credentials: string;
+    @observable private credentials: { username: string, apiKey: string } | undefined;
     private disposer: Opt<IReactionDisposer>;
 
     private set isOpen(value: boolean) {
@@ -35,9 +35,10 @@ export default class HypothesisAuthenticationManager extends React.Component<{}>
     }
 
     public fetchAccessToken = async (displayIfFound = false) => {
-        let response: any = await Networking.FetchFromServer("/readHypothesisAccessToken");
+        const jsonResponse = await Networking.FetchFromServer("/readHypothesisAccessToken");
+        const response = jsonResponse !== "" ? JSON.parse(jsonResponse) : undefined;
         // if this is an authentication url, activate the UI to register the new access token
-        if (!response) { // new RegExp(AuthenticationUrl).test(response)) {
+        if (!response) {
             this.isOpen = true;
             this.authenticationLink = response;
             return new Promise<string>(async resolve => {
@@ -48,10 +49,11 @@ export default class HypothesisAuthenticationManager extends React.Component<{}>
                         const userProfile = authenticationCode && await Hypothesis.fetchUser(authenticationCode);
                         if (userProfile && userProfile.userid !== null) {
                             this.disposer?.();
-                            Networking.PostToServer("/writeHypothesisAccessToken", { authenticationCode });
+                            const hypothesisUsername = Hypothesis.extractUsername(userProfile.userid); // extract username from profile
+                            Networking.PostToServer("/writeHypothesisAccessToken", { authenticationCode, hypothesisUsername });
                             runInAction(() => {
                                 this.success = true;
-                                this.credentials = Hypothesis.extractUsername(userProfile.userid); // extract username from profile
+                                this.credentials = response;
                             });
                             this.resetState();
                             resolve(authenticationCode);
@@ -69,7 +71,7 @@ export default class HypothesisAuthenticationManager extends React.Component<{}>
             this.resetState(-1, -1);
             this.isOpen = true;
         }
-        return response.access_token;
+        return response;
     }
 
     resetState = action((visibleForMS: number = 3000, fadesOutInMS: number = 500) => {
@@ -78,7 +80,7 @@ export default class HypothesisAuthenticationManager extends React.Component<{}>
                 this.isOpen = false;
                 this.success = undefined;
                 this.displayLauncher = true;
-                this.credentials = "";
+                this.credentials = undefined;
                 this.shouldShowPasteTarget = false;
                 this.authenticationCode = undefined;
             });
@@ -93,7 +95,7 @@ export default class HypothesisAuthenticationManager extends React.Component<{}>
                 setTimeout(action(() => {
                     this.success = undefined;
                     this.displayLauncher = true;
-                    this.credentials = "";
+                    this.credentials = undefined;
                 }), fadesOutInMS);
             }), visibleForMS);
         }
@@ -124,7 +126,7 @@ export default class HypothesisAuthenticationManager extends React.Component<{}>
                     <>
                         <span
                             className={'welcome'}
-                        >Welcome to Dash, {this.credentials}
+                        >Welcome to Dash, {this.credentials.username}
                         </span>
                         <div
                             className={'disconnect'}
diff --git a/src/client/apis/hypothesis/HypothesisApiUtils.ts b/src/client/apis/hypothesis/HypothesisApiUtils.ts
index 9ba481c8c..83881cd89 100644
--- a/src/client/apis/hypothesis/HypothesisApiUtils.ts
+++ b/src/client/apis/hypothesis/HypothesisApiUtils.ts
@@ -1,6 +1,10 @@
 import { StrCast } from "../../../fields/Types";
+import HypothesisAuthenticationManager from "../HypothesisAuthenticationManager";
 
 export namespace Hypothesis {
+
+    const getCredentials = async () => HypothesisAuthenticationManager.Instance.fetchAccessToken();
+
     export const fetchAnnotation = async (annotationId: string) => {
         const response = await fetch(`https://api.hypothes.is/api/annotations/${annotationId}`);
         if (response.ok) {
@@ -11,12 +15,12 @@ export namespace Hypothesis {
     };
 
     /**
-     * Searches for annotations made by @param username that 
-     * contain @param searchKeyWord 
+     * Searches for annotations authored by the current user that contain @param searchKeyWord 
      */
-    export const searchAnnotation = async (username: string, searchKeyWord: string) => {
+    export const searchAnnotation = async (searchKeyWord: string) => {
+        const credentials = await getCredentials();
         const base = 'https://api.hypothes.is/api/search';
-        const request = base + `?user=acct:${username}@hypothes.is&text=${searchKeyWord}`;
+        const request = base + `?user=acct:${credentials.username}@hypothes.is&text=${searchKeyWord}`;
         console.log("DASH Querying " + request);
         const response = await fetch(request);
         if (response.ok) {
@@ -40,8 +44,8 @@ export namespace Hypothesis {
     };
 
     // Find the most recent placeholder annotation created, and return its ID
-    export const getPlaceholderId = async (username: string, searchKeyWord: string) => {
-        const getResponse = await Hypothesis.searchAnnotation(username, searchKeyWord);
+    export const getPlaceholderId = async (searchKeyWord: string) => {
+        const getResponse = await Hypothesis.searchAnnotation(searchKeyWord);
         const id = getResponse.rows.length > 0 ? getResponse.rows[0].id : undefined;
         const uri = getResponse.rows.length > 0 ? getResponse.rows[0].uri : undefined;
         return id ? { id, uri } : undefined;
@@ -49,8 +53,7 @@ export namespace Hypothesis {
 
     // Send request to Hypothes.is client to modify a placeholder annotation into a hyperlink to Dash
     export const dispatchLinkRequest = async (title: string, url: string, annotationId: string) => {
-        const apiKey = "6879-DnMTKjWjnnLPa0Php7f5Ra2kunZ_X0tMRDbTF220_q0";
-
+        const credentials = await getCredentials();
         const oldAnnotation = await fetchAnnotation(annotationId);
         const oldText = StrCast(oldAnnotation.text);
         const newHyperlink = `[${title}\n](${url})`;
@@ -58,7 +61,7 @@ export namespace Hypothesis {
 
         console.log("DASH dispatching linkRequest");
         document.dispatchEvent(new CustomEvent<{ newText: string, id: string, apiKey: string }>("linkRequest", {
-            detail: { newText: newText, id: annotationId, apiKey: apiKey },
+            detail: { newText: newText, id: annotationId, apiKey: credentials.apiKey },
             bubbles: true
         }));
     };
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index 535711193..ab97e8531 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -41,7 +41,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         window.addEventListener("message", async (e: any) => {
             if (e.origin === "http://localhost:1050" && e.data.message === "annotation created") {
                 console.log("DASH RECEIVED MESSAGE:", e.data.message);
-                const response = await Hypothesis.getPlaceholderId("melissaz", "placeholder"); // delete once eventListening between client & Dash works
+                const response = await Hypothesis.getPlaceholderId("placeholder"); // delete once eventListening between client & Dash works
                 const source = SelectionManager.SelectedDocuments()[0];
                 response && runInAction(() => {
                     DocumentLinksButton.AnnotationId = response.id;
diff --git a/src/server/ApiManagers/HypothesisManager.ts b/src/server/ApiManagers/HypothesisManager.ts
index 73c707a55..370d02a49 100644
--- a/src/server/ApiManagers/HypothesisManager.ts
+++ b/src/server/ApiManagers/HypothesisManager.ts
@@ -14,7 +14,7 @@ export default class HypothesisManager extends ApiManager {
             subscription: "/readHypothesisAccessToken",
             secureHandler: async ({ user, res }) => {
                 const credentials = await Database.Auxiliary.HypothesisAccessToken.Fetch(user.id);
-                res.send(credentials?.hypothesisApiKey ?? "");
+                res.send(credentials ? { username: credentials.hypothesisUsername, apiKey: credentials.hypothesisApiKey } : "");
             }
         });
 
@@ -22,7 +22,7 @@ export default class HypothesisManager extends ApiManager {
             method: Method.POST,
             subscription: "/writeHypothesisAccessToken",
             secureHandler: async ({ user, req, res }) => {
-                await Database.Auxiliary.HypothesisAccessToken.Write(user.id, req.body.authenticationCode);
+                await Database.Auxiliary.HypothesisAccessToken.Write(user.id, req.body.authenticationCode, req.body.hypothesisUsername);
                 res.send();
             }
         });
diff --git a/src/server/database.ts b/src/server/database.ts
index 767d38350..456c1c254 100644
--- a/src/server/database.ts
+++ b/src/server/database.ts
@@ -413,6 +413,7 @@ export namespace Database {
             interface StoredCredentials {
                 userId: string;
                 hypothesisApiKey: string;
+                hypothesisUsername: string;
                 _id?: string;
             }
 
@@ -420,8 +421,8 @@ export namespace Database {
              * Writes the @param hypothesisApiKey to the database, associated
              * with @param userId for later retrieval and updating. 
              */
-            export const Write = async (userId: string, hypothesisApiKey: string) => {
-                return Instance.insert({ userId, hypothesisApiKey }, AuxiliaryCollections.HypothesisAccess);
+            export const Write = async (userId: string, hypothesisApiKey: string, hypothesisUsername: string) => {
+                return Instance.insert({ userId, hypothesisApiKey, hypothesisUsername }, AuxiliaryCollections.HypothesisAccess);
             };
 
             /**