Commit 9ebbeef6 authored by Merekeyev Dias's avatar Merekeyev Dias

changed apiSlice to have multiple endpoints

parent 983ae71e
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
import { RootState } from '../../main';
export const apiSlice = createApi({
reducerPath: 'api',
baseQuery: fetchBaseQuery({
baseUrl: "http://77.243.80.217:8080/esutd/api",
prepareHeaders: (headers, { getState }) => {
const state = getState() as RootState;
const accessToken = state.auth.token;
if (accessToken) {
headers.set("Authorization", `Bearer ${accessToken}`);
}
headers.set("Content-Type", "application/json");
headers.set("Accept", "application/json");
return headers;
},
}),
tagTypes: ["organizations"],
endpoints: () => ({}),
});
\ No newline at end of file
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'; import { apiSlice } from "./apiSlice";
import { RootState } from '../../main';
interface Organization { interface Organization {
id: number; id: number;
...@@ -14,36 +13,18 @@ interface Organization { ...@@ -14,36 +13,18 @@ interface Organization {
host: string; host: string;
} }
export const apiSlice = createApi({ export const organizationApiSlice = apiSlice.injectEndpoints({
reducerPath: 'api',
baseQuery: fetchBaseQuery({
baseUrl: "http://77.243.80.217:8080/esutd/api/organizations",
prepareHeaders: (headers, { getState }) => {
const state = getState() as RootState;
const accessToken = state.auth.token;
if (accessToken) {
headers.set("Authorization", `Bearer ${accessToken}`);
}
headers.set("Content-Type", "application/json");
headers.set("Accept", "application/json");
return headers;
},
}),
tagTypes: ["organizations"],
endpoints: (builder) => ({ endpoints: (builder) => ({
getOrganizations: builder.query<Organization[], void>({ getOrganizations: builder.query<Organization[], void>({
query: () => '/list', query: () => 'organizations/list',
providesTags: ["organizations"], providesTags: ["organizations"],
}), }),
getOrganization: builder.query<Organization, string>({ getOrganization: builder.query<Organization, string>({
query: (orgId) => `/info?id=${orgId}`, query: (orgId) => `organizations/info?id=${orgId}`,
}), }),
addNewOrganization: builder.mutation<Organization, Partial<Organization>>({ addNewOrganization: builder.mutation<Organization, Partial<Organization>>({
query: (initialOrg) => ({ query: (initialOrg) => ({
url: '/save', // Ensure the endpoint is correct url: 'organizations/save',
method: 'POST', method: 'POST',
body: initialOrg, body: initialOrg,
}), }),
...@@ -51,7 +32,7 @@ export const apiSlice = createApi({ ...@@ -51,7 +32,7 @@ export const apiSlice = createApi({
}), }),
editOrganization: builder.mutation<Organization, Partial<Organization>>({ editOrganization: builder.mutation<Organization, Partial<Organization>>({
query: ({ id, ...rest }) => ({ query: ({ id, ...rest }) => ({
url: `/edit?id=${id}`, url: `organizations/edit?id=${id}`,
method: 'PUT', method: 'PUT',
body: rest, body: rest,
}), }),
...@@ -59,13 +40,13 @@ export const apiSlice = createApi({ ...@@ -59,13 +40,13 @@ export const apiSlice = createApi({
}), }),
deleteOrganization: builder.mutation<{ success: boolean; id: number }, number>({ deleteOrganization: builder.mutation<{ success: boolean; id: number }, number>({
query: (orgId) => ({ query: (orgId) => ({
url: `/delete?id=${orgId}`, url: `organizations/delete?id=${orgId}`,
method: 'DELETE', method: 'DELETE',
}), }),
invalidatesTags: ["organizations"], invalidatesTags: ["organizations"],
}), }),
}), })
}); })
export const { export const {
useGetOrganizationsQuery, useGetOrganizationsQuery,
...@@ -73,4 +54,4 @@ export const { ...@@ -73,4 +54,4 @@ export const {
useAddNewOrganizationMutation, useAddNewOrganizationMutation,
useEditOrganizationMutation, useEditOrganizationMutation,
useDeleteOrganizationMutation, useDeleteOrganizationMutation,
} = apiSlice; } = organizationApiSlice;
import React from 'react'; import React from 'react';
import { useNavigate } from 'react-router'; import { useNavigate } from 'react-router';
import { Form, Input, Button, Select, message } from 'antd'; import { Form, Input, Button, Select, message } from 'antd';
import { useAddNewOrganizationMutation } from '../../features/api/apiSlice'; import { useAddNewOrganizationMutation } from '../../features/api/organizationApiSlice';
import { setTotalOrgNumber, setCurrentPage } from '../../features/pagination/mainPagination'; import { setTotalOrgNumber, setCurrentPage } from '../../features/pagination/mainPagination';
import { useSelector, useDispatch } from 'react-redux'; import { useSelector, useDispatch } from 'react-redux';
import './style.css'; import './style.css';
......
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { useNavigate, useParams } from 'react-router'; import { useNavigate, useParams } from 'react-router';
import { Form, Input, Button, Select, message } from 'antd'; import { Form, Input, Button, Select, message } from 'antd';
import { useGetOrganizationQuery, useEditOrganizationMutation } from '../../features/api/apiSlice'; import { useGetOrganizationQuery, useEditOrganizationMutation } from '../../features/api/organizationApiSlice';
import './style.css'; import './style.css';
interface EditValues { interface EditValues {
id: number; // Change this line id: number; // Change this line
......
...@@ -2,7 +2,7 @@ import React, { useState } from 'react'; ...@@ -2,7 +2,7 @@ import React, { useState } from 'react';
import { useNavigate } from 'react-router'; import { useNavigate } from 'react-router';
import { Button, Space, Tag, Modal, message } from 'antd'; import { Button, Space, Tag, Modal, message } from 'antd';
import type { TableProps } from 'antd'; import type { TableProps } from 'antd';
import { useDeleteOrganizationMutation } from '../../features/api/apiSlice'; import { useDeleteOrganizationMutation } from '../../features/api/organizationApiSlice';
import { getStatusText, getStatusColor } from './utils'; import { getStatusText, getStatusColor } from './utils';
export interface DataType { export interface DataType {
......
...@@ -2,7 +2,7 @@ import React, { useEffect } from 'react'; ...@@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
import { useNavigate } from 'react-router'; import { useNavigate } from 'react-router';
import { useSelector, useDispatch } from 'react-redux'; import { useSelector, useDispatch } from 'react-redux';
import { Button, Pagination, Spin, Table } from 'antd'; import { Button, Pagination, Spin, Table } from 'antd';
import { useGetOrganizationsQuery } from '../../features/api/apiSlice'; import { useGetOrganizationsQuery } from '../../features/api/organizationApiSlice';
import { setCurrentPage, setTotalOrgNumber } from '../../features/pagination/mainPagination'; import { setCurrentPage, setTotalOrgNumber } from '../../features/pagination/mainPagination';
import { DataType, columns } from './Columns'; import { DataType, columns } from './Columns';
import './Homepage.css'; import './Homepage.css';
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment