Merge pull request #39 from velt-js/master-sample-app-all-demos-fix

Sign Out User Fix

Author: yoen-velt

apps/react/comments/dashboard/custom/dashboard-demo/components/velt/VeltCollaboration.tsx

@@ -2,13 +2,22 @@
 import { useVeltClient, VeltComments } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   // [Velt] Get Velt client instance
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {

apps/react/comments/dashboard/inline-comments/dashboard-inline-comments-demo/components/velt/VeltCollaboration.tsx

@@ -2,13 +2,22 @@
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   // [Velt] Get Velt client instance
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {

apps/react/comments/dashboard/self-hosting/dashboard-mongo-db-demo/components/velt/VeltCollaboration.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
 import { useSelectedJob } from "@/app/document/JobsContext";
@@ -10,9 +10,18 @@ export function VeltCollaboration() {
     const { isUserLoggedIn } = useAppUser();
     // [Velt] Get Velt client instance
     const { client } = useVeltClient();
+    const hasSignedOutOnMount = useRef(false);
 
     const selectedJob = useSelectedJob();
 
+    // [Velt] Sign out any previous user on mount to clear stale state
+    useEffect(() => {
+        if (!hasSignedOutOnMount.current && client) {
+            hasSignedOutOnMount.current = true;
+            client.signOutUser();
+        }
+    }, [client]);
+
     // [Velt] Sign out user when user logs out, getting user login state from host app
     useEffect(() => {
         if (isUserLoggedIn === false && client) {

apps/react/comments/dashboard/self-hosting/dashboard-postgres-demo/components/velt/VeltCollaboration.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
 import { useSelectedJob } from "@/app/document/JobsContext";
@@ -10,9 +10,18 @@ export function VeltCollaboration() {
     const { isUserLoggedIn } = useAppUser();
     // [Velt] Get Velt client instance
     const { client } = useVeltClient();
+    const hasSignedOutOnMount = useRef(false);
 
     const selectedJob = useSelectedJob();
 
+    // [Velt] Sign out any previous user on mount to clear stale state
+    useEffect(() => {
+        if (!hasSignedOutOnMount.current && client) {
+            hasSignedOutOnMount.current = true;
+            client.signOutUser();
+        }
+    }, [client]);
+
     // [Velt] Sign out user when user logs out, getting user login state from host app
     useEffect(() => {
         if (isUserLoggedIn === false && client) {

apps/react/comments/tables/ag-grid/comment-aggregation/components/velt/VeltCollaboration.tsx

@@ -2,13 +2,22 @@
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   // [Velt] Get Velt client instance
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {

apps/react/comments/tables/ag-grid/multiple-tools/components/velt/VeltCollaboration.tsx

@@ -2,12 +2,21 @@
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {

apps/react/comments/tables/ag-grid/single-tool/components/velt/VeltCollaboration.tsx

@@ -2,12 +2,21 @@
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {

apps/react/comments/tables/tanstack/comment-aggregation/components/velt/VeltCollaboration.tsx

@@ -2,13 +2,22 @@
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   // [Velt] Get Velt client instance
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {

apps/react/comments/tables/tanstack/multiple-tools/components/velt/VeltCollaboration.tsx

@@ -2,13 +2,22 @@
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   // [Velt] Get Velt client instance
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {

apps/react/comments/tables/tanstack/single-tool/components/velt/VeltCollaboration.tsx

@@ -2,12 +2,21 @@
 import { useVeltClient, VeltComments, VeltCommentsSidebar } from "@veltdev/react";
 import VeltInitializeDocument from "./VeltInitializeDocument";
 import { VeltCustomization } from "./ui-customization/VeltCustomization";
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { useAppUser } from "@/app/userAuth/AppUserContext";
 
 export function VeltCollaboration() {
   const { isUserLoggedIn } = useAppUser();
   const { client } = useVeltClient();
+  const hasSignedOutOnMount = useRef(false);
+
+  // [Velt] Sign out any previous user on mount to clear stale state
+  useEffect(() => {
+    if (!hasSignedOutOnMount.current && client) {
+      hasSignedOutOnMount.current = true;
+      client.signOutUser();
+    }
+  }, [client]);
 
   // [Velt] Sign out user when user logs out, getting user login state from host app
   useEffect(() => {