fix conflix

Author: clement4444

frontend/src/components/Groups/Groups.tsx frontend/src/components/groups/Groups.tsxfrontend/src/components/Groups/Groups.tsx renamed to frontend/src/components/groups/Groups.tsx

@@ -1,6 +1,9 @@
 import React, { useEffect, useState } from "react";
-import Groups from "../components/Groups/Groups";
-import Messaging from "../components/Groups/Messaging/Messaging";
+import data from "../components/groups/data/data.json";
+import Groups from "../components/groups/Groups";
+import Messaging from "../components/groups/Messaging/Messaging";
+import PiggyBank from "../components/groups/PiggyBank";
+import Wishlist from "../components/groups/Wishlist";
 import Button from "../components/utils/Button";
 import type { GetAllMyGroupsQuery } from "../generated/graphql-types";
 import { useGetAllMyGroupsQuery } from "../generated/graphql-types";
@@ -10,10 +13,14 @@ export default function Conversations() {
   const [_whislist, setWishlist] = React.useState(true);
 
   const { data: groupData } = useGetAllMyGroupsQuery();
-  const [groups, setGroups] = useState<GetAllMyGroupsQuery["getAllMyGroups"]>([]);
+  const [groups, setGroups] = useState<GetAllMyGroupsQuery["getAllMyGroups"]>(
+    []
+  );
 
   const [activeGroupId, setActiveGroupId] = React.useState<Number | null>(null);
-  const [activeGroup, setActiveGroup] = React.useState<GetAllMyGroupsQuery["getAllMyGroups"][0] | null>(null);
+  const [activeGroup, setActiveGroup] = React.useState<
+    GetAllMyGroupsQuery["getAllMyGroups"][0] | null
+  >(null);
 
   useEffect(() => {
     setGroups(groupData?.getAllMyGroups || []);
@@ -34,7 +41,9 @@ export default function Conversations() {
       {/* Left Column */}
       <div className="flex flex-col mx-[2vw] h-full min-h-0 justify-between">
         <div className="h-[calc(50%-2rem)] flex pb-2 ">
-          {groups && <Groups groups={groups} setActiveGroup={setActiveGroupId} />}
+          {groups && (
+            <Groups groups={groups} setActiveGroup={setActiveGroupId} />
+          )}
         </div>
 
         <div className="flex flex-row gap-2 pb-2 absolute top-[calc(50%)]">