Commit 21e9eb45 authored by Alex Kakiris's avatar Alex Kakiris
Browse files

Merge branch 'feat/fix-users-page' into 'dev' 

Fix users page crashes and refresh after user creation

See merge request !1
parents 698be303 c62414ef

capif_frontend/src/pages/users/index.js

+21 −24
Changes for capif_frontend/src/pages/users/index.js: 21 added lines, 24 removed lines.
Original line number Diff line number Diff line
@@ -35,6 +35,15 @@ const LinkStyled = styled(Link)(({ theme }) => ({ 
  color: theme.palette.primary.main,

}));



const EMPTY_USER = {

  username: '',

  password: '',

  enterprise: '',

  country: '',

  email: '',

  purpose: ''

};



const Users = () => {

  const queryClient = useQueryClient();

  const [selectedUsers, setSelectedUsers] = useState([]);
@@ -57,33 +66,26 @@ const Users = () => { 
  const [isCreating, setIsCreating] = useState(false);

  const [isCreateDialogOpen, setCreateDialogOpen] = useState(false);

  

  const [userCreate, setUserCreate] = useState({

    username: '',

    password: '',

    enterprise: '',

    country: '',

    email: '',

    purpose: ''

  });

  const [userCreate, setUserCreate] = useState(EMPTY_USER);

  const [showCreateMessage, setShowCreateMessage] = useState(false);

  const [errorCreating, setErrorCreating] = useState(false);



  // Fetch all users data

  const { data: usersData, isLoading, isError } = useQuery({

  const { data: usersData, isLoading, isError, refetch } = useQuery({

    queryKey: ['users'],

    queryFn: () => getUsersPagesOrder(), // Fetch all data without pagination in query

  });



  useEffect(() => {

    if (usersData.data) {

    if (usersData && Array.isArray(usersData.data)) {

      let filteredUsers = usersData.data;



      // Search filter by any field

      if (searchTerm) {

        filteredUsers = filteredUsers.filter((user) =>

          user.username.toLowerCase().includes(searchTerm.toLowerCase()) ||

          user.enterprise.toLowerCase().includes(searchTerm.toLowerCase()) ||

          user.email.toLowerCase().includes(searchTerm.toLowerCase())

          user.username?.toLowerCase().includes(searchTerm.toLowerCase()) ||

          user.enterprise?.toLowerCase().includes(searchTerm.toLowerCase()) ||

          user.email?.toLowerCase().includes(searchTerm.toLowerCase())

        );

      }
@@ -134,11 +136,7 @@ const Users = () => { 
      await deleteUsers(selectedUsers);



      setDeleteMessage('Users removed');

      const response = await getUsersPagesOrder();

      setUsers(response);

      setTotalUsers(response.length);

      setTotalPages(Math.ceil(response.length / pageSize));



      await refetch(); // Refetch the users after deletion

      setDeleteDialogOpen(false);

      setSelectedUsers([]);

      setShowDeleteMessage(true);
@@ -186,14 +184,12 @@ const Users = () => { 
  const handleCreateConfirm = async () => {

    try {

      setIsCreating(true);

      await createUser(userCreate);



      const response = await getUsersPagesOrder();

      setUsers(response);

      setTotalUsers(response.length);

      setTotalPages(Math.ceil(response.length / pageSize));

      setErrorCreating(false);



      await createUser(userCreate);

      await refetch(); // Refetch the users after creation

      setCreateDialogOpen(false);

      setUserCreate(EMPTY_USER); // Reset the form

      setShowCreateMessage(true);

    } catch (error) {

      setErrorCreating(true);
@@ -204,6 +200,7 @@ const Users = () => { 


  const handleCreateCancel = () => {

    setCreateDialogOpen(false);

    setUserCreate(EMPTY_USER); // Reset the form on cancel

  };



  const handleCreateMessageAccept = () => {