update

src/components/SkillSearch/SkillSearch.tsx

@@ -59,10 +59,13 @@ const SkillSearch: React.FC<Props> = ({ skill }) => {
     deleteDialog(async () => {
       await deleteSkill(skill.id);
       successDialog(deleteSuccess, t);
-      setFilteredSkill((prev) => prev.filter((obj) => obj.id !== skill.id));
     }, t);
   }, []);
 
+  useEffect(() => {
+    setFilteredSkill(skill)
+  }, [skill]);
+
   const columns = useMemo<Column<SkillResult>[]>(
     () => [
       {

src/components/StaffSearch/StaffSearch.tsx

@@ -90,10 +90,13 @@ const StaffSearch: React.FC<Props> = ({ staff, teams, grades, positions, isAuthe
     deleteDialog(async () => {
       await deleteStaff(staff.id);
       successDialog(t("Delete Success"), t);
-      setFilteredStaff((prev) => prev.filter((obj) => obj.id !== staff.id));
     }, t);
   }, []);
 
+  useEffect(() => {
+    setFilteredStaff(staff)
+  }, [staff]);
+
   const columns = useMemo<Column<StaffResult>[]>(
     () => [
       {

src/components/TeamSearch/TeamSearch.tsx

@@ -2,7 +2,7 @@
 
 import { TeamResult } from "@/app/api/team";
 import SearchBox, { Criterion } from "../SearchBox";
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import SearchResults, { Column } from "../SearchResults/index";
 import EditNote from "@mui/icons-material/EditNote";
@@ -66,6 +66,10 @@ const TeamSearch: React.FC<Props> = ({ team }) => {
     }, t);
   }, []);
 
+  useEffect(() => {
+    setFilteredTeam(team)
+  }, [team]);
+
   const columns = useMemo<Column<TeamResult>[]>(
     () => [
       {

src/components/UserGroupSearch/UserGroupSearch.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import SearchBox, { Criterion } from "../SearchBox";
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import SearchResults, { Column } from "../SearchResults/index";
 import EditNote from "@mui/icons-material/EditNote";
@@ -9,7 +9,6 @@ import DeleteIcon from "@mui/icons-material/Delete";
 import { useRouter } from "next/navigation";
 import { deleteDialog, successDialog } from "../Swal/CustomAlerts";
 import { UserGroupResult } from "@/app/api/group";
-import { deleteUser } from "@/app/api/user/actions";
 import { deleteGroup } from "@/app/api/group/actions";
 
 interface Props {
@@ -41,7 +40,6 @@ const UserGroupSearch: React.FC<Props> = ({ groups }) => {
 
   const onUserClick = useCallback(
     (group: UserGroupResult) => {
-      console.log(group);
       router.push(`/settings/group/edit?id=${group.id}`)
     },
     [router, t]
@@ -51,11 +49,14 @@ const UserGroupSearch: React.FC<Props> = ({ groups }) => {
     deleteDialog(async () => {
       await deleteGroup(group.id);
       successDialog(t("Delete Success"), t);
-      setFilteredGroups((prev) => prev.filter((obj) => obj.id !== group.id));
 
     }, t);
   }, []);
 
+  useEffect(() => {
+    setFilteredGroups(groups)
+  }, [groups]);
+
   const columns = useMemo<Column<UserGroupResult>[]>(
     () => [
       {

src/components/UserGroupSearch/UserGroupSearchWrapper.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import UserGroupSearchLoading from "./UserGroupSearchLoading";
-import { UserGroupResult, fetchGroup } from "@/app/api/group";
+import { fetchGroup } from "@/app/api/group";
 import UserGroupSearch from "./UserGroupSearch";
 
 interface SubComponents {
@@ -9,6 +9,7 @@ interface SubComponents {
 
 const UserGroupSearchWrapper: React.FC & SubComponents = async () => {
 const group = await fetchGroup()
+console.log(group)
 
   return <UserGroupSearch groups={group.records} />;
 };