added consume and register deregister as simple fetch

This commit is contained in:
sara-pervana
2024-01-28 17:59:19 +01:00
committed by Sara Pervana
parent e06afab048
commit 29aa17ca7c
3 changed files with 71 additions and 28 deletions

View File

@@ -1,26 +1,38 @@
import { Button } from "@mui/material";
import useAxios from "../hooks/useAxios";
import { useState } from "react";
import axios from "axios";
const ConsumeAction = ({ endpoint }: { endpoint: string }) => {
const [data, setData] = useState(null);
const [error, setError] = useState(null);
const [currentEndpoint, setCurrentEndpoint] = useState("");
const [shouldFetch, setShouldFetch] = useState(false);
const { data, error } = useAxios(currentEndpoint, "GET", null, true, shouldFetch);
if (error) console.error("Error consuming:", error);
if (data) console.log('what the response', data)
if (data) console.log("Data in state", data);
if (error) console.log("Error in state", error);
const onConsume = () => {
setCurrentEndpoint(endpoint);
setShouldFetch(true);
}
const axiosConfig = {
url: endpoint,
method: "GET",
data: null,
};
axios(axiosConfig)
.then((response) => {
setData(response.data);
console.log("I got the data from consume: ", response.data);
})
.catch((error) => {
console.error("Error happened during consume: ", error);
setError(error);
})
.finally(() => {});
};
return <Button onClick={onConsume} variant="outlined">
Consume
</Button>
return (
<Button onClick={onConsume} variant="outlined">
Consume
</Button>
);
};
export default ConsumeAction;

View File

@@ -1,8 +1,8 @@
import { IEntityActions } from "@/types";
import { Button, Snackbar, Alert, AlertColor } from "@mui/material";
import { useState } from "react";
import useAxios from "../hooks/useAxios";
import { deleteEntity } from "@/api/entities/entities";
import axios from "axios";
interface Props {
endpointData: IEntityActions[];
@@ -16,17 +16,23 @@ const SNACKBAR_DEFAULT = {
};
const EntityActions = ({ endpointData, rowData }: Props) => {
const [currentEndpoint, setCurrentEndpoint] = useState("");
const [shouldFetch, setShouldFetch] = useState(false);
const { error } = useAxios(currentEndpoint, "GET", null, true, shouldFetch);
const [snackbar, setSnackbar] = useState<{
open: boolean;
message: string;
severity: AlertColor;
}>(SNACKBAR_DEFAULT);
if (error) console.error("Error registering/deregistering:", error);
const [registerData, setRegisterData] = useState(null);
const [registerError, setRegisterError] = useState(null);
const [DeregisterData, setDeRegisterData] = useState(null);
const [DeregisterError, setDeRegisterError] = useState(null);
if (registerData) console.log("Register Data in state", registerData);
if (registerError) console.log("Register Error in state", registerError);
if (DeregisterData) console.log("Register Data in state", DeregisterData);
if (DeregisterError) console.log("Register Error in state", DeregisterError);
const onDeleteEntity = async () => {
if (rowData)
@@ -50,13 +56,41 @@ const EntityActions = ({ endpointData, rowData }: Props) => {
};
const onRegisterEntity = (endpoint: string) => {
setCurrentEndpoint(endpoint);
setShouldFetch(true);
const axiosConfig = {
url: endpoint,
method: "GET",
data: null,
};
axios(axiosConfig)
.then((response) => {
setRegisterData(response.data);
console.log("I got the data from register: ", response.data);
})
.catch((error) => {
console.error("Error happened during register: ", error);
setRegisterError(error);
})
.finally(() => {});
};
const onDeregisterEntity = (endpoint: string) => {
setCurrentEndpoint(endpoint);
setShouldFetch(true);
const axiosConfig = {
url: endpoint,
method: "GET",
data: null,
};
axios(axiosConfig)
.then((response) => {
setDeRegisterData(response.data);
console.log("I got the data from deregister: ", response.data);
})
.catch((error) => {
console.error("Error happened during deregister: ", error);
setDeRegisterError(error);
})
.finally(() => {});
};
const handleCloseSnackbar = () => {

View File

@@ -1,4 +1,3 @@
import { Button } from "@mui/material";
import EntityActions from "@/components/entity_actions";
import ConsumeAction from "@/components/consume_action";
@@ -15,9 +14,7 @@ export const ClientTableConfig = [
key: "endpoint_url",
label: "End Point",
render: (value: any) => {
return (
<ConsumeAction endpoint={value} />
);
return <ConsumeAction endpoint={value} />;
},
},
// {