From 87dcd002641d9896c6e55f4e6f9d85cfc9e0f777 Mon Sep 17 00:00:00 2001
From: Eduard Gert <kontakt@eduardgert.de>
Date: Fri, 15 Mar 2024 13:34:47 +0100
Subject: [PATCH] Fix peer groups occasionally not refreshing  (#351)

* Trigger groups refresh when visiting peers page

* Disable exhaustive-deps linter

---------

Co-authored-by: Maycon Santos <mlsmaycon@gmail.com>
---
 src/app/(dashboard)/peers/page.tsx | 9 ++++++++-
 src/contexts/GroupsProvider.tsx    | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/app/(dashboard)/peers/page.tsx b/src/app/(dashboard)/peers/page.tsx
index 8a7049c..e31164d 100644
--- a/src/app/(dashboard)/peers/page.tsx
+++ b/src/app/(dashboard)/peers/page.tsx
@@ -6,8 +6,9 @@ import Paragraph from "@components/Paragraph";
 import SkeletonTable from "@components/skeletons/SkeletonTable";
 import useFetchApi from "@utils/api";
 import { ExternalLinkIcon } from "lucide-react";
-import React, { lazy, Suspense } from "react";
+import React, { lazy, Suspense, useEffect } from "react";
 import PeerIcon from "@/assets/icons/PeerIcon";
+import { useGroups } from "@/contexts/GroupsProvider";
 import { useLoggedInUser, useUsers } from "@/contexts/UsersProvider";
 import { Peer } from "@/interfaces/Peer";
 import PageContainer from "@/layouts/PageContainer";
@@ -28,6 +29,12 @@ export default function Peers() {
 function PeersView() {
   const { data: peers, isLoading } = useFetchApi<Peer[]>("/peers");
   const { users } = useUsers();
+  const { refresh } = useGroups();
+
+  useEffect(() => {
+    refresh();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
 
   const peersWithUser = peers?.map((peer) => {
     if (!users) return peer;
diff --git a/src/contexts/GroupsProvider.tsx b/src/contexts/GroupsProvider.tsx
index ac0f4e8..497ae1e 100644
--- a/src/contexts/GroupsProvider.tsx
+++ b/src/contexts/GroupsProvider.tsx
@@ -34,7 +34,7 @@ export function GroupsProviderContent({ children }: Props) {
   const [dropdownOptions, setDropdownOptions] = useState<Group[]>([]);
 
   const refresh = () => {
-    mutate().then();
+    if (groups && !isLoading) mutate().then();
   };
 
   return (