Added AuthCompletedContext to DataSync

Author: mpscholten

lib/IHP/DataSync/react.js

@@ -1,23 +1,33 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useContext } from 'react';
 import { DataSubscription } from './ihp-datasync.js';
 
+// Most IHP apps never use this context because they use session cookies for auth.
+// Therefore the default value is true.
+export const AuthCompletedContext = React.createContext(true);
+
 /**
  * Returns the result of the current query in real-time. Returns `null` while the data is still being fetched from the server.
  * @example
  * const messages = useQuery(query('messages').orderBy('createdAt'));
  */
 export function useQuery(queryBuilder) {
     const [records, setRecords] = useState(null);
+    const isAuthCompleted = useContext(AuthCompletedContext);
 
     useEffect(() => {
+        if (!isAuthCompleted) {
+            return;
+        }
+
         const dataSubscription = new DataSubscription(queryBuilder.query);
         dataSubscription.createOnServer();
 
         // The dataSubscription is automatically closed when the last subscriber on
         // the DataSubscription object has been unsubscribed
         return dataSubscription.subscribe(setRecords);
     }, [
-        JSON.stringify(queryBuilder.query) /* <-- It's terrible - but it works, we should find a better for this */
+        JSON.stringify(queryBuilder.query) /* <-- It's terrible - but it works, we should find a better for this */,
+        isAuthCompleted
     ])
 
     return records;