import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'

// URL's
const baseUrl = "http://127.0.0.1:8080";
const marketsUrl = '/coins/markets';
const countUrl = '/count';
const globalUrl = '/global';
const coinInfoUrl = (id:string) => `/coin/${id}`;
const coinChartUrl = (id:string) => `/coin/${id}/chart`;

export interface IGetGlobalResponse {
  active_cryptocurrencies: number;
  markets: number;
}

export interface IGetCoinsListResponse {
  [key: string]: any;
}

export interface IGetCoinsCountResponse {
  count: number;
}

export interface IGetCoinsInfoResponse {
  [key: string]: any;
}

export interface IGetCoinsInfoRequest {
  id: string;
}

export interface IGetCoinsChartRequest {
  page: number;
  per_page: number;
}

export interface IGetCoinsChartResponse {
  [key: string]: any ;
}

export const coinListApi = createApi({
  baseQuery: fetchBaseQuery({ baseUrl: baseUrl }),
  endpoints: (builder) => ({
    getGlobal: builder.query<IGetGlobalResponse, void>({
      query: () => globalUrl,
    }),
    getCoinsList: builder.query<IGetCoinsListResponse, IGetCoinsChartRequest>({
      query: (payload: IGetCoinsChartRequest) => `${marketsUrl}?per_page=${payload.per_page}&page=${payload.page}`,
    }),
    getCoinsCount: builder.query<IGetCoinsCountResponse, void>({
      query: () => countUrl,
    }),
    getCoinInfo: builder.query<IGetCoinsInfoResponse, string>({
      query: (id: string) => coinInfoUrl(id),
    }),
    getCoinChart: builder.query<IGetCoinsChartResponse, string>({
      query: (id: string) => coinChartUrl(id),
    }), 
  }),
})

export const {
  useGetGlobalQuery,
  useGetCoinsListQuery,
  useGetCoinsCountQuery,
  useGetCoinInfoQuery,
  useGetCoinChartQuery
 } = coinListApi;