all working deleting with circle (f9273561) · Commits · OCF / backoffice / frontend

capif_frontend/src/pages/apis/index.js

+1 −1

Original line number	Diff line number	Diff line
		@@ -274,7 +274,7 @@ const Apis = () => {

		<Dialog open={showDeleteMessage} onClose={handleDeleteMessageAccept}>
		<DialogTitle>
		{errorDeleting ? 'Error Deleting Api' : 'Api Deleted'}
		{errorDeleting ? 'Error Deleting Api' : 'Api Deleted!'}
		</DialogTitle>
		<DialogContent>
		{errorDeleting

capif_frontend/src/pages/invokers/index.js

+2 −283

Original line number	Diff line number	Diff line
		@@ -131,7 +131,7 @@ const Invokers = () => {

		const handleDeleteCancel = () => {
		setDeleteDialogOpen(false);
		setSelectedinvoker(null);
		setSelectedInvoker(null);
		setDeleteMessage('');
		};

		@@ -286,7 +286,7 @@ const Invokers = () => {

		<Dialog open={showDeleteMessage} onClose={handleDeleteMessageAccept}>
		<DialogTitle>
		{errorDeleting ? 'Error Deleting Invoker' : 'Invoker Deleted'}
		{errorDeleting ? 'Error Deleting Invoker' : 'Invoker Deleted!'}
		</DialogTitle>
		<DialogContent>
		{errorDeleting
		@@ -304,284 +304,3 @@ const Invokers = () => {
		};

		export default Invokers;










		// const Invokers = () => {
		// const queryClient = useQueryClient()
		// const [selectedInvoker, setSelectedInvoker] = useState(null);
		// const [isDeleteDialogOpen, setDeleteDialogOpen] = useState(false);
		// const [currentPage, setCurrentPage] = useState(1);
		// const [pageSize, setPageSize] = useState(10); // Número de invocadores por página
		// const [totalPages, setTotalPages] = useState(0);
		// const [totalInvokers, setTotalInvokers] = useState(0);
		// const [invokers, setInvokers] = useState([]);
		// const [searchTerm, setSearchTerm] = useState('');

		// const [isDeleting, setIsDeleting] = useState(false);
		// const [deleteMessage, setDeleteMessage] = useState('');
		// const [showDeleteMessage, setShowDeleteMessage] = useState(false);
		// const [errorDeleting, setErrorDeleting] = useState(false);



		// // INVOKERS NUMBER
		// const queryKeyNumInvokers = ['invokersNum']

		// const { data: invokersNum, isLoadingNumInvokers, isErrorNumInvokers, refetchNumInvokers } = useQuery({
		// queryKey: queryKeyNumInvokers,
		// queryFn: getNumInvokers,
		// refetchOnWindowFocus: false,
		// refetchOnMount: false,
		// });

		// // INVOKERS DATA
		// const queryKeyInvokers = ['invokers'];

		// const { data: invokersDataPages, isLoadingInvokersData, isErrorInvokersData, refetchInvokers } = useQuery({
		// queryKey: queryKeyInvokers,
		// queryFn: () => getInvokersPages({ page: currentPage, pageSize }),
		// refetchOnWindowFocus: false,
		// refetchOnMount: false,
		// });

		// console.log('invokersDataPages:', invokersDataPages);

		// useEffect(() => {
		// // Solo establece los invocadores cuando invokersData cambie
		// if (invokersDataPages) {
		// setInvokers(invokersDataPages.data);
		// }
		// }, [invokersDataPages]);

		// useEffect(() => {
		// // Lógica para refrescar los datos aquí
		// const fetchData = async () => {
		// try {
		// const response = await getInvokersPages({ page: currentPage, pageSize });
		// setInvokers(response.data);
		// setTotalInvokers(response.total);
		// setTotalPages(Math.ceil(response.total / pageSize));
		// } catch (error) {
		// console.error('Error fetching invokers:', error.message);
		// }
		// };

		// fetchData(); // Llama a la función fetchData directamente cuando cambien las dependencias
		// }, [currentPage, pageSize]);

		// const handleDeleteClick = (invokerId) => {
		// setSelectedInvoker(invokerId);
		// setDeleteDialogOpen(true);
		// };

		// const handleDeleteConfirm = async () => {
		// try {
		// setIsDeleting(true);
		// setErrorDeleting(false);
		// const currentPageBeforeDelete = currentPage; // Guarda la página actual antes de la eliminación

		// await deleteInvoker(selectedInvoker);

		// // Simula el mensaje de éxito, reemplaza esta línea con tu lógica real
		// setDeleteMessage('Invoker removed');

		// // Actualiza manualmente la lista de invocadores después de eliminar el invocador
		// const updatedInvokers = invokers.filter(invoker => invoker.api_invoker_id !== selectedInvoker);
		// setInvokers(updatedInvokers);

		// // Si la página actual quedó vacía después de la eliminación, cambia a la página anterior
		// if (updatedInvokers.length === 0 && currentPageBeforeDelete > 1) {
		// setCurrentPage(currentPageBeforeDelete - 1);
		// }

		// setDeleteDialogOpen(false);
		// setSelectedInvoker(null);
		// setShowDeleteMessage(true);
		// } catch (error) {
		// console.error('Error deleting invoker:', error.message);
		// setErrorDeleting(true);
		// } finally {
		// setIsDeleting(false);
		// }
		// };


		// const handleDeleteCancel = () => {
		// setDeleteDialogOpen(false);
		// setSelectedInvoker(null);
		// setDeleteMessage('');
		// };

		// const handleDeleteMessageAccept = () => {
		// setShowDeleteMessage(false);
		// };

		// const handlePageChange = (newPage) => {
		// setCurrentPage(newPage);
		// };

		// const handlePageSizeChange = (event) => {
		// const newSize = event.target.value;
		// setPageSize(newSize);
		// // Recalcular el número total de páginas cuando cambia el tamaño de la página
		// const newTotalPages = Math.ceil(totalInvokers / newSize);
		// setTotalPages(newTotalPages);
		// // Asegurarse de que la página actual sea válida después de cambiar el tamaño de la página
		// setCurrentPage(1);
		// };

		// return (
		// <Grid container spacing={3}>
		// <Grid item xs={12}>
		// {/* Agregar controles de búsqueda aquí si es necesario */}
		// </Grid>
		// <Grid item xs={8}>
		// <PageHeader title={<Typography variant='h5'>Invokers: {invokersNum?.data}</Typography>} />
		// </Grid>

		// {/* Grid con el campo de búsqueda en la segunda columna */}
		// <Grid item xs={4}>
		// <Grid container spacing={2}>
		// {/* Agregar un campo de búsqueda */}
		// <Grid item xs={12}>
		// <TextField
		// label="Search by ..."
		// variant="outlined"
		// //value={searchTerm}
		// onChange={(e) => setSearchTerm(e.target.value)}
		// />
		// </Grid>

		// {/* Otros elementos adicionales en la segunda columna, si es necesario */}
		// </Grid>
		// </Grid>

		// <Grid item xs={12}>
		// <Card>
		// <CardHeader title='List of Invokers' />
		// {isLoadingInvokersData ? (
		// <CircularProgress />
		// ) : isErrorInvokersData ? (
		// <Typography variant='body1' sx={{ paddingLeft: 4, paddingBottom: 2 }}>
		// Error loading data.
		// </Typography>
		// ) : invokersDataPages?.data && invokersDataPages.data.length > 0 ? (
		// <>
		// <TableContainer component={Paper}>
		// <Table sx={{ minWidth: 650 }} aria-label='invokers table'>
		// <TableHead>
		// <TableRow>
		// <TableCell>ID</TableCell>
		// <TableCell>Info</TableCell>
		// <TableCell>User name</TableCell>
		// <TableCell>Actions</TableCell>
		// </TableRow>
		// </TableHead>
		// <TableBody>
		// {invokers.map((invoker) => (
		// <TableRow
		// key={invoker.api_invoker_id}
		// sx={{
		// '&:last-of-type td, &:last-of-type th': {
		// border: 0,
		// },
		// }}
		// >
		// <TableCell component='th' scope='row'>
		// <LinkStyled href={`/invokers/${invoker.api_invoker_id}`}>
		// {invoker.api_invoker_id}
		// </LinkStyled>
		// </TableCell>
		// <TableCell>{invoker.api_invoker_information}</TableCell>
		// <TableCell>
		// {invoker.username ? (
		// <LinkStyled href={`/users/${invoker.username}`}>
		// {invoker.username}
		// </LinkStyled>
		// ) : (
		// 'Unknown user'
		// )}
		// </TableCell>
		// <TableCell>
		// <Button
		// variant='contained'
		// onClick={() => handleDeleteClick(invoker.api_invoker_id)}
		// >
		// Delete
		// </Button>
		// </TableCell>
		// </TableRow>
		// ))}
		// </TableBody>
		// </Table>
		// </TableContainer>
		// </>
		// ) : (
		// <Typography variant='body1' sx={{ paddingLeft: 4, paddingBottom: 2 }}>
		// There are no invokers yet.
		// </Typography>
		// )}
		// </Card>

		// </Grid>
		// <Grid item xs={12}>
		// <Grid container spacing={3} alignItems="center" justifyContent="space-between">
		// <Grid item>
		// <Pagination
		// count={totalPages}
		// page={currentPage}
		// onChange={(event, value) => handlePageChange(value)}
		// />
		// </Grid>
		// <Grid item>
		// <Select value={pageSize} onChange={handlePageSizeChange}>
		// <MenuItem value={10}>10 per page</MenuItem>
		// <MenuItem value={20}>20 per page</MenuItem>
		// <MenuItem value={30}>30 per page</MenuItem>
		// </Select>
		// </Grid>
		// </Grid>
		// </Grid>


		// <Dialog open={isDeleteDialogOpen} onClose={handleDeleteCancel}>
		// <DialogTitle>Confirm Deletion</DialogTitle>
		// <DialogContent>
		// Are you sure you want to delete the invoker?
		// </DialogContent>
		// <DialogActions>
		// <Button onClick={handleDeleteCancel}>Cancel</Button>
		// <Button onClick={handleDeleteConfirm} autoFocus disabled={isDeleting}>
		// {isDeleting ? <CircularProgress size={24} /> : 'Confirm'}
		// </Button>
		// </DialogActions>
		// </Dialog>

		// <Dialog open={showDeleteMessage} onClose={handleDeleteMessageAccept}>
		// <DialogTitle>
		// {errorDeleting ? 'Error Deleting Invoker' : 'Invoker Deleted'}
		// </DialogTitle>
		// <DialogContent>
		// {errorDeleting
		// ? 'An error occurred while deleting the invoker.'
		// : 'The invoker has been successfully deleted.'}
		// </DialogContent>
		// <DialogActions>
		// <Button onClick={handleDeleteMessageAccept} autoFocus>
		// Accept
		// </Button>
		// </DialogActions>
		// </Dialog>
		// </Grid>
		// );
		// };

		// export default Invokers;

capif_frontend/src/pages/providers/index.js

+1 −241

Original line number	Diff line number	Diff line
		@@ -280,7 +280,7 @@ const Providers = () => {

		<Dialog open={showDeleteMessage} onClose={handleDeleteMessageAccept}>
		<DialogTitle>
		{errorDeleting ? 'Error Deleting Provider' : 'Provider Deleted'}
		{errorDeleting ? 'Error Deleting Provider' : 'Provider Deleted!'}
		</DialogTitle>
		<DialogContent>
		{errorDeleting
		@@ -298,243 +298,3 @@ const Providers = () => {
		};

		export default Providers;












		// const Providers = () => {
		// const queryClient = useQueryClient()
		// const [selectedProvider, setSelectedProvider] = useState(null);
		// const [isDeleteDialogOpen, setDeleteDialogOpen] = useState(false);
		// const [currentPage, setCurrentPage] = useState(1);
		// const [pageSize, setPageSize] = useState(10); // Número de invocadores por página
		// const [totalPages, setTotalPages] = useState(0);
		// const [totalProviders, setTotalProviders] = useState(0);
		// const [providers, setProviders] = useState([]);
		// const [searchTerm, setSearchTerm] = useState('');

		// // PROVIDERS NUMBER
		// const queryKeyNumProviders = ['providersNum']

		// const { data: providersNum, isLoadingNumProviders, isErrorNumProviders, refetchNumProviders } = useQuery({
		// queryKey: queryKeyNumProviders,
		// queryFn: getNumProviders,
		// refetchOnWindowFocus: false,
		// refetchOnMount: false,
		// });

		// // ProviderS DATA
		// const queryKeyProviders = ['providers'];

		// const { data: providersDataPages, isLoadingProvidersData, isErrorProvidersData, refetchProviders } = useQuery({
		// queryKey: queryKeyProviders,
		// queryFn: () => getProvidersPages({ page: currentPage, pageSize }),
		// refetchOnWindowFocus: false,
		// refetchOnMount: false,
		// });

		// console.log('providersDataPages:', providersDataPages);

		// useEffect(() => {
		// // Solo establece los invocadores cuando providersData cambie
		// if (providersDataPages) {
		// setProviders(providersDataPages.data);
		// }
		// }, [providersDataPages]);

		// useEffect(() => {
		// // Lógica para refrescar los datos aquí
		// const fetchData = async () => {
		// try {
		// const response = await getProvidersPages({ page: currentPage, pageSize });
		// setProviders(response.data);
		// setTotalProviders(response.total);
		// setTotalPages(Math.ceil(response.total / pageSize));
		// } catch (error) {
		// console.error('Error fetching providers:', error.message);
		// }
		// };

		// fetchData(); // Llama a la función fetchData directamente cuando cambien las dependencias
		// }, [currentPage, pageSize]);

		// const handleDeleteClick = (providerId) => {
		// setSelectedProvider(providerId);
		// setDeleteDialogOpen(true);
		// };

		// const handleDeleteConfirm = async () => {
		// try {
		// // const { providerId } = selectedProvider
		// // await deleteProvider(providerId)
		// await deleteProvider(selectedProvider);

		// // Invalidar la caché después de la eliminación para que se vuelva a cargar la lista
		// queryClient.invalidateQueries('providers');

		// // Refrescar los datos inmediatamente después de la eliminación
		// // refetch()
		// setDeleteDialogOpen(false);
		// setSelectedProvider(null);
		// //fetchProviders();
		// } catch (error) {
		// console.error('Error deleting provider:', error.message);
		// }
		// };

		// const handleDeleteCancel = () => {
		// setDeleteDialogOpen(false);
		// setSelectedProvider(null);
		// };

		// const handlePageChange = (newPage) => {
		// setCurrentPage(newPage);
		// };

		// const handlePageSizeChange = (event) => {
		// const newSize = event.target.value;
		// setPageSize(newSize);
		// // Recalcular el número total de páginas cuando cambia el tamaño de la página
		// const newTotalPages = Math.ceil(totalProviders / newSize);
		// setTotalPages(newTotalPages);
		// // Asegurarse de que la página actual sea válida después de cambiar el tamaño de la página
		// setCurrentPage(1);
		// };

		// return (
		// <Grid container spacing={6}>
		// <Grid item xs={8}>
		// <PageHeader title={<Typography variant='h5'>Providers: {providersNum?.data}</Typography>} />
		// </Grid>

		// {/* Grid con el campo de búsqueda en la segunda columna */}
		// <Grid item xs={4}>
		// <Grid container spacing={2}>
		// {/* Agregar un campo de búsqueda */}
		// <Grid item xs={12}>
		// <TextField
		// label="Search by ..."
		// variant="outlined"
		// //value={searchTerm}
		// onChange={(e) => setSearchTerm(e.target.value)}
		// />
		// </Grid>

		// {/* Otros elementos adicionales en la segunda columna, si es necesario */}
		// </Grid>
		// </Grid>

		// <Grid item xs={12}>
		// <Card>
		// <CardHeader title='List of Providers' />
		// {isLoadingProvidersData ? (
		// <CircularProgress />
		// ) : isErrorProvidersData ? (
		// <Typography variant='body1' sx={{ paddingLeft: 4, paddingBottom: 2 }}>
		// Error loading data.
		// </Typography>
		// ) : providersDataPages?.data && providersDataPages.data.length > 0 ? (
		// <>
		// <TableContainer component={Paper}>
		// <Table sx={{ minWidth: 650 }} aria-label='Providers table'>
		// <TableHead>
		// <TableRow>
		// <TableCell>Provider id</TableCell>
		// <TableCell>Information</TableCell>
		// <TableCell>Owner name</TableCell>
		// <TableCell>Actions</TableCell>
		// </TableRow>
		// </TableHead>
		// <TableBody>
		// {providers.map((provider) => (
		// <TableRow
		// key={provider.api_prov_dom_id}
		// sx={{
		// '&:last-of-type td, &:last-of-type th': {
		// border: 0,
		// },
		// }}
		// >
		// <TableCell component='th' scope='row'>
		// <LinkStyled href={`/providers/${provider.api_prov_funcs[0].api_prov_func_id}`}>
		// {provider.api_prov_dom_id}
		// </LinkStyled>
		// </TableCell>
		// <TableCell>{provider.api_prov_dom_info}</TableCell>
		// <TableCell>
		// {provider.username ? (
		// <LinkStyled href={`/users/${provider.username}`}>
		// {provider.username}
		// </LinkStyled>
		// ) : (
		// 'Unknown user'
		// )}
		// </TableCell>
		// <TableCell>
		// <Button
		// variant='contained'
		// onClick={() => handleDeleteClick(provider.api_prov_dom_id)}
		// >
		// Delete
		// </Button>
		// </TableCell>
		// </TableRow>
		// ))}
		// </TableBody>
		// </Table>
		// </TableContainer>
		// </>
		// ) : (
		// <Typography variant='body1' sx={{ paddingLeft: 4, paddingBottom: 2 }}>
		// There are no providers yet.
		// </Typography>
		// )}
		// </Card>
		// </Grid>


		// <Grid item xs={12}>
		// <Grid container spacing={3} alignItems="center" justifyContent="space-between">
		// <Grid item>
		// <Pagination
		// count={totalPages}
		// page={currentPage}
		// onChange={(event, value) => handlePageChange(value)}
		// />
		// </Grid>
		// <Grid item>
		// <Select value={pageSize} onChange={handlePageSizeChange}>
		// <MenuItem value={10}>10 per page</MenuItem>
		// <MenuItem value={20}>20 per page</MenuItem>
		// <MenuItem value={30}>30 per page</MenuItem>
		// </Select>
		// </Grid>
		// </Grid>
		// </Grid>

		// {/* Confirmación de eliminación */}
		// <Dialog open={isDeleteDialogOpen} onClose={handleDeleteCancel}>
		// <DialogTitle>Confirm Deletion</DialogTitle>
		// <DialogContent>
		// Are you sure you want to delete the provider?
		// </DialogContent>
		// <DialogActions>
		// <Button onClick={handleDeleteCancel}>Cancel</Button>
		// <Button onClick={handleDeleteConfirm} autoFocus>
		// Confirm
		// </Button>
		// </DialogActions>
		// </Dialog>
		// </Grid>
		// );
		// };

		// export default Providers;
		No newline at end of file

capif_frontend/src/pages/users/index.js

+80 −37

File changed.

Preview size limit exceeded, changes collapsed.