PK!A7��nimport React, { useState, useEffect } from "react"; import tw from "tailwind-styled-components"; import { Link, useParams, useNavigate } from "react-router-dom"; import Images from "../Images"; import { useMutation, useQuery } from "react-query"; import axios from "axios"; import Config from "../Config"; import Loading from "../Components/Loading"; import Table from "../Components/APIs/Table"; import { Page, BoxContainer, BoxTitle, Underline, ErrorText, } from "../Components/Styles/PageStyles"; import NotFoundModel from "../Components/NotFoundModel"; import { SmallBtn } from "../Components/Styles/InputStyles"; import DeleteModel from "../Components/APIs/DeleteModel"; import { useSelector } from "react-redux"; import { ForUs } from "../Config"; import EditDeviceModel from "../Components/APIs/EditDeviceModel"; import SingleEntry from "../Components/APIs/SingleEntry"; import { MdAdd } from "react-icons/md"; import { HiUpload } from "react-icons/hi"; import { toast } from "react-toastify"; import ViewModel from "../Components/APIs/ViewModel"; const Apis = () => { const user = useSelector((state) => state.UserReducer.user); const [openViewModel, setOpenViewModel] = useState(false); const [regenerateModel, setRegenerateModel] = useState(false); const [selectedItem, setSelectedItem] = useState(null); const navigate = useNavigate(); const { id } = useParams(); // // ----- Getting Initial Data ------ const fetchFunction = async () => await axios.get( `${Config.nodeApiUrl}/customer/getApiKeys`, Config.AxiosConfig ); const { isLoading, error, data, refetch, isRefetching } = useQuery( "getApiKeys", fetchFunction ); //------- Regenerate API KEY ------- const generateApiKeyPostFunction = async (values) => await axios.post( `${Config.nodeApiUrl}/customer/regenerateApiKey`, values, Config.AxiosConfig ); const generateApiKeySuccess = (res) => { refetch(); toast.success(res?.data?.msg || "Success"); setRegenerateModel(false); }; const generateApiKeyError = (res) => { toast.error(res?.response?.data?.msg || "An Error Occured"); setRegenerateModel(false); }; const { isLoading: generateApiKeyLoading, mutate: generateApiKeyMutate } = useMutation(generateApiKeyPostFunction, { onSuccess: generateApiKeySuccess, onError: generateApiKeyError, }); return (
API's Info
{regenerateModel && ( )} {!isLoading && !isRefetching && ( )} {(isLoading || isRefetching) && } {error && !isLoading && !isRefetching && } ); }; const Uploader = ({ setOpenUploadModel }) => { return ( ); }; const TableWrapper = tw.h1`my-10 border rounded-md overflow-auto`; const Title = tw.h1`text-xl text-gray-800 whitespace-nowrap font-medium`; const UploadWrapper = tw.div` w-full flex justify-end space-x-4 items-center `; const Button = tw.button`text-white bg-custom-zambia w-40 flex items-center space-x-1 justify-center h-10 text-xs whitespace-nowrap rounded`; export default Apis;