\subsection{@generated/api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



export * from './api/analytics-api';
export * from './api/audit-api';
export * from './api/batch-status-api';
export * from './api/category-api';
export * from './api/charity-api';
export * from './api/chat-api';
export * from './api/donation-request-api';
export * from './api/donations-api';
export * from './api/file-api';
export * from './api/login-api';
export * from './api/money-api';
export * from './api/news-api';
export * from './api/notifications-api';
export * from './api/registration-api';
export * from './api/settings-api';
export * from './api/user-api';

\end{lstlisting}
\subsection{@generated/api/analytics-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { AnalyticsOneMonthProfit } from '../models';
// @ts-ignore
import { AnalyticsOneMonthRegistrations } from '../models';
// @ts-ignore
import { AnalyticsTopCategory } from '../models';
/**
 * AnalyticsApi - axios parameter creator
 * @export
 */
export const AnalyticsApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * Get sum of all donations by month
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAnalyticsGetDonationsSumByMonthGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/analytics/get_donations_sum_by_month`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * Get number of registrations by month
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAnalyticsGetRegistrationsCountByMonthGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/analytics/get_registrations_count_by_month`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * Get number of times category was used
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAnalyticsGetTopCategoriesCountGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/analytics/get_top_categories_count`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * AnalyticsApi - functional programming interface
 * @export
 */
export const AnalyticsApiFp = function(configuration?: Configuration) {
    return {
        /**
         * Get sum of all donations by month
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiAnalyticsGetDonationsSumByMonthGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<AnalyticsOneMonthProfit>>> {
            const localVarAxiosArgs = await AnalyticsApiAxiosParamCreator(configuration).apiAnalyticsGetDonationsSumByMonthGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * Get number of registrations by month
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiAnalyticsGetRegistrationsCountByMonthGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<AnalyticsOneMonthRegistrations>>> {
            const localVarAxiosArgs = await AnalyticsApiAxiosParamCreator(configuration).apiAnalyticsGetRegistrationsCountByMonthGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * Get number of times category was used
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiAnalyticsGetTopCategoriesCountGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<AnalyticsTopCategory>>> {
            const localVarAxiosArgs = await AnalyticsApiAxiosParamCreator(configuration).apiAnalyticsGetTopCategoriesCountGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * AnalyticsApi - factory interface
 * @export
 */
export const AnalyticsApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * Get sum of all donations by month
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAnalyticsGetDonationsSumByMonthGet(options?: any): AxiosPromise<Array<AnalyticsOneMonthProfit>> {
            return AnalyticsApiFp(configuration).apiAnalyticsGetDonationsSumByMonthGet(options).then((request) => request(axios, basePath));
        },
        /**
         * Get number of registrations by month
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAnalyticsGetRegistrationsCountByMonthGet(options?: any): AxiosPromise<Array<AnalyticsOneMonthRegistrations>> {
            return AnalyticsApiFp(configuration).apiAnalyticsGetRegistrationsCountByMonthGet(options).then((request) => request(axios, basePath));
        },
        /**
         * Get number of times category was used
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAnalyticsGetTopCategoriesCountGet(options?: any): AxiosPromise<Array<AnalyticsTopCategory>> {
            return AnalyticsApiFp(configuration).apiAnalyticsGetTopCategoriesCountGet(options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * AnalyticsApi - object-oriented interface
 * @export
 * @class AnalyticsApi
 * @extends {BaseAPI}
 */
export class AnalyticsApi extends BaseAPI {
    /**
     * Get sum of all donations by month
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof AnalyticsApi
     */
    public apiAnalyticsGetDonationsSumByMonthGet(options?: any) {
        return AnalyticsApiFp(this.configuration).apiAnalyticsGetDonationsSumByMonthGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * Get number of registrations by month
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof AnalyticsApi
     */
    public apiAnalyticsGetRegistrationsCountByMonthGet(options?: any) {
        return AnalyticsApiFp(this.configuration).apiAnalyticsGetRegistrationsCountByMonthGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * Get number of times category was used
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof AnalyticsApi
     */
    public apiAnalyticsGetTopCategoriesCountGet(options?: any) {
        return AnalyticsApiFp(this.configuration).apiAnalyticsGetTopCategoriesCountGet(options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/audit-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { AuditResponse } from '../models';
/**
 * AuditApi - axios parameter creator
 * @export
 */
export const AuditApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * Get logs of system
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAuditGet: async (page?: number, size?: number, sort?: string, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/audit/`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;

            if (page !== undefined) {
                localVarQueryParameter['page'] = page;
            }

            if (size !== undefined) {
                localVarQueryParameter['size'] = size;
            }

            if (sort !== undefined) {
                localVarQueryParameter['sort'] = sort;
            }


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * AuditApi - functional programming interface
 * @export
 */
export const AuditApiFp = function(configuration?: Configuration) {
    return {
        /**
         * Get logs of system
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiAuditGet(page?: number, size?: number, sort?: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<AuditResponse>> {
            const localVarAxiosArgs = await AuditApiAxiosParamCreator(configuration).apiAuditGet(page, size, sort, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * AuditApi - factory interface
 * @export
 */
export const AuditApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * Get logs of system
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiAuditGet(page?: number, size?: number, sort?: string, options?: any): AxiosPromise<AuditResponse> {
            return AuditApiFp(configuration).apiAuditGet(page, size, sort, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiAuditGet operation in AuditApi.
 * @export
 * @interface AuditApiApiAuditGetRequest
 */
export interface AuditApiApiAuditGetRequest {
    /**
     * Page number
     * @type {number}
     * @memberof AuditApiApiAuditGet
     */
    readonly page?: number

    /**
     * Page size
     * @type {number}
     * @memberof AuditApiApiAuditGet
     */
    readonly size?: number

    /**
     * Sort param
     * @type {string}
     * @memberof AuditApiApiAuditGet
     */
    readonly sort?: string
}

/**
 * AuditApi - object-oriented interface
 * @export
 * @class AuditApi
 * @extends {BaseAPI}
 */
export class AuditApi extends BaseAPI {
    /**
     * Get logs of system
     * @param {AuditApiApiAuditGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof AuditApi
     */
    public apiAuditGet(requestParameters: AuditApiApiAuditGetRequest = {}, options?: any) {
        return AuditApiFp(this.configuration).apiAuditGet(requestParameters.page, requestParameters.size, requestParameters.sort, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/batch-status-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { BlockchainStatusResponse } from '../models';
/**
 * BatchStatusApi - axios parameter creator
 * @export
 */
export const BatchStatusApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Retrieves a list of all operation statuses in blockchain
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {Array<string>} [type] Request type
         * @param {Array<string>} [status] Request status
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiBatchStatusesGet: async (page?: number, size?: number, sort?: string, type?: Array<string>, status?: Array<string>, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/batch-statuses`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;

            if (page !== undefined) {
                localVarQueryParameter['page'] = page;
            }

            if (size !== undefined) {
                localVarQueryParameter['size'] = size;
            }

            if (sort !== undefined) {
                localVarQueryParameter['sort'] = sort;
            }

            if (type) {
                localVarQueryParameter['type'] = type;
            }

            if (status) {
                localVarQueryParameter['status'] = status;
            }


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * BatchStatusApi - functional programming interface
 * @export
 */
export const BatchStatusApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Retrieves a list of all operation statuses in blockchain
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {Array<string>} [type] Request type
         * @param {Array<string>} [status] Request status
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiBatchStatusesGet(page?: number, size?: number, sort?: string, type?: Array<string>, status?: Array<string>, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<BlockchainStatusResponse>> {
            const localVarAxiosArgs = await BatchStatusApiAxiosParamCreator(configuration).apiBatchStatusesGet(page, size, sort, type, status, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * BatchStatusApi - factory interface
 * @export
 */
export const BatchStatusApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Retrieves a list of all operation statuses in blockchain
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {Array<string>} [type] Request type
         * @param {Array<string>} [status] Request status
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiBatchStatusesGet(page?: number, size?: number, sort?: string, type?: Array<string>, status?: Array<string>, options?: any): AxiosPromise<BlockchainStatusResponse> {
            return BatchStatusApiFp(configuration).apiBatchStatusesGet(page, size, sort, type, status, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiBatchStatusesGet operation in BatchStatusApi.
 * @export
 * @interface BatchStatusApiApiBatchStatusesGetRequest
 */
export interface BatchStatusApiApiBatchStatusesGetRequest {
    /**
     * Page number
     * @type {number}
     * @memberof BatchStatusApiApiBatchStatusesGet
     */
    readonly page?: number

    /**
     * Page size
     * @type {number}
     * @memberof BatchStatusApiApiBatchStatusesGet
     */
    readonly size?: number

    /**
     * Sort param
     * @type {string}
     * @memberof BatchStatusApiApiBatchStatusesGet
     */
    readonly sort?: string

    /**
     * Request type
     * @type {Array<string>}
     * @memberof BatchStatusApiApiBatchStatusesGet
     */
    readonly type?: Array<string>

    /**
     * Request status
     * @type {Array<string>}
     * @memberof BatchStatusApiApiBatchStatusesGet
     */
    readonly status?: Array<string>
}

/**
 * BatchStatusApi - object-oriented interface
 * @export
 * @class BatchStatusApi
 * @extends {BaseAPI}
 */
export class BatchStatusApi extends BaseAPI {
    /**
     * 
     * @summary Retrieves a list of all operation statuses in blockchain
     * @param {BatchStatusApiApiBatchStatusesGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof BatchStatusApi
     */
    public apiBatchStatusesGet(requestParameters: BatchStatusApiApiBatchStatusesGetRequest = {}, options?: any) {
        return BatchStatusApiFp(this.configuration).apiBatchStatusesGet(requestParameters.page, requestParameters.size, requestParameters.sort, requestParameters.type, requestParameters.status, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/category-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { CategoryAdminCategory } from '../models';
// @ts-ignore
import { CategoryDeleteInput } from '../models';
// @ts-ignore
import { CategoryUpdateInput } from '../models';
/**
 * CategoryApi - axios parameter creator
 * @export
 */
export const CategoryApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Delete categories of fund
         * @param {CategoryDeleteInput} [body] array of ids to be deleted
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCategoriesDelete: async (body?: CategoryDeleteInput, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/categories`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'DELETE', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Get categories of fund
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCategoriesGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/categories`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Create or update existing categories of fund
         * @param {CategoryUpdateInput} [body] array with new categories
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCategoriesPost: async (body?: CategoryUpdateInput, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/categories`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * CategoryApi - functional programming interface
 * @export
 */
export const CategoryApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Delete categories of fund
         * @param {CategoryDeleteInput} [body] array of ids to be deleted
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCategoriesDelete(body?: CategoryDeleteInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await CategoryApiAxiosParamCreator(configuration).apiCategoriesDelete(body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Get categories of fund
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCategoriesGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<CategoryAdminCategory>>> {
            const localVarAxiosArgs = await CategoryApiAxiosParamCreator(configuration).apiCategoriesGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Create or update existing categories of fund
         * @param {CategoryUpdateInput} [body] array with new categories
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCategoriesPost(body?: CategoryUpdateInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await CategoryApiAxiosParamCreator(configuration).apiCategoriesPost(body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * CategoryApi - factory interface
 * @export
 */
export const CategoryApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Delete categories of fund
         * @param {CategoryDeleteInput} [body] array of ids to be deleted
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCategoriesDelete(body?: CategoryDeleteInput, options?: any): AxiosPromise<void> {
            return CategoryApiFp(configuration).apiCategoriesDelete(body, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Get categories of fund
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCategoriesGet(options?: any): AxiosPromise<Array<CategoryAdminCategory>> {
            return CategoryApiFp(configuration).apiCategoriesGet(options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Create or update existing categories of fund
         * @param {CategoryUpdateInput} [body] array with new categories
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCategoriesPost(body?: CategoryUpdateInput, options?: any): AxiosPromise<void> {
            return CategoryApiFp(configuration).apiCategoriesPost(body, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiCategoriesDelete operation in CategoryApi.
 * @export
 * @interface CategoryApiApiCategoriesDeleteRequest
 */
export interface CategoryApiApiCategoriesDeleteRequest {
    /**
     * array of ids to be deleted
     * @type {CategoryDeleteInput}
     * @memberof CategoryApiApiCategoriesDelete
     */
    readonly body?: CategoryDeleteInput
}

/**
 * Request parameters for apiCategoriesPost operation in CategoryApi.
 * @export
 * @interface CategoryApiApiCategoriesPostRequest
 */
export interface CategoryApiApiCategoriesPostRequest {
    /**
     * array with new categories
     * @type {CategoryUpdateInput}
     * @memberof CategoryApiApiCategoriesPost
     */
    readonly body?: CategoryUpdateInput
}

/**
 * CategoryApi - object-oriented interface
 * @export
 * @class CategoryApi
 * @extends {BaseAPI}
 */
export class CategoryApi extends BaseAPI {
    /**
     * 
     * @summary Delete categories of fund
     * @param {CategoryApiApiCategoriesDeleteRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CategoryApi
     */
    public apiCategoriesDelete(requestParameters: CategoryApiApiCategoriesDeleteRequest = {}, options?: any) {
        return CategoryApiFp(this.configuration).apiCategoriesDelete(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Get categories of fund
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CategoryApi
     */
    public apiCategoriesGet(options?: any) {
        return CategoryApiFp(this.configuration).apiCategoriesGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Create or update existing categories of fund
     * @param {CategoryApiApiCategoriesPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CategoryApi
     */
    public apiCategoriesPost(requestParameters: CategoryApiApiCategoriesPostRequest = {}, options?: any) {
        return CategoryApiFp(this.configuration).apiCategoriesPost(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/charity-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { CharityFaq } from '../models';
// @ts-ignore
import { CharityFaqInput } from '../models';
// @ts-ignore
import { CharityFundInfo } from '../models';
// @ts-ignore
import { CharityFundInfoResponse } from '../models';
// @ts-ignore
import { CharityFundInput } from '../models';
// @ts-ignore
import { UtilsMoneyJson } from '../models';
/**
 * CharityApi - axios parameter creator
 * @export
 */
export const CharityApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Get balance of charity
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityBalanceGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/charity/balance`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Get fund\'s faq
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityFaqGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/charity/faq`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Update fund\'s faq
         * @param {CharityFaqInput} [body] faq
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityFaqPatch: async (body?: CharityFaqInput, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/charity/faq`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Get info about fund
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/charity`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Update info about fund
         * @param {CharityFundInput} [body] input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityPatch: async (body?: CharityFundInput, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/charity`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * CharityApi - functional programming interface
 * @export
 */
export const CharityApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Get balance of charity
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCharityBalanceGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UtilsMoneyJson>> {
            const localVarAxiosArgs = await CharityApiAxiosParamCreator(configuration).apiCharityBalanceGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Get fund\'s faq
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCharityFaqGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<CharityFaq>> {
            const localVarAxiosArgs = await CharityApiAxiosParamCreator(configuration).apiCharityFaqGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Update fund\'s faq
         * @param {CharityFaqInput} [body] faq
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCharityFaqPatch(body?: CharityFaqInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<CharityFaq>> {
            const localVarAxiosArgs = await CharityApiAxiosParamCreator(configuration).apiCharityFaqPatch(body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Get info about fund
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCharityGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<CharityFundInfoResponse>> {
            const localVarAxiosArgs = await CharityApiAxiosParamCreator(configuration).apiCharityGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Update info about fund
         * @param {CharityFundInput} [body] input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiCharityPatch(body?: CharityFundInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<CharityFundInfo>> {
            const localVarAxiosArgs = await CharityApiAxiosParamCreator(configuration).apiCharityPatch(body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * CharityApi - factory interface
 * @export
 */
export const CharityApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Get balance of charity
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityBalanceGet(options?: any): AxiosPromise<UtilsMoneyJson> {
            return CharityApiFp(configuration).apiCharityBalanceGet(options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Get fund\'s faq
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityFaqGet(options?: any): AxiosPromise<CharityFaq> {
            return CharityApiFp(configuration).apiCharityFaqGet(options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Update fund\'s faq
         * @param {CharityFaqInput} [body] faq
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityFaqPatch(body?: CharityFaqInput, options?: any): AxiosPromise<CharityFaq> {
            return CharityApiFp(configuration).apiCharityFaqPatch(body, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Get info about fund
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityGet(options?: any): AxiosPromise<CharityFundInfoResponse> {
            return CharityApiFp(configuration).apiCharityGet(options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Update info about fund
         * @param {CharityFundInput} [body] input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiCharityPatch(body?: CharityFundInput, options?: any): AxiosPromise<CharityFundInfo> {
            return CharityApiFp(configuration).apiCharityPatch(body, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiCharityFaqPatch operation in CharityApi.
 * @export
 * @interface CharityApiApiCharityFaqPatchRequest
 */
export interface CharityApiApiCharityFaqPatchRequest {
    /**
     * faq
     * @type {CharityFaqInput}
     * @memberof CharityApiApiCharityFaqPatch
     */
    readonly body?: CharityFaqInput
}

/**
 * Request parameters for apiCharityPatch operation in CharityApi.
 * @export
 * @interface CharityApiApiCharityPatchRequest
 */
export interface CharityApiApiCharityPatchRequest {
    /**
     * input
     * @type {CharityFundInput}
     * @memberof CharityApiApiCharityPatch
     */
    readonly body?: CharityFundInput
}

/**
 * CharityApi - object-oriented interface
 * @export
 * @class CharityApi
 * @extends {BaseAPI}
 */
export class CharityApi extends BaseAPI {
    /**
     * 
     * @summary Get balance of charity
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CharityApi
     */
    public apiCharityBalanceGet(options?: any) {
        return CharityApiFp(this.configuration).apiCharityBalanceGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Get fund\'s faq
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CharityApi
     */
    public apiCharityFaqGet(options?: any) {
        return CharityApiFp(this.configuration).apiCharityFaqGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Update fund\'s faq
     * @param {CharityApiApiCharityFaqPatchRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CharityApi
     */
    public apiCharityFaqPatch(requestParameters: CharityApiApiCharityFaqPatchRequest = {}, options?: any) {
        return CharityApiFp(this.configuration).apiCharityFaqPatch(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Get info about fund
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CharityApi
     */
    public apiCharityGet(options?: any) {
        return CharityApiFp(this.configuration).apiCharityGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Update info about fund
     * @param {CharityApiApiCharityPatchRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof CharityApi
     */
    public apiCharityPatch(requestParameters: CharityApiApiCharityPatchRequest = {}, options?: any) {
        return CharityApiFp(this.configuration).apiCharityPatch(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/chat-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { ChatAdminInput } from '../models';
// @ts-ignore
import { ChatDialog } from '../models';
// @ts-ignore
import { ChatDialogResponse } from '../models';
// @ts-ignore
import { ChatMessage } from '../models';
// @ts-ignore
import { ChatMessagesResponse } from '../models';
/**
 * ChatApi - axios parameter creator
 * @export
 */
export const ChatApiAxiosParamCreator = function (configuration?: Configuration) {
  return {
    /**
     * 
     * @summary Get list of all dialogs from operator
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] Sort param
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiChatDialogsGet: async (page?: number, size?: number, sort?: string, options: any = {}): Promise<RequestArgs> => {
      const localVarPath = `/api/chat/dialogs`;
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;

      if (page !== undefined) {
        localVarQueryParameter['page'] = page;
      }

      if (size !== undefined) {
        localVarQueryParameter['size'] = size;
      }

      if (sort !== undefined) {
        localVarQueryParameter['sort'] = sort;
      }



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Get dialog entity
     * @param {string} id Dialog id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiChatDialogsIdGet: async (id: string, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiChatDialogsIdGet.');
      }
      const localVarPath = `/api/chat/dialogs/{id}`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Get messages by dialog id
     * @param {number} [size] Page size
     * @param {string} id Dialog id
     * @param {string} [cursor] id of last displayed message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    // @ts-ignore
    apiChatDialogsIdMessagesGet: async (size?: number, id: string, cursor?: string, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiChatDialogsIdMessagesGet.');
      }
      const localVarPath = `/api/chat/dialogs/{id}/messages`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;

      if (size !== undefined) {
        localVarQueryParameter['size'] = size;
      }

      if (cursor !== undefined) {
        localVarQueryParameter['cursor'] = cursor;
      }



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Send message from operator
     * @param {ChatAdminInput} [body] Message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiChatOperatorPost: async (body?: ChatAdminInput, options: any = {}): Promise<RequestArgs> => {
      const localVarPath = `/api/chat/operator`;
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      localVarHeaderParameter['Content-Type'] = 'application/json';

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };
      const nonString = typeof body !== 'string';
      const needsSerialization = nonString && configuration && configuration.isJsonMime
        ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
        : nonString;
      localVarRequestOptions.data = needsSerialization
        ? JSON.stringify(body !== undefined ? body : {})
        : (body || "");

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
  }
};

/**
 * ChatApi - functional programming interface
 * @export
 */
export const ChatApiFp = function (configuration?: Configuration) {
  return {
    /**
     * 
     * @summary Get list of all dialogs from operator
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] Sort param
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiChatDialogsGet(page?: number, size?: number, sort?: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<ChatDialogResponse>> {
      const localVarAxiosArgs = await ChatApiAxiosParamCreator(configuration).apiChatDialogsGet(page, size, sort, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Get dialog entity
     * @param {string} id Dialog id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiChatDialogsIdGet(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<ChatDialog>> {
      const localVarAxiosArgs = await ChatApiAxiosParamCreator(configuration).apiChatDialogsIdGet(id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Get messages by dialog id
     * @param {number} [size] Page size
     * @param {string} id Dialog id
     * @param {string} [cursor] id of last displayed message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    // @ts-ignore
    async apiChatDialogsIdMessagesGet(size?: number, id: string, cursor?: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<ChatMessagesResponse>> {
      const localVarAxiosArgs = await ChatApiAxiosParamCreator(configuration).apiChatDialogsIdMessagesGet(size, id, cursor, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Send message from operator
     * @param {ChatAdminInput} [body] Message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiChatOperatorPost(body?: ChatAdminInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<ChatMessage>> {
      const localVarAxiosArgs = await ChatApiAxiosParamCreator(configuration).apiChatOperatorPost(body, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
  }
};

/**
 * ChatApi - factory interface
 * @export
 */
export const ChatApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
  return {
    /**
     * 
     * @summary Get list of all dialogs from operator
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] Sort param
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiChatDialogsGet(page?: number, size?: number, sort?: string, options?: any): AxiosPromise<ChatDialogResponse> {
      return ChatApiFp(configuration).apiChatDialogsGet(page, size, sort, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Get dialog entity
     * @param {string} id Dialog id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiChatDialogsIdGet(id: string, options?: any): AxiosPromise<ChatDialog> {
      return ChatApiFp(configuration).apiChatDialogsIdGet(id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Get messages by dialog id
     * @param {number} [size] Page size
     * @param {string} id Dialog id
     * @param {string} [cursor] id of last displayed message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    // @ts-ignore
    apiChatDialogsIdMessagesGet(size?: number, id: string, cursor?: string, options?: any): AxiosPromise<ChatMessagesResponse> {
      return ChatApiFp(configuration).apiChatDialogsIdMessagesGet(size, id, cursor, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Send message from operator
     * @param {ChatAdminInput} [body] Message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiChatOperatorPost(body?: ChatAdminInput, options?: any): AxiosPromise<ChatMessage> {
      return ChatApiFp(configuration).apiChatOperatorPost(body, options).then((request) => request(axios, basePath));
    },
  };
};

/**
 * Request parameters for apiChatDialogsGet operation in ChatApi.
 * @export
 * @interface ChatApiApiChatDialogsGetRequest
 */
export interface ChatApiApiChatDialogsGetRequest {
  /**
   * Page number
   * @type {number}
   * @memberof ChatApiApiChatDialogsGet
   */
  readonly page?: number

  /**
   * Page size
   * @type {number}
   * @memberof ChatApiApiChatDialogsGet
   */
  readonly size?: number

  /**
   * Sort param
   * @type {string}
   * @memberof ChatApiApiChatDialogsGet
   */
  readonly sort?: string
}

/**
 * Request parameters for apiChatDialogsIdGet operation in ChatApi.
 * @export
 * @interface ChatApiApiChatDialogsIdGetRequest
 */
export interface ChatApiApiChatDialogsIdGetRequest {
  /**
   * Dialog id
   * @type {string}
   * @memberof ChatApiApiChatDialogsIdGet
   */
  readonly id: string
}

/**
 * Request parameters for apiChatDialogsIdMessagesGet operation in ChatApi.
 * @export
 * @interface ChatApiApiChatDialogsIdMessagesGetRequest
 */
export interface ChatApiApiChatDialogsIdMessagesGetRequest {
  /**
   * Page size
   * @type {number}
   * @memberof ChatApiApiChatDialogsIdMessagesGet
   */
  readonly size?: number

  /**
   * Dialog id
   * @type {string}
   * @memberof ChatApiApiChatDialogsIdMessagesGet
   */
  readonly id: string

  /**
   * id of last displayed message
   * @type {string}
   * @memberof ChatApiApiChatDialogsIdMessagesGet
   */
  readonly cursor?: string
}

/**
 * Request parameters for apiChatOperatorPost operation in ChatApi.
 * @export
 * @interface ChatApiApiChatOperatorPostRequest
 */
export interface ChatApiApiChatOperatorPostRequest {
  /**
   * Message
   * @type {ChatAdminInput}
   * @memberof ChatApiApiChatOperatorPost
   */
  readonly body?: ChatAdminInput
}

/**
 * ChatApi - object-oriented interface
 * @export
 * @class ChatApi
 * @extends {BaseAPI}
 */
export class ChatApi extends BaseAPI {
  /**
   * 
   * @summary Get list of all dialogs from operator
   * @param {ChatApiApiChatDialogsGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof ChatApi
   */
  public apiChatDialogsGet(requestParameters: ChatApiApiChatDialogsGetRequest = {}, options?: any) {
    return ChatApiFp(this.configuration).apiChatDialogsGet(requestParameters.page, requestParameters.size, requestParameters.sort, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Get dialog entity
   * @param {ChatApiApiChatDialogsIdGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof ChatApi
   */
  public apiChatDialogsIdGet(requestParameters: ChatApiApiChatDialogsIdGetRequest, options?: any) {
    return ChatApiFp(this.configuration).apiChatDialogsIdGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Get messages by dialog id
   * @param {ChatApiApiChatDialogsIdMessagesGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof ChatApi
   */
  public apiChatDialogsIdMessagesGet(requestParameters: ChatApiApiChatDialogsIdMessagesGetRequest, options?: any) {
    return ChatApiFp(this.configuration).apiChatDialogsIdMessagesGet(requestParameters.size, requestParameters.id, requestParameters.cursor, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Send message from operator
   * @param {ChatApiApiChatOperatorPostRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof ChatApi
   */
  public apiChatOperatorPost(requestParameters: ChatApiApiChatOperatorPostRequest = {}, options?: any) {
    return ChatApiFp(this.configuration).apiChatOperatorPost(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
  }
}
\end{lstlisting}
\subsection{@generated/api/donation-request-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { DonationRequestBody } from '../models';
// @ts-ignore
import { DonationRequestComment } from '../models';
// @ts-ignore
import { DonationRequestDonationRequest } from '../models';
// @ts-ignore
import { DonationRequestHistoryResponse } from '../models';
// @ts-ignore
import { DonationRequestInput } from '../models';
// @ts-ignore
import { DonationRequestResponse } from '../models';
// @ts-ignore
import { DonationRequestReviewResponse } from '../models';
// @ts-ignore
import { DonationRequestSubmitReviewInput } from '../models';
// @ts-ignore
import { DonationRequestSuperManagerInput } from '../models';
// @ts-ignore
import { DonationRequestUpdateInput } from '../models';
// @ts-ignore
import { DonationRequestUpdateStatusInput } from '../models';
/**
 * DonationRequestApi - axios parameter creator
 * @export
 */
export const DonationRequestApiAxiosParamCreator = function (configuration?: Configuration) {
  return {
    /**
     * 
     * @summary Creates donation request from fund
     * @param {DonationRequestSuperManagerInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestFromManagerPost: async (request: DonationRequestSuperManagerInput, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'request' is not null or undefined
      if (request === null || request === undefined) {
        throw new RequiredError('request', 'Required parameter request was null or undefined when calling apiDonationRequestFromManagerPost.');
      }
      const localVarPath = `/api/donation-request/from_manager`;
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      localVarHeaderParameter['Content-Type'] = 'application/json';

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };
      const nonString = typeof request !== 'string';
      const needsSerialization = nonString && configuration && configuration.isJsonMime
        ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
        : nonString;
      localVarRequestOptions.data = needsSerialization
        ? JSON.stringify(request !== undefined ? request : {})
        : (request || "");

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Retrieves all donation requests
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] Sort param
     * @param {Array<string>} [author] request author id
     * @param {Array<string>} [assignee] request assignee id
     * @param {Array<string>} [status] request status
     * @param {Array<string>} [category] request category
     * @param {string} [searchString] id &#x3D;&#x3D; searchString OR title LIKE searchString OR description LIKE searchString
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestGet: async (page?: number, size?: number, sort?: string, author?: Array<string>, assignee?: Array<string>, status?: Array<string>, category?: Array<string>, searchString?: string, options: any = {}): Promise<RequestArgs> => {
      const localVarPath = `/api/donation-request/`;
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;

      if (page !== undefined) {
        localVarQueryParameter['page'] = page;
      }

      if (size !== undefined) {
        localVarQueryParameter['size'] = size;
      }

      if (sort !== undefined) {
        localVarQueryParameter['sort'] = sort;
      }

      if (author) {
        localVarQueryParameter['author'] = author;
      }

      if (assignee) {
        localVarQueryParameter['assignee'] = assignee;
      }

      if (searchString !== undefined) {
        localVarQueryParameter['searchString'] = searchString;
      }


      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      // status=a&status=b
      if (status) {
        for (const index in status) {
          queryParameters.append('status', status[index]);
        }
      }
      // category=a&category=b
      if (category) {
        for (const index in category) {
          queryParameters.append('category', category[index]);
        }
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Get comments for a given application
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdCommentsGet: async (id: number, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdCommentsGet.');
      }
      const localVarPath = `/api/donation-request/{id}/comments`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Retrieves donation request based on given ID
     * @param {number} id Donation request ID
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdGet: async (id: number, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdGet.');
      }
      const localVarPath = `/api/donation-request/{id}`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Get all SuperManagers responsible for category of application
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdGetAllReviewersGet: async (id: number, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdGetAllReviewersGet.');
      }
      const localVarPath = `/api/donation-request/{id}/get_all_reviewers`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Gets history of status changes
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] sort
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    // @ts-ignore
    apiDonationRequestIdHistoryGet: async (page?: number, size?: number, sort?: string, id: number, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdHistoryGet.');
      }
      const localVarPath = `/api/donation-request/{id}/history`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;

      if (page !== undefined) {
        localVarQueryParameter['page'] = page;
      }

      if (size !== undefined) {
        localVarQueryParameter['size'] = size;
      }

      if (sort !== undefined) {
        localVarQueryParameter['sort'] = sort;
      }



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Updates donation request
     * @param {number} id Donation request ID
     * @param {DonationRequestUpdateInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdPatch: async (id: number, request: DonationRequestUpdateInput, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdPatch.');
      }
      // verify required parameter 'request' is not null or undefined
      if (request === null || request === undefined) {
        throw new RequiredError('request', 'Required parameter request was null or undefined when calling apiDonationRequestIdPatch.');
      }
      const localVarPath = `/api/donation-request/{id}`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      localVarHeaderParameter['Content-Type'] = 'application/json';

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };
      const nonString = typeof request !== 'string';
      const needsSerialization = nonString && configuration && configuration.isJsonMime
        ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
        : nonString;
      localVarRequestOptions.data = needsSerialization
        ? JSON.stringify(request !== undefined ? request : {})
        : (request || "");

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary RollBacks status of donation request
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdStatusDelete: async (id: number, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdStatusDelete.');
      }
      const localVarPath = `/api/donation-request/{id}/status`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'DELETE', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Updates status of donation request
     * @param {number} id donation request id
     * @param {DonationRequestUpdateStatusInput} [input] Status and message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdStatusPatch: async (id: number, input?: DonationRequestUpdateStatusInput, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdStatusPatch.');
      }
      const localVarPath = `/api/donation-request/{id}/status`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      localVarHeaderParameter['Content-Type'] = 'application/json';

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };
      const nonString = typeof input !== 'string';
      const needsSerialization = nonString && configuration && configuration.isJsonMime
        ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
        : nonString;
      localVarRequestOptions.data = needsSerialization
        ? JSON.stringify(input !== undefined ? input : {})
        : (input || "");

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Submit result of application review
     * @param {number} id donation request id
     * @param {DonationRequestSubmitReviewInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdSubmitReviewPatch: async (id: number, request: DonationRequestSubmitReviewInput, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiDonationRequestIdSubmitReviewPatch.');
      }
      // verify required parameter 'request' is not null or undefined
      if (request === null || request === undefined) {
        throw new RequiredError('request', 'Required parameter request was null or undefined when calling apiDonationRequestIdSubmitReviewPatch.');
      }
      const localVarPath = `/api/donation-request/{id}/submit_review`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      localVarHeaderParameter['Content-Type'] = 'application/json';

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };
      const nonString = typeof request !== 'string';
      const needsSerialization = nonString && configuration && configuration.isJsonMime
        ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
        : nonString;
      localVarRequestOptions.data = needsSerialization
        ? JSON.stringify(request !== undefined ? request : {})
        : (request || "");

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Creates donation request
     * @param {DonationRequestInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestPost: async (request: DonationRequestInput, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'request' is not null or undefined
      if (request === null || request === undefined) {
        throw new RequiredError('request', 'Required parameter request was null or undefined when calling apiDonationRequestPost.');
      }
      const localVarPath = `/api/donation-request`;
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      localVarHeaderParameter['Content-Type'] = 'application/json';

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };
      const nonString = typeof request !== 'string';
      const needsSerialization = nonString && configuration && configuration.isJsonMime
        ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
        : nonString;
      localVarRequestOptions.data = needsSerialization
        ? JSON.stringify(request !== undefined ? request : {})
        : (request || "");

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
  }
};

/**
 * DonationRequestApi - functional programming interface
 * @export
 */
export const DonationRequestApiFp = function (configuration?: Configuration) {
  return {
    /**
     * 
     * @summary Creates donation request from fund
     * @param {DonationRequestSuperManagerInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestFromManagerPost(request: DonationRequestSuperManagerInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestFromManagerPost(request, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Retrieves all donation requests
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] Sort param
     * @param {Array<string>} [author] request author id
     * @param {Array<string>} [assignee] request assignee id
     * @param {Array<string>} [status] request status
     * @param {Array<string>} [category] request category
     * @param {string} [searchString] id &#x3D;&#x3D; searchString OR title LIKE searchString OR description LIKE searchString
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestGet(page?: number, size?: number, sort?: string, author?: Array<string>, assignee?: Array<string>, status?: Array<string>, category?: Array<string>, searchString?: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<DonationRequestResponse>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestGet(page, size, sort, author, assignee, status, category, searchString, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Get comments for a given application
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestIdCommentsGet(id: number, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<DonationRequestComment>>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdCommentsGet(id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Retrieves donation request based on given ID
     * @param {number} id Donation request ID
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestIdGet(id: number, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<DonationRequestBody>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdGet(id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Get all SuperManagers responsible for category of application
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestIdGetAllReviewersGet(id: number, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<DonationRequestReviewResponse>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdGetAllReviewersGet(id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Gets history of status changes
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] sort
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    // @ts-ignore
    async apiDonationRequestIdHistoryGet(page?: number, size?: number, sort?: string, id: number, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<DonationRequestHistoryResponse>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdHistoryGet(page, size, sort, id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Updates donation request
     * @param {number} id Donation request ID
     * @param {DonationRequestUpdateInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestIdPatch(id: number, request: DonationRequestUpdateInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdPatch(id, request, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary RollBacks status of donation request
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestIdStatusDelete(id: number, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<DonationRequestDonationRequest>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdStatusDelete(id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Updates status of donation request
     * @param {number} id donation request id
     * @param {DonationRequestUpdateStatusInput} [input] Status and message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestIdStatusPatch(id: number, input?: DonationRequestUpdateStatusInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdStatusPatch(id, input, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Submit result of application review
     * @param {number} id donation request id
     * @param {DonationRequestSubmitReviewInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestIdSubmitReviewPatch(id: number, request: DonationRequestSubmitReviewInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestIdSubmitReviewPatch(id, request, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Creates donation request
     * @param {DonationRequestInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiDonationRequestPost(request: DonationRequestInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
      const localVarAxiosArgs = await DonationRequestApiAxiosParamCreator(configuration).apiDonationRequestPost(request, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
  }
};

/**
 * DonationRequestApi - factory interface
 * @export
 */
export const DonationRequestApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
  return {
    /**
     * 
     * @summary Creates donation request from fund
     * @param {DonationRequestSuperManagerInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestFromManagerPost(request: DonationRequestSuperManagerInput, options?: any): AxiosPromise<void> {
      return DonationRequestApiFp(configuration).apiDonationRequestFromManagerPost(request, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Retrieves all donation requests
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] Sort param
     * @param {Array<string>} [author] request author id
     * @param {Array<string>} [assignee] request assignee id
     * @param {Array<string>} [status] request status
     * @param {Array<string>} [category] request category
     * @param {string} [searchString] id &#x3D;&#x3D; searchString OR title LIKE searchString OR description LIKE searchString
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestGet(page?: number, size?: number, sort?: string, author?: Array<string>, assignee?: Array<string>, status?: Array<string>, category?: Array<string>, searchString?: string, options?: any): AxiosPromise<DonationRequestResponse> {
      return DonationRequestApiFp(configuration).apiDonationRequestGet(page, size, sort, author, assignee, status, category, searchString, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Get comments for a given application
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdCommentsGet(id: number, options?: any): AxiosPromise<Array<DonationRequestComment>> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdCommentsGet(id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Retrieves donation request based on given ID
     * @param {number} id Donation request ID
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdGet(id: number, options?: any): AxiosPromise<DonationRequestBody> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdGet(id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Get all SuperManagers responsible for category of application
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdGetAllReviewersGet(id: number, options?: any): AxiosPromise<DonationRequestReviewResponse> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdGetAllReviewersGet(id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Gets history of status changes
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] sort
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    // @ts-ignore
    apiDonationRequestIdHistoryGet(page?: number, size?: number, sort?: string, id: number, options?: any): AxiosPromise<DonationRequestHistoryResponse> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdHistoryGet(page, size, sort, id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Updates donation request
     * @param {number} id Donation request ID
     * @param {DonationRequestUpdateInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdPatch(id: number, request: DonationRequestUpdateInput, options?: any): AxiosPromise<void> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdPatch(id, request, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary RollBacks status of donation request
     * @param {number} id donation request id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdStatusDelete(id: number, options?: any): AxiosPromise<DonationRequestDonationRequest> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdStatusDelete(id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Updates status of donation request
     * @param {number} id donation request id
     * @param {DonationRequestUpdateStatusInput} [input] Status and message
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdStatusPatch(id: number, input?: DonationRequestUpdateStatusInput, options?: any): AxiosPromise<void> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdStatusPatch(id, input, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Submit result of application review
     * @param {number} id donation request id
     * @param {DonationRequestSubmitReviewInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestIdSubmitReviewPatch(id: number, request: DonationRequestSubmitReviewInput, options?: any): AxiosPromise<void> {
      return DonationRequestApiFp(configuration).apiDonationRequestIdSubmitReviewPatch(id, request, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Creates donation request
     * @param {DonationRequestInput} request Donation request Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiDonationRequestPost(request: DonationRequestInput, options?: any): AxiosPromise<void> {
      return DonationRequestApiFp(configuration).apiDonationRequestPost(request, options).then((request) => request(axios, basePath));
    },
  };
};

/**
 * Request parameters for apiDonationRequestFromManagerPost operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestFromManagerPostRequest
 */
export interface DonationRequestApiApiDonationRequestFromManagerPostRequest {
  /**
   * Donation request Input
   * @type {DonationRequestSuperManagerInput}
   * @memberof DonationRequestApiApiDonationRequestFromManagerPost
   */
  readonly request: DonationRequestSuperManagerInput
}

/**
 * Request parameters for apiDonationRequestGet operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestGetRequest
 */
export interface DonationRequestApiApiDonationRequestGetRequest {
  /**
   * Page number
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly page?: number

  /**
   * Page size
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly size?: number

  /**
   * Sort param
   * @type {string}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly sort?: string

  /**
   * request author id
   * @type {Array<string>}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly author?: Array<string>

  /**
   * request assignee id
   * @type {Array<string>}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly assignee?: Array<string>

  /**
   * request status
   * @type {Array<string>}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly status?: Array<string>

  /**
   * request category
   * @type {Array<string>}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly category?: Array<string>

  /**
   * id &#x3D;&#x3D; searchString OR title LIKE searchString OR description LIKE searchString
   * @type {string}
   * @memberof DonationRequestApiApiDonationRequestGet
   */
  readonly searchString?: string
}

/**
 * Request parameters for apiDonationRequestIdCommentsGet operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdCommentsGetRequest
 */
export interface DonationRequestApiApiDonationRequestIdCommentsGetRequest {
  /**
   * donation request id
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdCommentsGet
   */
  readonly id: number
}

/**
 * Request parameters for apiDonationRequestIdGet operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdGetRequest
 */
export interface DonationRequestApiApiDonationRequestIdGetRequest {
  /**
   * Donation request ID
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdGet
   */
  readonly id: number
}

/**
 * Request parameters for apiDonationRequestIdGetAllReviewersGet operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdGetAllReviewersGetRequest
 */
export interface DonationRequestApiApiDonationRequestIdGetAllReviewersGetRequest {
  /**
   * donation request id
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdGetAllReviewersGet
   */
  readonly id: number
}

/**
 * Request parameters for apiDonationRequestIdHistoryGet operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdHistoryGetRequest
 */
export interface DonationRequestApiApiDonationRequestIdHistoryGetRequest {
  /**
   * Page number
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdHistoryGet
   */
  readonly page?: number

  /**
   * Page size
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdHistoryGet
   */
  readonly size?: number

  /**
   * sort
   * @type {string}
   * @memberof DonationRequestApiApiDonationRequestIdHistoryGet
   */
  readonly sort?: string

  /**
   * donation request id
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdHistoryGet
   */
  readonly id: number
}

/**
 * Request parameters for apiDonationRequestIdPatch operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdPatchRequest
 */
export interface DonationRequestApiApiDonationRequestIdPatchRequest {
  /**
   * Donation request ID
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdPatch
   */
  readonly id: number

  /**
   * Donation request Input
   * @type {DonationRequestUpdateInput}
   * @memberof DonationRequestApiApiDonationRequestIdPatch
   */
  readonly request: DonationRequestUpdateInput
}

/**
 * Request parameters for apiDonationRequestIdStatusDelete operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdStatusDeleteRequest
 */
export interface DonationRequestApiApiDonationRequestIdStatusDeleteRequest {
  /**
   * donation request id
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdStatusDelete
   */
  readonly id: number
}

/**
 * Request parameters for apiDonationRequestIdStatusPatch operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdStatusPatchRequest
 */
export interface DonationRequestApiApiDonationRequestIdStatusPatchRequest {
  /**
   * donation request id
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdStatusPatch
   */
  readonly id: number

  /**
   * Status and message
   * @type {DonationRequestUpdateStatusInput}
   * @memberof DonationRequestApiApiDonationRequestIdStatusPatch
   */
  readonly input?: DonationRequestUpdateStatusInput
}

/**
 * Request parameters for apiDonationRequestIdSubmitReviewPatch operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestIdSubmitReviewPatchRequest
 */
export interface DonationRequestApiApiDonationRequestIdSubmitReviewPatchRequest {
  /**
   * donation request id
   * @type {number}
   * @memberof DonationRequestApiApiDonationRequestIdSubmitReviewPatch
   */
  readonly id: number

  /**
   * Donation request Input
   * @type {DonationRequestSubmitReviewInput}
   * @memberof DonationRequestApiApiDonationRequestIdSubmitReviewPatch
   */
  readonly request: DonationRequestSubmitReviewInput
}

/**
 * Request parameters for apiDonationRequestPost operation in DonationRequestApi.
 * @export
 * @interface DonationRequestApiApiDonationRequestPostRequest
 */
export interface DonationRequestApiApiDonationRequestPostRequest {
  /**
   * Donation request Input
   * @type {DonationRequestInput}
   * @memberof DonationRequestApiApiDonationRequestPost
   */
  readonly request: DonationRequestInput
}

/**
 * DonationRequestApi - object-oriented interface
 * @export
 * @class DonationRequestApi
 * @extends {BaseAPI}
 */
export class DonationRequestApi extends BaseAPI {
  /**
   * 
   * @summary Creates donation request from fund
   * @param {DonationRequestApiApiDonationRequestFromManagerPostRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestFromManagerPost(requestParameters: DonationRequestApiApiDonationRequestFromManagerPostRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestFromManagerPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Retrieves all donation requests
   * @param {DonationRequestApiApiDonationRequestGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestGet(requestParameters: DonationRequestApiApiDonationRequestGetRequest = {}, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestGet(requestParameters.page, requestParameters.size, requestParameters.sort, requestParameters.author, requestParameters.assignee, requestParameters.status, requestParameters.category, requestParameters.searchString, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Get comments for a given application
   * @param {DonationRequestApiApiDonationRequestIdCommentsGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdCommentsGet(requestParameters: DonationRequestApiApiDonationRequestIdCommentsGetRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdCommentsGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Retrieves donation request based on given ID
   * @param {DonationRequestApiApiDonationRequestIdGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdGet(requestParameters: DonationRequestApiApiDonationRequestIdGetRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Get all SuperManagers responsible for category of application
   * @param {DonationRequestApiApiDonationRequestIdGetAllReviewersGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdGetAllReviewersGet(requestParameters: DonationRequestApiApiDonationRequestIdGetAllReviewersGetRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdGetAllReviewersGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Gets history of status changes
   * @param {DonationRequestApiApiDonationRequestIdHistoryGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdHistoryGet(requestParameters: DonationRequestApiApiDonationRequestIdHistoryGetRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdHistoryGet(requestParameters.page, requestParameters.size, requestParameters.sort, requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Updates donation request
   * @param {DonationRequestApiApiDonationRequestIdPatchRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdPatch(requestParameters: DonationRequestApiApiDonationRequestIdPatchRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdPatch(requestParameters.id, requestParameters.request, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary RollBacks status of donation request
   * @param {DonationRequestApiApiDonationRequestIdStatusDeleteRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdStatusDelete(requestParameters: DonationRequestApiApiDonationRequestIdStatusDeleteRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdStatusDelete(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Updates status of donation request
   * @param {DonationRequestApiApiDonationRequestIdStatusPatchRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdStatusPatch(requestParameters: DonationRequestApiApiDonationRequestIdStatusPatchRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdStatusPatch(requestParameters.id, requestParameters.input, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Submit result of application review
   * @param {DonationRequestApiApiDonationRequestIdSubmitReviewPatchRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestIdSubmitReviewPatch(requestParameters: DonationRequestApiApiDonationRequestIdSubmitReviewPatchRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestIdSubmitReviewPatch(requestParameters.id, requestParameters.request, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Creates donation request
   * @param {DonationRequestApiApiDonationRequestPostRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof DonationRequestApi
   */
  public apiDonationRequestPost(requestParameters: DonationRequestApiApiDonationRequestPostRequest, options?: any) {
    return DonationRequestApiFp(this.configuration).apiDonationRequestPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
  }
}
\end{lstlisting}
\subsection{@generated/api/donations-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { BlockchainDonation } from '../models';
// @ts-ignore
import { BlockchainDonationsResponse } from '../models';
/**
 * DonationsApi - axios parameter creator
 * @export
 */
export const DonationsApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Retrieves a list of donations
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {string} [user] Only for manager
         * @param {string} [application] User can access only his donations
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiDonationsGet: async (page?: number, size?: number, sort?: string, user?: string, application?: string, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/donations`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;

            if (page !== undefined) {
                localVarQueryParameter['page'] = page;
            }

            if (size !== undefined) {
                localVarQueryParameter['size'] = size;
            }

            if (sort !== undefined) {
                localVarQueryParameter['sort'] = sort;
            }

            if (user !== undefined) {
                localVarQueryParameter['user'] = user;
            }

            if (application !== undefined) {
                localVarQueryParameter['application'] = application;
            }


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Returns donation with a given id
         * @param {string} id Donation ID
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiDonationsIdGet: async (id: string, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'id' is not null or undefined
            if (id === null || id === undefined) {
                throw new RequiredError('id','Required parameter id was null or undefined when calling apiDonationsIdGet.');
            }
            const localVarPath = `/api/donations/{id}`
                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * DonationsApi - functional programming interface
 * @export
 */
export const DonationsApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Retrieves a list of donations
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {string} [user] Only for manager
         * @param {string} [application] User can access only his donations
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiDonationsGet(page?: number, size?: number, sort?: string, user?: string, application?: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<BlockchainDonationsResponse>> {
            const localVarAxiosArgs = await DonationsApiAxiosParamCreator(configuration).apiDonationsGet(page, size, sort, user, application, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Returns donation with a given id
         * @param {string} id Donation ID
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiDonationsIdGet(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<BlockchainDonation>> {
            const localVarAxiosArgs = await DonationsApiAxiosParamCreator(configuration).apiDonationsIdGet(id, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * DonationsApi - factory interface
 * @export
 */
export const DonationsApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Retrieves a list of donations
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {string} [user] Only for manager
         * @param {string} [application] User can access only his donations
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiDonationsGet(page?: number, size?: number, sort?: string, user?: string, application?: string, options?: any): AxiosPromise<BlockchainDonationsResponse> {
            return DonationsApiFp(configuration).apiDonationsGet(page, size, sort, user, application, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Returns donation with a given id
         * @param {string} id Donation ID
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiDonationsIdGet(id: string, options?: any): AxiosPromise<BlockchainDonation> {
            return DonationsApiFp(configuration).apiDonationsIdGet(id, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiDonationsGet operation in DonationsApi.
 * @export
 * @interface DonationsApiApiDonationsGetRequest
 */
export interface DonationsApiApiDonationsGetRequest {
    /**
     * Page number
     * @type {number}
     * @memberof DonationsApiApiDonationsGet
     */
    readonly page?: number

    /**
     * Page size
     * @type {number}
     * @memberof DonationsApiApiDonationsGet
     */
    readonly size?: number

    /**
     * Sort param
     * @type {string}
     * @memberof DonationsApiApiDonationsGet
     */
    readonly sort?: string

    /**
     * Only for manager
     * @type {string}
     * @memberof DonationsApiApiDonationsGet
     */
    readonly user?: string

    /**
     * User can access only his donations
     * @type {string}
     * @memberof DonationsApiApiDonationsGet
     */
    readonly application?: string
}

/**
 * Request parameters for apiDonationsIdGet operation in DonationsApi.
 * @export
 * @interface DonationsApiApiDonationsIdGetRequest
 */
export interface DonationsApiApiDonationsIdGetRequest {
    /**
     * Donation ID
     * @type {string}
     * @memberof DonationsApiApiDonationsIdGet
     */
    readonly id: string
}

/**
 * DonationsApi - object-oriented interface
 * @export
 * @class DonationsApi
 * @extends {BaseAPI}
 */
export class DonationsApi extends BaseAPI {
    /**
     * 
     * @summary Retrieves a list of donations
     * @param {DonationsApiApiDonationsGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof DonationsApi
     */
    public apiDonationsGet(requestParameters: DonationsApiApiDonationsGetRequest = {}, options?: any) {
        return DonationsApiFp(this.configuration).apiDonationsGet(requestParameters.page, requestParameters.size, requestParameters.sort, requestParameters.user, requestParameters.application, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Returns donation with a given id
     * @param {DonationsApiApiDonationsIdGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof DonationsApi
     */
    public apiDonationsIdGet(requestParameters: DonationsApiApiDonationsIdGetRequest, options?: any) {
        return DonationsApiFp(this.configuration).apiDonationsIdGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/file-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { FileInfo } from '../models';
/**
 * FileApi - axios parameter creator
 * @export
 */
export const FileApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Gets the binary representation of a file
         * @param {string} id File Id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiFileIdDownloadGet: async (id: string, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'id' is not null or undefined
            if (id === null || id === undefined) {
                throw new RequiredError('id','Required parameter id was null or undefined when calling apiFileIdDownloadGet.');
            }
            const localVarPath = `/api/file/{id}/download`
                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Gets the info about file
         * @param {string} id File Id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiFileIdGet: async (id: string, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'id' is not null or undefined
            if (id === null || id === undefined) {
                throw new RequiredError('id','Required parameter id was null or undefined when calling apiFileIdGet.');
            }
            const localVarPath = `/api/file/{id}`
                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Uploads given file
         * @param {object} [file] File
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiFileUploadPost: async (file?: object, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/file/upload`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;
            const localVarFormParams = new ((configuration && configuration.formDataCtor) || FormData)();


            if (file !== undefined) { 
                localVarFormParams.append('file', new Blob([JSON.stringify(file)], { type: "application/json", }));
            }
    
    
            localVarHeaderParameter['Content-Type'] = 'multipart/form-data';
    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            localVarRequestOptions.data = localVarFormParams;

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * FileApi - functional programming interface
 * @export
 */
export const FileApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Gets the binary representation of a file
         * @param {string} id File Id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiFileIdDownloadGet(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await FileApiAxiosParamCreator(configuration).apiFileIdDownloadGet(id, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Gets the info about file
         * @param {string} id File Id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiFileIdGet(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<FileInfo>> {
            const localVarAxiosArgs = await FileApiAxiosParamCreator(configuration).apiFileIdGet(id, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Uploads given file
         * @param {object} [file] File
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiFileUploadPost(file?: object, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<FileInfo>>> {
            const localVarAxiosArgs = await FileApiAxiosParamCreator(configuration).apiFileUploadPost(file, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * FileApi - factory interface
 * @export
 */
export const FileApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Gets the binary representation of a file
         * @param {string} id File Id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiFileIdDownloadGet(id: string, options?: any): AxiosPromise<void> {
            return FileApiFp(configuration).apiFileIdDownloadGet(id, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Gets the info about file
         * @param {string} id File Id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiFileIdGet(id: string, options?: any): AxiosPromise<FileInfo> {
            return FileApiFp(configuration).apiFileIdGet(id, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Uploads given file
         * @param {object} [file] File
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiFileUploadPost(file?: object, options?: any): AxiosPromise<Array<FileInfo>> {
            return FileApiFp(configuration).apiFileUploadPost(file, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiFileIdDownloadGet operation in FileApi.
 * @export
 * @interface FileApiApiFileIdDownloadGetRequest
 */
export interface FileApiApiFileIdDownloadGetRequest {
    /**
     * File Id
     * @type {string}
     * @memberof FileApiApiFileIdDownloadGet
     */
    readonly id: string
}

/**
 * Request parameters for apiFileIdGet operation in FileApi.
 * @export
 * @interface FileApiApiFileIdGetRequest
 */
export interface FileApiApiFileIdGetRequest {
    /**
     * File Id
     * @type {string}
     * @memberof FileApiApiFileIdGet
     */
    readonly id: string
}

/**
 * Request parameters for apiFileUploadPost operation in FileApi.
 * @export
 * @interface FileApiApiFileUploadPostRequest
 */
export interface FileApiApiFileUploadPostRequest {
    /**
     * File
     * @type {object}
     * @memberof FileApiApiFileUploadPost
     */
    readonly file?: object
}

/**
 * FileApi - object-oriented interface
 * @export
 * @class FileApi
 * @extends {BaseAPI}
 */
export class FileApi extends BaseAPI {
    /**
     * 
     * @summary Gets the binary representation of a file
     * @param {FileApiApiFileIdDownloadGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof FileApi
     */
    public apiFileIdDownloadGet(requestParameters: FileApiApiFileIdDownloadGetRequest, options?: any) {
        return FileApiFp(this.configuration).apiFileIdDownloadGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Gets the info about file
     * @param {FileApiApiFileIdGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof FileApi
     */
    public apiFileIdGet(requestParameters: FileApiApiFileIdGetRequest, options?: any) {
        return FileApiFp(this.configuration).apiFileIdGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Uploads given file
     * @param {FileApiApiFileUploadPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof FileApi
     */
    public apiFileUploadPost(requestParameters: FileApiApiFileUploadPostRequest = {}, options?: any) {
        return FileApiFp(this.configuration).apiFileUploadPost(requestParameters.file, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/login-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { AuthCredentials } from '../models';
/**
 * LoginApi - axios parameter creator
 * @export
 */
export const LoginApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * Sets token on success
         * @summary Route for signing in
         * @param {AuthCredentials} request User credentials
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiLoginPost: async (request: AuthCredentials, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiLoginPost.');
            }
            const localVarPath = `/api/login`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Route for refreshing
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiLoginRefreshPost: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/login/refresh`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Destroys user session
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiLogoutPost: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/logout`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * LoginApi - functional programming interface
 * @export
 */
export const LoginApiFp = function(configuration?: Configuration) {
    return {
        /**
         * Sets token on success
         * @summary Route for signing in
         * @param {AuthCredentials} request User credentials
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiLoginPost(request: AuthCredentials, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await LoginApiAxiosParamCreator(configuration).apiLoginPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Route for refreshing
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiLoginRefreshPost(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await LoginApiAxiosParamCreator(configuration).apiLoginRefreshPost(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Destroys user session
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiLogoutPost(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await LoginApiAxiosParamCreator(configuration).apiLogoutPost(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * LoginApi - factory interface
 * @export
 */
export const LoginApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * Sets token on success
         * @summary Route for signing in
         * @param {AuthCredentials} request User credentials
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiLoginPost(request: AuthCredentials, options?: any): AxiosPromise<void> {
            return LoginApiFp(configuration).apiLoginPost(request, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Route for refreshing
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiLoginRefreshPost(options?: any): AxiosPromise<void> {
            return LoginApiFp(configuration).apiLoginRefreshPost(options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Destroys user session
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiLogoutPost(options?: any): AxiosPromise<void> {
            return LoginApiFp(configuration).apiLogoutPost(options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiLoginPost operation in LoginApi.
 * @export
 * @interface LoginApiApiLoginPostRequest
 */
export interface LoginApiApiLoginPostRequest {
    /**
     * User credentials
     * @type {AuthCredentials}
     * @memberof LoginApiApiLoginPost
     */
    readonly request: AuthCredentials
}

/**
 * LoginApi - object-oriented interface
 * @export
 * @class LoginApi
 * @extends {BaseAPI}
 */
export class LoginApi extends BaseAPI {
    /**
     * Sets token on success
     * @summary Route for signing in
     * @param {LoginApiApiLoginPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof LoginApi
     */
    public apiLoginPost(requestParameters: LoginApiApiLoginPostRequest, options?: any) {
        return LoginApiFp(this.configuration).apiLoginPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Route for refreshing
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof LoginApi
     */
    public apiLoginRefreshPost(options?: any) {
        return LoginApiFp(this.configuration).apiLoginRefreshPost(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Destroys user session
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof LoginApi
     */
    public apiLogoutPost(options?: any) {
        return LoginApiFp(this.configuration).apiLogoutPost(options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/money-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { AuthUnregisteredUser } from '../models';
// @ts-ignore
import { BlockchainDonation } from '../models';
// @ts-ignore
import { BlockchainDonationToApplicationFromFund } from '../models';
// @ts-ignore
import { BlockchainDonationToCharity } from '../models';
// @ts-ignore
import { BlockchainDonationToCharityFromUser } from '../models';
// @ts-ignore
import { ControllersDeposit } from '../models';
// @ts-ignore
import { ControllersDonateRequestInput } from '../models';
// @ts-ignore
import { UserBalance } from '../models';
/**
 * MoneyApi - axios parameter creator
 * @export
 */
export const MoneyApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Gets user\'s balance
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyBalanceGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/money/balance`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Deposit money to user with given ID
         * @param {ControllersDeposit} request Deposit
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDepositPost: async (request: ControllersDeposit, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiMoneyDepositPost.');
            }
            const localVarPath = `/api/money/deposit`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Donate to application from charity
         * @param {BlockchainDonationToApplicationFromFund} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateApplicationFromCharityPost: async (request: BlockchainDonationToApplicationFromFund, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiMoneyDonateApplicationFromCharityPost.');
            }
            const localVarPath = `/api/money/donate/application/from_charity`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Donation to an application with a given ID
         * @param {ControllersDonateRequestInput} request DonateRequestInput
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateApplicationPost: async (request: ControllersDonateRequestInput, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiMoneyDonateApplicationPost.');
            }
            const localVarPath = `/api/money/donate/application`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Donate to charity from manager
         * @param {BlockchainDonationToCharity} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateCharityFromManagerPost: async (request: BlockchainDonationToCharity, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiMoneyDonateCharityFromManagerPost.');
            }
            const localVarPath = `/api/money/donate/charity/from_manager`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Donate to charity from user
         * @param {BlockchainDonationToCharityFromUser} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateCharityFromUserPost: async (request: BlockchainDonationToCharityFromUser, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiMoneyDonateCharityFromUserPost.');
            }
            const localVarPath = `/api/money/donate/charity/from_user`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * MoneyApi - functional programming interface
 * @export
 */
export const MoneyApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Gets user\'s balance
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiMoneyBalanceGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UserBalance>> {
            const localVarAxiosArgs = await MoneyApiAxiosParamCreator(configuration).apiMoneyBalanceGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Deposit money to user with given ID
         * @param {ControllersDeposit} request Deposit
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiMoneyDepositPost(request: ControllersDeposit, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await MoneyApiAxiosParamCreator(configuration).apiMoneyDepositPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Donate to application from charity
         * @param {BlockchainDonationToApplicationFromFund} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiMoneyDonateApplicationFromCharityPost(request: BlockchainDonationToApplicationFromFund, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<BlockchainDonation>> {
            const localVarAxiosArgs = await MoneyApiAxiosParamCreator(configuration).apiMoneyDonateApplicationFromCharityPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Donation to an application with a given ID
         * @param {ControllersDonateRequestInput} request DonateRequestInput
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiMoneyDonateApplicationPost(request: ControllersDonateRequestInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await MoneyApiAxiosParamCreator(configuration).apiMoneyDonateApplicationPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Donate to charity from manager
         * @param {BlockchainDonationToCharity} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiMoneyDonateCharityFromManagerPost(request: BlockchainDonationToCharity, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<AuthUnregisteredUser>> {
            const localVarAxiosArgs = await MoneyApiAxiosParamCreator(configuration).apiMoneyDonateCharityFromManagerPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Donate to charity from user
         * @param {BlockchainDonationToCharityFromUser} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiMoneyDonateCharityFromUserPost(request: BlockchainDonationToCharityFromUser, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await MoneyApiAxiosParamCreator(configuration).apiMoneyDonateCharityFromUserPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * MoneyApi - factory interface
 * @export
 */
export const MoneyApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Gets user\'s balance
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyBalanceGet(options?: any): AxiosPromise<UserBalance> {
            return MoneyApiFp(configuration).apiMoneyBalanceGet(options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Deposit money to user with given ID
         * @param {ControllersDeposit} request Deposit
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDepositPost(request: ControllersDeposit, options?: any): AxiosPromise<void> {
            return MoneyApiFp(configuration).apiMoneyDepositPost(request, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Donate to application from charity
         * @param {BlockchainDonationToApplicationFromFund} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateApplicationFromCharityPost(request: BlockchainDonationToApplicationFromFund, options?: any): AxiosPromise<BlockchainDonation> {
            return MoneyApiFp(configuration).apiMoneyDonateApplicationFromCharityPost(request, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Donation to an application with a given ID
         * @param {ControllersDonateRequestInput} request DonateRequestInput
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateApplicationPost(request: ControllersDonateRequestInput, options?: any): AxiosPromise<void> {
            return MoneyApiFp(configuration).apiMoneyDonateApplicationPost(request, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Donate to charity from manager
         * @param {BlockchainDonationToCharity} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateCharityFromManagerPost(request: BlockchainDonationToCharity, options?: any): AxiosPromise<AuthUnregisteredUser> {
            return MoneyApiFp(configuration).apiMoneyDonateCharityFromManagerPost(request, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Donate to charity from user
         * @param {BlockchainDonationToCharityFromUser} request Donation Input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiMoneyDonateCharityFromUserPost(request: BlockchainDonationToCharityFromUser, options?: any): AxiosPromise<void> {
            return MoneyApiFp(configuration).apiMoneyDonateCharityFromUserPost(request, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiMoneyDepositPost operation in MoneyApi.
 * @export
 * @interface MoneyApiApiMoneyDepositPostRequest
 */
export interface MoneyApiApiMoneyDepositPostRequest {
    /**
     * Deposit
     * @type {ControllersDeposit}
     * @memberof MoneyApiApiMoneyDepositPost
     */
    readonly request: ControllersDeposit
}

/**
 * Request parameters for apiMoneyDonateApplicationFromCharityPost operation in MoneyApi.
 * @export
 * @interface MoneyApiApiMoneyDonateApplicationFromCharityPostRequest
 */
export interface MoneyApiApiMoneyDonateApplicationFromCharityPostRequest {
    /**
     * Donation Input
     * @type {BlockchainDonationToApplicationFromFund}
     * @memberof MoneyApiApiMoneyDonateApplicationFromCharityPost
     */
    readonly request: BlockchainDonationToApplicationFromFund
}

/**
 * Request parameters for apiMoneyDonateApplicationPost operation in MoneyApi.
 * @export
 * @interface MoneyApiApiMoneyDonateApplicationPostRequest
 */
export interface MoneyApiApiMoneyDonateApplicationPostRequest {
    /**
     * DonateRequestInput
     * @type {ControllersDonateRequestInput}
     * @memberof MoneyApiApiMoneyDonateApplicationPost
     */
    readonly request: ControllersDonateRequestInput
}

/**
 * Request parameters for apiMoneyDonateCharityFromManagerPost operation in MoneyApi.
 * @export
 * @interface MoneyApiApiMoneyDonateCharityFromManagerPostRequest
 */
export interface MoneyApiApiMoneyDonateCharityFromManagerPostRequest {
    /**
     * Donation Input
     * @type {BlockchainDonationToCharity}
     * @memberof MoneyApiApiMoneyDonateCharityFromManagerPost
     */
    readonly request: BlockchainDonationToCharity
}

/**
 * Request parameters for apiMoneyDonateCharityFromUserPost operation in MoneyApi.
 * @export
 * @interface MoneyApiApiMoneyDonateCharityFromUserPostRequest
 */
export interface MoneyApiApiMoneyDonateCharityFromUserPostRequest {
    /**
     * Donation Input
     * @type {BlockchainDonationToCharityFromUser}
     * @memberof MoneyApiApiMoneyDonateCharityFromUserPost
     */
    readonly request: BlockchainDonationToCharityFromUser
}

/**
 * MoneyApi - object-oriented interface
 * @export
 * @class MoneyApi
 * @extends {BaseAPI}
 */
export class MoneyApi extends BaseAPI {
    /**
     * 
     * @summary Gets user\'s balance
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof MoneyApi
     */
    public apiMoneyBalanceGet(options?: any) {
        return MoneyApiFp(this.configuration).apiMoneyBalanceGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Deposit money to user with given ID
     * @param {MoneyApiApiMoneyDepositPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof MoneyApi
     */
    public apiMoneyDepositPost(requestParameters: MoneyApiApiMoneyDepositPostRequest, options?: any) {
        return MoneyApiFp(this.configuration).apiMoneyDepositPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Donate to application from charity
     * @param {MoneyApiApiMoneyDonateApplicationFromCharityPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof MoneyApi
     */
    public apiMoneyDonateApplicationFromCharityPost(requestParameters: MoneyApiApiMoneyDonateApplicationFromCharityPostRequest, options?: any) {
        return MoneyApiFp(this.configuration).apiMoneyDonateApplicationFromCharityPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Donation to an application with a given ID
     * @param {MoneyApiApiMoneyDonateApplicationPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof MoneyApi
     */
    public apiMoneyDonateApplicationPost(requestParameters: MoneyApiApiMoneyDonateApplicationPostRequest, options?: any) {
        return MoneyApiFp(this.configuration).apiMoneyDonateApplicationPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Donate to charity from manager
     * @param {MoneyApiApiMoneyDonateCharityFromManagerPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof MoneyApi
     */
    public apiMoneyDonateCharityFromManagerPost(requestParameters: MoneyApiApiMoneyDonateCharityFromManagerPostRequest, options?: any) {
        return MoneyApiFp(this.configuration).apiMoneyDonateCharityFromManagerPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Donate to charity from user
     * @param {MoneyApiApiMoneyDonateCharityFromUserPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof MoneyApi
     */
    public apiMoneyDonateCharityFromUserPost(requestParameters: MoneyApiApiMoneyDonateCharityFromUserPostRequest, options?: any) {
        return MoneyApiFp(this.configuration).apiMoneyDonateCharityFromUserPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/news-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { NewsInput } from '../models';
// @ts-ignore
import { NewsResponse } from '../models';
// @ts-ignore
import { NewsView } from '../models';
/**
 * NewsApi - axios parameter creator
 * @export
 */
export const NewsApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Get all news with pagination
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsGet: async (page?: number, size?: number, sort?: string, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/news`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;

            if (page !== undefined) {
                localVarQueryParameter['page'] = page;
            }

            if (size !== undefined) {
                localVarQueryParameter['size'] = size;
            }

            if (sort !== undefined) {
                localVarQueryParameter['sort'] = sort;
            }


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Deletes one news entity
         * @param {string} id News entity id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsIdDelete: async (id: string, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'id' is not null or undefined
            if (id === null || id === undefined) {
                throw new RequiredError('id','Required parameter id was null or undefined when calling apiNewsIdDelete.');
            }
            const localVarPath = `/api/news/{id}`
                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'DELETE', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Get one news entity
         * @param {string} id News entity id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsIdGet: async (id: string, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'id' is not null or undefined
            if (id === null || id === undefined) {
                throw new RequiredError('id','Required parameter id was null or undefined when calling apiNewsIdGet.');
            }
            const localVarPath = `/api/news/{id}`
                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Edit one news entity
         * @param {string} id News id
         * @param {NewsInput} [body] News input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsIdPatch: async (id: string, body?: NewsInput, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'id' is not null or undefined
            if (id === null || id === undefined) {
                throw new RequiredError('id','Required parameter id was null or undefined when calling apiNewsIdPatch.');
            }
            const localVarPath = `/api/news/{id}`
                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Creates news entity
         * @param {NewsInput} [body] News input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsPost: async (body?: NewsInput, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/news`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * NewsApi - functional programming interface
 * @export
 */
export const NewsApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Get all news with pagination
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiNewsGet(page?: number, size?: number, sort?: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<NewsResponse>> {
            const localVarAxiosArgs = await NewsApiAxiosParamCreator(configuration).apiNewsGet(page, size, sort, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Deletes one news entity
         * @param {string} id News entity id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiNewsIdDelete(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<NewsView>> {
            const localVarAxiosArgs = await NewsApiAxiosParamCreator(configuration).apiNewsIdDelete(id, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Get one news entity
         * @param {string} id News entity id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiNewsIdGet(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<NewsView>> {
            const localVarAxiosArgs = await NewsApiAxiosParamCreator(configuration).apiNewsIdGet(id, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Edit one news entity
         * @param {string} id News id
         * @param {NewsInput} [body] News input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiNewsIdPatch(id: string, body?: NewsInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<NewsView>> {
            const localVarAxiosArgs = await NewsApiAxiosParamCreator(configuration).apiNewsIdPatch(id, body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Creates news entity
         * @param {NewsInput} [body] News input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiNewsPost(body?: NewsInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<NewsView>> {
            const localVarAxiosArgs = await NewsApiAxiosParamCreator(configuration).apiNewsPost(body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * NewsApi - factory interface
 * @export
 */
export const NewsApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Get all news with pagination
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsGet(page?: number, size?: number, sort?: string, options?: any): AxiosPromise<NewsResponse> {
            return NewsApiFp(configuration).apiNewsGet(page, size, sort, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Deletes one news entity
         * @param {string} id News entity id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsIdDelete(id: string, options?: any): AxiosPromise<NewsView> {
            return NewsApiFp(configuration).apiNewsIdDelete(id, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Get one news entity
         * @param {string} id News entity id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsIdGet(id: string, options?: any): AxiosPromise<NewsView> {
            return NewsApiFp(configuration).apiNewsIdGet(id, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Edit one news entity
         * @param {string} id News id
         * @param {NewsInput} [body] News input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsIdPatch(id: string, body?: NewsInput, options?: any): AxiosPromise<NewsView> {
            return NewsApiFp(configuration).apiNewsIdPatch(id, body, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Creates news entity
         * @param {NewsInput} [body] News input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNewsPost(body?: NewsInput, options?: any): AxiosPromise<NewsView> {
            return NewsApiFp(configuration).apiNewsPost(body, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiNewsGet operation in NewsApi.
 * @export
 * @interface NewsApiApiNewsGetRequest
 */
export interface NewsApiApiNewsGetRequest {
    /**
     * Page number
     * @type {number}
     * @memberof NewsApiApiNewsGet
     */
    readonly page?: number

    /**
     * Page size
     * @type {number}
     * @memberof NewsApiApiNewsGet
     */
    readonly size?: number

    /**
     * Sort param
     * @type {string}
     * @memberof NewsApiApiNewsGet
     */
    readonly sort?: string
}

/**
 * Request parameters for apiNewsIdDelete operation in NewsApi.
 * @export
 * @interface NewsApiApiNewsIdDeleteRequest
 */
export interface NewsApiApiNewsIdDeleteRequest {
    /**
     * News entity id
     * @type {string}
     * @memberof NewsApiApiNewsIdDelete
     */
    readonly id: string
}

/**
 * Request parameters for apiNewsIdGet operation in NewsApi.
 * @export
 * @interface NewsApiApiNewsIdGetRequest
 */
export interface NewsApiApiNewsIdGetRequest {
    /**
     * News entity id
     * @type {string}
     * @memberof NewsApiApiNewsIdGet
     */
    readonly id: string
}

/**
 * Request parameters for apiNewsIdPatch operation in NewsApi.
 * @export
 * @interface NewsApiApiNewsIdPatchRequest
 */
export interface NewsApiApiNewsIdPatchRequest {
    /**
     * News id
     * @type {string}
     * @memberof NewsApiApiNewsIdPatch
     */
    readonly id: string

    /**
     * News input
     * @type {NewsInput}
     * @memberof NewsApiApiNewsIdPatch
     */
    readonly body?: NewsInput
}

/**
 * Request parameters for apiNewsPost operation in NewsApi.
 * @export
 * @interface NewsApiApiNewsPostRequest
 */
export interface NewsApiApiNewsPostRequest {
    /**
     * News input
     * @type {NewsInput}
     * @memberof NewsApiApiNewsPost
     */
    readonly body?: NewsInput
}

/**
 * NewsApi - object-oriented interface
 * @export
 * @class NewsApi
 * @extends {BaseAPI}
 */
export class NewsApi extends BaseAPI {
    /**
     * 
     * @summary Get all news with pagination
     * @param {NewsApiApiNewsGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof NewsApi
     */
    public apiNewsGet(requestParameters: NewsApiApiNewsGetRequest = {}, options?: any) {
        return NewsApiFp(this.configuration).apiNewsGet(requestParameters.page, requestParameters.size, requestParameters.sort, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Deletes one news entity
     * @param {NewsApiApiNewsIdDeleteRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof NewsApi
     */
    public apiNewsIdDelete(requestParameters: NewsApiApiNewsIdDeleteRequest, options?: any) {
        return NewsApiFp(this.configuration).apiNewsIdDelete(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Get one news entity
     * @param {NewsApiApiNewsIdGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof NewsApi
     */
    public apiNewsIdGet(requestParameters: NewsApiApiNewsIdGetRequest, options?: any) {
        return NewsApiFp(this.configuration).apiNewsIdGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Edit one news entity
     * @param {NewsApiApiNewsIdPatchRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof NewsApi
     */
    public apiNewsIdPatch(requestParameters: NewsApiApiNewsIdPatchRequest, options?: any) {
        return NewsApiFp(this.configuration).apiNewsIdPatch(requestParameters.id, requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Creates news entity
     * @param {NewsApiApiNewsPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof NewsApi
     */
    public apiNewsPost(requestParameters: NewsApiApiNewsPostRequest = {}, options?: any) {
        return NewsApiFp(this.configuration).apiNewsPost(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/notifications-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { ControllersFcmId } from '../models';
// @ts-ignore
import { NotificationsNotificationResponse } from '../models';
/**
 * NotificationsApi - axios parameter creator
 * @export
 */
export const NotificationsApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * Get all user notifications with pagination
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNotificationsGet: async (page?: number, size?: number, sort?: string, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/notifications`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;

            if (page !== undefined) {
                localVarQueryParameter['page'] = page;
            }

            if (size !== undefined) {
                localVarQueryParameter['size'] = size;
            }

            if (sort !== undefined) {
                localVarQueryParameter['sort'] = sort;
            }


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Sets firebase token to current session for sending notifications
         * @param {ControllersFcmId} [body] client registration id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNotificationsSetTokenPatch: async (body?: ControllersFcmId, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/notifications/set-token`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * NotificationsApi - functional programming interface
 * @export
 */
export const NotificationsApiFp = function(configuration?: Configuration) {
    return {
        /**
         * Get all user notifications with pagination
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiNotificationsGet(page?: number, size?: number, sort?: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<NotificationsNotificationResponse>> {
            const localVarAxiosArgs = await NotificationsApiAxiosParamCreator(configuration).apiNotificationsGet(page, size, sort, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Sets firebase token to current session for sending notifications
         * @param {ControllersFcmId} [body] client registration id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiNotificationsSetTokenPatch(body?: ControllersFcmId, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await NotificationsApiAxiosParamCreator(configuration).apiNotificationsSetTokenPatch(body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * NotificationsApi - factory interface
 * @export
 */
export const NotificationsApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * Get all user notifications with pagination
         * @param {number} [page] Page number
         * @param {number} [size] Page size
         * @param {string} [sort] Sort param
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNotificationsGet(page?: number, size?: number, sort?: string, options?: any): AxiosPromise<NotificationsNotificationResponse> {
            return NotificationsApiFp(configuration).apiNotificationsGet(page, size, sort, options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Sets firebase token to current session for sending notifications
         * @param {ControllersFcmId} [body] client registration id
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiNotificationsSetTokenPatch(body?: ControllersFcmId, options?: any): AxiosPromise<void> {
            return NotificationsApiFp(configuration).apiNotificationsSetTokenPatch(body, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiNotificationsGet operation in NotificationsApi.
 * @export
 * @interface NotificationsApiApiNotificationsGetRequest
 */
export interface NotificationsApiApiNotificationsGetRequest {
    /**
     * Page number
     * @type {number}
     * @memberof NotificationsApiApiNotificationsGet
     */
    readonly page?: number

    /**
     * Page size
     * @type {number}
     * @memberof NotificationsApiApiNotificationsGet
     */
    readonly size?: number

    /**
     * Sort param
     * @type {string}
     * @memberof NotificationsApiApiNotificationsGet
     */
    readonly sort?: string
}

/**
 * Request parameters for apiNotificationsSetTokenPatch operation in NotificationsApi.
 * @export
 * @interface NotificationsApiApiNotificationsSetTokenPatchRequest
 */
export interface NotificationsApiApiNotificationsSetTokenPatchRequest {
    /**
     * client registration id
     * @type {ControllersFcmId}
     * @memberof NotificationsApiApiNotificationsSetTokenPatch
     */
    readonly body?: ControllersFcmId
}

/**
 * NotificationsApi - object-oriented interface
 * @export
 * @class NotificationsApi
 * @extends {BaseAPI}
 */
export class NotificationsApi extends BaseAPI {
    /**
     * Get all user notifications with pagination
     * @param {NotificationsApiApiNotificationsGetRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof NotificationsApi
     */
    public apiNotificationsGet(requestParameters: NotificationsApiApiNotificationsGetRequest = {}, options?: any) {
        return NotificationsApiFp(this.configuration).apiNotificationsGet(requestParameters.page, requestParameters.size, requestParameters.sort, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Sets firebase token to current session for sending notifications
     * @param {NotificationsApiApiNotificationsSetTokenPatchRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof NotificationsApi
     */
    public apiNotificationsSetTokenPatch(requestParameters: NotificationsApiApiNotificationsSetTokenPatchRequest = {}, options?: any) {
        return NotificationsApiFp(this.configuration).apiNotificationsSetTokenPatch(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/registration-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { AuthEmailConfirmationInput } from '../models';
// @ts-ignore
import { AuthManagerRegistrationInput } from '../models';
// @ts-ignore
import { AuthRegistrationInput } from '../models';
/**
 * RegistrationApi - axios parameter creator
 * @export
 */
export const RegistrationApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * Confirms email with code from email
         * @summary Confirm email
         * @param {AuthEmailConfirmationInput} request Email confirmation input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiRegisterConfirmPost: async (request: AuthEmailConfirmationInput, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiRegisterConfirmPost.');
            }
            const localVarPath = `/api/register/confirm`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * Register another user
         * @summary Register another user from manager
         * @param {AuthManagerRegistrationInput} request Registration input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiRegisterManagerPost: async (request: AuthManagerRegistrationInput, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiRegisterManagerPost.');
            }
            const localVarPath = `/api/register/manager`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * Register with this route
         * @summary Register
         * @param {AuthRegistrationInput} request Email registration input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiRegisterPost: async (request: AuthRegistrationInput, options: any = {}): Promise<RequestArgs> => {
            // verify required parameter 'request' is not null or undefined
            if (request === null || request === undefined) {
                throw new RequiredError('request','Required parameter request was null or undefined when calling apiRegisterPost.');
            }
            const localVarPath = `/api/register`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof request !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(request !== undefined ? request : {})
                : (request || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * RegistrationApi - functional programming interface
 * @export
 */
export const RegistrationApiFp = function(configuration?: Configuration) {
    return {
        /**
         * Confirms email with code from email
         * @summary Confirm email
         * @param {AuthEmailConfirmationInput} request Email confirmation input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiRegisterConfirmPost(request: AuthEmailConfirmationInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await RegistrationApiAxiosParamCreator(configuration).apiRegisterConfirmPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * Register another user
         * @summary Register another user from manager
         * @param {AuthManagerRegistrationInput} request Registration input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiRegisterManagerPost(request: AuthManagerRegistrationInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await RegistrationApiAxiosParamCreator(configuration).apiRegisterManagerPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * Register with this route
         * @summary Register
         * @param {AuthRegistrationInput} request Email registration input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiRegisterPost(request: AuthRegistrationInput, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
            const localVarAxiosArgs = await RegistrationApiAxiosParamCreator(configuration).apiRegisterPost(request, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * RegistrationApi - factory interface
 * @export
 */
export const RegistrationApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * Confirms email with code from email
         * @summary Confirm email
         * @param {AuthEmailConfirmationInput} request Email confirmation input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiRegisterConfirmPost(request: AuthEmailConfirmationInput, options?: any): AxiosPromise<void> {
            return RegistrationApiFp(configuration).apiRegisterConfirmPost(request, options).then((request) => request(axios, basePath));
        },
        /**
         * Register another user
         * @summary Register another user from manager
         * @param {AuthManagerRegistrationInput} request Registration input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiRegisterManagerPost(request: AuthManagerRegistrationInput, options?: any): AxiosPromise<void> {
            return RegistrationApiFp(configuration).apiRegisterManagerPost(request, options).then((request) => request(axios, basePath));
        },
        /**
         * Register with this route
         * @summary Register
         * @param {AuthRegistrationInput} request Email registration input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiRegisterPost(request: AuthRegistrationInput, options?: any): AxiosPromise<void> {
            return RegistrationApiFp(configuration).apiRegisterPost(request, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiRegisterConfirmPost operation in RegistrationApi.
 * @export
 * @interface RegistrationApiApiRegisterConfirmPostRequest
 */
export interface RegistrationApiApiRegisterConfirmPostRequest {
    /**
     * Email confirmation input
     * @type {AuthEmailConfirmationInput}
     * @memberof RegistrationApiApiRegisterConfirmPost
     */
    readonly request: AuthEmailConfirmationInput
}

/**
 * Request parameters for apiRegisterManagerPost operation in RegistrationApi.
 * @export
 * @interface RegistrationApiApiRegisterManagerPostRequest
 */
export interface RegistrationApiApiRegisterManagerPostRequest {
    /**
     * Registration input
     * @type {AuthManagerRegistrationInput}
     * @memberof RegistrationApiApiRegisterManagerPost
     */
    readonly request: AuthManagerRegistrationInput
}

/**
 * Request parameters for apiRegisterPost operation in RegistrationApi.
 * @export
 * @interface RegistrationApiApiRegisterPostRequest
 */
export interface RegistrationApiApiRegisterPostRequest {
    /**
     * Email registration input
     * @type {AuthRegistrationInput}
     * @memberof RegistrationApiApiRegisterPost
     */
    readonly request: AuthRegistrationInput
}

/**
 * RegistrationApi - object-oriented interface
 * @export
 * @class RegistrationApi
 * @extends {BaseAPI}
 */
export class RegistrationApi extends BaseAPI {
    /**
     * Confirms email with code from email
     * @summary Confirm email
     * @param {RegistrationApiApiRegisterConfirmPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof RegistrationApi
     */
    public apiRegisterConfirmPost(requestParameters: RegistrationApiApiRegisterConfirmPostRequest, options?: any) {
        return RegistrationApiFp(this.configuration).apiRegisterConfirmPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * Register another user
     * @summary Register another user from manager
     * @param {RegistrationApiApiRegisterManagerPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof RegistrationApi
     */
    public apiRegisterManagerPost(requestParameters: RegistrationApiApiRegisterManagerPostRequest, options?: any) {
        return RegistrationApiFp(this.configuration).apiRegisterManagerPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * Register with this route
     * @summary Register
     * @param {RegistrationApiApiRegisterPostRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof RegistrationApi
     */
    public apiRegisterPost(requestParameters: RegistrationApiApiRegisterPostRequest, options?: any) {
        return RegistrationApiFp(this.configuration).apiRegisterPost(requestParameters.request, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/settings-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { UserSettings } from '../models';
/**
 * SettingsApi - axios parameter creator
 * @export
 */
export const SettingsApiAxiosParamCreator = function (configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Retrieves user\'s settings
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiUserSettingsGet: async (options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/user-settings`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
        /**
         * 
         * @summary Updates user settings
         * @param {UserSettings} [body] user settings input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiUserSettingsPatch: async (body?: UserSettings, options: any = {}): Promise<RequestArgs> => {
            const localVarPath = `/api/user-settings`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, 'https://example.com');
            let baseOptions;
            if (configuration) {
                baseOptions = configuration.baseOptions;
            }

            const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
            const localVarHeaderParameter = {} as any;
            const localVarQueryParameter = {} as any;


    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            const queryParameters = new URLSearchParams(localVarUrlObj.search);
            for (const key in localVarQueryParameter) {
                queryParameters.set(key, localVarQueryParameter[key]);
            }
            for (const key in options.query) {
                queryParameters.set(key, options.query[key]);
            }
            localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
            const nonString = typeof body !== 'string';
            const needsSerialization = nonString && configuration && configuration.isJsonMime
                ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
                : nonString;
            localVarRequestOptions.data =  needsSerialization
                ? JSON.stringify(body !== undefined ? body : {})
                : (body || "");

            return {
                url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
                options: localVarRequestOptions,
            };
        },
    }
};

/**
 * SettingsApi - functional programming interface
 * @export
 */
export const SettingsApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
         * @summary Retrieves user\'s settings
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiUserSettingsGet(options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UserSettings>> {
            const localVarAxiosArgs = await SettingsApiAxiosParamCreator(configuration).apiUserSettingsGet(options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
        /**
         * 
         * @summary Updates user settings
         * @param {UserSettings} [body] user settings input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        async apiUserSettingsPatch(body?: UserSettings, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UserSettings>> {
            const localVarAxiosArgs = await SettingsApiAxiosParamCreator(configuration).apiUserSettingsPatch(body, options);
            return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
                const axiosRequestArgs = {...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url};
                return axios.request(axiosRequestArgs);
            };
        },
    }
};

/**
 * SettingsApi - factory interface
 * @export
 */
export const SettingsApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
    return {
        /**
         * 
         * @summary Retrieves user\'s settings
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiUserSettingsGet(options?: any): AxiosPromise<UserSettings> {
            return SettingsApiFp(configuration).apiUserSettingsGet(options).then((request) => request(axios, basePath));
        },
        /**
         * 
         * @summary Updates user settings
         * @param {UserSettings} [body] user settings input
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
        apiUserSettingsPatch(body?: UserSettings, options?: any): AxiosPromise<UserSettings> {
            return SettingsApiFp(configuration).apiUserSettingsPatch(body, options).then((request) => request(axios, basePath));
        },
    };
};

/**
 * Request parameters for apiUserSettingsPatch operation in SettingsApi.
 * @export
 * @interface SettingsApiApiUserSettingsPatchRequest
 */
export interface SettingsApiApiUserSettingsPatchRequest {
    /**
     * user settings input
     * @type {UserSettings}
     * @memberof SettingsApiApiUserSettingsPatch
     */
    readonly body?: UserSettings
}

/**
 * SettingsApi - object-oriented interface
 * @export
 * @class SettingsApi
 * @extends {BaseAPI}
 */
export class SettingsApi extends BaseAPI {
    /**
     * 
     * @summary Retrieves user\'s settings
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof SettingsApi
     */
    public apiUserSettingsGet(options?: any) {
        return SettingsApiFp(this.configuration).apiUserSettingsGet(options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
     * @summary Updates user settings
     * @param {SettingsApiApiUserSettingsPatchRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof SettingsApi
     */
    public apiUserSettingsPatch(requestParameters: SettingsApiApiUserSettingsPatchRequest = {}, options?: any) {
        return SettingsApiFp(this.configuration).apiUserSettingsPatch(requestParameters.body, options).then((request) => request(this.axios, this.basePath));
    }
}
\end{lstlisting}
\subsection{@generated/api/user-api.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';
import { Configuration } from '../configuration';
// Some imports not used depending on template conditions
// @ts-ignore
import { BASE_PATH, COLLECTION_FORMATS, RequestArgs, BaseAPI, RequiredError } from '../base';
// @ts-ignore
import { UserEditableInfo } from '../models';
// @ts-ignore
import { UserExtendedUser } from '../models';
// @ts-ignore
import { UserResponse } from '../models';
// @ts-ignore
import { UserUser } from '../models';
/**
 * UserApi - axios parameter creator
 * @export
 */
export const UserApiAxiosParamCreator = function (configuration?: Configuration) {
  return {
    /**
     * 
     * @summary GetAllUsers
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] sort
     * @param {Array<string>} [role] User role
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserGet: async (page?: number, size?: number, sort?: string, role?: Array<string>, options: any = {}): Promise<RequestArgs> => {
      const localVarPath = `/api/user`;
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;

      if (page !== undefined) {
        localVarQueryParameter['page'] = page;
      }

      if (size !== undefined) {
        localVarQueryParameter['size'] = size;
      }

      if (sort !== undefined) {
        localVarQueryParameter['sort'] = sort;
      }

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      // role=a&role=b
      if (role) {
        for (const index in role) {
          queryParameters.append('role', role[index]);
        }
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Block or unblock user
     * @param {string} id User id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserIdBlockPatch: async (id: string, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiUserIdBlockPatch.');
      }
      const localVarPath = `/api/user/{id}/block`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Retrieves user based on given ID
     * @param {string} id User ID
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserIdGet: async (id: string, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiUserIdGet.');
      }
      const localVarPath = `/api/user/{id}`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
    /**
     * 
     * @summary Update user info
     * @param {string} id User id
     * @param {UserEditableInfo} [body] Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserIdPatch: async (id: string, body?: UserEditableInfo, options: any = {}): Promise<RequestArgs> => {
      // verify required parameter 'id' is not null or undefined
      if (id === null || id === undefined) {
        throw new RequiredError('id', 'Required parameter id was null or undefined when calling apiUserIdPatch.');
      }
      const localVarPath = `/api/user/{id}`
        .replace(`{${"id"}}`, encodeURIComponent(String(id)));
      // use dummy base URL string because the URL constructor only accepts absolute URLs.
      const localVarUrlObj = new URL(localVarPath, 'https://example.com');
      let baseOptions;
      if (configuration) {
        baseOptions = configuration.baseOptions;
      }

      const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options };
      const localVarHeaderParameter = {} as any;
      const localVarQueryParameter = {} as any;



      localVarHeaderParameter['Content-Type'] = 'application/json';

      const queryParameters = new URLSearchParams(localVarUrlObj.search);
      for (const key in localVarQueryParameter) {
        queryParameters.set(key, localVarQueryParameter[key]);
      }
      for (const key in options.query) {
        queryParameters.set(key, options.query[key]);
      }
      localVarUrlObj.search = (new URLSearchParams(queryParameters)).toString();
      let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
      localVarRequestOptions.headers = { ...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers };
      const nonString = typeof body !== 'string';
      const needsSerialization = nonString && configuration && configuration.isJsonMime
        ? configuration.isJsonMime(localVarRequestOptions.headers['Content-Type'])
        : nonString;
      localVarRequestOptions.data = needsSerialization
        ? JSON.stringify(body !== undefined ? body : {})
        : (body || "");

      return {
        url: localVarUrlObj.pathname + localVarUrlObj.search + localVarUrlObj.hash,
        options: localVarRequestOptions,
      };
    },
  }
};

/**
 * UserApi - functional programming interface
 * @export
 */
export const UserApiFp = function (configuration?: Configuration) {
  return {
    /**
     * 
     * @summary GetAllUsers
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] sort
     * @param {Array<string>} [role] User role
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiUserGet(page?: number, size?: number, sort?: string, role?: Array<string>, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UserResponse>> {
      const localVarAxiosArgs = await UserApiAxiosParamCreator(configuration).apiUserGet(page, size, sort, role, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Block or unblock user
     * @param {string} id User id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiUserIdBlockPatch(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UserUser>> {
      const localVarAxiosArgs = await UserApiAxiosParamCreator(configuration).apiUserIdBlockPatch(id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Retrieves user based on given ID
     * @param {string} id User ID
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiUserIdGet(id: string, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UserExtendedUser>> {
      const localVarAxiosArgs = await UserApiAxiosParamCreator(configuration).apiUserIdGet(id, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
    /**
     * 
     * @summary Update user info
     * @param {string} id User id
     * @param {UserEditableInfo} [body] Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    async apiUserIdPatch(id: string, body?: UserEditableInfo, options?: any): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<UserUser>> {
      const localVarAxiosArgs = await UserApiAxiosParamCreator(configuration).apiUserIdPatch(id, body, options);
      return (axios: AxiosInstance = globalAxios, basePath: string = BASE_PATH) => {
        const axiosRequestArgs = { ...localVarAxiosArgs.options, url: basePath + localVarAxiosArgs.url };
        return axios.request(axiosRequestArgs);
      };
    },
  }
};

/**
 * UserApi - factory interface
 * @export
 */
export const UserApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
  return {
    /**
     * 
     * @summary GetAllUsers
     * @param {number} [page] Page number
     * @param {number} [size] Page size
     * @param {string} [sort] sort
     * @param {Array<string>} [role] User role
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserGet(page?: number, size?: number, sort?: string, role?: Array<string>, options?: any): AxiosPromise<UserResponse> {
      return UserApiFp(configuration).apiUserGet(page, size, sort, role, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Block or unblock user
     * @param {string} id User id
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserIdBlockPatch(id: string, options?: any): AxiosPromise<UserUser> {
      return UserApiFp(configuration).apiUserIdBlockPatch(id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Retrieves user based on given ID
     * @param {string} id User ID
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserIdGet(id: string, options?: any): AxiosPromise<UserExtendedUser> {
      return UserApiFp(configuration).apiUserIdGet(id, options).then((request) => request(axios, basePath));
    },
    /**
     * 
     * @summary Update user info
     * @param {string} id User id
     * @param {UserEditableInfo} [body] Input
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     */
    apiUserIdPatch(id: string, body?: UserEditableInfo, options?: any): AxiosPromise<UserUser> {
      return UserApiFp(configuration).apiUserIdPatch(id, body, options).then((request) => request(axios, basePath));
    },
  };
};

/**
 * Request parameters for apiUserGet operation in UserApi.
 * @export
 * @interface UserApiApiUserGetRequest
 */
export interface UserApiApiUserGetRequest {
  /**
   * Page number
   * @type {number}
   * @memberof UserApiApiUserGet
   */
  readonly page?: number

  /**
   * Page size
   * @type {number}
   * @memberof UserApiApiUserGet
   */
  readonly size?: number

  /**
   * sort
   * @type {string}
   * @memberof UserApiApiUserGet
   */
  readonly sort?: string

  /**
   * User role
   * @type {Array<string>}
   * @memberof UserApiApiUserGet
   */
  readonly role?: Array<string>
}

/**
 * Request parameters for apiUserIdBlockPatch operation in UserApi.
 * @export
 * @interface UserApiApiUserIdBlockPatchRequest
 */
export interface UserApiApiUserIdBlockPatchRequest {
  /**
   * User id
   * @type {string}
   * @memberof UserApiApiUserIdBlockPatch
   */
  readonly id: string
}

/**
 * Request parameters for apiUserIdGet operation in UserApi.
 * @export
 * @interface UserApiApiUserIdGetRequest
 */
export interface UserApiApiUserIdGetRequest {
  /**
   * User ID
   * @type {string}
   * @memberof UserApiApiUserIdGet
   */
  readonly id: string
}

/**
 * Request parameters for apiUserIdPatch operation in UserApi.
 * @export
 * @interface UserApiApiUserIdPatchRequest
 */
export interface UserApiApiUserIdPatchRequest {
  /**
   * User id
   * @type {string}
   * @memberof UserApiApiUserIdPatch
   */
  readonly id: string

  /**
   * Input
   * @type {UserEditableInfo}
   * @memberof UserApiApiUserIdPatch
   */
  readonly body?: UserEditableInfo
}

/**
 * UserApi - object-oriented interface
 * @export
 * @class UserApi
 * @extends {BaseAPI}
 */
export class UserApi extends BaseAPI {
  /**
   * 
   * @summary GetAllUsers
   * @param {UserApiApiUserGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof UserApi
   */
  public apiUserGet(requestParameters: UserApiApiUserGetRequest = {}, options?: any) {
    return UserApiFp(this.configuration).apiUserGet(requestParameters.page, requestParameters.size, requestParameters.sort, requestParameters.role, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Block or unblock user
   * @param {UserApiApiUserIdBlockPatchRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof UserApi
   */
  public apiUserIdBlockPatch(requestParameters: UserApiApiUserIdBlockPatchRequest, options?: any) {
    return UserApiFp(this.configuration).apiUserIdBlockPatch(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Retrieves user based on given ID
   * @param {UserApiApiUserIdGetRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof UserApi
   */
  public apiUserIdGet(requestParameters: UserApiApiUserIdGetRequest, options?: any) {
    return UserApiFp(this.configuration).apiUserIdGet(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
  }

  /**
   * 
   * @summary Update user info
   * @param {UserApiApiUserIdPatchRequest} requestParameters Request parameters.
   * @param {*} [options] Override http request option.
   * @throws {RequiredError}
   * @memberof UserApi
   */
  public apiUserIdPatch(requestParameters: UserApiApiUserIdPatchRequest, options?: any) {
    return UserApiFp(this.configuration).apiUserIdPatch(requestParameters.id, requestParameters.body, options).then((request) => request(this.axios, this.basePath));
  }
}
\end{lstlisting}
\subsection{@generated/base.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { Configuration } from "./configuration";
// Some imports not used depending on template conditions
// @ts-ignore
import globalAxios, { AxiosPromise, AxiosInstance } from 'axios';

export const BASE_PATH = process.env.REACT_APP_API_URL?.replace(/\/+$/, "") ?? "";

/**
 *
 * @export
 */
export const COLLECTION_FORMATS = {
  csv: ",",
  ssv: " ",
  tsv: "\t",
  pipes: "|",
};

/**
 *
 * @export
 * @interface RequestArgs
 */
export interface RequestArgs {
  url: string;
  options: any;
}

/**
 *
 * @export
 * @class BaseAPI
 */
export class BaseAPI {
  protected configuration: Configuration | undefined;

  constructor(configuration?: Configuration, protected basePath: string = BASE_PATH, protected axios: AxiosInstance = globalAxios) {
    if (configuration) {
      this.configuration = configuration;
      this.basePath = configuration.basePath || this.basePath;
    }
  }
};

/**
 *
 * @export
 * @class RequiredError
 * @extends {Error}
 */
export class RequiredError extends Error {
  name: "RequiredError" = "RequiredError";
  constructor(public field: string, msg?: string) {
    super(msg);
  }
}
\end{lstlisting}
\subsection{@generated/configuration.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


export interface ConfigurationParameters {
    apiKey?: string | Promise<string> | ((name: string) => string) | ((name: string) => Promise<string>);
    username?: string;
    password?: string;
    accessToken?: string | Promise<string> | ((name?: string, scopes?: string[]) => string) | ((name?: string, scopes?: string[]) => Promise<string>);
    basePath?: string;
    baseOptions?: any;
    formDataCtor?: new () => any;
}

export class Configuration {
    /**
     * parameter for apiKey security
     * @param name security name
     * @memberof Configuration
     */
    apiKey?: string | Promise<string> | ((name: string) => string) | ((name: string) => Promise<string>);
    /**
     * parameter for basic security
     *
     * @type {string}
     * @memberof Configuration
     */
    username?: string;
    /**
     * parameter for basic security
     *
     * @type {string}
     * @memberof Configuration
     */
    password?: string;
    /**
     * parameter for oauth2 security
     * @param name security name
     * @param scopes oauth2 scope
     * @memberof Configuration
     */
    accessToken?: string | Promise<string> | ((name?: string, scopes?: string[]) => string) | ((name?: string, scopes?: string[]) => Promise<string>);
    /**
     * override base path
     *
     * @type {string}
     * @memberof Configuration
     */
    basePath?: string;
    /**
     * base options for axios calls
     *
     * @type {any}
     * @memberof Configuration
     */
    baseOptions?: any;
    /**
     * The FormData constructor that will be used to create multipart form data
     * requests. You can inject this here so that execution environments that
     * do not support the FormData class can still run the generated client.
     *
     * @type {new () => FormData}
     */
    formDataCtor?: new () => any;

    constructor(param: ConfigurationParameters = {}) {
        this.apiKey = param.apiKey;
        this.username = param.username;
        this.password = param.password;
        this.accessToken = param.accessToken;
        this.basePath = param.basePath;
        this.baseOptions = param.baseOptions;
        this.formDataCtor = param.formDataCtor;
    }

    /**
     * Check if the given MIME is a JSON MIME.
     * JSON MIME examples:
     *   application/json
     *   application/json; charset=UTF8
     *   APPLICATION/JSON
     *   application/vnd.company+json
     * @param mime - MIME (Multipurpose Internet Mail Extensions)
     * @return True if the given MIME is JSON, false otherwise.
     */
    public isJsonMime(mime: string): boolean {
        const jsonMime: RegExp = new RegExp('^(application\/json|[^;/ \t]+\/[^;/ \t]+[+]json)[ \t]*(;.*)?$', 'i');
        return mime !== null && (jsonMime.test(mime) || mime.toLowerCase() === 'application/json-patch+json');
    }
}
\end{lstlisting}
\subsection{@generated/git_push.sh}
\begin{lstlisting}
#!/bin/sh
# ref: https://help.github.com/articles/adding-an-existing-project-to-github-using-the-command-line/
#
# Usage example: /bin/sh ./git_push.sh wing328 openapi-pestore-perl "minor update" "gitlab.com"

git_user_id=$1
git_repo_id=$2
release_note=$3
git_host=$4

if [ "$git_host" = "" ]; then
    git_host="github.com"
    echo "[INFO] No command line input provided. Set \$git_host to $git_host"
fi

if [ "$git_user_id" = "" ]; then
    git_user_id="GIT_USER_ID"
    echo "[INFO] No command line input provided. Set \$git_user_id to $git_user_id"
fi

if [ "$git_repo_id" = "" ]; then
    git_repo_id="GIT_REPO_ID"
    echo "[INFO] No command line input provided. Set \$git_repo_id to $git_repo_id"
fi

if [ "$release_note" = "" ]; then
    release_note="Minor update"
    echo "[INFO] No command line input provided. Set \$release_note to $release_note"
fi

# Initialize the local directory as a Git repository
git init

# Adds the files in the local repository and stages them for commit.
git add .

# Commits the tracked changes and prepares them to be pushed to a remote repository.
git commit -m "$release_note"

# Sets the new remote
git_remote=`git remote`
if [ "$git_remote" = "" ]; then # git remote not defined

    if [ "$GIT_TOKEN" = "" ]; then
        echo "[INFO] \$GIT_TOKEN (environment variable) is not set. Using the git credential in your environment."
        git remote add origin https://${git_host}/${git_user_id}/${git_repo_id}.git
    else
        git remote add origin https://${git_user_id}:${GIT_TOKEN}@${git_host}/${git_user_id}/${git_repo_id}.git
    fi

fi

git pull origin master

# Pushes (Forces) the changes in the local repository up to the remote repository
echo "Git pushing to https://${git_host}/${git_user_id}/${git_repo_id}.git"
git push origin master 2>&1 | grep -v 'To https'

\end{lstlisting}
\subsection{@generated/index.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


export * from "./api";
export * from "./configuration";
export * from "./models";
\end{lstlisting}
\subsection{@generated/models/analytics-one-month-profit.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface AnalyticsOneMonthProfit
 */
export interface AnalyticsOneMonthProfit {
    /**
     * 
     * @type {string}
     * @memberof AnalyticsOneMonthProfit
     */
    month?: string;
    /**
     * 
     * @type {number}
     * @memberof AnalyticsOneMonthProfit
     */
    to_application?: number;
    /**
     * 
     * @type {number}
     * @memberof AnalyticsOneMonthProfit
     */
    to_fund?: number;
    /**
     * 
     * @type {number}
     * @memberof AnalyticsOneMonthProfit
     */
    total?: number;
    /**
     * 
     * @type {string}
     * @memberof AnalyticsOneMonthProfit
     */
    year?: string;
}


\end{lstlisting}
\subsection{@generated/models/analytics-one-month-registrations.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface AnalyticsOneMonthRegistrations
 */
export interface AnalyticsOneMonthRegistrations {
    /**
     * 
     * @type {number}
     * @memberof AnalyticsOneMonthRegistrations
     */
    count?: number;
    /**
     * 
     * @type {string}
     * @memberof AnalyticsOneMonthRegistrations
     */
    month?: string;
    /**
     * 
     * @type {string}
     * @memberof AnalyticsOneMonthRegistrations
     */
    year?: string;
}


\end{lstlisting}
\subsection{@generated/models/analytics-top-category.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface AnalyticsTopCategory
 */
export interface AnalyticsTopCategory {
    /**
     * 
     * @type {string}
     * @memberof AnalyticsTopCategory
     */
    category_id?: string;
    /**
     * 
     * @type {number}
     * @memberof AnalyticsTopCategory
     */
    count?: number;
}


\end{lstlisting}
\subsection{@generated/models/audit-audit.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface AuditAudit
 */
export interface AuditAudit {
    /**
     * 
     * @type {UserUser}
     * @memberof AuditAudit
     */
    author?: UserUser;
    /**
     * 
     * @type {string}
     * @memberof AuditAudit
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof AuditAudit
     */
    data?: string;
    /**
     * 
     * @type {string}
     * @memberof AuditAudit
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof AuditAudit
     */
    type?: AuditAuditTypeEnum;
}

/**
    * @export
    * @enum {string}
    */
export enum AuditAuditTypeEnum {
    Login = 'Login',
    ApplicationStatusChanged = 'ApplicationStatusChanged',
    ApplicationDataChange = 'ApplicationDataChange'
}



\end{lstlisting}
\subsection{@generated/models/audit-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { AuditAudit } from './audit-audit';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface AuditResponse
 */
export interface AuditResponse {
    /**
     * 
     * @type {Array<AuditAudit>}
     * @memberof AuditResponse
     */
    data?: Array<AuditAudit>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof AuditResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/auth-credentials.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface AuthCredentials
 */
export interface AuthCredentials {
    /**
     * 
     * @type {string}
     * @memberof AuthCredentials
     */
    email?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthCredentials
     */
    password?: string;
}


\end{lstlisting}
\subsection{@generated/models/auth-email-confirmation-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface AuthEmailConfirmationInput
 */
export interface AuthEmailConfirmationInput {
    /**
     * 
     * @type {string}
     * @memberof AuthEmailConfirmationInput
     */
    code?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthEmailConfirmationInput
     */
    email?: string;
}


\end{lstlisting}
\subsection{@generated/models/auth-manager-registration-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { AuthManagerRegistrationUser } from './auth-manager-registration-user';

/**
 * 
 * @export
 * @interface AuthManagerRegistrationInput
 */
export interface AuthManagerRegistrationInput {
    /**
     * 
     * @type {Array<string>}
     * @memberof AuthManagerRegistrationInput
     */
    assigned_categories?: Array<string>;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationInput
     */
    role?: AuthManagerRegistrationInputRoleEnum;
    /**
     * 
     * @type {AuthManagerRegistrationUser}
     * @memberof AuthManagerRegistrationInput
     */
    user?: AuthManagerRegistrationUser;
}

/**
    * @export
    * @enum {string}
    */
export enum AuthManagerRegistrationInputRoleEnum {
    User = 'User',
    Manager = 'Manager',
    SuperManager = 'SuperManager',
    ContentManager = 'ContentManager',
    Operator = 'Operator',
    Admin = 'Admin'
}



\end{lstlisting}
\subsection{@generated/models/auth-manager-registration-user.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface AuthManagerRegistrationUser
 */
export interface AuthManagerRegistrationUser {
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    birth_date?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    city?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    country?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    email: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    first_name: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    last_name: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    middle_name?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthManagerRegistrationUser
     */
    phone?: string;
}


\end{lstlisting}
\subsection{@generated/models/auth-registration-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface AuthRegistrationInput
 */
export interface AuthRegistrationInput {
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    birth_date?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    city?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    country?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    email: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    first_name: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    last_name: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    middle_name?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    password: string;
    /**
     * 
     * @type {string}
     * @memberof AuthRegistrationInput
     */
    phone?: string;
}


\end{lstlisting}
\subsection{@generated/models/auth-unregistered-user.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserPrettyPublicKey } from './user-pretty-public-key';

/**
 * 
 * @export
 * @interface AuthUnregisteredUser
 */
export interface AuthUnregisteredUser {
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    birth_date?: string;
    /**
     * 
     * @type {boolean}
     * @memberof AuthUnregisteredUser
     */
    blocked?: boolean;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    city?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    country?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    email?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    first_name?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    last_name?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    middle_name?: string;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    phone?: string;
    /**
     * 
     * @type {UserPrettyPublicKey}
     * @memberof AuthUnregisteredUser
     */
    pretty_public_key?: UserPrettyPublicKey;
    /**
     * 
     * @type {string}
     * @memberof AuthUnregisteredUser
     */
    role?: AuthUnregisteredUserRoleEnum;
}

/**
    * @export
    * @enum {string}
    */
export enum AuthUnregisteredUserRoleEnum {
    User = 'User',
    Manager = 'Manager',
    SuperManager = 'SuperManager',
    ContentManager = 'ContentManager',
    Operator = 'Operator',
    Admin = 'Admin'
}



\end{lstlisting}
\subsection{@generated/models/blockchain-deposit.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface BlockchainDeposit
 */
export interface BlockchainDeposit {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof BlockchainDeposit
     */
    amount: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof BlockchainDeposit
     */
    user_id: string;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-donate-request-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface BlockchainDonateRequestInput
 */
export interface BlockchainDonateRequestInput {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof BlockchainDonateRequestInput
     */
    amount: UtilsMoneyJson;
    /**
     * 
     * @type {number}
     * @memberof BlockchainDonateRequestInput
     */
    application: number;
    /**
     * 
     * @type {string}
     * @memberof BlockchainDonateRequestInput
     */
    password: string;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-donation-to-application-from-fund.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface BlockchainDonationToApplicationFromFund
 */
export interface BlockchainDonationToApplicationFromFund {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof BlockchainDonationToApplicationFromFund
     */
    amount: UtilsMoneyJson;
    /**
     * 
     * @type {boolean}
     * @memberof BlockchainDonationToApplicationFromFund
     */
    anonymous?: boolean;
    /**
     * 
     * @type {number}
     * @memberof BlockchainDonationToApplicationFromFund
     */
    application_id: number;
    /**
     * 
     * @type {string}
     * @memberof BlockchainDonationToApplicationFromFund
     */
    donor_id?: string;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-donation-to-charity-from-user.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface BlockchainDonationToCharityFromUser
 */
export interface BlockchainDonationToCharityFromUser {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof BlockchainDonationToCharityFromUser
     */
    amount: UtilsMoneyJson;
    /**
     * 
     * @type {boolean}
     * @memberof BlockchainDonationToCharityFromUser
     */
    anonymous?: boolean;
    /**
     * 
     * @type {string}
     * @memberof BlockchainDonationToCharityFromUser
     */
    password: string;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-donation-to-charity.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';
import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface BlockchainDonationToCharity
 */
export interface BlockchainDonationToCharity {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof BlockchainDonationToCharity
     */
    amount?: UtilsMoneyJson;
    /**
     * 
     * @type {UserUser}
     * @memberof BlockchainDonationToCharity
     */
    donor?: UserUser;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-donation.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { AuthUnregisteredUser } from './auth-unregistered-user';
import { DonationRequestDonationRequest } from './donation-request-donation-request';
import { UserUser } from './user-user';
import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface BlockchainDonation
 */
export interface BlockchainDonation {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof BlockchainDonation
     */
    amount?: UtilsMoneyJson;
    /**
     * 
     * @type {boolean}
     * @memberof BlockchainDonation
     */
    anonymous?: boolean;
    /**
     * 
     * @type {string}
     * @memberof BlockchainDonation
     */
    created_at?: string;
    /**
     * 
     * @type {UserUser}
     * @memberof BlockchainDonation
     */
    donation_author?: UserUser;
    /**
     * 
     * @type {DonationRequestDonationRequest}
     * @memberof BlockchainDonation
     */
    donation_request?: DonationRequestDonationRequest;
    /**
     * 
     * @type {string}
     * @memberof BlockchainDonation
     */
    id?: string;
    /**
     * 
     * @type {AuthUnregisteredUser}
     * @memberof BlockchainDonation
     */
    unverified_author?: AuthUnregisteredUser;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-donations-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { BlockchainDonation } from './blockchain-donation';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface BlockchainDonationsResponse
 */
export interface BlockchainDonationsResponse {
    /**
     * 
     * @type {Array<BlockchainDonation>}
     * @memberof BlockchainDonationsResponse
     */
    data?: Array<BlockchainDonation>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof BlockchainDonationsResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-status-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { BlockchainStatus } from './blockchain-status';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface BlockchainStatusResponse
 */
export interface BlockchainStatusResponse {
    /**
     * 
     * @type {Array<BlockchainStatus>}
     * @memberof BlockchainStatusResponse
     */
    data?: Array<BlockchainStatus>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof BlockchainStatusResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/blockchain-status.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface BlockchainStatus
 */
export interface BlockchainStatus {
    /**
     * 
     * @type {string}
     * @memberof BlockchainStatus
     */
    batch_id?: string;
    /**
     * 
     * @type {string}
     * @memberof BlockchainStatus
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof BlockchainStatus
     */
    error_string?: string;
    /**
     * 
     * @type {string}
     * @memberof BlockchainStatus
     */
    status?: BlockchainStatusStatusEnum;
    /**
     * 
     * @type {string}
     * @memberof BlockchainStatus
     */
    type?: BlockchainStatusTypeEnum;
    /**
     * 
     * @type {string}
     * @memberof BlockchainStatus
     */
    updated_at?: string;
}

/**
    * @export
    * @enum {string}
    */
export enum BlockchainStatusStatusEnum {
    Pending = 'Pending',
    Success = 'Success',
    Failure = 'Failure'
}
/**
    * @export
    * @enum {string}
    */
export enum BlockchainStatusTypeEnum {
    DonateToCharity = 'DonateToCharity',
    DonateFromCharityToApplication = 'DonateFromCharityToApplication',
    DonateToCharityFromExistingUser = 'DonateToCharityFromExistingUser',
    DonateToCharityFromNewUser = 'DonateToCharityFromNewUser',
    DepositMoney = 'DepositMoney',
    DonateToApplication = 'DonateToApplication',
    ProposeApplication = 'ProposeApplication',
    PublishApplication = 'PublishApplication',
    CancelApplication = 'CancelApplication',
    Registration = 'Registration',
    CloseApplication = 'CloseApplication'
}



\end{lstlisting}
\subsection{@generated/models/category-admin-category.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface CategoryAdminCategory
 */
export interface CategoryAdminCategory {
    /**
     * 
     * @type {string}
     * @memberof CategoryAdminCategory
     */
    ara: string;
    /**
     * 
     * @type {string}
     * @memberof CategoryAdminCategory
     */
    eng: string;
    /**
     * 
     * @type {string}
     * @memberof CategoryAdminCategory
     */
    id: string;
    /**
     * 
     * @type {boolean}
     * @memberof CategoryAdminCategory
     */
    is_hidden?: boolean;
    /**
     * 
     * @type {string}
     * @memberof CategoryAdminCategory
     */
    rus: string;
}


\end{lstlisting}
\subsection{@generated/models/category-category.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface CategoryCategory
 */
export interface CategoryCategory {
    /**
     * 
     * @type {string}
     * @memberof CategoryCategory
     */
    eng: string;
    /**
     * 
     * @type {string}
     * @memberof CategoryCategory
     */
    id: string;
    /**
     * 
     * @type {string}
     * @memberof CategoryCategory
     */
    rus: string;
}


\end{lstlisting}
\subsection{@generated/models/category-delete-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface CategoryDeleteInput
 */
export interface CategoryDeleteInput {
    /**
     * 
     * @type {Array<string>}
     * @memberof CategoryDeleteInput
     */
    categories: Array<string>;
}


\end{lstlisting}
\subsection{@generated/models/category-update-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { CategoryAdminCategory } from './category-admin-category';

/**
 * 
 * @export
 * @interface CategoryUpdateInput
 */
export interface CategoryUpdateInput {
    /**
     * 
     * @type {Array<CategoryAdminCategory>}
     * @memberof CategoryUpdateInput
     */
    categories: Array<CategoryAdminCategory>;
}


\end{lstlisting}
\subsection{@generated/models/charity-faq-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface CharityFaqInput
 */
export interface CharityFaqInput {
    /**
     * 
     * @type {string}
     * @memberof CharityFaqInput
     */
    faq?: string;
}


\end{lstlisting}
\subsection{@generated/models/charity-faq.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface CharityFaq
 */
export interface CharityFaq {
    /**
     * 
     * @type {string}
     * @memberof CharityFaq
     */
    faq?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFaq
     */
    fund_id?: string;
}


\end{lstlisting}
\subsection{@generated/models/charity-fund-info-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { FileInfo } from './file-info';

/**
 * 
 * @export
 * @interface CharityFundInfoResponse
 */
export interface CharityFundInfoResponse {
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfoResponse
     */
    address?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfoResponse
     */
    description: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfoResponse
     */
    email?: string;
    /**
     * 
     * @type {Array<FileInfo>}
     * @memberof CharityFundInfoResponse
     */
    files?: Array<FileInfo>;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfoResponse
     */
    phone?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfoResponse
     */
    title: string;
}


\end{lstlisting}
\subsection{@generated/models/charity-fund-info.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface CharityFundInfo
 */
export interface CharityFundInfo {
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfo
     */
    address?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfo
     */
    description: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfo
     */
    email?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfo
     */
    phone?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInfo
     */
    title: string;
}


\end{lstlisting}
\subsection{@generated/models/charity-fund-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface CharityFundInput
 */
export interface CharityFundInput {
    /**
     * 
     * @type {string}
     * @memberof CharityFundInput
     */
    address?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInput
     */
    description: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInput
     */
    email?: string;
    /**
     * 
     * @type {Array<string>}
     * @memberof CharityFundInput
     */
    file_ids?: Array<string>;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInput
     */
    phone?: string;
    /**
     * 
     * @type {string}
     * @memberof CharityFundInput
     */
    title: string;
}


\end{lstlisting}
\subsection{@generated/models/chat-admin-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface ChatAdminInput
 */
export interface ChatAdminInput {
    /**
     * 
     * @type {Array<string>}
     * @memberof ChatAdminInput
     */
    attachments?: Array<string>;
    /**
     * 
     * @type {string}
     * @memberof ChatAdminInput
     */
    body: string;
    /**
     * 
     * @type {string}
     * @memberof ChatAdminInput
     */
    dialog_id: string;
}


\end{lstlisting}
\subsection{@generated/models/chat-dialog-response-body.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { ChatMessage } from './chat-message';
import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface ChatDialogResponseBody
 */
export interface ChatDialogResponseBody {
    /**
     * 
     * @type {string}
     * @memberof ChatDialogResponseBody
     */
    id?: string;
    /**
     * 
     * @type {ChatMessage}
     * @memberof ChatDialogResponseBody
     */
    last_message?: ChatMessage;
    /**
     * 
     * @type {number}
     * @memberof ChatDialogResponseBody
     */
    unread_message_counter?: number;
    /**
     * 
     * @type {UserUser}
     * @memberof ChatDialogResponseBody
     */
    user?: UserUser;
}


\end{lstlisting}
\subsection{@generated/models/chat-dialog-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { ChatDialogResponseBody } from './chat-dialog-response-body';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface ChatDialogResponse
 */
export interface ChatDialogResponse {
    /**
     * 
     * @type {Array<ChatDialogResponseBody>}
     * @memberof ChatDialogResponse
     */
    data?: Array<ChatDialogResponseBody>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof ChatDialogResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/chat-dialog.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface ChatDialog
 */
export interface ChatDialog {
    /**
     * 
     * @type {string}
     * @memberof ChatDialog
     */
    id?: string;
    /**
     * 
     * @type {number}
     * @memberof ChatDialog
     */
    unread_message_counter?: number;
    /**
     * 
     * @type {UserUser}
     * @memberof ChatDialog
     */
    user: UserUser;
}


\end{lstlisting}
\subsection{@generated/models/chat-message-body.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { ChatDialog } from './chat-dialog';
import { FileInfo } from './file-info';
import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface ChatMessageBody
 */
export interface ChatMessageBody {
    /**
     * 
     * @type {Array<FileInfo>}
     * @memberof ChatMessageBody
     */
    attachments?: Array<FileInfo>;
    /**
     * 
     * @type {UserUser}
     * @memberof ChatMessageBody
     */
    author?: UserUser;
    /**
     * 
     * @type {string}
     * @memberof ChatMessageBody
     */
    body?: string;
    /**
     * 
     * @type {ChatDialog}
     * @memberof ChatMessageBody
     */
    dialog?: ChatDialog;
    /**
     * 
     * @type {string}
     * @memberof ChatMessageBody
     */
    dialog_id?: string;
    /**
     * 
     * @type {string}
     * @memberof ChatMessageBody
     */
    created_at?: string;
    /**
     * 
     * @type {number}
     * @memberof ChatMessageBody
     */
    id?: number;
}


\end{lstlisting}
\subsection{@generated/models/chat-message.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface ChatMessage
 */
export interface ChatMessage {
    /**
     * 
     * @type {UserUser}
     * @memberof ChatMessage
     */
    author?: UserUser;
    /**
     * 
     * @type {string}
     * @memberof ChatMessage
     */
    body?: string;
    /**
     * 
     * @type {string}
     * @memberof ChatMessage
     */
    created_at?: string;
    /**
     * 
     * @type {number}
     * @memberof ChatMessage
     */
    id?: number;
}


\end{lstlisting}
\subsection{@generated/models/chat-messages-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { ChatMessageBody } from './chat-message-body';

/**
 * 
 * @export
 * @interface ChatMessagesResponse
 */
export interface ChatMessagesResponse {
    /**
     * 
     * @type {string}
     * @memberof ChatMessagesResponse
     */
    cursor?: string;
    /**
     * 
     * @type {Array<ChatMessageBody>}
     * @memberof ChatMessagesResponse
     */
    data?: Array<ChatMessageBody>;
}


\end{lstlisting}
\subsection{@generated/models/controllers-deposit.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface ControllersDeposit
 */
export interface ControllersDeposit {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof ControllersDeposit
     */
    amount: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof ControllersDeposit
     */
    user_id: string;
}


\end{lstlisting}
\subsection{@generated/models/controllers-donate-request-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface ControllersDonateRequestInput
 */
export interface ControllersDonateRequestInput {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof ControllersDonateRequestInput
     */
    amount: UtilsMoneyJson;
    /**
     * 
     * @type {number}
     * @memberof ControllersDonateRequestInput
     */
    application: number;
    /**
     * 
     * @type {string}
     * @memberof ControllersDonateRequestInput
     */
    password: string;
}


\end{lstlisting}
\subsection{@generated/models/controllers-fcm-id.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface ControllersFcmId
 */
export interface ControllersFcmId {
    /**
     * 
     * @type {string}
     * @memberof ControllersFcmId
     */
    id: string;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-body.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { CategoryCategory } from './category-category';
import { FileInfo } from './file-info';
import { UserSimpleUser } from './user-simple-user';
import { UserUser } from './user-user';
import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface DonationRequestBody
 */
export interface DonationRequestBody {
    /**
     * 
     * @type {boolean}
     * @memberof DonationRequestBody
     */
    anonymous?: boolean;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestBody
     */
    approved_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestBody
     */
    assignee?: UserUser;
    /**
     * 
     * @type {Array<FileInfo>}
     * @memberof DonationRequestBody
     */
    attached_files?: Array<FileInfo>;
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestBody
     */
    author?: UserUser;
    /**
     * 
     * @type {Array<string>}
     * @memberof DonationRequestBody
     */
    available_statuses?: Array<DonationRequestBodyAvailableStatusesEnum>;
    /**
     * 
     * @type {boolean}
     * @memberof DonationRequestBody
     */
    undo_transition?: boolean;
    /**
     * 
     * @type {CategoryCategory}
     * @memberof DonationRequestBody
     */
    category?: CategoryCategory;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestBody
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestBody
     */
    description?: string;
    /**
     * 
     * @type {UserSimpleUser}
     * @memberof DonationRequestBody
     */
    donee?: UserSimpleUser;
    /**
     * 
     * @type {number}
     * @memberof DonationRequestBody
     */
    id?: number;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestBody
     */
    received_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestBody
     */
    relationship?: string;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestBody
     */
    requested_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestBody
     */
    started_at?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestBody
     */
    status?: DonationRequestBodyStatusEnum;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestBody
     */
    title?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestBody
     */
    until?: string;
}

/**
    * @export
    * @enum {string}
    */
export enum DonationRequestBodyAvailableStatusesEnum {
    New = 'New',
    InProcessing = 'InProcessing',
    Refused = 'Refused',
    NeedsImprovement = 'NeedsImprovement',
    Archived = 'Archived',
    SuperManagerConfirmation = 'SuperManagerConfirmation',
    UserConfirmation = 'UserConfirmation',
    Active = 'Active',
    Spam = 'Spam',
    Deleted = 'Deleted',
    OnRealization = 'OnRealization'
}
/**
    * @export
    * @enum {string}
    */
export enum DonationRequestBodyStatusEnum {
    New = 'New',
    InProcessing = 'InProcessing',
    Refused = 'Refused',
    NeedsImprovement = 'NeedsImprovement',
    Archived = 'Archived',
    SuperManagerConfirmation = 'SuperManagerConfirmation',
    UserConfirmation = 'UserConfirmation',
    Active = 'Active',
    Spam = 'Spam',
    Deleted = 'Deleted',
    OnRealization = 'OnRealization'
}



\end{lstlisting}
\subsection{@generated/models/donation-request-comment.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface DonationRequestComment
 */
export interface DonationRequestComment {
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestComment
     */
    author?: UserUser;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestComment
     */
    created_at?: string;
    /**
     * 
     * @type {number}
     * @memberof DonationRequestComment
     */
    donation_request_id?: number;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestComment
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestComment
     */
    text?: string;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-donation-request.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { CategoryCategory } from './category-category';
import { UserSimpleUser } from './user-simple-user';
import { UserUser } from './user-user';
import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface DonationRequestDonationRequest
 */
export interface DonationRequestDonationRequest {
    /**
     * 
     * @type {boolean}
     * @memberof DonationRequestDonationRequest
     */
    anonymous?: boolean;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestDonationRequest
     */
    approved_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestDonationRequest
     */
    assignee?: UserUser;
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestDonationRequest
     */
    author?: UserUser;
    /**
     * 
     * @type {CategoryCategory}
     * @memberof DonationRequestDonationRequest
     */
    category?: CategoryCategory;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestDonationRequest
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestDonationRequest
     */
    description?: string;
    /**
     * 
     * @type {UserSimpleUser}
     * @memberof DonationRequestDonationRequest
     */
    donee?: UserSimpleUser;
    /**
     * 
     * @type {number}
     * @memberof DonationRequestDonationRequest
     */
    id?: number;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestDonationRequest
     */
    received_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestDonationRequest
     */
    relationship?: string;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestDonationRequest
     */
    requested_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestDonationRequest
     */
    started_at?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestDonationRequest
     */
    status?: DonationRequestDonationRequestStatusEnum;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestDonationRequest
     */
    title?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestDonationRequest
     */
    until?: string;
}

/**
    * @export
    * @enum {string}
    */
export enum DonationRequestDonationRequestStatusEnum {
    New = 'New',
    InProcessing = 'InProcessing',
    Refused = 'Refused',
    NeedsImprovement = 'NeedsImprovement',
    Archived = 'Archived',
    SuperManagerConfirmation = 'SuperManagerConfirmation',
    UserConfirmation = 'UserConfirmation',
    Active = 'Active',
    Spam = 'Spam',
    Deleted = 'Deleted',
    OnRealization = 'OnRealization'
}



\end{lstlisting}
\subsection{@generated/models/donation-request-history-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { DonationRequestStatusHistory } from './donation-request-status-history';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface DonationRequestHistoryResponse
 */
export interface DonationRequestHistoryResponse {
    /**
     * 
     * @type {Array<DonationRequestStatusHistory>}
     * @memberof DonationRequestHistoryResponse
     */
    data?: Array<DonationRequestStatusHistory>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof DonationRequestHistoryResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserSimpleUser } from './user-simple-user';
import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface DonationRequestInput
 */
export interface DonationRequestInput {
    /**
     * 
     * @type {string}
     * @memberof DonationRequestInput
     */
    assignee_id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestInput
     */
    category_id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestInput
     */
    comment?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestInput
     */
    description?: string;
    /**
     * 
     * @type {UserSimpleUser}
     * @memberof DonationRequestInput
     */
    donee?: UserSimpleUser;
    /**
     * 
     * @type {Array<string>}
     * @memberof DonationRequestInput
     */
    file_ids?: Array<string>;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestInput
     */
    relationship?: string;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestInput
     */
    requested_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestInput
     */
    title?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestInput
     */
    until?: string;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { DonationRequestBody } from './donation-request-body';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface DonationRequestResponse
 */
export interface DonationRequestResponse {
    /**
     * 
     * @type {Array<DonationRequestBody>}
     * @memberof DonationRequestResponse
     */
    data?: Array<DonationRequestBody>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof DonationRequestResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-review-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { DonationRequestSingleReviewStatus } from './donation-request-single-review-status';

/**
 * 
 * @export
 * @interface DonationRequestReviewResponse
 */
export interface DonationRequestReviewResponse {
    /**
     * 
     * @type {number}
     * @memberof DonationRequestReviewResponse
     */
    accepted_count?: number;
    /**
     * 
     * @type {number}
     * @memberof DonationRequestReviewResponse
     */
    not_viewed_count?: number;
    /**
     * 
     * @type {number}
     * @memberof DonationRequestReviewResponse
     */
    rejected_count?: number;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestReviewResponse
     */
    review_status?: DonationRequestReviewResponseReviewStatusEnum;
    /**
     * 
     * @type {Array<DonationRequestSingleReviewStatus>}
     * @memberof DonationRequestReviewResponse
     */
    reviewers?: Array<DonationRequestSingleReviewStatus>;
    /**
     * 
     * @type {number}
     * @memberof DonationRequestReviewResponse
     */
    total_count?: number;
}

/**
    * @export
    * @enum {string}
    */
export enum DonationRequestReviewResponseReviewStatusEnum {
    Accepted = 'Accepted',
    Rejected = 'Rejected',
    NotViewed = 'NotViewed'
}



\end{lstlisting}
\subsection{@generated/models/donation-request-single-review-status.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface DonationRequestSingleReviewStatus
 */
export interface DonationRequestSingleReviewStatus {
    /**
     * 
     * @type {number}
     * @memberof DonationRequestSingleReviewStatus
     */
    application_id?: number;
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestSingleReviewStatus
     */
    manager?: UserUser;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSingleReviewStatus
     */
    single_review_status?: DonationRequestSingleReviewStatusSingleReviewStatusEnum;
}

/**
    * @export
    * @enum {string}
    */
export enum DonationRequestSingleReviewStatusSingleReviewStatusEnum {
    Accepted = 'Accepted',
    Rejected = 'Rejected',
    NotViewed = 'NotViewed'
}



\end{lstlisting}
\subsection{@generated/models/donation-request-status-history.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { DonationRequestComment } from './donation-request-comment';
import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface DonationRequestStatusHistory
 */
export interface DonationRequestStatusHistory {
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestStatusHistory
     */
    assignee?: UserUser;
    /**
     * 
     * @type {UserUser}
     * @memberof DonationRequestStatusHistory
     */
    author?: UserUser;
    /**
     * 
     * @type {DonationRequestComment}
     * @memberof DonationRequestStatusHistory
     */
    comment?: DonationRequestComment;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestStatusHistory
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestStatusHistory
     */
    current_status?: string;
    /**
     * 
     * @type {number}
     * @memberof DonationRequestStatusHistory
     */
    donation_request_id?: number;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestStatusHistory
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestStatusHistory
     */
    previous_status?: string;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-submit-review-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface DonationRequestSubmitReviewInput
 */
export interface DonationRequestSubmitReviewInput {
    /**
     * 
     * @type {number}
     * @memberof DonationRequestSubmitReviewInput
     */
    id?: number;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSubmitReviewInput
     */
    review_status?: DonationRequestSubmitReviewInputReviewStatusEnum;
}

/**
    * @export
    * @enum {string}
    */
export enum DonationRequestSubmitReviewInputReviewStatusEnum {
    Accepted = 'Accepted',
    Rejected = 'Rejected',
    NotViewed = 'NotViewed'
}



\end{lstlisting}
\subsection{@generated/models/donation-request-super-manager-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserSimpleUser } from './user-simple-user';
import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface DonationRequestSuperManagerInput
 */
export interface DonationRequestSuperManagerInput {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestSuperManagerInput
     */
    approved_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSuperManagerInput
     */
    assignee_id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSuperManagerInput
     */
    category_id: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSuperManagerInput
     */
    comment?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSuperManagerInput
     */
    description?: string;
    /**
     * 
     * @type {UserSimpleUser}
     * @memberof DonationRequestSuperManagerInput
     */
    donee?: UserSimpleUser;
    /**
     * 
     * @type {Array<string>}
     * @memberof DonationRequestSuperManagerInput
     */
    file_ids?: Array<string>;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSuperManagerInput
     */
    relationship?: string;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestSuperManagerInput
     */
    requested_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSuperManagerInput
     */
    title?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestSuperManagerInput
     */
    until?: string;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-update-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserSimpleUser } from './user-simple-user';
import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface DonationRequestUpdateInput
 */
export interface DonationRequestUpdateInput {
    /**
     * 
     * @type {boolean}
     * @memberof DonationRequestUpdateInput
     */
    anonymous?: boolean;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestUpdateInput
     */
    approved_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateInput
     */
    assignee_id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateInput
     */
    category_id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateInput
     */
    description?: string;
    /**
     * 
     * @type {UserSimpleUser}
     * @memberof DonationRequestUpdateInput
     */
    donee?: UserSimpleUser;
    /**
     * 
     * @type {Array<string>}
     * @memberof DonationRequestUpdateInput
     */
    file_ids?: Array<string>;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateInput
     */
    message?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateInput
     */
    relationship?: string;
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof DonationRequestUpdateInput
     */
    requested_amount?: UtilsMoneyJson;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateInput
     */
    title?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateInput
     */
    until?: string;
}


\end{lstlisting}
\subsection{@generated/models/donation-request-update-status-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface DonationRequestUpdateStatusInput
 */
export interface DonationRequestUpdateStatusInput {
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateStatusInput
     */
    assignee_id?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateStatusInput
     */
    comment?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateStatusInput
     */
    password?: string;
    /**
     * 
     * @type {string}
     * @memberof DonationRequestUpdateStatusInput
     */
    status?: string;
    /**
     * 
     * @type {Array<string>}
     * @memberof DonationRequestUpdateStatusInput
     */
    file_ids?: Array<string>;
}


\end{lstlisting}
\subsection{@generated/models/file-info.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface FileInfo
 */
export interface FileInfo {
    /**
     * 
     * @type {string}
     * @memberof FileInfo
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof FileInfo
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof FileInfo
     */
    mime_type?: string;
    /**
     * 
     * @type {string}
     * @memberof FileInfo
     */
    title?: string;
}


\end{lstlisting}
\subsection{@generated/models/file-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface FileResponse
 */
export interface FileResponse {
    /**
     * 
     * @type {string}
     * @memberof FileResponse
     */
    createdAt?: string;
    /**
     * 
     * @type {string}
     * @memberof FileResponse
     */
    id?: string;
}


\end{lstlisting}
\subsection{@generated/models/index.ts}
\begin{lstlisting}
export * from './analytics-one-month-profit';
export * from './analytics-one-month-registrations';
export * from './analytics-top-category';
export * from './audit-audit';
export * from './audit-response';
export * from './auth-credentials';
export * from './auth-email-confirmation-input';
export * from './auth-manager-registration-input';
export * from './auth-manager-registration-user';
export * from './auth-registration-input';
export * from './auth-unregistered-user';
export * from './blockchain-donation';
export * from './blockchain-donation-to-application-from-fund';
export * from './blockchain-donation-to-charity';
export * from './blockchain-donation-to-charity-from-user';
export * from './blockchain-donations-response';
export * from './blockchain-status';
export * from './blockchain-status-response';
export * from './category-admin-category';
export * from './category-category';
export * from './category-delete-input';
export * from './category-update-input';
export * from './charity-faq';
export * from './charity-faq-input';
export * from './charity-fund-info';
export * from './charity-fund-info-response';
export * from './charity-fund-input';
export * from './chat-admin-input';
export * from './chat-dialog';
export * from './chat-dialog-response';
export * from './chat-dialog-response-body';
export * from './chat-message';
export * from './chat-message-body';
export * from './chat-messages-response';
export * from './controllers-deposit';
export * from './controllers-donate-request-input';
export * from './controllers-fcm-id';
export * from './donation-request-body';
export * from './donation-request-comment';
export * from './donation-request-donation-request';
export * from './donation-request-history-response';
export * from './donation-request-input';
export * from './donation-request-response';
export * from './donation-request-review-response';
export * from './donation-request-single-review-status';
export * from './donation-request-status-history';
export * from './donation-request-submit-review-input';
export * from './donation-request-super-manager-input';
export * from './donation-request-update-input';
export * from './donation-request-update-status-input';
export * from './file-info';
export * from './news-input';
export * from './news-response';
export * from './news-view';
export * from './notifications-notification';
export * from './notifications-notification-response';
export * from './user-balance';
export * from './user-editable-info';
export * from './user-extended-user';
export * from './user-pretty-public-key';
export * from './user-response';
export * from './user-settings';
export * from './user-simple-user';
export * from './user-user';
export * from './utils-money-json';
export * from './utils-page-data';
\end{lstlisting}
\subsection{@generated/models/news-input.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface NewsInput
 */
export interface NewsInput {
    /**
     * 
     * @type {string}
     * @memberof NewsInput
     */
    description: string;
    /**
     * 
     * @type {string}
     * @memberof NewsInput
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof NewsInput
     */
    text: string;
    /**
     * 
     * @type {string}
     * @memberof NewsInput
     */
    title: string;
}


\end{lstlisting}
\subsection{@generated/models/news-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { NewsView } from './news-view';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface NewsResponse
 */
export interface NewsResponse {
    /**
     * 
     * @type {Array<NewsView>}
     * @memberof NewsResponse
     */
    data?: Array<NewsView>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof NewsResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/news-view.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface NewsView
 */
export interface NewsView {
    /**
     * 
     * @type {string}
     * @memberof NewsView
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof NewsView
     */
    description?: string;
    /**
     * 
     * @type {string}
     * @memberof NewsView
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof NewsView
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof NewsView
     */
    text?: string;
    /**
     * 
     * @type {string}
     * @memberof NewsView
     */
    title?: string;
    /**
     * 
     * @type {string}
     * @memberof NewsView
     */
    updated_at?: string;
}


\end{lstlisting}
\subsection{@generated/models/notifications-notification-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { NotificationsNotification } from './notifications-notification';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface NotificationsNotificationResponse
 */
export interface NotificationsNotificationResponse {
    /**
     * 
     * @type {Array<NotificationsNotification>}
     * @memberof NotificationsNotificationResponse
     */
    data?: Array<NotificationsNotification>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof NotificationsNotificationResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/notifications-notification.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';

/**
 * 
 * @export
 * @interface NotificationsNotification
 */
export interface NotificationsNotification {
    /**
     * 
     * @type {string}
     * @memberof NotificationsNotification
     */
    body?: string;
    /**
     * 
     * @type {string}
     * @memberof NotificationsNotification
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof NotificationsNotification
     */
    id?: string;
    /**
     * 
     * @type {UserUser}
     * @memberof NotificationsNotification
     */
    notification_author?: UserUser;
    /**
     * 
     * @type {string}
     * @memberof NotificationsNotification
     */
    notification_type?: string;
}


\end{lstlisting}
\subsection{@generated/models/user-balance.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UtilsMoneyJson } from './utils-money-json';

/**
 * 
 * @export
 * @interface UserBalance
 */
export interface UserBalance {
    /**
     * 
     * @type {UtilsMoneyJson}
     * @memberof UserBalance
     */
    balance?: UtilsMoneyJson;
}


\end{lstlisting}
\subsection{@generated/models/user-editable-info.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface UserEditableInfo
 */
export interface UserEditableInfo {
    /**
     * 
     * @type {Array<string>}
     * @memberof UserEditableInfo
     */
    assigned_categories?: Array<string>;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    birth_date?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    city?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    country?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    email?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    first_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    last_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    middle_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    phone?: string;
    /**
     * 
     * @type {string}
     * @memberof UserEditableInfo
     */
    role?: UserEditableInfoRoleEnum;
}

/**
    * @export
    * @enum {string}
    */
export enum UserEditableInfoRoleEnum {
    User = 'User',
    Manager = 'Manager',
    SuperManager = 'SuperManager',
    ContentMaRolnager = 'ContentMaRolnager',
    Operator = 'Operator',
    Admin = 'Admin'
}



\end{lstlisting}
\subsection{@generated/models/user-extended-user.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { CategoryCategory } from './category-category';
import { UserPrettyPublicKey } from './user-pretty-public-key';

/**
 * 
 * @export
 * @interface UserExtendedUser
 */
export interface UserExtendedUser {
    /**
     * 
     * @type {Array<CategoryCategory>}
     * @memberof UserExtendedUser
     */
    assigned_categories?: Array<CategoryCategory>;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    birth_date?: string;
    /**
     * 
     * @type {boolean}
     * @memberof UserExtendedUser
     */
    blocked?: boolean;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    city?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    country?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    email?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    first_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    last_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    middle_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    phone?: string;
    /**
     * 
     * @type {UserPrettyPublicKey}
     * @memberof UserExtendedUser
     */
    pretty_public_key?: UserPrettyPublicKey;
    /**
     * 
     * @type {string}
     * @memberof UserExtendedUser
     */
    role?: UserExtendedUserRoleEnum;
    /**
     * 
     * @type {boolean}
     * @memberof UserExtendedUser
     */
    tech_user?: boolean;
}

/**
    * @export
    * @enum {string}
    */
export enum UserExtendedUserRoleEnum {
    User = 'User',
    Manager = 'Manager',
    SuperManager = 'SuperManager',
    ContentManager = 'ContentManager',
    Operator = 'Operator',
    Admin = 'Admin'
}



\end{lstlisting}
\subsection{@generated/models/user-pretty-public-key.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface UserPrettyPublicKey
 */
export interface UserPrettyPublicKey {
    /**
     * 
     * @type {string}
     * @memberof UserPrettyPublicKey
     */
    _long?: string;
    /**
     * 
     * @type {string}
     * @memberof UserPrettyPublicKey
     */
    _short?: string;
}


\end{lstlisting}
\subsection{@generated/models/user-response.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserUser } from './user-user';
import { UtilsPageData } from './utils-page-data';

/**
 * 
 * @export
 * @interface UserResponse
 */
export interface UserResponse {
    /**
     * 
     * @type {Array<UserUser>}
     * @memberof UserResponse
     */
    data?: Array<UserUser>;
    /**
     * 
     * @type {UtilsPageData}
     * @memberof UserResponse
     */
    page?: UtilsPageData;
}


\end{lstlisting}
\subsection{@generated/models/user-settings.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface UserSettings
 */
export interface UserSettings {
    /**
     * 
     * @type {string}
     * @memberof UserSettings
     */
    language: UserSettingsLanguageEnum;
}

/**
    * @export
    * @enum {string}
    */
export enum UserSettingsLanguageEnum {
    Ru = 'ru',
    En = 'en'
}



\end{lstlisting}
\subsection{@generated/models/user-simple-user.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface UserSimpleUser
 */
export interface UserSimpleUser {
    /**
     * 
     * @type {string}
     * @memberof UserSimpleUser
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof UserSimpleUser
     */
    first_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserSimpleUser
     */
    last_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserSimpleUser
     */
    middle_name?: string;
}


\end{lstlisting}
\subsection{@generated/models/user-user.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */


import { UserPrettyPublicKey } from './user-pretty-public-key';

/**
 * 
 * @export
 * @interface UserUser
 */
export interface UserUser {
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    birth_date?: string;
    /**
     * 
     * @type {boolean}
     * @memberof UserUser
     */
    blocked?: boolean;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    city?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    country?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    created_at?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    email?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    first_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    id?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    image_id?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    last_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    middle_name?: string;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    phone?: string;
    /**
     * 
     * @type {UserPrettyPublicKey}
     * @memberof UserUser
     */
    pretty_public_key?: UserPrettyPublicKey;
    /**
     * 
     * @type {string}
     * @memberof UserUser
     */
    role?: UserUserRoleEnum;
    /**
     * 
     * @type {boolean}
     * @memberof UserUser
     */
    tech_user?: boolean;
}

/**
    * @export
    * @enum {string}
    */
export enum UserUserRoleEnum {
    User = 'User',
    Manager = 'Manager',
    SuperManager = 'SuperManager',
    ContentManager = 'ContentManager',
    Operator = 'Operator',
    Admin = 'Admin'
}



\end{lstlisting}
\subsection{@generated/models/utils-money-json.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface UtilsMoneyJson
 */
export interface UtilsMoneyJson {
    /**
     * 
     * @type {string}
     * @memberof UtilsMoneyJson
     */
    currency?: string;
    /**
     * 
     * @type {number}
     * @memberof UtilsMoneyJson
     */
    denominator?: number;
    /**
     * 
     * @type {number}
     * @memberof UtilsMoneyJson
     */
    numerator?: number;
}


\end{lstlisting}
\subsection{@generated/models/utils-page-data.ts}
\begin{lstlisting}
/* tslint:disable */
/* eslint-disable */
/**
 * Charity API
 * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
 *
 * The version of the OpenAPI document: 1.0.0
 * 
 *
 * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
 * https://openapi-generator.tech
 * Do not edit the class manually.
 */



/**
 * 
 * @export
 * @interface UtilsPageData
 */
export interface UtilsPageData {
    /**
     * 
     * @type {number}
     * @memberof UtilsPageData
     */
    page?: number;
    /**
     * 
     * @type {number}
     * @memberof UtilsPageData
     */
    size?: number;
    /**
     * 
     * @type {number}
     * @memberof UtilsPageData
     */
    totalElements?: number;
    /**
     * 
     * @type {number}
     * @memberof UtilsPageData
     */
    totalPages?: number;
}


\end{lstlisting}
\subsection{@lib/components/AmountInput/index.tsx}
\begin{lstlisting}
import React, { useState } from "react";
import { Input, Select } from "antd";

const { Option } = Select;

export type Currency = "rmb" | "dollar";

interface PriceValue {
  amount?: number;
  currency?: Currency;
}

interface PriceInputProps {
  value?: PriceValue;
  onChange?: (value: PriceValue) => void;
}

export const AmountInput: React.FC<PriceInputProps> = ({
  value = {},
  onChange,
}) => {
  const [amount, setAmount] = useState(0);
  const [currency, setCurrency] = useState<Currency>("rmb");

  const triggerChange = (changedValue: {
    amount?: number;
    currency?: Currency;
  }): void => {
    if (onChange) {
      onChange({ amount, currency, ...value, ...changedValue });
    }
  };

  const onAmountChange = (e: React.ChangeEvent<HTMLInputElement>): void => {
    const newAmount = parseInt(e.target.value || "0", 10);
    if (Number.isNaN(amount)) {
      return;
    }
    if (!("amount" in value)) {
      setAmount(newAmount);
    }
    triggerChange({ amount: newAmount });
  };

  const onCurrencyChange = (newCurrency: Currency): void => {
    if (!("currency" in value)) {
      setCurrency(newCurrency);
    }
    triggerChange({ currency: newCurrency });
  };

  return (
    <span>
      <Input
        type="text"
        value={value.amount || amount}
        onChange={onAmountChange}
        style={{ width: 100 }}
      />
      <Select
        value={value.currency || currency}
        style={{ width: 80, margin: "0 8px" }}
        onChange={onCurrencyChange}
      >
        <Option value="rmb">RUB</Option>
      </Select>
    </span>
  );
};
\end{lstlisting}
\subsection{@lib/components/Auth/index.tsx}
\begin{lstlisting}
import React, { Component } from "react";
import { notification } from "antd";
import { UserSettings, UserSettingsLanguageEnum } from "@generated";
import { decode } from "@lib/utils/base64";
import { notify } from "@lib/utils/notification";
import { i18n } from "@providers";
import { AuthProvider, Credentials } from "@providers/authContext";
import {
  LoginFactory,
  SettingsFactory,
  UserApiModel,
  UserApiRole,
  UserRequestFactory,
} from "@providers/axios";
import { Role } from "@providers/rbac-rules";
import axios from "axios";
import { getToken, onMessageListener, sendTokenToServer } from "firebase.js";

export type HeaderData = {
  user_id: string;
  role: UserApiRole;
  exp: number;
  token: string;
};

// TODO: replace or remove
function mapRole(apiRole: UserApiRole): Role {
  switch (apiRole) {
    case UserApiRole.Manager:
      return Role.manager;
    case UserApiRole.ContentManager:
      return Role.contentManager;
    case UserApiRole.SuperManager:
      return Role.supermanager;
    case UserApiRole.Admin:
      return Role.admin;
    case UserApiRole.User:
      return Role.visitor;
    case UserApiRole.Operator:
      return Role.operator;
  }
}

class Auth extends Component {
  state = {
    authenticated: localStorage.getItem("authenticated") === "true",
    user: {
      role: (localStorage.getItem("role") as Role) ?? Role.visitor,
      uuid: localStorage.getItem("uuid") ?? "",
      name: localStorage.getItem("name") ?? "",
      surname: localStorage.getItem("surname") ?? "",
      language: localStorage.getItem("language") ?? "",
    },
    accessToken: localStorage.getItem("accessToken") ?? "",
    expires: parseInt(localStorage.getItem("exp") ?? "0"),
  };

  initiateLogin = (credentials: Credentials): void => {
    LoginFactory.apiLoginPost(credentials)
      .then((r) => {
        const headerData = this.parseHeader(r.headers.authorization);

        this.handleAuthentication(headerData); // TODO: replace
      })
      .catch((e) => {
        if (
          e.response.status === 404 ||
          e.response.status === 401 ||
          e.response.status === 403
        ) {
          notify(i18n.t(`Login:error.${e.response.status}`), "error");
        } else {
          notify(i18n.t("Login:error.undefined"), "error");
        }
      });
  };

  logout = (): void => {
    LoginFactory.apiLogoutPost()
      .catch((e) => {
        console.error(e);
      })
      .finally(() => {
        localStorage.clear();

        this.setState({
          authenticated: false,
          user: {
            role: Role.visitor,
          },
          accessToken: "",
          expires: undefined,
        });
      });
  };

  handleAuthentication = async (headerData: HeaderData): Promise<void> => {
    const data = await UserRequestFactory.apiUserIdGet(headerData.user_id);
    localStorage.setItem("accessToken", headerData.token);
    const settings = await SettingsFactory.apiUserSettingsGet();

    if (data && settings) {
      this.setSession(headerData, data.data, settings.data);
    }
  };

  // Parse header https://git.infostrategic.com/hsecharity/android/-/blob/develop/app/src/main/java/com/hse/charity/screens/auth/AuthRepository.kt#L39
  parseHeader(authHeader: string): HeaderData {
    const fst = authHeader.indexOf(".");
    const lst = authHeader.lastIndexOf(".");
    const headerUndecodedData = authHeader.substring(fst + 1, lst);
    return {
      ...JSON.parse(decode(headerUndecodedData) ?? ""),
      token: authHeader,
    };
  }

  // Important data to save in LocalStorage
  saveToLocalStorage(
    role: Role,
    user: UserApiModel,
    exp: number,
    token: string,
    language: UserSettingsLanguageEnum,
  ): void {
    localStorage.setItem("authenticated", "true");
    localStorage.setItem("role", role);
    localStorage.setItem("uuid", user.id ?? "");
    localStorage.setItem("name", user.first_name ?? "");
    localStorage.setItem("surname", user.last_name ?? "");
    localStorage.setItem("accessToken", token);
    localStorage.setItem("exp", exp.toString());
    localStorage.setItem("language", language);
  }

  // Function that will be called to refresh authorization
  // eslint-disable-next-line
  refreshAuthLogic = async (): Promise<HeaderData | undefined> =>
    LoginFactory.apiLoginRefreshPost()
      .then((r) => {
        return this.parseHeader(r.headers.authorization);
      })
      .catch(() => {
        return undefined;
      });

  setSession(
    headerData: HeaderData,
    user: UserApiModel,
    settings: UserSettings,
  ): void {
    const role = mapRole(headerData.role); // TODO: remove

    if (role === Role.visitor) {
      notify(i18n.t("Login:error.denied"));
      return;
    }

    this.saveToLocalStorage(
      role,
      user,
      headerData.exp,
      headerData.token,
      settings.language,
    );

    this.setState({
      authenticated: true,
      user: {
        role,
        uuid: headerData.user_id,
        name: user.first_name,
        surname: user.last_name,
        language: settings.language,
      },
      accessToken: headerData.token,
      expires: headerData.exp,
    });
  }

  render(): JSX.Element {
    const authProviderValue = {
      ...this.state,
      initiateLogin: this.initiateLogin,
      handleAuthentication: this.handleAuthentication,
      logout: this.logout,
    };

    if (this.state.authenticated) {
      getToken().then((maybeToken) => {
        sendTokenToServer(maybeToken);
      });

      onMessageListener()
        .then((payload) => {
          const n = payload.notification;
          notification.info({
            message: n.title,
            description: n.body,
            placement: "topRight",
          });
        })
        .catch((err) => console.log("failed: ", err));
    }

    // Add a request interceptor
    axios.interceptors.response.use(
      async (response) => {
        const originalResponce = response.config;

        if (
          originalResponce.url === `/api/login/refresh` ||
          originalResponce.url ===
            `${process.env.REACT_APP_API_URL}/api/login/refresh`
        ) {
          return response;
        }

        const exp = parseInt(localStorage.getItem("exp") ?? "");

        if (exp && new Date(exp * 1000) < new Date()) {
          const headerData = await this.refreshAuthLogic();

          if (!headerData) {
            this.logout();
            return Promise.reject(response);
          }

          const { token, exp: expires } = headerData;

          localStorage.setItem("accessToken", token);
          localStorage.setItem("exp", expires.toString());

          axios.defaults.headers.common = {
            Authorization: token,
          };
          axios.defaults.withCredentials = true;

          return axios(originalResponce);
        }

        return response;
      },
      async (error) => {
        const originalRequest = error.config;

        if (
          originalRequest.url === `/api/login/refresh` ||
          originalRequest.url ===
            `${process.env.REACT_APP_API_URL}/api/login/refresh`
        ) {
          return Promise.reject(error);
        }

        const exp = parseInt(localStorage.getItem("exp") ?? "");

        if (exp && new Date(exp * 1000) < new Date()) {
          const headerData = await this.refreshAuthLogic();

          if (!headerData) {
            this.logout();
            return Promise.reject(error);
          }

          const { token, exp: expired } = headerData;

          localStorage.setItem("accessToken", token);
          localStorage.setItem("exp", expired.toString());

          axios.defaults.headers.common = {
            Authorization: token,
          };

          axios.defaults.withCredentials = true;

          return axios(originalRequest);
        }

        return Promise.reject(error);
      },
    );

    axios.interceptors.request.use(
      (config) => {
        const token = localStorage.getItem("accessToken");
        if (token) {
          config.headers = {
            Authorization: token,
          };
        }

        console.log(
          config.url,
          config.headers.Authorization?.substr(
            config.headers.Authorization?.length - 10,
          ),
        );

        return config;
      },
      (error) => {
        Promise.reject(error);
      },
    );

    axios.defaults.headers.common = {
      Authorization: `${this.state.accessToken}`,
    };

    return (
      <AuthProvider value={authProviderValue}>
        {this.props.children}
      </AuthProvider>
    );
  }
}

export default Auth;
\end{lstlisting}
\subsection{@lib/components/Metrics/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Col, Row, Tooltip } from "antd";

type Metric = {
  title: string;
  icon: JSX.Element;
  value: number;
};

export type MetricsProps = {
  metrics: Metric[];
};

const Metrics: FC<MetricsProps> = ({ metrics }) => {
  return (
    <Row gutter={30}>
      {metrics.map((metric) => {
        return (
          <Col key={metric.title}>
            <Tooltip title={metric.title}>
              <Row gutter={6}>
                <Col>{metric.icon}</Col>
                <Col>{metric.value}</Col>
              </Row>
            </Tooltip>
          </Col>
        );
      })}
    </Row>
  );
};

export default Metrics;
\end{lstlisting}
\subsection{@lib/components/Pagination/index.tsx}
\begin{lstlisting}
import React, { MutableRefObject, ReactNode, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Empty, Result as DisplayResult, Skeleton } from "antd";
import Pagination, { PaginationProps } from "antd/lib/pagination";
import useAxios, { PageData as ModelsPageData } from "@providers/axios";
import { AxiosResponse } from "axios";
import classnames from "classnames";
import i18n from "i18next";

import styles from "./styles.module.less";

type RestProps = Omit<
  PaginationProps,
  | "current"
  | "defaultCurrent"
  | "defaultPageSize"
  | "pageSize"
  | "total"
  | "showSizeChanger"
  | "showQuickJumper"
  | "showTotal"
  | "onChange"
  | "onShowSizeChange"
>;

type FullProps<Variables, Result, Single> = PaginatedQueryProps<
  Variables,
  Result,
  Single
> &
  RestProps;

type PaginationState = {
  currentPage: number;
  size: number;
};

type PaginationHookState = PaginationState & {
  onCurrentChange: PaginationProps["onChange"];
  onPageSizeChange: PaginationProps["onShowSizeChange"];
};

export type PaginatedResult<T> = {
  total: number | null;
  entries: T[];
};

export type StateRef = {
  page: number;
  size: number;
} | null;

type PaginatedQueryProps<Variables, Result, Single> = {
  noInfo?: boolean;
  className?: string;
  paginationClassName?: string;
  refetch?: boolean;
  // eslint-disable-next-line
  requestQuery: (variables: any) => Promise<AxiosResponse<Result>>;
  variables?: Omit<Variables, "page" | "size">;
  stateRef?: MutableRefObject<StateRef>;
  initialPage?: number;
  initialSize?: number;
  render: (
    entries: PaginatedResult<Single>["entries"],
    total: PaginatedResult<Single>["total"],
  ) => ReactNode;
  onResult?: (queryResult: Result) => void;
  onPaginationState?: (state: PaginationState) => void;
};

/**
 * Pagination resume, generates string from total and current scope
 *
 * @param total
 * @param scope [from, to]
 */
function showTotal(total: number, [from, to]: [number, number]): string {
  return i18n.t("Pagination.showTotal", { total, from, to });
}

/**
 * Extracts entries and total using provided reduce option
 *
 * @param data raw query result
 */
function grabPaginatedResult<V, R, S>(data: R): PaginatedResult<S> {
  let entries: S[] = [];

  // eslint-disable-next-line
  const { page = null, ...rest } = data as any; // TODO

  // can be less hacky if pagination has fixed list field name
  if (Object.keys(rest).length === 1) {
    entries = rest[Object.keys(rest)[0]];
  }

  return {
    total: (page as ModelsPageData).totalElements ?? 0,
    entries,
  };
}

/**
 *  Actual Pagination component without wrapper for className
 */
function InnerPaginatedQuery<
  Variables extends Record<string, unknown>,
  Result,
  Single
>({
  noInfo = false,
  paginationClassName,
  refetch = undefined,
  requestQuery,
  initialPage = 1,
  initialSize = 10,
  stateRef,
  variables,
  onResult,
  render,
  onPaginationState,
  ...rest
}: PaginatedQueryProps<Variables, Result, Single> &
  RestProps): JSX.Element | null {
  // pagination state handlers

  const { t } = useTranslation("translation");

  const [page, onCurrentChange] = useState(initialPage);
  const [size, onPageSizeChange] = useState(initialSize);

  // save state above if needed
  useEffect(() => {
    if (stateRef !== undefined) {
      stateRef.current = { page, size };
    }
    onPaginationState?.({ currentPage: page, size });
  }, [stateRef, onPaginationState, page, size]);

  const { data, loading, error } = useAxios(
    requestQuery,
    refetch,
    ...Object.values(
      variables
        ? { page: page - 1, size, ...variables }
        : { page: page - 1, size, sort: "" },
    ),
  );

  // propagate result above if needed
  useEffect(() => {
    if (data) {
      onResult?.(data);
    }
  }, [onResult, data]);

  if (error) {
    console.error(error);
    // TODO : make more userfriendly and consice
    return <DisplayResult status="500" title="500" subTitle={t("error")} />;
  }

  // Handle data
  if (loading || !data) {
    return <Skeleton active={loading} />;
  }

  // Grab total and entries
  const { total, entries } = grabPaginatedResult<Variables, Result, Single>(
    data,
  );

  // Handle bad response
  if (total === null || total === 0) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  return (
    <>
      {render(entries, total)}

      <Pagination
        {...rest}
        className={classnames(styles.pagination, paginationClassName)}
        total={total}
        current={page}
        pageSize={size}
        pageSizeOptions={rest.pageSizeOptions ?? ["10", "20", "50"]}
        showSizeChanger={total > size}
        showQuickJumper={total > size}
        showTotal={noInfo ? () => "" : showTotal}
        onChange={onCurrentChange}
        onShowSizeChange={onPageSizeChange}
      />
    </>
  );
}

export default function PaginatedQuery<
  Variables extends Record<string, unknown>,
  Result,
  Single
>(props: FullProps<Variables, Result, Single>): JSX.Element {
  return (
    <div className={props.className}>
      <InnerPaginatedQuery {...props} />
    </div>
  );
}
\end{lstlisting}
\subsection{@lib/components/Pagination/styles.module.less}
\begin{lstlisting}
@import "../../../variables.less";

.pagination {
  display: flex;

  :global(.ant-pagination-total-text) {
    flex: 1 1 auto;
  }
}
\end{lstlisting}
\subsection{@lib/components/RegistryTable/index.tsx}
\begin{lstlisting}
import React, { useCallback, useMemo } from "react";
import { get, isFunction } from "lodash";
import { Table } from "antd";
import { ColumnsType, ColumnType, TableProps } from "antd/lib/table";
import { bindStyles, formatDate, formatNumber } from "@lib/utils";
import classnames from "classnames";
import i18n, { TFunction } from "i18next";

import styles from "./styles.module.less";

export type RegistryColumnConf<Element> = {
  key: string;
  title?: string;
  render?:
    | ColumnType<Element>["render"]
    | "Int"
    | "Boolean"
    | "String"
    | "Text"
    | "DateTime";
  width?: string;
  sortOrder?: "descend" | "ascend";
};

export type RegistryRowState = {
  selected?: boolean;
  target?: boolean;
};

export type RegistryTableProps<Element> = {
  entity: string;
  className?: string;
  headerClassName?: string;
  rowState?: (record: Element, index?: number) => RegistryRowState;
  rowClassName?:
    | string
    | ((record: Element, index?: number) => string | undefined);
  rowKey?: TableProps<Element>["rowKey"];
  columns: Array<RegistryColumnConf<Element>>;
  rows: Element[];
  expandable?: TableProps<Element>["expandable"];
  // Handlers
  onRecordClick?: (
    event: React.MouseEvent,
    record: Element,
    index?: number,
  ) => void;
};

function cellRenderer<Element>(
  t: TFunction,
  key: string,
  type: RegistryColumnConf<Element>["render"],
): ColumnType<Element>["render"] {
  switch (type) {
    case "Int":
      return (text, record) => formatNumber(get(record, key));
    case "Boolean":
      return (text, record) => get(record, key);
    case "String":
      return (text, record) => get(record, key);
    case "Text":
      return (text, record) => (get(record, key, "") as string).substr(0, 200);
    case "DateTime":
      return (text, record) => formatDate(get(record, key));

    default:
      return type;
  }
}

function buildSingleColumn<Element>(
  t: TFunction,
  column: RegistryColumnConf<Element>,
): ColumnType<Element> {
  const key = column.key;
  const title = column.title ?? t(column.key);
  const render = cellRenderer(t, key, column.render);

  return {
    key,
    title,
    render,
    width: column.width,
    sortOrder: column.sortOrder,
  };
}

function buildColumns<Element>(
  entity: string,
  columns: Array<RegistryColumnConf<Element>>,
): ColumnsType<Element> {
  const t = i18n.getFixedT(null, entity);
  return columns.map((column) => buildSingleColumn(t, column));
}

function RegistryTable<Element extends Record<string, unknown>>({
  entity,
  className,
  headerClassName,
  rowState,
  rowClassName,
  rows,
  rowKey = "id",
  columns,
  // Handlers
  expandable,
  onRecordClick,
}: RegistryTableProps<Element>): JSX.Element {
  const COLUMNS = useMemo(() => buildColumns(entity, columns), [
    entity,
    columns,
  ]);

  const onHeaderRow = useCallback(
    () => ({
      className: classnames(styles.headerRow, headerClassName),
    }),
    [headerClassName],
  );

  const boundStyles = useMemo(() => bindStyles(styles, rowState), [rowState]);

  const onRow = useCallback(
    (record: Element, index?: number) => ({
      className: classnames(
        styles.row,
        boundStyles(record, index),
        isFunction(rowClassName) ? rowClassName(record, index) : rowClassName,
      ),
      onClick(event: React.MouseEvent): void {
        onRecordClick?.(event, record, index);
      },
      onMouseDown(event: React.MouseEvent): void {
        // prevent shift+click selection behavior
        event.preventDefault();
      },
    }),
    [boundStyles, rowClassName, onRecordClick],
  );

  return (
    <Table
      className={classnames(styles.table, className)}
      rowKey={rowKey}
      onHeaderRow={onHeaderRow}
      onRow={onRow}
      pagination={false}
      columns={COLUMNS}
      dataSource={rows}
      expandable={expandable}
    />
  );
}

export default RegistryTable;
\end{lstlisting}
\subsection{@lib/components/RegistryTable/styles.module.less}
\begin{lstlisting}
@import "../../../variables.less";

.table {
  margin-bottom: @main-vertical-padding;
}

.row {
  & > td {
    background: none !important;
    transition: background 0s;
  }

  cursor: pointer;

  .selectAndHover();
}
\end{lstlisting}
\subsection{@lib/components/RoleSwitch/index.tsx}
\begin{lstlisting}
import { FC } from "react";
import { check, Role } from "@providers/rbac-rules";

type RoleSwitchProps = {
  role: Role;
  perform: string;
  yes?: () => JSX.Element;
  no?: () => JSX.Element;
};

const RoleSwitch: FC<RoleSwitchProps> = ({
  role,
  perform,
  yes = () => null,
  no = () => null,
}) => (check(role, perform) ? yes() : no());

export default RoleSwitch;
\end{lstlisting}
\subsection{@lib/hooks/debounce.ts}
\begin{lstlisting}
import { useEffect, useState } from "react";

export function useDebounce<T>(value: T, delay: number): T {
  // State and setters for debounced value
  const [debouncedValue, setDebouncedValue] = useState(value);

  useEffect(
    () => {
      // Update debounced value after delay
      const handler = setTimeout(() => {
        setDebouncedValue(value);
      }, delay);

      // Cancel the timeout if value changes (also on delay change or unmount)
      // This is how we prevent debounced value from updating if value is changed ...
      // .. within the delay period. Timeout gets cleared and restarted.
      return (): void => {
        clearTimeout(handler);
      };
    },
    [value, delay], // Only re-call effect if value or delay changes
  );

  return debouncedValue;
}
\end{lstlisting}
\subsection{@lib/hooks/index.ts}
\begin{lstlisting}
import { useEffect } from "react";

import { nameString } from "../../appInfo";

export {
  useLocationQuery,
  useLocationQueryState,
  useLocationQueryEffect,
} from "./location";

export { usePrevious } from "./previous";
export { useListSelection } from "./list";
export { useDebounce } from "./debounce";

export function useDocumentTitle(title: string): void {
  useEffect(() => {
    document.title = `[${nameString}] ${title}`;

    return () => {
      document.title = `[${nameString}]`;
    };
  }, [title]);
}
\end{lstlisting}
\subsection{@lib/hooks/list.ts}
\begin{lstlisting}
import { useCallback, useEffect, useMemo, useState } from "react";
import { isNil, update } from "lodash/fp";

type Index = number;

type ListSelectionState<T> = {
  target?: T | null;
  selected: T[];
  isTarget: (index: Index | undefined) => boolean;
  isSelected: (index: Index | undefined) => boolean;
  onElementClick: (event: React.MouseEvent | MouseEvent, index: Index) => void;
  setList: React.Dispatch<React.SetStateAction<T[]>>;
  getSelectedIndeces: () => Index[];
  reset: () => void;
};

type SelectedState = boolean[];

function buildStateFromList<T>(
  list: T[],
  from?: Index,
  to?: Index,
): SelectedState {
  if (isNil(to)) {
    if (isNil(from)) {
      return list.map(() => false);
    }

    return list.map((e, index) => index >= from);
  }
  const selectedStart = Math.min(from ?? 0, to);
  const selectedEnd = Math.max(from ?? 0, to);
  return list.map((e, index) => index >= selectedStart && index <= selectedEnd);
}

function isCtrl(event: React.MouseEvent | MouseEvent): boolean {
  return event.ctrlKey || event.metaKey;
}

function isShift(event: React.MouseEvent | MouseEvent): boolean {
  return event.shiftKey;
}

type ListSelectionProps = {
  external?: boolean;
};

export function useListSelection<T>(
  list: T[] = [],
  { external = false }: ListSelectionProps = {},
): ListSelectionState<T> {
  const [innerList, setList] = useState<T[]>(list);

  const actualList = useMemo(() => (external ? list : innerList), [
    external,
    list,
    innerList,
  ]);

  const [selected, setSelected] = useState<SelectedState>(() =>
    buildStateFromList(actualList),
  );

  const [target, setTarget] = useState<Index | undefined>();

  const reset = useCallback((): void => {
    setSelected(buildStateFromList(actualList));
    setTarget(undefined);
  }, [actualList]);

  const toggleElement = (index: Index): void => {
    setSelected(update([index], (x) => !x));
  };

  const isTarget = useCallback(
    (index: Index | undefined): boolean =>
      target !== undefined && target === index,
    [target],
  );

  const isSelected = useCallback(
    (index: Index | undefined = -1): boolean => selected[index] ?? false,
    [selected],
  );

  const onElementClick = useCallback(
    (event: React.MouseEvent | MouseEvent, index: Index): void => {
      const currentTarget = target;

      // Click with queue
      if (isCtrl(event)) {
        event.preventDefault();

        toggleElement(index);
        setTarget(index);
        return;
      }

      // From-to select
      if (isShift(event)) {
        event.preventDefault();

        setSelected(buildStateFromList(actualList, currentTarget, index));
        return;
      }

      // Usual single click
      if (currentTarget === index) {
        reset();
      } else {
        setSelected(buildStateFromList(actualList, index, index));
        setTarget(index);
      }
    },
    [actualList, target, reset],
  );

  const getSelectedIndeces = useCallback(
    () =>
      selected.reduce(
        (ac, value, index) => (value ? [...ac, index] : ac),
        [] as Index[],
      ),
    [selected],
  );

  useEffect(reset, [actualList, reset]);

  return {
    target: useMemo(() => (isNil(target) ? null : actualList[target]), [
      actualList,
      target,
    ]),
    selected: useMemo(
      () => actualList.filter((element, index) => selected[index]),
      [actualList, selected],
    ),
    isTarget,
    isSelected,
    onElementClick,

    getSelectedIndeces,
    setList,
    reset,
  };
}
\end{lstlisting}
\subsection{@lib/hooks/location.ts}
\begin{lstlisting}
import { Dispatch, SetStateAction, useEffect, useState } from "react";
import { isEmpty } from "lodash";
import { useResponse, useRouter } from "@curi/react-dom";
import { NavigationDetails } from "@curi/types";
import { QueryObject, queryParse, queryStringify } from "@lib/utils/query";

type T = QueryObject;

/**
 * get @QueryObject from route location query
 *
 * @param value
 */
export function useLocationQuery(defaultValue: T = {}): T {
  const { response } = useResponse();

  const { query: queryString } = response.location;
  const value = isEmpty(queryString) ? defaultValue : queryParse(queryString);

  return value;
}

/**
 * Store limited @QueryObject synchronously with route location query
 *
 * @param value
 */
export function useLocationQueryEffect(
  value: T,
  method: NavigationDetails["method"] = "replace",
): void {
  const { response } = useResponse();
  const router = useRouter();

  const { pathname: currentPath } = response.location;

  useEffect(() => {
    const newQueryString = queryStringify(value);
    router.navigate({
      url: `${currentPath}?${newQueryString}`,
      method,
    });
  }, [value, router, currentPath, method]);
}

/**
 * Allows to work with limited @QueryObject as usual useState,
 * but stores it synchronously with route location query
 *
 * @param defaultValue
 */
export function useLocationQueryState(
  defaultValue: T = {},
  method: NavigationDetails["method"] = "replace",
): [T, Dispatch<SetStateAction<T>>] {
  const initialState = useLocationQuery(defaultValue);
  const [value, setValue] = useState<T>(initialState);

  useLocationQueryEffect(value, method);

  return [value, setValue];
}
\end{lstlisting}
\subsection{@lib/hooks/previous.ts}
\begin{lstlisting}
import { useEffect, useRef } from "react";

export function usePrevious<T>(value: T): T {
  const ref = useRef(value);

  useEffect(() => {
    ref.current = value;
  }, [value]);

  return ref.current;
}
\end{lstlisting}
\subsection{@lib/hooks/storage.ts}
\begin{lstlisting}
import { Dispatch, SetStateAction, useState } from "react";

import KVStorage from "../utils/kvstorage";

const LocalStorage = new KVStorage("local");

export function useLocalStorage<T>(
  key: string,
  initialValue: T,
): [T, Dispatch<SetStateAction<T>>] {
  const [storedValue, setStoredValue] = useState(() => {
    return LocalStorage.get<T>(key) ?? initialValue;
  });

  const setValue: Dispatch<SetStateAction<T>> = (value) => {
    const valueToStore = value instanceof Function ? value(storedValue) : value;
    setStoredValue(valueToStore);
    LocalStorage.set(key, valueToStore);
  };

  return [storedValue, setValue];
}
\end{lstlisting}
\subsection{@lib/utils/__tests__/base64.ts}
\begin{lstlisting}
/* eslint-disable no-undef */
import { decode as d, encode as e } from "../base64";

test("base64 encode", () => {
  expect(e("test string")).toEqual("dGVzdCUyMHN0cmluZw==");
  expect(e("")).toEqual("JUUyJTk5JUEw");
});

test("base64 decode", () => {
  expect(d("dGVzdCUyMHN0cmluZw==")).toEqual("test string");
});

test("base64 full cycle", () => {
  expect(d(e("test string") ?? "")).toEqual("test string");
});
\end{lstlisting}
\subsection{@lib/utils/__tests__/query.ts}
\begin{lstlisting}
/* eslint-disable no-undef */
import { queryParse, queryStringify } from "../query";

const settings = {
  str: "test",
  flag: false,
  interval: {
    from: 0,
    to: 10,
  },
  tags: ["tag1", "tag2"],
  hide: undefined,
};

test("queryParse", () => {
  expect(queryParse("a=b&c=d")).toEqual({ a: "b", c: "d" });
  expect(queryParse("a=true")).toEqual({ a: true });
  expect(queryParse("a=")).toEqual({ a: "" });
  expect(queryParse("a")).toEqual({ a: null });
  expect(queryParse("a=1&a=2&a=3")).toEqual({ a: [1, 2, 3] });
  expect(queryParse("a.a=1&a.b=b")).toEqual({ a: { a: 1, b: "b" } });
});

test("queryStringify", () => {
  expect(queryStringify({ a: true }, false)).toEqual("a=true");
  expect(queryStringify({ a: "b", c: "d" }, false)).toEqual("a=b&c=d");
  expect(queryStringify({ a: [1, 2, 3] }, false)).toEqual("a=1&a=2&a=3");
  expect(queryStringify({ a: { a: 1, b: "b" } }, false)).toEqual("a.a=1&a.b=b");
  expect(queryStringify({ a: { a: [1, 2, 3] } }, false)).toEqual(
    "a.a=1&a.a=2&a.a=3",
  );
  expect(queryStringify(settings, false)).toEqual(
    "flag=false&interval.from=0&interval.to=10&str=test&tags=tag1&tags=tag2",
  );
});

test("marshall/unmarshall", () => {
  expect(queryParse(queryStringify(settings))).toEqual(settings);
});
\end{lstlisting}
\subsection{@lib/utils/__tests__/storage.ts}
\begin{lstlisting}
/* eslint-disable no-undef */
import KVStorage from "../kvstorage";

const value = {
  foo: 1,
  bar: "bar",
};

test("KVStorage", () => {
  const S = new KVStorage("local", "test");
  expect(S.get("1")).toEqual(undefined);

  S.set("2", 1);
  expect(S.get("2")).toEqual(1);

  S.set("3", value);
  expect(S.get("3")).toEqual(value);

  S.remove("3");
  expect(S.get("3")).toEqual(undefined);

  S.clear();
  expect([S.get("1"), S.get("2"), S.get("3")]).toStrictEqual([
    undefined,
    undefined,
    undefined,
  ]);
});
\end{lstlisting}
\subsection{@lib/utils/__tests__/transliterate.ts}
\begin{lstlisting}
/* eslint-disable no-undef */
import t from "../transliterate";

test("Transliteration", () => {
  expect(t("TEST")).toEqual("TEST");
});
\end{lstlisting}
\subsection{@lib/utils/auth.ts}
\begin{lstlisting}
import KVStorage from "./kvstorage";

const JWT_TOKEN = "jwtToken";
const PERM = "permissions";

const storage = new KVStorage("local");

export type Permission = string;
export type Permissions = Array<Permission>;
export type AuthToken = string;

export function getPermissions(): Permissions {
  return storage.get(PERM) || [];
}

export function setPermissions(permissions: Permissions): void {
  storage.set(PERM, permissions);
}

export function clearPermissions(): void {
  storage.set(PERM, []);
}

export function getToken(): AuthToken | undefined {
  return storage.get<AuthToken>(JWT_TOKEN);
}

export function setToken(token: AuthToken): void {
  storage.set(JWT_TOKEN, token);
}

export function checkPermissions(
  permissions: Permissions | Permission,
  against?: Permissions,
): boolean {
  if (!permissions) {
    return true;
  }
  const access = against || getPermissions();

  if (Array.isArray(permissions)) {
    return permissions.every((p) => access.includes(p));
  }

  return access.includes(permissions);
}
\end{lstlisting}
\subsection{@lib/utils/base64.ts}
\begin{lstlisting}
export function encode(str: string): string | undefined {
  try {
    return window.btoa(encodeURIComponent(str));
  } catch (e) {
    return;
  }
}

export function decode(str: string): string | undefined {
  try {
    return decodeURIComponent(window.atob(str));
  } catch (e) {
    return;
  }
}
\end{lstlisting}
\subsection{@lib/utils/category.ts}
\begin{lstlisting}
import { CategoryCategory as Category, CategoryCategory } from "@generated";

export function format(
  lang: "ru" | "en" | string | undefined,
  category?: Category,
): string {
  if (lang === "ru") {
    return category?.rus ?? "-";
  }

  if (lang === "en") {
    return category?.eng ?? "-";
  }

  return "-";
}

export function formatMany(
  lang: "run" | "en" | string | undefined,
  categories?: CategoryCategory[],
): string {
  if (!categories) {
    return "-";
  }

  if (categories?.length === 0) {
    return "-";
  }

  return categories
    .map((item) => {
      return format(lang, item);
    })
    .join(", ");
}
\end{lstlisting}
\subsection{@lib/utils/clipboard.ts}
\begin{lstlisting}
function fallbackCopyTextToClipboard(text: string): void {
  const textArea = document.createElement("textarea");
  textArea.value = text;
  document.body.appendChild(textArea);
  textArea.focus();
  textArea.select();

  try {
    document.execCommand("copy");
  } catch (err) {
    // Do nothing
  }

  document.body.removeChild(textArea);
}

export function copyTextToClipboard(text: string): Promise<void> {
  if (!navigator.clipboard) {
    fallbackCopyTextToClipboard(text);
    return Promise.resolve();
  }
  return navigator.clipboard.writeText(text);
}
\end{lstlisting}
\subsection{@lib/utils/currency.ts}
\begin{lstlisting}
import { UtilsMoneyJson } from "@generated";

import { NO_DATA_PLACEHOLDER } from "./meta";

export function format(apiValue: UtilsMoneyJson | undefined): string {
  if (!apiValue) {
    return NO_DATA_PLACEHOLDER;
  }

  const { currency, denominator, numerator } = apiValue;

  return `${numerator ?? 0 / (denominator ?? 0)} ${currency}`;
}

export function moneyCollected(
  approved?: UtilsMoneyJson,
  collected?: UtilsMoneyJson,
): number | undefined {
  if (!approved) {
    return undefined;
  }

  const approvedNumber =
    (approved?.numerator ?? 0) / (approved?.denominator ?? 1);
  const collectedNumber =
    (collected?.numerator ?? 0) / (collected?.denominator ?? 1);

  if (approvedNumber < collectedNumber) {
    return 100;
  }

  return Math.ceil((collectedNumber / approvedNumber) * 100);
}
\end{lstlisting}
\subsection{@lib/utils/date.ts}
\begin{lstlisting}
import * as DateFn from "date-fns";
import { ru } from "date-fns/locale";

import { NO_DATA_PLACEHOLDER } from "./meta";

export type UnixTime = string;

type DateInput = {
  year?: number | null;
  month?: number | null;
  day?: number | null;
};

type TimeInput = {
  hour: number;
  minute: number;
  second: number;
};

export type ApiDateTime = {
  date: DateInput;
  time?: TimeInput | null;
};

/**
 * Names are picked from luxon
 */
export enum DateTimeFormat {
  DATE_SHORT = "dd.MM.yyyy",
  DATE_MED = "dd MMM yyyy",
  DATE_MED_WITH_WEEKDAY = "EE, dd MMM yyyy",
  DATE_FULL = "dd MMMM yyyy",
  DATE_HUGE = "EEEE, dd MMMM yyyy",
  TIME_SIMPLE = "p",
  TIME_WITH_SECONDS = "pp",
  TIME_WITH_SHORT_OFFSET = "ppp",
  TIME_WITH_LONG_OFFSET = "pppp",
  TIME_24_SIMPLE = "HH:mm",
  TIME_24_WITH_SECONDS = "HH:mm:ss",
  TIME_24_WITH_SHORT_OFFSET = "HH:mm:ss O",
  TIME_24_WITH_LONG_OFFSET = "HH:mm:ss OOOO",
  DATETIME_SHORT = "dd.MM.yyyy HH:mm",
  DATETIME_MED = "dd MMM yyyy HH:mm",
  DATETIME_FULL = "dd MMMM yyyy HH:mm",
  DATETIME_HUGE = "EEEE, dd MMMM yyyy HH:mm OOOO",
  DATETIME_SHORT_WITH_SECONDS = "dd.MM.yyyy HH:mm:ss",
  DATETIME_MED_WITH_SECONDS = "dd MMM yyyy HH:mm:ss",
  DATETIME_FULL_WITH_SECONDS = "dd MMMM yyyy HH:mm:ss",
  DATETIME_HUGE_WITH_SECONDS = "dd MMMM yyyy OOOO",
}

export function noNull<T>(value: T | null | undefined): T | undefined {
  if (value === null) {
    return undefined;
  }

  return value;
}

export function dateFromApi(
  source: DeepPartial<ApiDateTime> | null | undefined,
): Date | null {
  if (!source) {
    return null;
  }

  return DateFn.set(new Date(), {
    year: noNull(source.date?.year),
    month: noNull(source.date?.month),
    date: noNull(source.date?.day),
    hours: noNull(source.time?.hour),
    minutes: noNull(source.time?.minute),
    seconds: noNull(source.time?.second),
  });
}

export function dateToApi(source: Date | null): ApiDateTime | null {
  if (!source) {
    return null;
  }

  return {
    date: {
      year: DateFn.getYear(source),
      month: DateFn.getMonth(source),
      day: DateFn.getDate(source),
    },
    time: {
      hour: DateFn.getHours(source),
      minute: DateFn.getMinutes(source),
      second: DateFn.getSeconds(source),
    },
  };
}

export function format(
  apiValue: UnixTime | null | undefined,
  display: DateTimeFormat | string = DateTimeFormat.DATETIME_SHORT,
): string {
  if (!apiValue) {
    return NO_DATA_PLACEHOLDER;
  }

  const d = new Date(apiValue);

  return DateFn.format(d, display, { locale: ru });
}

export function formatDateTime(apiValue: DeepPartial<ApiDateTime>): string {
  const dt = dateFromApi(apiValue);

  if (!dt) {
    return NO_DATA_PLACEHOLDER;
  }

  return DateFn.format(
    dt,
    apiValue.time ? DateTimeFormat.DATETIME_FULL : DateTimeFormat.DATE_FULL,
    { locale: ru },
  );
}

type UntilProgress = {
  days: number;
  percentage: number;
};

export function daysLeft(
  started?: string,
  until?: string,
): UntilProgress | undefined {
  if (!until || !started) {
    return undefined;
  }

  const startDate = new Date(started);
  const untilDate = new Date(until);
  const currentDate = new Date();

  if (untilDate < currentDate) {
    return {
      days: 0,
      percentage: 100,
    };
  }

  const diff = Math.abs(untilDate.getTime() - currentDate.getTime());
  const diffDays = Math.ceil(diff / (1000 * 3600 * 24));

  const totalDiff = Math.abs(untilDate.getTime() - startDate.getTime());
  const diffTotalDays = Math.ceil(totalDiff / (1000 * 3600 * 24));

  return {
    days: diffDays,
    percentage: (diffDays / diffTotalDays) * 100,
  };
}
\end{lstlisting}
\subsection{@lib/utils/index.ts}
\begin{lstlisting}
import { format as formatDate, UnixTime } from "./date";

export { queryParse, queryStringify } from "./query";
export { copyTextToClipboard } from "./clipboard";
export { encode as base64encode, decode as base64decode } from "./base64";
export { format as formatDate, formatDateTime } from "./date";
export { format as formatMoney } from "./currency";
export { format as formatNumber } from "./number";
export { format as formatCategory } from "./category";
export { formatMany as formatCategories } from "./category";
export { default as transliterate } from "./transliterate";
export { default as KVStorage } from "./kvstorage";
export { bindStyles } from "./styles";
export { format as formatString } from "./list_data";

export { NO_DATA_PLACEHOLDER, NO_IMAGE_PLACEHOLDER } from "./meta";

type User = {
  name: string;
};

export function formatSystemInfo(
  date: UnixTime | null | undefined,
  user: User | null | undefined,
): string {
  if (user === undefined || user === null) {
    return formatDate(date);
  }

  if (date === undefined) {
    return user.name;
  }

  return `${user.name} - ${formatDate(date)}`;
}
\end{lstlisting}
\subsection{@lib/utils/kvstorage.ts}
\begin{lstlisting}
const BACKENDS = {
  local: window.localStorage,
  session: window.sessionStorage,
};

type StorageBackend = "local" | "session";

export default class KVStorage {
  private backend: Storage;
  private prefix?: string;

  constructor(type: StorageBackend = "local", prefix?: string) {
    this.backend = BACKENDS[type];
    this.prefix = prefix;
  }

  private prefixedKey(key: string): string {
    const prefix = this.prefix ?? window.APP.name;
    return `${prefix}:${key}`;
  }

  set<T>(key: string, value: T): void {
    const innerKey = this.prefixedKey(key);
    this.backend.setItem(innerKey, JSON.stringify(value));
  }

  get<T>(key: string): T | undefined {
    try {
      const innerKey = this.prefixedKey(key);
      const strValue = this.backend.getItem(innerKey);
      if (strValue) {
        return JSON.parse(strValue) as T;
      }

      return undefined;
    } catch (e) {
      return undefined;
    }
  }

  remove(key: string): void {
    const innerKey = this.prefixedKey(key);
    this.backend.removeItem(innerKey);
  }

  clear(): void {
    this.backend.clear();
  }
}
\end{lstlisting}
\subsection{@lib/utils/list_data.ts}
\begin{lstlisting}
export function format(data: string | undefined | null): string {
  if (data?.length === 0) {
    return "-";
  }

  return data ?? "-";
}
\end{lstlisting}
\subsection{@lib/utils/meta.ts}
\begin{lstlisting}
export const NO_DATA_PLACEHOLDER = "-";
export const NO_IMAGE_PLACEHOLDER =
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMIAAADDCAYAAADQvc6UAAABRWlDQ1BJQ0MgUHJvZmlsZQAAKJFjYGASSSwoyGFhYGDIzSspCnJ3UoiIjFJgf8LAwSDCIMogwMCcmFxc4BgQ4ANUwgCjUcG3awyMIPqyLsis7PPOq3QdDFcvjV3jOD1boQVTPQrgSkktTgbSf4A4LbmgqISBgTEFyFYuLykAsTuAbJEioKOA7DkgdjqEvQHEToKwj4DVhAQ5A9k3gGyB5IxEoBmML4BsnSQk8XQkNtReEOBxcfXxUQg1Mjc0dyHgXNJBSWpFCYh2zi+oLMpMzyhRcASGUqqCZ16yno6CkYGRAQMDKMwhqj/fAIcloxgHQqxAjIHBEugw5sUIsSQpBobtQPdLciLEVJYzMPBHMDBsayhILEqEO4DxG0txmrERhM29nYGBddr//5/DGRjYNRkY/l7////39v///y4Dmn+LgeHANwDrkl1AuO+pmgAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAwqADAAQAAAABAAAAwwAAAAD9b/HnAAAHlklEQVR4Ae3dP3PTWBSGcbGzM6GCKqlIBRV0dHRJFarQ0eUT8LH4BnRU0NHR0UEFVdIlFRV7TzRksomPY8uykTk/zewQfKw/9znv4yvJynLv4uLiV2dBoDiBf4qP3/ARuCRABEFAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghgg0Aj8i0JO4OzsrPv69Wv+hi2qPHr0qNvf39+iI97soRIh4f3z58/u7du3SXX7Xt7Z2enevHmzfQe+oSN2apSAPj09TSrb+XKI/f379+08+A0cNRE2ANkupk+ACNPvkSPcAAEibACyXUyfABGm3yNHuAECRNgAZLuYPgEirKlHu7u7XdyytGwHAd8jjNyng4OD7vnz51dbPT8/7z58+NB9+/bt6jU/TI+AGWHEnrx48eJ/EsSmHzx40L18+fLyzxF3ZVMjEyDCiEDjMYZZS5wiPXnyZFbJaxMhQIQRGzHvWR7XCyOCXsOmiDAi1HmPMMQjDpbpEiDCiL358eNHurW/5SnWdIBbXiDCiA38/Pnzrce2YyZ4//59F3ePLNMl4PbpiL2J0L979+7yDtHDhw8vtzzvdGnEXdvUigSIsCLAWavHp/+qM0BcXMd/q25n1vF57TYBp0a3mUzilePj4+7k5KSLb6gt6ydAhPUzXnoPR0dHl79WGTNCfBnn1uvSCJdegQhLI1vvCk+fPu2ePXt2tZOYEV6/fn31dz+shwAR1sP1cqvLntbEN9MxA9xcYjsxS1jWR4AIa2Ibzx0tc44fYX/16lV6NDFLXH+YL32jwiACRBiEbf5KcXoTIsQSpzXx4N28Ja4BQoK7rgXiydbHjx/P25TaQAJEGAguWy0+2Q8PD6/Ki4R8EVl+bzBOnZY95fq9rj9zAkTI2SxdidBHqG9+skdw43borCXO/ZcJdraPWdv22uIEiLA4q7nvvCug8WTqzQveOH26fodo7g6uFe/a17W3+nFBAkRYENRdb1vkkz1CH9cPsVy/jrhr27PqMYvENYNlHAIesRiBYwRy0V+8iXP8+/fvX11Mr7L7ECueb/r48eMqm7FuI2BGWDEG8cm+7G3NEOfmdcTQw4h9/55lhm7DekRYKQPZF2ArbXTAyu4kDYB2YxUzwg0gi/41ztHnfQG26HbGel/crVrm7tNY+/1btkOEAZ2M05r4FB7r9GbAIdxaZYrHdOsgJ/wCEQY0J74TmOKnbxxT9n3FgGGWWsVdowHtjt9Nnvf7yQM2aZU/TIAIAxrw6dOnAWtZZcoEnBpNuTuObWMEiLAx1HY0ZQJEmHJ3HNvGCBBhY6jtaMoEiJB0Z29vL6ls58vxPcO8/zfrdo5qvKO+d3Fx8Wu8zf1dW4p/cPzLly/dtv9Ts/EbcvGAHhHyfBIhZ6NSiIBTo0LNNtScABFyNiqFCBChULMNNSdAhJyNSiECRCjUbEPNCRAhZ6NSiAARCjXbUHMCRMjZqBQiQIRCzTbUnAARcjYqhQgQoVCzDTUnQIScjUohAkQo1GxDzQkQIWejUogAEQo121BzAkTI2agUIkCEQs021JwAEXI2KoUIEKFQsw01J0CEnI1KIQJEKNRsQ80JECFno1KIABEKNdtQcwJEyNmoFCJAhELNNtScABFyNiqFCBChULMNNSdAhJyNSiECRCjUbEPNCRAhZ6NSiAARCjXbUHMCRMjZqBQiQIRCzTbUnAARcjYqhQgQoVCzDTUnQIScjUohAkQo1GxDzQkQIWejUogAEQo121BzAkTI2agUIkCEQs021JwAEXI2KoUIEKFQsw01J0CEnI1KIQJEKNRsQ80JECFno1KIABEKNdtQcwJEyNmoFCJAhELNNtScABFyNiqFCBChULMNNSdAhJyNSiECRCjUbEPNCRAhZ6NSiAARCjXbUHMCRMjZqBQiQIRCzTbUnAARcjYqhQgQoVCzDTUnQIScjUohAkQo1GxDzQkQIWejUogAEQo121BzAkTI2agUIkCEQs021JwAEXI2KoUIEKFQsw01J0CEnI1KIQJEKNRsQ80JECFno1KIABEKNdtQcwJEyNmoFCJAhELNNtScABFyNiqFCBChULMNNSdAhJyNSiEC/wGgKKC4YMA4TAAAAABJRU5ErkJggg==";
\end{lstlisting}
\subsection{@lib/utils/name.ts}
\begin{lstlisting}
export function cred(
  firstName?: string,
  middleName?: string,
  lastName?: string,
): string {
  const fst = firstName?.charAt(0) ?? "";
  const middle = middleName?.charAt(0) ?? "";
  const last = lastName ?? "";
  return `${last} ${fst.length === 0 ? fst : `${fst}. `}${
    middle.length === 0 ? middle : `${middle}.`
  }`;
}

/** Surname FirstName MiddleName*/
export function fullName(
  firstName?: string,
  middleName?: string,
  lastName?: string,
): string {
  const lName = lastName ? `${lastName} ` : "";
  const fName = firstName ? ` ${firstName}` : "";
  const mName = middleName ? ` ${middleName}` : "";

  return lName + fName + mName;
}
\end{lstlisting}
\subsection{@lib/utils/notification.module.less}
\begin{lstlisting}
@import "../../variables.less";

.error {
  background: @red-2;
}

.success {
  background: @green-2;
}

.warning {
  background: @yellow-2;
}

.info {
  background: @blue-2;
}
\end{lstlisting}
\subsection{@lib/utils/notification.ts}
\begin{lstlisting}
import { notification } from "antd";
import { ArgsProps } from "antd/lib/notification";

import styles from "./notification.module.less";

notification.config({
  placement: "bottomLeft",
});

type NotificationLevel = "success" | "info" | "error" | "warning";

type NotificationParams = Omit<ArgsProps, "message" | "placement">;

export function notify(
  message: string,
  level: NotificationLevel = "info",
  params: NotificationParams = {},
): void {
  switch (level) {
    case "error":
      return notification.error({
        message,
        className: styles.error,
        ...params,
      });
    case "success":
      return notification.success({
        message,
        className: styles.success,
        ...params,
      });
    case "warning":
      return notification.warning({
        message,
        className: styles.warning,
        ...params,
      });
    case "info":
      return notification.info({
        message,
        className: styles.info,
        ...params,
      });
  }
}
\end{lstlisting}
\subsection{@lib/utils/number.ts}
\begin{lstlisting}
import { NO_DATA_PLACEHOLDER } from "./meta";

const numberFormatter = new Intl.NumberFormat("ru-ru");

export function format(apiValue: number | null | undefined): string {
  if (apiValue === null || apiValue === undefined) {
    return NO_DATA_PLACEHOLDER;
  }

  return numberFormatter.format(apiValue);
}
\end{lstlisting}
\subsection{@lib/utils/query.ts}
\begin{lstlisting}
import { forEach, isArray, isObject, set } from "lodash";
import { parse, stringify } from "query-string";

type Primitive = undefined | null | string | number | boolean;
interface PrimitiveObject {
  [key: string]: Primitive | Array<Primitive>;
}

// only allow objects on first nest level
export interface QueryObject {
  [key: string]: Primitive | Array<Primitive> | PrimitiveObject;
}

export function queryStringify(input: QueryObject, encode = true): string {
  const proccedInput: PrimitiveObject = {};

  forEach(input, (outerValue, outerKey) => {
    if (isObject(outerValue) && !isArray(outerValue)) {
      forEach(outerValue, (value, key) => {
        proccedInput[`${outerKey}.${key}`] = value;
      });
    } else {
      proccedInput[outerKey] = outerValue as Primitive | Array<Primitive>;
    }
  });

  return stringify(proccedInput, { encode });
}

export function queryParse(input: string): QueryObject {
  const result: QueryObject = {};
  const draft = parse(input, {
    parseBooleans: true,
    parseNumbers: true,
  }) as PrimitiveObject;

  forEach(draft, (value, key) => {
    if (key.includes(".")) {
      set(result, key.split("."), value);
    } else {
      result[key] = value;
    }
  });

  return result;
}
\end{lstlisting}
\subsection{@lib/utils/styles.ts}
\begin{lstlisting}
import { isFunction, map } from "lodash";
import classnames from "classnames";

type StyleModule = Record<string, string>;

type State = Record<string, boolean | undefined>;

// eslint-disable-next-line @typescript-eslint/no-explicit-any
export function bindStyles<T extends (...args: any[]) => State>(
  styles: StyleModule,
  stateFn?: T,
) {
  return (...args: Parameters<T>): string => {
    if (!isFunction(stateFn)) {
      return "";
    }

    return classnames(
      map(stateFn(...args), (isActive, state) => isActive && styles[state]),
    );
  };
}
\end{lstlisting}
\subsection{@lib/utils/transliterate.ts}
\begin{lstlisting}
type CharMap = {
  [key: string]: string;
};


export default function transliterate(word: string): string {
  return word
    .split("")
    .map((letter) => CHAR_MAP[letter] || letter)
    .join("");
}
\end{lstlisting}
\subsection{@lib/utils/xmlhttp.ts}
\begin{lstlisting}
export type ProgressCallback = (
  this: XMLHttpRequest,
  ev: ProgressEvent<XMLHttpRequestEventTarget>,
) => void;

export type XMLHttpParams = {
  // 0 (or negative) to wait forever
  timeout?: number;
  responseType?: XMLHttpRequestResponseType;
  method?:
    | "GET"
    | "HEAD"
    | "POST"
    | "PUT"
    | "DELETE"
    | "CONNECT"
    | "OPTIONS"
    | "TRACE"
    | "PATCH";
  body?: string | null;
  token?: string | null;
};

export function wrapXMLHttp(
  link: string,
  params: XMLHttpParams,
  onProgress?: ProgressCallback,
): Promise<XMLHttpRequest> {
  const {
    method = "GET",
    body,
    responseType = "blob",
    token,
    timeout = 0,
  } = params;

  return new Promise((resolve) => {
    const req = new XMLHttpRequest();
    req.open(method, link);
    req.responseType = responseType;
    req.timeout = timeout;

    if (token) {
      req.setRequestHeader("authorization", `Bearer ${token}`);
    }
    req.setRequestHeader("content-type", "application/json");

    req.onload = (): void => {
      resolve(req);
    };

    req.onerror = (): void => {
      resolve(req);
    };

    if (onProgress) {
      req.addEventListener("progress", onProgress);
    }

    if (body) {
      req.send(body);
    } else {
      req.send();
    }
  });
}

export function isOk(xhr: XMLHttpRequest): boolean {
  return xhr.status >= 200 && xhr.status < 300;
}
\end{lstlisting}
\subsection{@providers/authContext.ts}
\begin{lstlisting}
import { createContext } from "react";
import { HeaderData } from "@lib/components/Auth";

import { Role } from "./rbac-rules";

export type User = {
  name?: string;
  role: Role;
  surname?: string;
  uuid?: string;
  language?: string;
};

export type Credentials = {
  email: string;
  password: string;
};

type AuthContextType = {
  authenticated: boolean;
  user: User;
  accessToken: string;
  initiateLogin: (credentials: Credentials) => void;
  handleAuthentication: (headerData: HeaderData) => void;
  logout: () => void;
};

const authContext = createContext<AuthContextType>({
  authenticated: false, // to check if authenticated or not
  user: { role: Role.admin, name: "Hello World" }, // store all the user details
  accessToken: "", // accessToken of user for Auth0
  initiateLogin: () => {
    console.log("initiate login");
  }, // to start the login process
  handleAuthentication: () => {
    console.log("handle auth");
  }, // handle Auth0 login process
  logout: () => {
    console.log("logout");
  }, // logout the user
});

export const AuthProvider = authContext.Provider;
export const AuthConsumer = authContext.Consumer;
\end{lstlisting}
\subsection{@providers/axios.ts}
\begin{lstlisting}
import { useEffect, useState } from "react";
import {
  AnalyticsApiFactory,
  AuditApiFactory,
  BatchStatusApiFactory,
  CategoryApiFactory,
  CharityApiFactory,
  ChatApiFactory,
  DonationRequestApiFactory,
  DonationsApiFactory,
  FileApiFactory,
  LoginApiFactory,
  MoneyApiFactory,
  NewsApiFactory,
  NotificationsApiFactory,
  RegistrationApiFactory,
  SettingsApiFactory,
  UserApiFactory,
} from "@generated";
import { AxiosResponse as Response } from "axios";

// i18n reexports
export type { UtilsPageData as PageData } from "@generated";

export const soketUrl = `${process.env.NODE_ENV === "production" ? "wss" : "ws"
  }//:${process.env.REACT_APP_WEBSOCKET}/api/chat/ws/`;

type AxiosResponse<R> = {
  data: R | undefined;
  loading: boolean;
  error: string | undefined;
  refetchQuery: () => Promise<void>;
};

export default function useAxios<R>(
  // eslint-disable-next-line
  query: (...v: any[]) => Promise<Response<R>>,
  refetch: boolean | undefined = undefined,
  // eslint-disable-next-line
  ...variables: any[]
): AxiosResponse<R> {
  const [data, setData] = useState<R | undefined>(undefined);
  const [error, setError] = useState<string | undefined>(undefined);

  // Turn objects into strings for useCallback & useEffect dependencies
  const [stringifiedUrl, stringifiedInit] = [
    JSON.stringify(variables),
    JSON.stringify(query),
  ];

  const fetchData = async (): Promise<void> => {
    try {
      const response = await query(...variables);

      if (response.status === 200) {
        setData(response.data);
      } else {
        console.error(`Error ${response.status} ${response.statusText}`);
      }
    } catch (e) {
      console.log(e);
      setError(e?.message);
    }
  };

  useEffect(() => {
    fetchData();
    // eslint-disable-next-line
  }, [stringifiedUrl, stringifiedInit, refetch]);

  if (!(data || error)) {
    return { data, loading: true, error, refetchQuery: fetchData };
  }

  return { data, loading: false, error, refetchQuery: fetchData };
}

const configuration = undefined;
const basePath = undefined;
const axios = undefined;

export const DonationRequestFactory = DonationRequestApiFactory(
  configuration,
  basePath,
  axios,
);
export const AuditFactory = AuditApiFactory(configuration, basePath, axios);
export const DonationsFactory = DonationsApiFactory(
  configuration,
  basePath,
  axios,
);
export const FileFactory = FileApiFactory(configuration, basePath, axios);
export const BatchStatusFactory = BatchStatusApiFactory(
  configuration,
  basePath,
  axios,
);
export const MoneyFactory = MoneyApiFactory(configuration, basePath, axios);
export const NewsFactory = NewsApiFactory(configuration, basePath, axios);
export const AnalyticsFactory = AnalyticsApiFactory(configuration, basePath, axios);
export const ChatsFactory = ChatApiFactory(configuration, basePath, axios);
export const NotificationsFactory = NotificationsApiFactory(
  configuration,
  basePath,
  axios,
);
export const UserRequestFactory = UserApiFactory(
  configuration,
  basePath,
  axios,
);
export const CharityFactory = CharityApiFactory(configuration, basePath, axios);
export const CategoryFactory = CategoryApiFactory(
  configuration,
  basePath,
  axios,
);
export const RegistrationFactory = RegistrationApiFactory(
  configuration,
  basePath,
  axios,
);

export const LoginFactory = LoginApiFactory(configuration, basePath, axios);
export const SettingsFactory = SettingsApiFactory(
  configuration,
  basePath,
  axios,
);

export { UserExtendedUserRoleEnum as UserApiRole } from "@generated";
export type { UserExtendedUser as UserApiModel } from "@generated";
\end{lstlisting}
\subsection{@providers/cusomUpload.ts}
\begin{lstlisting}
import { RcCustomRequestOptions } from "antd/lib/upload/interface";
import { FileInfo } from "@generated";

export const customRequest = (
  options: RcCustomRequestOptions,
  setIds: (ids: string[]) => void,
): void => {
  const { file, onError, onSuccess } = options;

  const url = `/api/file/upload`;

  const formData = new FormData();
  formData.append("file", file as Blob);
  const request = new XMLHttpRequest();

  request.open("POST", url);
  request.send(formData);

  request.onload = function () {
    if (request.status === 200) {
      const parsed: FileInfo[] = JSON.parse(request.responseText);
      setIds(parsed.map((value) => value.id ?? ""));

      return onSuccess(parsed, file);
    } else {
      return onError(Error(request.statusText));
    }
  };
};
\end{lstlisting}
\subsection{@providers/i18n.ts}
\begin{lstlisting}
import { initReactI18next } from "react-i18next";
import i18n, { TFunction } from "i18next";
import detector from "i18next-browser-languagedetector";
import HttpApi from "i18next-http-backend";

const DETECTION_OPTIONS = {
  order: ["navigator"],
};

const I18N_LANGUAGE = "language";

export const init = (): Promise<TFunction> =>
  i18n
    .use(detector)
    .use(initReactI18next)
    .use(HttpApi)
    .init({
      detection: DETECTION_OPTIONS,
      ns: ["translation", "form", "_error"],
      defaultNS: "translation",
      lng: localStorage.getItem(I18N_LANGUAGE) || "en",
      fallbackLng: "en",
      interpolation: {
        escapeValue: false,
      },
    });
\end{lstlisting}
\subsection{@providers/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Provider as ReduxProvider } from "react-redux";
import { ConfigProvider as AntdConfigProvider } from "antd";
// static imports aren't perfect for locales
import ru from "antd/lib/locale/ru_RU";
import { Response } from "@curi/types";
import Auth from "@lib/components/Auth";
import { transliterate } from "@lib/utils";
import { closeRightPanel } from "reducer/workspace";

import { init as i18nInit } from "./i18n";
import { store } from "./redux";
import { init as routerInit, Router, router } from "./router";

// i18n reexports
export { default as i18n } from "i18next";
export { useTranslation } from "react-i18next";

// Helpers
export { toggleRightPanelAtom } from "../Layout/Workspace/index";

// router reexports
export { useResponse, useActive } from "@curi/react-dom";
export { router } from "./router";
export interface PageProps {
  response: Response;
}

// Redux reexports
export { useDispatch, useSelector, useStore, shallowEqual } from "react-redux";
export { useActions } from "./redux";

// Helpers
export { default as Workspace } from "../Layout/Workspace/index";

const Provider: FC = ({ children }) => {
  return (
    <AntdConfigProvider locale={ru}>
      <ReduxProvider store={store}>
        <Auth>
          <Router>{children}</Router>
        </Auth>
      </ReduxProvider>
    </AntdConfigProvider>
  );
};

router.observe(() => {
  store.dispatch(closeRightPanel());
});

function setupGlobalInfo(info: APP_INFO): void {
  window.APP = {
    name: transliterate(info.name),
  };
}

export const init = async (info: APP_INFO): Promise<void> => {
  setupGlobalInfo(info);
  await Promise.all([i18nInit(), routerInit()]);
};

export default Provider;
\end{lstlisting}
\subsection{@providers/rbac-rules.ts}
\begin{lstlisting}
export enum Role {
  visitor = "visitor",
  manager = "manager",
  supermanager = "supermanager",
  contentManager = "contentManager",
  operator = "operator",
  admin = "admin",
}

const rules = {
  visitor: {
    static: [
      "auth:login",
      "faq:pretty",
      "fund:description-pretty",
      "news:public",
    ],
  },
  contentManager: {
    static: [
      "applications:show",
      "settings:index",
      "users:show",
      "fund:index",
      "fund:faq-index",
      "fund:description",
      "fund:description-edit",
      "faq:edit",
      "news:edit",
      "news:create",
      "news:index",
      "notifications:index",
    ],
  },
  operator: {
    static: ["chats:show", "chats:index", "settings:index"],
  },
  manager: {
    static: [
      "applications:index",
      "settings:index",
      "application:edit",
      "applications:show",
      "applications:create",
      "users:show",
      "user:view-applications",
      "notifications:index",
    ],
  },
  supermanager: {
    static: [
      "applications:index",
      "applications:show",
      "application:edit",
      "application:can-vote",
      "applications:create",
      "settings:index",
      "categories:index",
      "users:show",
      "user:view-applications",
      "fund:index",
      "fund:description",
      "transactions:show",
      "transactions:index",
      "transactions:create",
      "managers:index",
      "managers:show",
      "fund:faq-index",
      "notifications:index",
      "transactions:distribute",
    ],
  },
  admin: {
    static: [
      "users:index",
      "users:show",
      "user:edit",
      "users:create",
      "user:view-sessions",
      "user:show-admin",
      "settings:index",
      "logs:index",
      "notifications:index",
    ],
  },
};

export function check(role: Role, action: string): boolean {
  const permissions = rules[role];
  if (!permissions) {
    // role is not present in the rules
    return false;
  }

  const staticPermissions = permissions.static;

  if (staticPermissions && staticPermissions.includes(action)) {
    // static rule not provided for action
    return true;
  }

  return false;
}

export default rules;
\end{lstlisting}
\subsection{@providers/redux.ts}
\begin{lstlisting}
import { useMemo } from "react";
import { useDispatch } from "react-redux";
import {
  ActionCreator,
  bindActionCreators,
  configureStore,
} from "@reduxjs/toolkit";

import reducer from "../reducer";

export const store = configureStore({
  reducer,
  devTools: true,
});

export type RootState = ReturnType<typeof reducer>;
export type AppDispatch = typeof store.dispatch;

export function useActions<A, C extends ActionCreator<A>>(
  actionCreators: C,
): C {
  const dispatch = useDispatch();

  return useMemo(() => bindActionCreators(actionCreators, dispatch), [
    dispatch,
    actionCreators,
  ]);
}
\end{lstlisting}
\subsection{@providers/router/__tests__/utils.ts}
\begin{lstlisting}
/* eslint-disable no-undef */
import { RouteDescriptor } from "@curi/types";

import { buildRoutes, filename, treeFromFilenames } from "../utils";

const CONF_1 = {
  pages: [
    "./first/[id].tsx",
    "./first/index.tsx",
    "./first/foo.tsx",
    "./index.tsx",
  ],
  tree: {
    index: { [filename]: "./index.tsx" },
    first: {
      "[id]": { [filename]: "./first/[id].tsx" },
      index: { [filename]: "./first/index.tsx" },
      foo: { [filename]: "./first/foo.tsx" },
    },
  },
  routes: [
    { name: "index", path: "", extra: { file: "./index.tsx" } },
    {
      name: "first:index",
      path: "first",
      extra: { file: "./first/index.tsx" },
      children: [
        { name: "first:foo", path: "foo", extra: { file: "./first/foo.tsx" } },
        { name: "first", path: ":id", extra: { file: "./first/[id].tsx" } },
      ],
    },
  ],
};

test("Tree builder", () => {
  expect(treeFromFilenames(CONF_1.pages)).toEqual(CONF_1.tree);
});

const builderMock = jest.fn(
  (file: string, path: string, name: string): RouteDescriptor => ({
    path,
    name,
    extra: { file },
  }),
);

const wrap = (x: Array<string>): Array<RouteDescriptor> =>
  buildRoutes(x, builderMock);

test("Routes builder", () => {
  expect(wrap(CONF_1.pages)).toEqual(CONF_1.routes);
  expect(builderMock.mock.calls.length).toBe(4);
});
\end{lstlisting}
\subsection{@providers/router/index.ts}
\begin{lstlisting}
import { createRouterComponent } from "@curi/react-dom";
import { createRouter, prepareRoutes } from "@curi/router";
import { browser } from "@hickory/browser";

import pages from "./pageRoutes";

const routes = prepareRoutes(pages);

export const router = createRouter(browser, routes);

export function init(): Promise<void> {
  return new Promise((resolve) => router.once(() => resolve()));
}

export const Router = createRouterComponent(router);
\end{lstlisting}
\subsection{@providers/router/pageRoutes.ts}
\begin{lstlisting}
import { ReactNode } from "react";
import { RouteDescriptor, SettableResponseProperties } from "@curi/types";

import NotFound from "../../pages/_notFound";

import { buildRoutes } from "./utils";

interface ResolveResult {
  component: ReactNode;
}

// TODO: better regexp for pages to ignore util pages
const context = require.context("../../pages", true, /\.\/[^_]*.tsx$/);

function buildSubRoute(
  file: string,
  path: string,
  name: string,
): RouteDescriptor {
  const {
    default: importedComponent,
    name: importedName,
    pageComponent: importedPageComponent,
  } = context(file);

  return {
    path,
    name: importedName || name,
    resolve(): Promise<ResolveResult> {
      // TODO: check if this can be async
      return Promise.resolve({
        component: importedComponent || importedPageComponent,
      });
    },
    respond({ resolved }): SettableResponseProperties {
      const { component } = resolved as ResolveResult;
      return { body: component }; // TODO: add AuthConsumer
    },
  };
}

const appRoutes = buildRoutes(context.keys(), buildSubRoute);

const utilRoutes: Array<RouteDescriptor> = [
  {
    name: "NotFound",
    path: "(.*)",
    respond(): SettableResponseProperties {
      return { body: NotFound };
    },
  },
];

export default [...appRoutes, ...utilRoutes];
\end{lstlisting}
\subsection{@providers/router/utils.ts}
\begin{lstlisting}
import { map, reverse, set, sortBy, toPairs } from "lodash";
import { RouteDescriptor } from "@curi/types";

export const filename = Symbol("filename");

type PageInfo = {
  [filename]: string;
};

type PageTree = {
  [key: string]: PageTree | PageInfo;
};

function cleanPath(str: string): string {
  return str.replace(/(^|\/)index$/, "").replace(/\[([^\]]*)\]/g, ":$1");
}

function cleanName(str: string): string {
  return str.replace(/\[(.*)\]/, "");
}

type RouteBuilder = (
  file: string,
  path: string,
  name: string,
) => RouteDescriptor;

type BuilderContext = {
  build: RouteBuilder;
};

export function buildFromTree(
  this: BuilderContext,
  from: PageTree | PageInfo,
  paths: Array<string> = [],
  names: Array<string> = [],
): RouteDescriptor {
  // Util function for child routes
  const buildChildrenRoutes = (tree: PageTree): Array<RouteDescriptor> => {
    // Sort pairs from tree by key, basically moving templated routes down
    const sorted = reverse(sortBy(toPairs(tree), ["0"]));

    return map(sorted, ([path, value]) => {
      const addedName = cleanName(path);
      const addedPath = cleanPath(path);

      return buildFromTree.call(
        this,
        value,
        [...paths, addedPath],
        [...names, addedName],
      );
    });
  };

  // Actual function body
  const pathTail = paths.length > 0 ? paths[paths.length - 1] : "";

  const currentName = names.filter(Boolean).join(":");

  if ((from as PageInfo)[filename]) {
    const leaf = from as PageInfo;

    return this.build(leaf[filename], pathTail, currentName);
  }

  if (paths.length === 0) {
    const tree = from as PageTree;
    // Ephemeral root
    const resultEntry: RouteDescriptor = {
      name: "",
      path: "",
    };

    resultEntry.children = buildChildrenRoutes(tree);

    return resultEntry;
  }

  const { index, ...rest } = from as PageTree;

  const resultEntry: RouteDescriptor = index
    ? this.build(
        (index as PageInfo)[filename],
        pathTail,
        `${currentName}:index`,
      )
    : {
        name: `${currentName}:index`,
        path: pathTail,
      };

  resultEntry.children = buildChildrenRoutes(rest);

  return resultEntry;
}

export function treeFromFilenames(files: Array<string>): PageTree {
  const result = {};

  files.forEach((file) => {
    const centerPart = file.replace(/^\.\//, "").replace(/.tsx$/, "");

    set(result, centerPart.split("/"), { [filename]: file });
  });

  return result;
}

export function buildRoutes(
  files: Array<string>,
  builder: RouteBuilder,
): Array<RouteDescriptor> {
  const tree = treeFromFilenames(files);
  return buildFromTree.call({ build: builder }, tree).children ?? [];
}
\end{lstlisting}
\subsection{@typings/component.d.ts}
\begin{lstlisting}
import { FC } from "react";

type DataComponent<T> = FC<{ data: T }>;

type IdComponent = FC<{ id: number }>;
\end{lstlisting}
\subsection{@typings/index.d.ts}
\begin{lstlisting}
/* eslint-disable */
declare module "*.module.less" {
  const classes: { [key: string]: string };
  export default classes;
}

declare module "*.elm" {
  export const Elm: any;
}

declare module "react-elm-components" {
  import { Component } from "react";

  type ElmProps = {
    src: any;
    flags?: any;
    ports?: any;
    key?: string;
  };
  class Elm extends Component<ElmProps> {}
  export = Elm;
}

type DeepPartial<T> = {
  [P in keyof T]?: DeepPartial<T[P]>;
};

type WrapperComponent<T> = (props: {
  className?: string;
  children: T;
}) => JSX.Element | null;
\end{lstlisting}
\subsection{@typings/window.d.ts}
\begin{lstlisting}
type APP_INFO = {
  name: string;
};

interface Window {
  APP: APP_INFO;
}
\end{lstlisting}
\subsection{App.tsx}
\begin{lstlisting}
import React, { FC, Suspense } from "react";
import Provider, { useTranslation } from "@providers";

import Layout from "./Layout";

const App: FC = () => {
  const { t } = useTranslation();
  const loadingMessage = <div>{t("loading")} </div>;

  return (
    <Suspense fallback={loadingMessage}>
      <Provider>
        <Layout />
      </Provider>
    </Suspense>
  );
};

export default App;
\end{lstlisting}
\subsection{appInfo.tsx}
\begin{lstlisting}
import React from "react";

import meta from "../package.json";

export const logoSmall = "Charity";

export const logoLarge = "Charity CRM";

export const nameString = "Charity";

export const name = (
  <>
    System <b>{nameString}</b>
  </>
);

const suffix = process.env.CI_PIPELINE_ID || "dev";
export const version = `${meta.version}.${suffix}`;
\end{lstlisting}
\subsection{components/Application/ActionForm/Change.tsx}
\begin{lstlisting}
import React, {
  forwardRef,
  ForwardRefRenderFunction,
  useCallback,
} from "react";
import { DonationRequestBodyAvailableStatusesEnum as ApplicationStatus } from "@generated";
import { notify } from "@lib/utils/notification";
import { useTranslation } from "@providers";
import { DonationRequestFactory } from "@providers/axios";

import ApplicationForm, {
  ApplicationFormHandler,
  ApplicationFormState,
} from "./form";

type ChangeApplicationFormProps = {
  id: number;
  setLoading: (value: boolean) => void;
  availiableStatuses: ApplicationStatus[];
  currentStatus: ApplicationStatus;
  undoTransition?: boolean;
  onSuccess?: () => void;
  onError?: (error: Error) => void;
};

const ChangeApplicationForm: ForwardRefRenderFunction<
  ApplicationFormHandler,
  ChangeApplicationFormProps
> = (
  {
    onSuccess,
    onError,
    id,
    availiableStatuses,
    currentStatus,
    undoTransition,
    setLoading,
  },
  ref,
) => {
  const { t } = useTranslation("Application");

  const onSubmit = useCallback(
    async (values: ApplicationFormState): Promise<void> => {
      try {
        setLoading(true);
        DonationRequestFactory.apiDonationRequestIdStatusPatch(id, values).then(
          () => {
            notify(t("$views.updateStatus"), "success");

            onSuccess?.();
          },
        );
      } catch (e) {
        onError?.(e);
      } finally {
        setLoading(false);
      }
    },
    // eslint-disable-next-line
    [],
  );

  const onUndoTransition = async (): Promise<void> => {
    try {
      await DonationRequestFactory.apiDonationRequestIdStatusDelete(id);

      notify(t("$views.undoTransitionSuccess", "success"));

      onSuccess?.();
    } catch (e) {
      onError?.(e);
    }
  };

  return (
    <ApplicationForm
      ref={ref}
      onSubmit={onSubmit}
      availiableStatuses={availiableStatuses}
      currentStatus={currentStatus}
      undoTransition={undoTransition}
      onUndoTransition={onUndoTransition}
    />
  );
};

export default forwardRef(ChangeApplicationForm);
\end{lstlisting}
\subsection{components/Application/ActionForm/ChangeDrawerButton.tsx}
\begin{lstlisting}
import React, { FC, useRef, useState } from "react";
import { Button, Drawer, Space } from "antd";
import { DonationRequestBodyAvailableStatusesEnum as ApplicationStatus } from "@generated";
import { useTranslation } from "@providers";

import { ApplicationFormHandler } from "./form";
import { ApplicationForm } from ".";

import styles from "./styles.module.less";

const CreateDrawerButton: FC<{
  refetch: () => void;
  availiableStatuses: ApplicationStatus[];
  currentStatus: ApplicationStatus;
  undoTransition?: boolean;
  id: number;
}> = ({ availiableStatuses, id, currentStatus, undoTransition, refetch }) => {
  const { t } = useTranslation("Application");

  const handlers = useRef<ApplicationFormHandler>(null);

  const [drawer, setDrawer] = useState(false);
  const [loading, setLoading] = useState(false);

  const onClose = (): void => {
    setDrawer(false);
    refetch();
    handlers.current?.resetFields();
  };

  return (
    <>
      <Button
        onClick={() => {
          setDrawer(true);
        }}
      >
        {t("$views.buttons.actions.title")}
      </Button>

      <Drawer
        visible={drawer}
        onClose={onClose}
        title={t("$views.buttons.actions.formTitle")}
        width="33vw"
        footer={
          <Space align="center" className={styles.submitButtons}>
            <Button onClick={onClose}>{t("translation:cancel")}</Button>

            <Button
              loading={loading}
              type="primary"
              onClick={() => handlers.current?.submit()}
            >
              {t("translation:save")}
            </Button>
          </Space>
        }
      >
        <ApplicationForm
          ref={handlers}
          onSuccess={onClose}
          setLoading={setLoading}
          id={id}
          availiableStatuses={availiableStatuses}
          currentStatus={currentStatus}
          undoTransition={undoTransition}
        />
      </Drawer>
    </>
  );
};

export default CreateDrawerButton;
\end{lstlisting}
\subsection{components/Application/ActionForm/form.tsx}
\begin{lstlisting}
/* eslint-disable @typescript-eslint/no-explicit-any */
import React, {
  FC,
  forwardRef,
  ForwardRefRenderFunction,
  useEffect,
  useMemo,
  useState,
} from "react";
import { defaults, noop } from "lodash";
import { Button, Form, Input, Tooltip, Upload } from "antd";
import { FormInstance, Rule } from "antd/lib/form";
import { UploadChangeParam, UploadFile } from "antd/lib/upload/interface";
import { UploadOutlined } from "@ant-design/icons";
import {
  DonationRequestBodyAvailableStatusesEnum as ApplicationStatus,
  DonationRequestUpdateStatusInput,
} from "@generated";
import { useTranslation } from "@providers";
import { customRequest } from "@providers/cusomUpload";

import AssigneeSelect from "components/Assignee/Select";
import StatusSelect from "components/Status/Select";

export type ApplicationFormState = DonationRequestUpdateStatusInput;

export type ApplicationFormHandler = FormInstance<ApplicationFormState>;

type ApplicationFormProps = {
  initial?: ApplicationFormState;
  availiableStatuses: ApplicationStatus[];
  undoTransition?: boolean;
  currentStatus: ApplicationStatus;
  onSubmit?: (values: ApplicationFormState) => void | Promise<void>;
  onUndoTransition?: () => void | Promise<void>;
};

const DEFAULTS: ApplicationFormState = {
  assignee_id: undefined,
  status: undefined,
  comment: undefined,
};

const RULES: { [K in keyof ApplicationFormState]?: Rule[] } = {
  status: [
    {
      required: true,
      message: "Couldn't be elmpy",
    },
  ],
};

const UndoTransition: FC<{
  currentStatus: ApplicationStatus;
  onClick?: () => void | Promise<void>;
}> = ({ currentStatus, onClick }) => {
  const { t } = useTranslation("Application");

  return (
    <Tooltip title={t("undo_transition_tooltip")}>
      <Button type="link" style={{ padding: "0px" }} onClick={onClick}>
        {t("undo_transition", { currentStatus: t(`Status.${currentStatus}`) })}
      </Button>
    </Tooltip>
  );
};

type UploadFilesProps = {
  initial: Array<UploadFile<any>>;
  onFilesChange: (files: string[]) => void;
  onUploadChange: (info: UploadChangeParam) => void;
};

const UploadFilesItem: FC<UploadFilesProps> = (
  { initial, onFilesChange, onUploadChange },
  ...rest
) => {
  const { t } = useTranslation("Application");

  return (
    <Form.Item name="file_ids" label={t("file_ids")} {...rest}>
      <Upload
        onChange={onUploadChange}
        fileList={initial}
        customRequest={(options) => customRequest(options, onFilesChange)}
      >
        <Button icon={<UploadOutlined />}>{t("upload")}</Button>
      </Upload>
    </Form.Item>
  );
};

const ApplicationForm: ForwardRefRenderFunction<
  ApplicationFormHandler,
  ApplicationFormProps
> = (
  {
    initial,
    onSubmit,
    availiableStatuses,
    undoTransition,
    onUndoTransition,
    currentStatus,
  },
  ref,
) => {
  const { t } = useTranslation("Application");

  const [form] = Form.useForm<ApplicationFormState>();

  const [status, setStatus] = useState<ApplicationStatus | undefined>();

  // file ids after uploading during OnRealization
  const [initialFileList, setUploadChange] = useState<Array<UploadFile<any>>>(
    [],
  );

  const handleOnChange = (info: UploadChangeParam): void => {
    setUploadChange(info.fileList);
  };

  const initialValues = useMemo(() => defaults({}, initial, DEFAULTS), [
    initial,
  ]);

  useEffect(() => {
    form.setFieldsValue(initialValues);
  }, [form, initialValues]);

  return (
    <Form<ApplicationFormState>
      layout="vertical"
      ref={ref}
      form={form}
      initialValues={initialValues}
      // eslint-disable-next-line
      onFinish={(values: any) => {
        const file_ids = initialFileList
          .map((item) => {
            if (item.response) {
              return item.response[0]?.id;
            } else {
              return undefined;
            }
          })
          .flatMap((item) => {
            return item ? [item] : [];
          });

        console.log(file_ids);

        onSubmit?.({
          assignee_id: values?.assignee?.value,
          comment: values.comment,
          status: values.status,
          file_ids,
        });
      }}
    >
      <Form.Item
        name="status"
        label={t("status")}
        rules={RULES.status}
        extra={
          undoTransition ? (
            <UndoTransition
              currentStatus={currentStatus}
              onClick={onUndoTransition}
            />
          ) : undefined
        }
      >
        <StatusSelect avaliable={availiableStatuses} onChange={setStatus} />
      </Form.Item>

      {currentStatus === ApplicationStatus.OnRealization &&
        status === ApplicationStatus.Archived && (
          <UploadFilesItem
            initial={initialFileList}
            onFilesChange={(ids) => {
              console.log(ids);
            }}
            onUploadChange={handleOnChange}
          />
        )}

      <Form.Item name={["assignee"]} label={t("assignee")}>
        <AssigneeSelect value={null} status={status} onChange={noop} />
      </Form.Item>

      <Form.Item name="comment" label={t("comment")}>
        <Input.TextArea allowClear autoSize={{ minRows: 3 }} />
      </Form.Item>
    </Form>
  );
};

export default forwardRef(ApplicationForm);
\end{lstlisting}
\subsection{components/Application/ActionForm/index.tsx}
\begin{lstlisting}
import Form from "./form";

export { default as ApplicationForm } from "./Change";
export { default as ChangeButton } from "./ChangeDrawerButton";
export type { ApplicationFormHandler, ApplicationFormState } from "./form";

export default Form;
\end{lstlisting}
\subsection{components/Application/ActionForm/styles.module.less}
\begin{lstlisting}
\end{lstlisting}
\subsection{components/Application/Buttons/create.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Button } from "antd";
import { PlusOutlined } from "@ant-design/icons";
import { router, useTranslation } from "@providers";

export const Actions: FC = () => {
  const { t } = useTranslation("Application");

  return (
    <Button
      icon={<PlusOutlined />}
      onClick={() => {
        router.navigate({ url: router.url({ name: "applications:create" }) });
      }}
    >
      {t("$views.createApplication")}
    </Button>
  );
};
\end{lstlisting}
\subsection{components/Application/Buttons/index.tsx}
\begin{lstlisting}
import React, { FC, useState } from "react";
import { useTranslation } from "react-i18next";
import { Dropdown, Menu } from "antd";
import {
  DonationRequestBodyAvailableStatusesEnum as ApplicationStatus,
  DonationRequestBodyStatusEnum,
  DonationRequestUpdateInput,
} from "@generated";
import { DonationRequestFactory } from "@providers/axios";
import { AxiosPromise } from "axios";

import ModalWithMessage from "components/Application/Modal";

import { startProcessing, stopProcessing } from "./Processing";
import { requireConfirmation } from "./RequireConfirmation";

type ApplicationButtonsProps = {
  currentStatus: ApplicationStatus;
  applicationId: number;
  availiableStatuses: ApplicationStatus[];
  onRefetch: () => Promise<void>;
};

type ModalState = {
  title: string;
  newStatus: ApplicationStatus;
  query: (
    id: number,
    input?: DonationRequestUpdateInput,
    // eslint-disable-next-line
    options?: any,
  ) => AxiosPromise<void>;
};

const ActionButtons: FC<ApplicationButtonsProps> = (props) => {
  const { applicationId, onRefetch, currentStatus } = props;
  const { t } = useTranslation("Application");
  const [visibleModal, setVisibleModal] = useState(false);
  const [modalState, setModalState] = useState<ModalState | undefined>(
    undefined,
  );

  const menu = [];

  for (const ind in props.availiableStatuses) {
    const status = props.availiableStatuses[ind];

    switch (status) {
      case ApplicationStatus.InProcessing:
        menu.push(
          <Menu.Item
            key="inProcessing"
            onClick={() => startProcessing(applicationId, onRefetch)}
          >
            {t("$views.buttons.inProcessing")}
          </Menu.Item>,
        );
        break;
      case ApplicationStatus.Deleted:
        menu.push(
          <Menu.Item
            key="delete"
            onClick={() => {
              setVisibleModal(true);
              setModalState({
                title: t("$views.modal.deleteTitle"),
                newStatus: ApplicationStatus.Deleted,
                query: DonationRequestFactory.apiDonationRequestIdStatusPatch,
              });
            }}
          >
            {t("$views.buttons.delete")}
          </Menu.Item>,
        );
        break;
      case ApplicationStatus.Spam:
        menu.push(
          <Menu.Item
            key="spam"
            onClick={() => {
              setVisibleModal(true);
              setModalState({
                title: t("$views.modal.spamTitle"),
                query: DonationRequestFactory.apiDonationRequestIdStatusPatch,
                newStatus: ApplicationStatus.Spam,
              });
            }}
          >
            {t("$views.buttons.spam")}
          </Menu.Item>,
        );
        break;
      case ApplicationStatus.New:
        menu.push(
          <Menu.Item
            key="stopProcessing"
            onClick={() => stopProcessing(applicationId, onRefetch)}
          >
            {currentStatus === ApplicationStatus.Spam
              ? t("$views.buttons.returnFromSpam")
              : t("$views.buttons.stopProcessing")}
          </Menu.Item>,
        );
        break;
      case ApplicationStatus.NeedsImprovement:
        menu.push(
          <Menu.Item
            key="request_changes"
            onClick={() => {
              setVisibleModal(true);
              setModalState({
                newStatus: ApplicationStatus.NeedsImprovement,
                query: DonationRequestFactory.apiDonationRequestIdStatusPatch,
                title: t("$views.modal.requestChangesTitle"),
              });
            }}
          >
            {t("$views.buttons.request_changes")}
          </Menu.Item>,
        );
        break;
      case ApplicationStatus.Refused:
        menu.push(
          <Menu.Item
            key="refuse"
            onClick={() => {
              setVisibleModal(true);
              setModalState({
                title: t("$views.modal.refuse"),
                query: DonationRequestFactory.apiDonationRequestIdStatusPatch,
                newStatus: ApplicationStatus.Refused,
              });
            }}
          >
            {t("$views.buttons.refuse")}
          </Menu.Item>,
        );
        break;
      case ApplicationStatus.SuperManagerConfirmation:
        menu.push(
          <Menu.Item
            key="require_confirmation"
            onClick={() =>
              requireConfirmation(
                applicationId,
                onRefetch,
                ApplicationStatus.SuperManagerConfirmation,
              )
            }
          >
            {currentStatus === ApplicationStatus.SuperManagerConfirmation
              ? t("$views.buttons.activate")
              : t("$views.buttons.require_confirmation")}
          </Menu.Item>,
        );
        break;
      case ApplicationStatus.UserConfirmation:
        menu.push(
          <Menu.Item
            key="require_confirmation2"
            onClick={() =>
              requireConfirmation(
                applicationId,
                onRefetch,
                ApplicationStatus.UserConfirmation,
              )
            }
          >
            {currentStatus === ApplicationStatus.SuperManagerConfirmation
              ? t("$views.buttons.activate")
              : t("$views.buttons.require_confirmation")}
          </Menu.Item>,
        );
        break;
      default:
        break;
    }
  }

  return (
    <>
      {menu.length !== 0 && (
        <Dropdown.Button overlay={<Menu>{menu}</Menu>}>
          {t("$views.buttons.actions.title")}
        </Dropdown.Button>
      )}

      <ModalWithMessage
        title={modalState?.title ?? ""}
        isVisible={visibleModal}
        onRefetch={props.onRefetch}
        newStatus={
          (modalState?.newStatus as unknown) as DonationRequestBodyStatusEnum
        }
        query={
          modalState?.query ??
          DonationRequestFactory.apiDonationRequestIdStatusPatch
        }
        applicationId={props.applicationId}
        onClose={() => setVisibleModal(false)}
      />
    </>
  );
};

export default ActionButtons;
\end{lstlisting}
\subsection{components/Application/Buttons/Processing/index.ts}
\begin{lstlisting}
import { DonationRequestFactory } from "@providers/axios";

import { ApplicationStatus } from "../../Status/tag";

export const stopProcessing = async (
  id: number,
  onRefetch: () => Promise<void>,
): Promise<void> => {
  try {
    await DonationRequestFactory.apiDonationRequestIdStatusDelete(id);
  } catch (e) {
    console.log(e);
  } finally {
    onRefetch();
  }
};

export const startProcessing = async (
  id: number,
  onRefetch: () => Promise<void>,
): Promise<void> => {
  try {
    const input = {
      status: ApplicationStatus.InProcessing,
      role: "Manager",
    };
    await DonationRequestFactory.apiDonationRequestIdStatusPatch(id, input);
  } catch (e) {
    console.log(e);
  } finally {
    onRefetch();
  }
};
\end{lstlisting}
\subsection{components/Application/Buttons/RequireConfirmation/index.tsx}
\begin{lstlisting}
import { DonationRequestBodyAvailableStatusesEnum as ApplicationStatus } from "@generated";
import { DonationRequestFactory } from "@providers/axios";

export const requireConfirmation = async (
  id: number,
  onRefetch: () => Promise<void>,
  status: ApplicationStatus,
): Promise<void> => {
  try {
    // const newStatus =
    //   status === ApplicationStatus.SuperManagerConfirmation
    //     ? ApplicationStatus.Active
    //     : ApplicationStatus.SuperManagerConfirmation;

    await DonationRequestFactory.apiDonationRequestIdStatusPatch(id, {
      status,
    });
  } catch (e) {
    console.log(e);
  } finally {
    onRefetch();
  }
};
\end{lstlisting}
\subsection{components/Application/Filters/assignee.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Checkbox } from "antd";
import { useTranslation } from "@providers";

export const AssignedToMe: FC<{ initial: boolean; onChange: () => void }> = ({
  initial,
  onChange,
}) => {
  const { t } = useTranslation("Application");

  return (
    <Checkbox checked={initial} onChange={onChange}>
      {t("Filters.assignee")}
    </Checkbox>
  );
};
\end{lstlisting}
\subsection{components/Application/Filters/clear.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Button } from "antd";
import { ClearOutlined } from "@ant-design/icons";

export const ClearButton: FC<{ onClearAll: () => void }> = ({ onClearAll }) => {
  return <Button icon={<ClearOutlined />} onClick={onClearAll} />;
};
\end{lstlisting}
\subsection{components/Application/Filters/index.tsx}
\begin{lstlisting}
export { AssignedToMe } from "./assignee";
export { NeedMyVote } from "./vote";
export { StatusFilter } from "./status";
export { ClearButton } from "./clear";
\end{lstlisting}
\subsection{components/Application/Filters/status.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Select } from "antd";
import { useTranslation } from "@providers";

import { ApplicationStatus } from "../Status/tag";

export const StatusFilter: FC<{
  initial?: string[];
  onChange: (value?: string[]) => void;
}> = ({ initial, onChange }) => {
  const { t } = useTranslation("Application");

  return (
    <Select
      placeholder={t("Filters.status")}
      mode="multiple"
      onChange={(value) => {
        onChange(value);
      }}
      maxTagCount={1}
      maxTagPlaceholder={t("Filters.statusTagPlaceholder")}
      allowClear
      value={initial ?? []}
      onClear={() => onChange(undefined)}
      style={{ width: "auto", minWidth: 300 }}
    >
      <Select.Option value={ApplicationStatus.New}>
        {t(`Status.${ApplicationStatus.New}`)}
      </Select.Option>
      <Select.Option value={ApplicationStatus.InProcessing}>
        {t(`Status.${ApplicationStatus.InProcessing}`)}
      </Select.Option>
      <Select.Option value={ApplicationStatus.NeedsImprovement}>
        {t(`Status.${ApplicationStatus.NeedsImprovement}`)}
      </Select.Option>
      <Select.Option value={ApplicationStatus.UserConfirmation}>
        {t(`Status.${ApplicationStatus.UserConfirmation}`)}
      </Select.Option>
      <Select.Option value={ApplicationStatus.SuperManagerConfirmation}>
        {t(`Status.${ApplicationStatus.SuperManagerConfirmation}`)}
      </Select.Option>
      <Select.Option value={ApplicationStatus.Active}>
        {t(`Status.${ApplicationStatus.Active}`)}
      </Select.Option>
      <Select.Option value={ApplicationStatus.Refused}>
        {t(`Status.${ApplicationStatus.Refused}`)}
      </Select.Option>
      <Select.Option value={ApplicationStatus.Archived}>
        {t(`Status.${ApplicationStatus.Archived}`)}
      </Select.Option>
    </Select>
  );
};
\end{lstlisting}
\subsection{components/Application/Filters/vote.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Checkbox } from "antd";
import { useTranslation } from "@providers";

export const NeedMyVote: FC<{
  initial: boolean;
  onChange: () => void;
  disabled: boolean;
}> = ({ initial, onChange, disabled }) => {
  const { t } = useTranslation("Application");

  return (
    <Checkbox checked={initial} onChange={onChange} disabled={disabled}>
      {t("Filters.vote")}
    </Checkbox>
  );
};
\end{lstlisting}
\subsection{components/Application/Form/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
import {
  Button,
  Card,
  DatePicker,
  Divider,
  Form,
  Input,
  Select,
  Space,
  Upload,
} from "antd";
import { useForm } from "antd/lib/form/Form";
import { RcCustomRequestOptions } from "antd/lib/upload/interface";
import { InboxOutlined } from "@ant-design/icons";
import { CategoryCategory, FileInfo } from "@generated";
import { DonationRequestSuperManagerInput } from "@generated/models/donation-request-super-manager-input";
import { formatCategory } from "@lib/utils";
import { notify } from "@lib/utils/notification";
import { i18n, router } from "@providers";
import { AxiosResponse } from "axios";

const { Dragger } = Upload;

const formLayout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 8 },
};

const tailLayout = {
  wrapperCol: { offset: 8, span: 8 },
};

const CreatePage: FC<{
  onCreate: (
    values: DonationRequestSuperManagerInput,
  ) => Promise<AxiosResponse<void>>;
  categories: CategoryCategory[];
}> = ({ categories, onCreate }) => {
  const { t } = useTranslation("Application");

  const [ids, setIds] = useState<string[]>([]);
  const [loading, setLoading] = useState(false);

  const [form] = useForm<DonationRequestSuperManagerInput>();

  const onReset = (): void => {
    form.resetFields();
  };

  const draggerProps = {
    name: "file",
    multiple: true,
    defaultFileList: [],
    customRequest(options: RcCustomRequestOptions) {
      const { file, onError, onSuccess } = options;

      const url = `/api/file/upload`;

      const formData = new FormData();
      formData.append("file", file as Blob);
      const request = new XMLHttpRequest();

      request.open("POST", url);
      request.send(formData);

      request.onload = function () {
        if (request.status === 200) {
          const parsed: FileInfo[] = JSON.parse(request.responseText);
          setIds(ids.concat(parsed.map((value) => value.id ?? "")));

          return onSuccess(parsed, file);
        } else {
          return onError(Error(request.statusText));
        }
      };
    },
  };

  const onFinish = useCallback(
    async (values: DonationRequestSuperManagerInput) => {
      try {
        setLoading(true);

        const numberator = values.approved_amount?.numerator?.toString();

        await onCreate({
          ...values,
          approved_amount: {
            numerator: parseInt(numberator ?? "0"),
            denominator: 1,
            currency: "RUB",
          },
        });

        notify(t("$views.createSuccess"), "success");

        router.navigate({ url: router.url({ name: "applications:index" }) });
      } catch (e) {
        console.error(e);
        notify(t("$views.createError"), "error");
      } finally {
        setLoading(false);
      }
    },
    [setLoading, t, onCreate],
  );

  const lang = i18n.language.substr(0, 2);

  return (
    <Card>
      <Form
        {...formLayout}
        form={form}
        name="control-hooks"
        onFinish={onFinish}
      >
        <Form.Item
          name={["title"]}
          label={t("$views.createPage.title")}
          rules={[{ required: true, message: t("$views.message.title") }]}
        >
          <Input />
        </Form.Item>

        <Form.Item
          name={["description"]}
          label={t("$views.createPage.description")}
        >
          <Input.TextArea />
        </Form.Item>

        <Form.Item name={["file_ids"]} label={t("$views.createPage.files")}>
          <Dragger {...draggerProps}>
            <p className="ant-upload-drag-icon">
              <InboxOutlined />
            </p>
            <p className="ant-upload-text">
              {t("$views.createPage.dragger.title")}
            </p>
            <p className="ant-upload-hint">
              {t("$views.createPage.dragger.description")}
            </p>
          </Dragger>
        </Form.Item>

        <Form.Item
          name="category_id"
          rules={[
            {
              required: true,
              message: t("$views.message.category"),
            },
          ]}
          label={t("$views.createPage.category")}
        >
          <Select
            showSearch
            optionFilterProp="children"
            placeholder={t("$views.createPage.select_category")}
            filterOption={(input, option) => {
              return (
                (option?.children?.toString() ?? "")
                  .toLowerCase()
                  .indexOf(input.toLowerCase()) >= 0
              );
            }}
          >
            {categories.map((category) => {
              return (
                <Select.Option value={category.id} key={category.id}>
                  {formatCategory(lang, category)}
                </Select.Option>
              );
            })}
          </Select>
        </Form.Item>

        <Form.Item
          name={["approved_amount", "numerator"]}
          label={t("$views.createPage.approved_amount")}
        >
          <Input prefix="₽" suffix="RUB" />
        </Form.Item>

        <Form.Item name={["until"]} label={t("$views.createPage.until")}>
          <DatePicker style={{ width: 200 }} />
        </Form.Item>

        <Divider />

        <Form.Item
          name={["donee", "first_name"]}
          rules={[{ required: true, message: t("$views.message.donee_first") }]}
          label={t("$views.createPage.donee.first_name")}
        >
          <Input />
        </Form.Item>

        <Form.Item
          name={["donee", "middle_name"]}
          label={t("$views.createPage.donee.middle_name")}
        >
          <Input />
        </Form.Item>

        <Form.Item
          name={["donee", "last_name"]}
          rules={[{ required: true, message: t("$views.message.donee_last") }]}
          label={t("$views.createPage.donee.last_name")}
        >
          <Input />
        </Form.Item>

        <Divider />

        <Form.Item name={["comment"]} label={t("$views.createPage.message")}>
          <Input.TextArea />
        </Form.Item>

        <Form.Item {...tailLayout}>
          <Space>
            <Button loading={loading} type="primary" htmlType="submit">
              {t("$views.buttons.add")}
            </Button>

            <Button htmlType="button" onClick={onReset}>
              {t("$views.buttons.reset")}
            </Button>
          </Space>
        </Form.Item>
      </Form>
    </Card>
  );
};

export default CreatePage;
\end{lstlisting}
\subsection{components/Application/Form/relationship_select.tsx}
\begin{lstlisting}
import React, { FC, useState } from "react";
import { useTranslation } from "react-i18next";
import { Divider, Input, Select } from "antd";
import { PlusOutlined } from "@ant-design/icons";

import styles from "./styles.module.less";

const { Option } = Select;

const RelationshipSelect: FC = () => {
  let index = 0;

  const { t } = useTranslation("Relationship");

  const [state, setState] = useState({
    items: [t("parent"), t("grandparent"), t("relative"), t("friend")],
    name: "",
  });

  const addItem = (): void => {
    console.log("addItem");
    const { items, name } = state;
    setState({
      items: [...items, name || `New item ${index++}`],
      name: "",
    });
  };

  const onNameChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
    setState({
      ...state,
      name: event.target.value,
    });
  };

  return (
    <Select
      placeholder={t("placeholder")}
      dropdownRender={(menu) => (
        <div>
          {menu}
          <Divider className={styles.divider} />
          <div className={styles.add}>
            <Input className={styles.input} onChange={onNameChange} />
            <a style={{}} onClick={addItem}>
              <PlusOutlined />
              {t("addRelationship")}
            </a>
          </div>
        </div>
      )}
    >
      {state.items.map((item) => (
        <Option key={item} value={item}>
          {item}
        </Option>
      ))}
    </Select>
  );
};

export default RelationshipSelect;
\end{lstlisting}
\subsection{components/Application/Form/styles.module.less}
\begin{lstlisting}
.add {
  flex: none;
  padding: 8px;
  display: block;
  cursor: pointer;
}

.divider {
  margin: 4px 0;
}

.input {
  flex: auto;
}
\end{lstlisting}
\subsection{components/Application/Modal/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Form, Input, Modal } from "antd";
import { useForm } from "antd/lib/form/Form";
import { DonationRequestUpdateStatusInput } from "@generated";
import { notify } from "@lib/utils/notification";
import { AxiosPromise } from "axios";

import { ApplicationStatus } from "../Status/tag";

type FormValues = {
  message: string;
};

const ModalWithMessage: FC<{
  query: (
    id: number,
    input?: DonationRequestUpdateStatusInput,
    // eslint-disable-next-line
    options?: any,
  ) => AxiosPromise<void>;
  title: string;
  applicationId: number;
  newStatus: ApplicationStatus;
  onRefetch: () => Promise<void>;
  isVisible: boolean;
  onClose: () => void;
}> = ({
  query,
  title,
  applicationId: id,
  newStatus,
  onRefetch,
  isVisible,
  onClose,
}) => {
  const { t } = useTranslation("Application");

  const [form] = useForm<FormValues>();
  const [visible, setVisible] = useState(isVisible);
  const [confirmLoading, setConfirmLoading] = useState(false);

  useEffect(() => {
    setVisible(isVisible);
  }, [isVisible]);

  const handleOk = useCallback(
    async (values: FormValues): Promise<void> => {
      try {
        setConfirmLoading(true);

        console.log(values);

        const input: DonationRequestUpdateStatusInput = {
          status: newStatus,
          comment: values.message,
        };

        await query(id, input);

        form.resetFields();

        notify(t("$views.card.successUpdateStatus"));
      } catch (e) {
        console.error(e);
      } finally {
        setVisible(false);
        setConfirmLoading(false);
        onClose();
        onRefetch();
      }
    },
    [
      setConfirmLoading,
      setVisible,
      id,
      onRefetch,
      newStatus,
      query,
      onClose,
      t,
      form,
    ],
  );

  return (
    <Modal
      title={title}
      visible={visible}
      onOk={() => handleOk(form.getFieldsValue())}
      confirmLoading={confirmLoading}
      onCancel={() => setVisible(false)}
    >
      <Form<FormValues> form={form}>
        <Form.Item
          name="message"
          label={t("$views.card.message")}
          rules={[
            {
              required: true,
              message: t("$views.card.enterMessage"),
            },
          ]}
        >
          <Input.TextArea placeholder={t("$views.card.enterMessage")} />
        </Form.Item>
      </Form>
    </Modal>
  );
};

export default ModalWithMessage;
\end{lstlisting}
\subsection{components/Application/RightPanel/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback } from "react";
import { toInteger, toNumber } from "lodash";
import {
  Button,
  Card,
  Col,
  Divider,
  Empty,
  List,
  Progress,
  Row,
  Skeleton,
  Statistic,
  Tag,
  Typography,
} from "antd";
import Avatar from "antd/lib/avatar/avatar";
import {
  CheckOutlined,
  CloseCircleOutlined,
  WarningOutlined,
} from "@ant-design/icons";
import {
  DonationRequestReviewResponseReviewStatusEnum as ReviewStatus,
  DonationRequestSingleReviewStatusSingleReviewStatusEnum as SingleReviewStatus,
  DonationRequestSubmitReviewInputReviewStatusEnum as IsReadyEum,
} from "@generated";
import { fullName } from "@lib/utils/name";
import { notify } from "@lib/utils/notification";
import { useTranslation } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { DonationRequestFactory } from "@providers/axios";

const { Paragraph, Title } = Typography;

const StatusTag: FC<{ status?: ReviewStatus }> = ({ status }) => {
  const { t } = useTranslation("Application");

  let color;

  switch (status) {
    case ReviewStatus.Accepted:
      color = "green";
      break;
    case ReviewStatus.Rejected:
      color = "red";
      break;
    case ReviewStatus.NotViewed:
      color = "gold";
      break;
  }

  return <Tag color={color}>{t(`ReviewStatus.${status}`)}</Tag>;
};

const SingleReviewSpan: FC<{ status?: SingleReviewStatus }> = ({ status }) => {
  const { t } = useTranslation("Application");
  let emoji;

  switch (status) {
    case SingleReviewStatus.Accepted:
      emoji = "👍🏻";
      break;
    case SingleReviewStatus.Rejected:
      emoji = "👎🏻";
      break;
    case SingleReviewStatus.NotViewed:
      emoji = "⏳";
      break;
  }

  return (
    <span>
      {emoji} {t(`ReviewStatus.${status}`)}
    </span>
  );
};

const RightPanel: FC<{
  id: number;
  category?: string;
  onRefetchApplication: () => Promise<void>;
}> = ({ id, category, onRefetchApplication }) => {
  const { t } = useTranslation("Application");

  const { data, loading, refetchQuery } = useAxios(
    DonationRequestFactory.apiDonationRequestIdGetAllReviewersGet,
    undefined,
    id,
  );

  const voteAPI = useCallback(
    async (vote: IsReadyEum) => {
      try {
        await DonationRequestFactory.apiDonationRequestIdSubmitReviewPatch(id, {
          id: toInteger(id.toString()),
          review_status: vote,
        });

        notify(t("$views.rightPanel.success_vote"), "success");
      } catch (e) {
        notify(t("$views.rightPanel.error_vote"), "error");
      } finally {
        await refetchQuery();
        await onRefetchApplication();
      }
    },
    [t, id, onRefetchApplication, refetchQuery],
  );

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  if (loading) {
    return <Skeleton active={true} />;
  }

  return (
    <AuthConsumer>
      {({ user }) => {
        //const canVote = data.reviewers?.[0];
        const canVote = data.reviewers?.find(
          (element) => element.manager?.id === user.uuid,
        );
        const alreadyVoted =
          canVote?.single_review_status !== SingleReviewStatus.NotViewed;

        return (
          <Card
            title={t("$views.rightPanel.title")}
            bordered={false}
            extra={<StatusTag status={data.review_status} />}
          >
            <Row>
              <Col span={24}>
                <Progress
                  percent={toNumber(
                    (
                      (((data.accepted_count ?? 0) +
                        (data.rejected_count ?? 0)) /
                        (data.total_count ?? 1)) *
                      100
                    ).toFixed(1),
                  )}
                  success={{
                    percent: toNumber(
                      (
                        ((data.accepted_count ?? 0) / (data.total_count ?? 1)) *
                        100
                      ).toFixed(1),
                    ),
                  }}
                />
              </Col>
            </Row>

            <Divider />

            <Row gutter={16}>
              <Col span={8}>
                <Statistic
                  title={t("$views.rightPanel.for")}
                  value={data.accepted_count}
                  prefix={"👍🏻"}
                  suffix={`/ ${data.total_count}`}
                />
                {canVote && !alreadyVoted && (
                  <Button
                    style={{ marginTop: 16 }}
                    type="primary"
                    onClick={() => voteAPI(IsReadyEum.Accepted)}
                  >
                    {t("$views.rightPanel.vote_for")}
                  </Button>
                )}
              </Col>
              <Col span={8}>
                <Statistic
                  title={t("$views.rightPanel.against")}
                  value={data.rejected_count}
                  prefix={"👎🏻"}
                  suffix={`/ ${data.total_count}`}
                />
                {canVote && !alreadyVoted && (
                  <Button
                    style={{ marginTop: 16 }}
                    type="default"
                    danger
                    onClick={() => voteAPI(IsReadyEum.Rejected)}
                  >
                    {t("$views.rightPanel.vote_against")}
                  </Button>
                )}
              </Col>
              <Col span={8}>
                <Statistic
                  title={t("$views.rightPanel.not_voted")}
                  value={data.not_viewed_count}
                  prefix={"⏳"}
                  suffix={`/ ${data.total_count}`}
                />
              </Col>

              {alreadyVoted &&
                canVote?.single_review_status ===
                  SingleReviewStatus.Accepted && (
                  <Col style={{ marginTop: "16px" }} span={24}>
                    <Paragraph style={{ marginBottom: "0px" }}>
                      <CheckOutlined style={{ color: "green" }} />{" "}
                      {t("vote_text", { id })}
                    </Paragraph>
                  </Col>
                )}

              {!canVote && (
                <Col style={{ marginTop: "16px" }} span={24}>
                  <Paragraph style={{ marginBottom: "0px" }}>
                    <WarningOutlined style={{ color: "orange" }} />{" "}
                    {t("vote_text_visitor", { id, category })}
                  </Paragraph>
                </Col>
              )}

              {alreadyVoted &&
                canVote?.single_review_status ===
                  SingleReviewStatus.Rejected && (
                  <Col style={{ marginTop: "16px" }} span={24}>
                    <Paragraph style={{ marginBottom: "0px" }}>
                      <CloseCircleOutlined style={{ color: "red" }} />{" "}
                      {t("vote_text_reject", { id })}
                    </Paragraph>
                  </Col>
                )}
            </Row>

            <Divider />
            <Title level={5}>{t("reviewers")}</Title>
            <List
              itemLayout="horizontal"
              dataSource={data.reviewers}
              renderItem={(item) => (
                <List.Item>
                  <List.Item.Meta
                    avatar={
                      <Avatar
                        src={`/api/file/${item.manager?.image_id}/download`}
                      />
                    }
                    description={fullName(
                      item.manager?.first_name,
                      item.manager?.middle_name,
                      item.manager?.last_name,
                    )}
                    title={
                      <SingleReviewSpan status={item.single_review_status} />
                    }
                  />
                </List.Item>
              )}
            />
          </Card>
        );
      }}
    </AuthConsumer>
  );
};

export default RightPanel;
\end{lstlisting}
\subsection{components/Application/Status/tag.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import Tag, { TagProps } from "antd/lib/tag";
import { DonationRequestBodyStatusEnum } from "@generated";
import { NO_DATA_PLACEHOLDER } from "@lib/utils";

export { DonationRequestBodyStatusEnum as ApplicationStatus };

function getColor(level: DonationRequestBodyStatusEnum): TagProps["color"] {
  switch (level) {
    case DonationRequestBodyStatusEnum.New:
      return "blue";
    case DonationRequestBodyStatusEnum.InProcessing:
      return "gold";
    case DonationRequestBodyStatusEnum.Deleted:
      return "pink";
    case DonationRequestBodyStatusEnum.NeedsImprovement:
      return "warning";
    case DonationRequestBodyStatusEnum.SuperManagerConfirmation:
      return "gray";
    case DonationRequestBodyStatusEnum.Active:
      return "green";
    case DonationRequestBodyStatusEnum.Spam:
      return "red";
    case DonationRequestBodyStatusEnum.Refused:
      return "error";
    case DonationRequestBodyStatusEnum.UserConfirmation:
      return "magenta";
    case DonationRequestBodyStatusEnum.Archived:
      return "volcano";
  }
}

const StatusTag: FC<{
  status?: DonationRequestBodyStatusEnum | null | undefined;
}> = ({ status }) => {
  const { t } = useTranslation("Application");

  if (!status) {
    return <span>{NO_DATA_PLACEHOLDER}</span>;
  }

  return <Tag color={getColor(status)}>{t(`Status.${status}`)}</Tag>;
};

export default StatusTag;
\end{lstlisting}
\subsection{components/Application/View/index.tsx}
\begin{lstlisting}
import React, { MutableRefObject, useEffect } from "react";
import { /*Badge,*/ Card, Tabs, Tooltip } from "antd";
import {
  DiffOutlined,
  FileOutlined,
  InfoCircleOutlined,
  MessageOutlined,
} from "@ant-design/icons";
import { DonationRequestBody } from "@generated";
import { useTranslation } from "@providers";

// import { DonationRequestFactory } from "@providers/axios";
import { CommentTab, FilesTab, GeneralInfoTab, LogsTab } from "./Tabs";

const { TabPane } = Tabs;

type PropsType = {
  donation: DonationRequestBody;
  onRefetch: () => Promise<void>;
};

type RefType = {
  onRefetch: () => Promise<void>;
};

const ApplicationView = React.forwardRef<RefType, PropsType>((props, ref) => {
  const { t } = useTranslation("Application");

  const { donation, onRefetch } = props;

  useEffect(() => {
    if (ref !== undefined) {
      (ref as MutableRefObject<RefType>).current = {
        onRefetch,
      };
    }
    // eslint-disable-next-line
  }, [ref]);

  return (
    <Card>
      <Tabs defaultActiveKey="1" tabPosition="left">
        <TabPane
          tab={
            <Tooltip title={t("$views.tabs.generalInfoTitle")}>
              <InfoCircleOutlined />
            </Tooltip>
          }
          key="general"
        >
          <GeneralInfoTab info={donation} onRefetch={onRefetch} />
        </TabPane>

        {/* <TabPane
          tab={
            <Tooltip title={t("$views.tabs.doneeInfoTitle")}>
              <UserOutlined />
            </Tooltip>
          }
          key="donee"
        >
          <DoneeInfoTab
            applicantId={donation.author?.id}
            donee={donation.donee ?? donation.author}
            relationship={donation.relationship}
          />
        </TabPane> */}

        <TabPane
          tab={
            <Tooltip title={t("$views.tabs.filesTitle")}>
              <FileOutlined />
            </Tooltip>
          }
          key="files"
        >
          <FilesTab files={donation.attached_files ?? []} />
        </TabPane>

        <TabPane
          tab={
            <Tooltip title={t("$views.tabs.logsTitle")}>
              <DiffOutlined />
            </Tooltip>
          }
          key="logs"
        >
          <LogsTab
            {...{ id: donation.id ?? 0, onButtonsStatusRefetch: onRefetch }}
            ref={ref}
          />
        </TabPane>

        <TabPane
          tab={
            <Tooltip title={t("$views.tabs.commentsTitle")}>
              <MessageOutlined />
              {/* <Badge count={5}>
              </Badge> */}
            </Tooltip>
          }
        >
          <CommentTab id={donation.id ?? 0} />
        </TabPane>
      </Tabs>
    </Card>
  );
});

ApplicationView.displayName = "ApplicationView";

export default ApplicationView;
\end{lstlisting}
\subsection{components/Application/View/Tabs/Comments/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { Avatar, Button, Card, Comment, Empty, Form, Input } from "antd";
import { CommentProps } from "antd/lib/comment";
import { UserOutlined } from "@ant-design/icons";
import { UserUser } from "@generated";
import { formatDate } from "@lib/utils";
import { DonationRequestFactory } from "@providers/axios";
import { IdComponent } from "@typings/component";

import styles from "./styles.module.less";

const { TextArea } = Input;

/** Comment list */
const CommentList: FC<{ comments: CommentProps[] }> = ({ comments }) => {
  const { t } = useTranslation("Comments");

  // eslint-disable-next-line
  const messagesEndRef = useRef<any>(null);

  const scrollToBottom = (): void => {
    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
  };

  useEffect(scrollToBottom, [comments]);

  return (
    <Card title={t("title", { count: comments.length })} bordered={false}>
      <div className={styles.list}>
        {comments.length === 0 && (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
        )}
        {comments.map((item, index) => (
          <Comment key={index} {...item} />
        ))}
        <div id="end" ref={messagesEndRef} />
      </div>
    </Card>
  );
};

const Editor: FC<{
  onChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
  onSubmit: () => void;
  submitting: boolean;
  value: string;
}> = ({ onChange, onSubmit, submitting, value }) => {
  const { t } = useTranslation("Comments");

  return (
    <>
      <Form.Item>
        <TextArea rows={4} onChange={onChange} value={value} />
      </Form.Item>
      <Form.Item>
        <Button
          htmlType="submit"
          loading={submitting}
          onClick={onSubmit}
          type="primary"
        >
          {t("add_comment")}
        </Button>
      </Form.Item>
    </>
  );
};

export const CommentTab: IdComponent = ({ id }) => {
  const { t } = useTranslation("Users");

  const [state, setState] = useState<{
    comments: CommentProps[];
    submitting: boolean;
    value: string;
  }>({
    comments: [],
    submitting: false,
    value: "",
  });

  const formatName = (author?: UserUser): string => {
    return `${author?.first_name} ${author?.last_name} (${t(
      `Role.${author?.role}`,
    )})`;
  };

  const fetchAPI = useCallback(
    async () => {
      const {
        data,
      } = await DonationRequestFactory.apiDonationRequestIdCommentsGet(id);

      if (data) {
        setState({
          ...state,
          comments: data.map((comment) => {
            return {
              author: formatName(comment.author),
              content: comment.text,
              datetime: formatDate(comment.created_at),
              avatar: comment.author?.image_id ? (
                `/api/file/${comment.author?.image_id}/download`
              ) : (
                <Avatar icon={<UserOutlined />} />
              ),
            };
          }),
        });
      }
    },
    // eslint-disable-next-line
    [id, setState, state],
  );

  const sendMessage = useCallback(async () => {
    try {
      await DonationRequestFactory.apiDonationRequestIdStatusPatch(id, {
        comment: state.value,
      });
    } finally {
      setState({
        submitting: false,
        value: "",
        comments: [],
      });
    }
  }, [state, setState, id]);

  useEffect(
    () => {
      if (!state.submitting) {
        fetchAPI();
      }
    },
    // eslint-disable-next-line
    [state.submitting],
  );

  const handleSubmit = useCallback(
    () => {
      if (!state.value) {
        return;
      }

      setState({
        ...state,
        submitting: true,
      });

      sendMessage();
    },
    // eslint-disable-next-line
    [state, setState],
  );

  const handleChange = useCallback(
    (e: React.ChangeEvent<HTMLTextAreaElement>) => {
      setState({
        ...state,
        value: e.target.value,
      });
    },
    [state],
  );

  const { comments, submitting, value } = state;

  return (
    <>
      {<CommentList comments={comments} />}
      <Comment
        content={
          <Editor
            onChange={handleChange}
            onSubmit={handleSubmit}
            submitting={submitting}
            value={value}
          />
        }
      />
    </>
  );
};
\end{lstlisting}
\subsection{components/Application/View/Tabs/Comments/styles.module.less}
\begin{lstlisting}
.list {
  min-height: 120px;
  max-height: 220px;
  overflow-y: scroll;
}
\end{lstlisting}
\subsection{components/Application/View/Tabs/Donee/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Descriptions } from "antd";
import { UserSimpleUser as Donee } from "@generated";
import { fullName } from "@lib/utils/name";
import { useTranslation } from "@providers";

export const DoneeInfo: FC<{
  donee?: Donee;
  relationship?: string;
}> = ({ donee, relationship }) => {
  const { t } = useTranslation("Application");

  if (!donee) {
    return null;
  }

  const { first_name, middle_name, last_name } = donee;

  const doneeFullName = fullName(first_name, middle_name, last_name);

  if (doneeFullName.length === 0) {
    return null;
  }

  return (
    <Descriptions title={t("$views.card.donee")} layout="vertical" bordered>
      <Descriptions.Item label={t("$views.card.donee_fullname")}>
        {doneeFullName}
      </Descriptions.Item>
      {relationship && (
        <Descriptions.Item label={t("$views.card.relationship")} span={2}>
          <span>{relationship}</span>
        </Descriptions.Item>
      )}
    </Descriptions>
  );
};
\end{lstlisting}
\subsection{components/Application/View/Tabs/Files/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import { Button } from "antd";
import { DownloadOutlined } from "@ant-design/icons";
import { FileInfo as Single } from "@generated";
import RegistryTable from "@lib/components/RegistryTable";
import { useListSelection } from "@lib/hooks";
import { formatDate } from "@lib/utils";

export const FilesTab: FC<{ files: Single[] }> = ({ files }) => {
  const { t } = useTranslation("Application");

  const {
    isTarget,
    isSelected,
    onElementClick,
    // setList,
  } = useListSelection<File>();

  const columns = [
    {
      key: "file",
      render(record: Single) {
        return `${record.title}`;
      },
    },
    {
      key: "uploadDate",
      width: "20%",
      render(record: Single) {
        return formatDate(record.created_at);
      },
    },
    {
      key: "",
      name: "actions",
      width: "10%",
      render(record: Single) {
        return (
          <Button
            type="link"
            icon={<DownloadOutlined />}
            target="_blank"
            href={`/api/file/${record.id}/download`}
          >
            {t("$views.download")}
          </Button>
        );
      },
    },
  ];

  return (
    <RegistryTable
      entity="Application"
      columns={columns}
      // eslint-disable-next-line
      rows={files as Record<string, any>[]} // TODO
      rowState={(record, index) => ({
        selected: isSelected(index),
        target: isTarget(index),
      })}
      onRecordClick={(event, record, index) => {
        if (index !== undefined) {
          onElementClick(event, index);
        }
      }}
    />
  );
};
\end{lstlisting}
\subsection{components/Application/View/Tabs/index.tsx}
\begin{lstlisting}
export { CommentTab } from "./Comments";
export { LogsTab } from "./Logs";
export { GeneralInfo as GeneralInfoTab } from "./Info";
export { FilesTab } from "./Files";
\end{lstlisting}
\subsection{components/Application/View/Tabs/Info/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useState } from "react";
import { toInteger } from "lodash";
import { Button, DatePicker, Descriptions, InputNumber, Space } from "antd";
import { EditOutlined } from "@ant-design/icons";
import { Link } from "@curi/react-dom";
import {
  DonationRequestBody as Single,
  DonationRequestBodyAvailableStatusesEnum as Status,
  UserUserRoleEnum,
} from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { formatCategory, formatMoney } from "@lib/utils";
import { DateTimeFormat, format } from "@lib/utils/date";
import { cred, fullName } from "@lib/utils/name";
import { notify } from "@lib/utils/notification";
import { i18n, useTranslation } from "@providers";
import { DonationRequestFactory } from "@providers/axios";
import { Role } from "@providers/rbac-rules";
import moment from "moment";

import StatusTag, {
  ApplicationStatus,
} from "components/Application/Status/tag";
import AssigneeSelect from "components/Assignee/Select";
import RoleTag from "components/User/Role/tag";

import UserPreview from "../../../../User/Drawer";
import { DoneeInfo } from "../Donee";

const Actions: FC<{
  status?: ApplicationStatus;
  onSave: () => Promise<void>;
  onClose: () => void;
  onEdit: () => void;
  editable: boolean;
}> = ({ status, onSave, editable, onClose, onEdit }) => {
  const [loading, setLoading] = useState(false);

  const { t } = useTranslation("Translation");

  const saveAndClose = useCallback(async () => {
    setLoading(true);

    try {
      await onSave();

      onClose();
    } catch (e) {
      notify(t("$views.updateError", "error"));
    } finally {
      setLoading(false);
    }
  }, [onClose, onSave, t]);

  return (
    <Space>
      {!editable &&
        (status === ApplicationStatus.InProcessing ||
          status === ApplicationStatus.SuperManagerConfirmation) && (
          <Button icon={<EditOutlined />} onClick={onEdit}>
            {t("translation:edit")}
          </Button>
        )}

      {editable && <Button onClick={onClose}>{t("translation:cancel")}</Button>}

      {editable && (
        <Button onClick={saveAndClose} loading={loading} type="primary">
          {t("translation:save")}
        </Button>
      )}
    </Space>
  );
};

type EditableInfo = {
  approvedAmount?: number;
  endTime?: string;
  assigneeId?: string;
};

export const GeneralInfo: FC<{
  info: Single;
  onRefetch: () => Promise<void>;
}> = ({ info, onRefetch }) => {
  const [visible, setVisible] = useState(false);

  const { t } = useTranslation("Application");

  const [editable, setEditable] = useState<boolean>(false);

  const lang = i18n.language.substr(0, 2);

  const [initialInfo, updateInfo] = useState<EditableInfo>({
    approvedAmount: info.approved_amount?.numerator,
    endTime: undefined,
    assigneeId: info.assignee?.id,
  });

  const onSave = useCallback(
    async (updInfo: EditableInfo) => {
      try {
        await DonationRequestFactory.apiDonationRequestIdPatch(info.id ?? 0, {
          approved_amount: {
            currency: "RUB",
            numerator: updInfo.approvedAmount,
            denominator: 1,
          },
          until: updInfo.endTime,
          assignee_id: updInfo.assigneeId,
        });

        notify(t("$views.update_success"), "success");
      } catch (e) {
        console.error(e);
        notify(t("$views.update_error"), "error");
      } finally {
        onRefetch();
      }
    },
    [onRefetch, t, info],
  );

  return (
    <>
      <Descriptions
        layout="vertical"
        bordered
        title={t("$views.tabs.generalInfoTitle")}
        extra={
          <RoleSwitch
            // it's an example of the RoleSwitch component
            role={Role.manager} // replace for user.role from <AuthProvider />
            perform="application:edit"
            yes={() => (
              <Actions
                status={info.status}
                onSave={() => onSave(initialInfo)}
                onClose={() => setEditable(false)}
                onEdit={() => setEditable(true)}
                editable={editable}
              />
            )}
          />
        }
      >
        <Descriptions.Item label={t("$views.card.description")} span={3}>
          {<span>{info?.description ?? "-"}</span>}
        </Descriptions.Item>

        <Descriptions.Item label={t("$views.card.createdBy")}>
          <a onClick={() => setVisible(true)}>
            {cred(
              info.author?.first_name,
              info.author?.middle_name,
              info.author?.last_name,
            )}
          </a>
        </Descriptions.Item>

        <Descriptions.Item label={t("$views.card.requestedAmount")}>
          {formatMoney(info.requested_amount)}
        </Descriptions.Item>

        <Descriptions.Item label={t("$views.card.approvedAmount")}>
          {!editable && <span>{formatMoney(info.approved_amount)}</span>}
          {editable && (
            <InputNumber
              defaultValue={
                (info.approved_amount?.numerator ?? 0) /
                (info.approved_amount?.denominator ?? 1)
              }
              onChange={(value) => {
                console.log(value);
                updateInfo({
                  ...initialInfo,
                  approvedAmount: toInteger(value),
                });
              }}
            />
          )}
        </Descriptions.Item>

        <Descriptions.Item label={t("$views.card.createdAt")}>
          {format(info.created_at)}
        </Descriptions.Item>

        <Descriptions.Item label={t("$views.card.endTime")}>
          {!editable && (
            <span>{format(info.until, DateTimeFormat.DATE_SHORT)}</span>
          )}
          {editable && (
            <DatePicker
              defaultValue={
                initialInfo.endTime
                  ? moment(initialInfo.endTime, "DD-MM-YYYY")
                  : undefined
              }
              style={{ width: "100%" }}
              onChange={(date, dateString) => {
                updateInfo({
                  ...initialInfo,
                  endTime: dateString,
                });
              }}
            />
          )}
        </Descriptions.Item>

        <Descriptions.Item label={t("$views.card.category")}>
          {formatCategory(lang, info.category)}
        </Descriptions.Item>

        <Descriptions.Item label={t("$views.card.status")}>
          <StatusTag status={info.status} />
        </Descriptions.Item>

        {info.received_amount && (
          <Descriptions.Item label={t("$views.card.received_amount")}>
            <span>{formatMoney(info.received_amount)}</span>
          </Descriptions.Item>
        )}

        {info.assignee && (
          <Descriptions.Item label={t("$views.card.assignee")}>
            {!editable && (
              <>
                <Link name="managers:show" params={{ id: info.assignee.id }}>
                  {fullName(
                    info.assignee?.first_name,
                    info.assignee?.middle_name,
                    info.assignee?.last_name,
                  )}
                </Link>{" "}
                <RoleTag
                  roles={[info.assignee?.role ?? UserUserRoleEnum.Admin]}
                />
              </>
            )}
            {editable && (
              <AssigneeSelect
                value={info.assignee?.id ?? null}
                status={(info.status as unknown) as Status}
                // eslint-disable-next-line
                onChange={(value: any) => {
                  updateInfo({
                    ...initialInfo,
                    assigneeId: value.value ?? undefined,
                  });
                }}
              />
            )}
          </Descriptions.Item>
        )}
      </Descriptions>
      <br />
      <DoneeInfo donee={info.donee} relationship={info.relationship} />
      {visible && (
        <UserPreview
          visible={visible}
          userId={info.author?.id ?? ""}
          onClose={() => setVisible(false)}
        />
      )}
    </>
  );
};
\end{lstlisting}
\subsection{components/Application/View/Tabs/Logs/index.tsx}
\begin{lstlisting}
import React, {
  MutableRefObject,
  useCallback,
  useEffect,
  useRef,
  useState,
} from "react";
import {
  DonationRequestHistoryResponse as Result,
  DonationRequestStatusHistory as Single,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import { useListSelection } from "@lib/hooks";
import { format } from "@lib/utils/date";
import { fullName } from "@lib/utils/name";
import { useTranslation } from "@providers";
import { DonationRequestFactory } from "@providers/axios";

import StatusTag, {
  ApplicationStatus,
} from "components/Application/Status/tag";
import RoleTag from "components/User/Role/tag";

import styles from "./styles.module.less";

type RefType = {
  onRefetch: () => Promise<void>;
};

type PropsType = {
  id: number;
  onButtonsStatusRefetch: () => Promise<void>;
};

export const LogsTab = React.forwardRef<RefType, PropsType>((props, ref) => {
  const { id, onButtonsStatusRefetch } = props;
  const { t } = useTranslation("Application");

  const [refetch, setRefetch] = useState<boolean | undefined>(undefined);

  const {
    isTarget,
    isSelected,
    onElementClick,
    setList,
  } = useListSelection<Single>();

  const onResult = useCallback(
    (result: Result) => {
      setList(result.data ?? []);
    },
    [setList],
  );

  const paginationState = useRef<StateRef>(null);

  useEffect(() => {
    if (ref !== null) {
      (ref as MutableRefObject<RefType>).current = {
        onRefetch: async () => {
          await onButtonsStatusRefetch();
          setRefetch(!refetch);
        },
      };
    }
    // eslint-disable-next-line
  }, [ref, setRefetch, refetch]);

  const columns = [
    {
      key: "prevStatus",
      name: t("prevStatus"),
      render(record: Single) {
        return (
          <StatusTag status={record.previous_status as ApplicationStatus} />
        );
      },
    },

    {
      key: "newStatus",
      name: t("newStatus"),
      render(record: Single) {
        return (
          <StatusTag status={record.current_status as ApplicationStatus} />
        );
      },
    },
    {
      key: "statusUpdData",
      name: t("statusUpdData"),
      render(record: Single) {
        return format(record.created_at);
      },
    },

    {
      key: "authorUpd",
      render(record: Single) {
        const author = record.author;

        return author ? (
          fullName(author.first_name, author.middle_name, author.last_name)
        ) : (
          <>-</>
        );
      },
    },

    {
      key: "authorRole",
      render(record: Single) {
        const author = record.author;
        return <RoleTag roles={author?.role ? [author?.role] : []} />;
      },
    },
  ];

  return (
    <PaginatedQuery<{ page: number; size: number }, Result, Single>
      className={styles.pagination}
      // eslint-disable-next-line
      // @ts-ignore
      requestQuery={DonationRequestFactory.apiDonationRequestIdHistoryGet}
      stateRef={paginationState}
      refetch={refetch}
      variables={{ sort: "", id }}
      onResult={onResult}
      render={(entries) => (
        <RegistryTable
          entity="Application"
          columns={columns}
          // eslint-disable-next-line
          rows={entries as Record<string, any>[]} // TODO
          rowState={(record, index) => ({
            selected: isSelected(index),
            target: isTarget(index),
          })}
          onRecordClick={(event, record, index) => {
            if (index !== undefined) {
              onElementClick(event, index);
            }
          }}
        />
      )}
    />
  );
});
\end{lstlisting}
\subsection{components/Application/View/Tabs/Logs/styles.module.less}
\begin{lstlisting}
@import "../../../../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{components/Assignee/Select.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Select, Spin } from "antd";
import {
  DonationRequestBodyAvailableStatusesEnum as Status,
  UserUser as Single,
  UserUserRoleEnum as Role,
  UserUserRoleEnum,
} from "@generated";
import { useTranslation } from "@providers";
import useAxios, { UserRequestFactory } from "@providers/axios";

import RoleTag from "components/User/Role/tag";

type BaseSelectProps = {
  disabled?: boolean;
  noSearch?: boolean;
  onCreate?: (name: string) => void;
};

type SingleSelectProps = {
  value: string | null;
  status?: Status;
  onChange: (key: string | null, entity: Single | null) => void;
};

const Variables: Record<Status, Array<Role>> = {
  New: [Role.Manager, Role.SuperManager],
  InProcessing: [Role.Manager, Role.SuperManager],
  NeedsImprovement: [Role.Manager, Role.SuperManager],
  Refused: [Role.Manager, Role.SuperManager],
  Spam: [Role.Manager, Role.SuperManager],
  Active: [Role.Manager],
  Deleted: [Role.Manager],
  SuperManagerConfirmation: [Role.SuperManager],
  UserConfirmation: [Role.SuperManager, Role.Manager],
  Archived: [Role.Manager, Role.SuperManager],
  OnRealization: [Role.SuperManager],
};

const { Option } = Select;

const AssigneeSelect: FC<BaseSelectProps & SingleSelectProps> = ({
  value,
  status,
  onChange,
}) => {
  const { t } = useTranslation("Application");

  const { data, loading } = useAxios(
    UserRequestFactory.apiUserGet,
    false,
    0,
    10,
    "",
    Variables[status ?? Status.Spam],
  );

  const handleChange = (v: string): void => {
    onChange(v, null);
  };

  return (
    <Select
      labelInValue
      defaultValue={value ?? undefined}
      placeholder={t("$views.select_assignee")}
      notFoundContent={loading ? <Spin size="small" /> : null}
      filterOption={false}
      onChange={handleChange}
      style={{ width: "100%" }}
    >
      {(data?.data ?? []).map((d) => (
        <Option key={d.id} value={d.id ?? ""}>
          {d.first_name}
          {"   "}
          <RoleTag roles={[d.role ?? UserUserRoleEnum.SuperManager]} />
        </Option>
      ))}
    </Select>
  );
};

export default AssigneeSelect;
\end{lstlisting}
\subsection{components/Category/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useRef } from "react";
import { Button, Card, Checkbox, Form, Input, Popconfirm, Space } from "antd";
import {
  /*MinusCircleOutlined,*/ MinusCircleOutlined,
  PlusOutlined,
} from "@ant-design/icons";
import { CategoryAdminCategory, CategoryUpdateInput } from "@generated";
import { notify } from "@lib/utils/notification";
import { useTranslation } from "@providers";
import { CategoryFactory } from "@providers/axios";

const CategoryPage: FC<{ data: CategoryAdminCategory[] }> = ({ data }) => {
  const { t } = useTranslation("Category");

  // eslint-disable-next-line
  const messagesEndRef = useRef<any>(null);

  const scrollToBottom = (): void => {
    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
  };

  useEffect(scrollToBottom, [data]);

  const onFinish = useCallback(
    async (values: CategoryUpdateInput) => {
      console.log(values);
      try {
        await CategoryFactory.apiCategoriesPost(values);

        notify(t("updated"), "success");
      } catch (e) {
        notify(t("updated_err"), "error");
      }
    },
    [t],
  );

  const removeCategory = useCallback(
    async (onRemove: () => void, item: CategoryAdminCategory) => {
      try {
        await CategoryFactory.apiCategoriesDelete({
          categories: [item.id],
        });

        notify(t("deleted", { id: item.id }), "success");
        onRemove();
      } catch (e) {
        notify(t("deleted_err", { id: item.id }), "error");
      }
    },
    [t],
  );

  return (
    <Card>
      <Form
        name="dynamic_form_nest_item"
        onFinish={onFinish}
        autoComplete="off"
        initialValues={{ categories: data }}
      >
        <Form.List name="categories">
          {(fields, { add, remove }) => (
            <>
              {fields.map((field) => (
                <Space
                  key={field.key}
                  style={{ display: "flex", marginBottom: 8 }}
                  align="baseline"
                >
                  <Form.Item
                    {...field}
                    name={[field.name, "is_hidden"]}
                    fieldKey={[field.fieldKey, "is_hidden"]}
                    valuePropName="checked"
                  >
                    <Checkbox />
                  </Form.Item>

                  <Form.Item
                    {...field}
                    name={[field.name, "id"]}
                    fieldKey={[field.fieldKey, "id"]}
                    rules={[{ required: true, message: t("missing.id") }]}
                  >
                    <Input placeholder={t("placeholder.id")} />
                  </Form.Item>
                  <Form.Item
                    {...field}
                    name={[field.name, "rus"]}
                    fieldKey={[field.fieldKey, "rus"]}
                    rules={[{ required: true, message: t("missing.rus") }]}
                  >
                    <Input placeholder={t("placeholder.rus")} />
                  </Form.Item>
                  <Form.Item
                    {...field}
                    name={[field.name, "eng"]}
                    fieldKey={[field.fieldKey, "eng"]}
                    rules={[{ required: true, message: t("missing.eng") }]}
                  >
                    <Input placeholder={t("placeholder.eng")} />
                  </Form.Item>
                  <Form.Item
                    {...field}
                    name={[field.name, "ara"]}
                    fieldKey={[field.fieldKey, "ara"]}
                    //rules={[{ required: true, message: t("missing.ara") }]}
                  >
                    <Input placeholder={t("placeholder.ara")} />
                  </Form.Item>
                  <Popconfirm
                    okText={t("ok")}
                    cancelText={t("cancel")}
                    title={t("delete_popconfirm")}
                    onConfirm={() =>
                      removeCategory(() => {
                        remove(field.name);
                      }, data[field.name])
                    }
                  >
                    <MinusCircleOutlined />
                  </Popconfirm>
                </Space>
              ))}
              <Form.Item>
                <Button
                  type="dashed"
                  onClick={() => add()}
                  block
                  icon={<PlusOutlined />}
                >
                  {t("add")}
                </Button>
              </Form.Item>
              <div id="end" ref={messagesEndRef} />
            </>
          )}
        </Form.List>
        <Form.Item>
          <Button type="primary" htmlType="submit">
            {t("submit")}
          </Button>
        </Form.Item>
      </Form>
    </Card>
  );
};

export default CategoryPage;
\end{lstlisting}
\subsection{components/Category/select.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Select } from "antd";
import { CategoryAdminCategory } from "@generated";
import { formatCategory } from "@lib/utils";
import { useTranslation } from "@providers";

const SelectCategory: FC<{
  lang: string;
  categories: CategoryAdminCategory[];
}> = (props) => {
  const { lang, categories } = props;

  const { t } = useTranslation("Users");

  return (
    <Select
      {...props}
      mode="multiple"
      showSearch
      optionFilterProp="children"
      placeholder={t("$views.register.categories_placeholder")}
      filterOption={(input, option) => {
        return (
          (option?.children?.toString() ?? "")
            .toLowerCase()
            .indexOf(input.toLowerCase()) >= 0
        );
      }}
    >
      {categories?.map((category) => {
        return (
          <Select.Option value={category.id} key={category.id}>
            {formatCategory(lang, category)}
          </Select.Option>
        );
      })}
    </Select>
  );
};

export default SelectCategory;
\end{lstlisting}
\subsection{components/FAQ/Editor/index.tsx}
\begin{lstlisting}
import React, { FC, RefObject, useEffect, useState } from "react";
import ReactMarkdown from "react-markdown";
import Editor from "react-markdown-editor-lite";

import "react-markdown-editor-lite/lib/index.css";

type EditorChangeType = {
  text: string;
  html: string;
};

type EditorProps = {
  initialValue: string;
  editorRef?: RefObject<Editor>;
};

const FAQEditor: FC<EditorProps> = ({ editorRef, initialValue }) => {
  const [value, setValue] = useState(initialValue);

  useEffect(() => {
    setValue(initialValue);
  }, [initialValue]);

  const handleEditorChange = (val: EditorChangeType): void => {
    const { text } = val;
    const newValue = text.replace(/\d/g, "");
    setValue(newValue);
  };

  return (
    <Editor
      ref={editorRef}
      view={{
        menu: true,
        md: true,
        html: false,
      }}
      value={value}
      style={{
        height: "500px",
      }}
      onChange={handleEditorChange}
      renderHTML={(text) => <ReactMarkdown source={text} />}
    />
  );
};

export default FAQEditor;
\end{lstlisting}
\subsection{components/FAQ/index.tsx}
\begin{lstlisting}
import React, { FC, RefObject } from "react";
import Editor from "react-markdown-editor-lite";
import { Card } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { Role } from "@providers/rbac-rules";

import FAQEditor from "./Editor";
import FAQView from "./View";

import styles from "./styles.module.less";

const FAQ: FC<{
  role: Role;
  text: string;
  editorRef?: RefObject<Editor>;
}> = ({ role, text, editorRef }) => {
  return (
    <Card className={styles.card}>
      <RoleSwitch
        role={role}
        perform="faq:edit"
        yes={() => <FAQEditor editorRef={editorRef} initialValue={text} />}
        no={() => <FAQView text={text} />}
      />
    </Card>
  );
};

export default FAQ;
\end{lstlisting}
\subsection{components/FAQ/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.card {
  h1 {
    font-size: 2em;
  }
  h2 {
    font-size: 1.5em;
  }
  h3 {
    font-size: 1.17em;
  }
  h4 {
    font-size: 1.12em;
  }
  h5 {
    font-size: 0.83em;
  }
  h6 {
    font-size: 0.75em;
  }
}
\end{lstlisting}
\subsection{components/FAQ/View/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import Markdown from "react-markdown";
import { Empty } from "antd";
import gfm from "remark-gfm";

const FAQView: FC<{ text?: string }> = ({ text }) => {
  if (!text) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  return <Markdown plugins={[gfm]}>{text}</Markdown>;
};

export default FAQView;
\end{lstlisting}
\subsection{components/Fund/Description/edit.tsx}
\begin{lstlisting}
/* eslint-disable  @typescript-eslint/no-explicit-any */
import React, { forwardRef, ForwardRefRenderFunction, useState } from "react";
import Editor from "react-markdown-editor-lite";
import { Button, Card, Form, Input, Upload } from "antd";
import { FormInstance } from "antd/lib/form";
import { UploadFile } from "antd/lib/upload/interface";
import { UploadOutlined } from "@ant-design/icons";
import {
  CharityFundInfoResponse as CharityFundInfo,
  CharityFundInput,
} from "@generated";
import { useTranslation } from "@providers";
import { customRequest } from "@providers/cusomUpload";

import FAQEditor from "components/FAQ/Editor";

const layout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 8 },
};

type EditPageProps = {
  initialInfo?: CharityFundInfo;
  onSubmit: (info: CharityFundInput) => Promise<void> | void;
};

export type CharityInfoHandler = FormInstance<CharityFundInput>;

const EditFundDescription: ForwardRefRenderFunction<
  CharityInfoHandler,
  EditPageProps
> = ({ initialInfo, onSubmit }, ref) => {
  const { t } = useTranslation("Fund");

  const [ids, setIds] = useState(
    initialInfo?.files?.map((item) => item.id ?? ""),
  );

  const editorRef = React.useRef<Editor>(null);

  const initialFileList = (initialInfo?.files ?? []).map<UploadFile<any>>(
    (item) => {
      return {
        uid: item.id ?? "",
        status: "done",
        name: item.title ?? "file",
        size: 0,
        type: item.mime_type ?? "image/png",
        url: `/api/file/${item.id}/download`,
      };
    },
  );

  const handleOnChange = ({ fileList }: any): void => {
    setFileList(fileList);
  };

  const [fileList, setFileList] = useState<Array<UploadFile<any>>>(
    initialFileList,
  );

  return (
    <Card title={t("generalInfo")}>
      <Form
        {...layout}
        initialValues={initialInfo}
        ref={ref}
        onFinish={(values) => {
          onSubmit?.({
            ...values,
            description:
              (editorRef as React.RefObject<Editor>).current?.getMdValue() ??
              "",
            file_ids: ids,
          });
        }}
      >
        <Form.Item
          name={["title"]}
          label={t("$views.editPage.title")}
          rules={[{ required: true, message: t("$views.message.title") }]}
        >
          <Input />
        </Form.Item>
        <Form.Item
          name={["address"]}
          label={t("$views.editPage.address")}
          //rules={[{ required: true, message: t("$views.message.address") }]}
        >
          <Input.TextArea />
        </Form.Item>

        <Form.Item
          name={["phone"]}
          label={t("$views.editPage.phone")}
          //rules={[{ required: true, message: t("$views.message.phone") }]}
        >
          <Input />
        </Form.Item>

        <Form.Item
          name={["email"]}
          label={t("$views.editPage.email")}
          //rules={[{ required: true, message: t("$views.message.email") }]}
        >
          <Input />
        </Form.Item>

        <Form.Item name={["files"]} label={t("$views.editPage.files")}>
          <Upload
            onChange={handleOnChange}
            fileList={fileList}
            customRequest={(options) => customRequest(options, setIds)}
          >
            <Button icon={<UploadOutlined />}>
              {t("$views.editPage.upload")}
            </Button>
          </Upload>
        </Form.Item>

        <Form.Item
          name={["description"]}
          label={t("$views.editPage.description")}
        >
          <FAQEditor
            editorRef={editorRef}
            initialValue={initialInfo?.description ?? ""}
          />
        </Form.Item>
      </Form>
    </Card>
  );
};

export default forwardRef(EditFundDescription);
\end{lstlisting}
\subsection{components/Fund/Description/view.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Card, Col, Row, Statistic, Upload } from "antd";
import { CharityFundInfoResponse } from "@generated";
import { useTranslation } from "@providers";

import FAQView from "components/FAQ/View";

export const FundDescriptionView: FC<{ data: CharityFundInfoResponse }> = ({
  data,
}) => {
  const { t } = useTranslation("Fund");
  return (
    <>
      <Card title={data.title}>
        <FAQView text={data.description} />
      </Card>

      <Card style={{ marginTop: "5px" }}>
        <Upload
          listType="picture"
          fileList={data.files?.map((item) => {
            return {
              uid: item.id ?? "",
              type: item.mime_type ?? "",
              status: "done",
              size: 0,
              name: item.title ?? "file",
              thumbUrl: `/api/file/${item.id}/download`,
            };
          })}
        />
      </Card>

      <Card style={{ marginTop: "5px" }}>
        <Row gutter={16}>
          <Col span={12}>
            <Statistic title={t("$views.viewPage.email")} value={data.email} />
          </Col>
          <Col span={12}>
            <Statistic title={t("$views.viewPage.phone")} value={data.phone} />
          </Col>
          <Col span={24} style={{ marginTop: 32 }}>
            <Statistic
              title={t("$views.viewPage.address")}
              value={data.address}
            />
          </Col>
        </Row>
      </Card>
    </>
  );
};
\end{lstlisting}
\subsection{components/Fund/Statistics/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Card, Col, Row, Statistic } from "antd";
import { UtilsMoneyJson } from "@generated";
import { formatMoney, formatNumber } from "@lib/utils";
import { useTranslation } from "@providers";

type StatisticsCardProps = {
  loading: boolean;
  usersCount?: number;
  staffCount?: number;
  activeApplications?: number;
  balance?: UtilsMoneyJson;
};

const StatisticsCard: FC<StatisticsCardProps> = ({
  loading,
  usersCount,
  staffCount,
  balance,
  activeApplications,
}) => {
  const { t } = useTranslation("Fund");

  const usersLabel = t("users_title", formatNumber(usersCount));
  const staffLabel = t("staff_title", formatNumber(staffCount));
  const applicationsLabel = t("applications", formatNumber(activeApplications));

  return (
    <Card loading={loading}>
      <Card>
        <Row>
          <Col span={12}>
            <Statistic title={t("active_users")} value={usersLabel} />
          </Col>
          <Col span={12}>
            <Statistic
              title={t("active_applications")}
              value={applicationsLabel}
            />
          </Col>
        </Row>

        <Row style={{ marginTop: 32 }}>
          <Col span={12}>
            <Statistic title={t("staff")} value={staffLabel} />
          </Col>
          <Col span={12}>
            <Statistic
              title={t("balance")}
              value={formatMoney(balance)}
              precision={2}
            />
          </Col>
        </Row>
      </Card>
    </Card>
  );
};

export default StatisticsCard;
\end{lstlisting}
\subsection{components/Fund/Tabs/Docs/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";

export const DocsTab: FC = () => {
  return <></>;
};
\end{lstlisting}
\subsection{components/Fund/Tabs/index.tsx}
\begin{lstlisting}
export { InfoTab } from "./Info";
export { ReportsTab } from "./Reports";
export { DocsTab } from "./Docs";
\end{lstlisting}
\subsection{components/Fund/Tabs/Info/index.tsx}
\begin{lstlisting}
import React, {
  MutableRefObject,
  useCallback,
  useEffect,
  useState,
} from "react";
import { useTranslation } from "react-i18next";
import { Avatar, Col, Divider, Input, Row, Upload } from "antd";
import { UploadChangeParam } from "antd/lib/upload";
import { UploadFile } from "antd/lib/upload/interface";
import {
  LoadingOutlined,
  PlusOutlined,
  ProfileFilled,
} from "@ant-design/icons";
import RoleSwitch from "@lib/components/RoleSwitch";
import { Role } from "@providers/rbac-rules";

import styles from "./styles.module.less";

type RefType = {
  onSave: () => Promise<void>;
};

type PropsType = {
  role: Role;
  editable: boolean;
};

export const InfoTab = React.forwardRef<RefType, PropsType>((props, ref) => {
  const { editable, role } = props;

  const [uploadLoading, setLoading] = useState(false);

  const [text, setText] = useState(
  );

  const [refetch, setRefetch] = useState<boolean | undefined>(undefined);

  const { t } = useTranslation("Fund");

  const onInfoUpdate = useCallback(async () => {
    console.log(text);
  }, [text]);

  useEffect(() => {
    if (ref !== null) {
      (ref as MutableRefObject<RefType>).current = {
        onSave: async () => {
          await onInfoUpdate();
          setRefetch(!refetch);
        },
      };
    }
    // eslint-disable-next-line
  }, [ref, setRefetch, refetch]);

  const uploadButton = (
    <div>
      {uploadLoading ? <LoadingOutlined /> : <PlusOutlined />}
      <div style={{ marginTop: 8 }}>Upload</div>
    </div>
  );

  // eslint-disable-next-line
  const handleChange = (info: UploadChangeParam<UploadFile<any>>): void => {
    if (info.file.status === "uploading") {
      setLoading(true);
      return;
    }
  };

  return (
    <Row justify="space-around" align="top">
      <Col>
        <div
          style={{
            display: "inline-flex",
            justifyContent: "center",
            alignItems: "center",
          }}
        >
          {!editable && (
            <Avatar
              size={100}
              icon={<ProfileFilled />}
              className={styles.avatar}
            />
          )}

          {editable && (
            <Upload
              name="avatar"
              listType="picture-card"
              className="avatar-uploader"
              showUploadList={false}
              action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
              onChange={handleChange}
            >
              {uploadButton}
            </Upload>
          )}
        </div>
      </Col>

      <Col span={20}>
        <Row justify="space-between" align="middle">
          <Col>
            <h3>{t("description")}</h3>
          </Col>
          <RoleSwitch
            role={role}
            perform="fund:description-edit"
            yes={() => (
              <Col>
                <span className={styles.extra}>
                 
                </span>
              </Col>
            )}
          />
        </Row>
        <Row>
          {!editable && text}

          {editable && (
            <Input.TextArea
              autoSize={true}
              defaultValue={text}
              onChange={(e) => setText(e.target.value)}
            />
          )}
        </Row>

        <Divider />
        <Row>
          <Col>
            <h3>{t("contacts")}</h3>
          </Col>
        </Row>

        <Row>
          <Col>
            <span>+ 7(4852) 21-33-59</span>
          </Col>
        </Row>
      </Col>
    </Row>
  );
});

InfoTab.displayName = "InfoTab";
\end{lstlisting}
\subsection{components/Fund/Tabs/Info/styles.module.less}
\begin{lstlisting}
@import "../../../../variables.less";

.avatar {
  display: inline-block;
  vertical-align: middle;
}

.extra {
  //: 12px;
  font-size: @font-size-sm;
  color: @gray-7;
}
\end{lstlisting}
\subsection{components/Fund/Tabs/Reports/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";

export const ReportsTab: FC = () => {
  return <></>;
};
\end{lstlisting}
\subsection{components/Fund/View/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { Button, Card, Modal, Space, Tabs, Tooltip } from "antd";
import {
  EditOutlined,
  FileDoneOutlined,
  FileOutlined,
  InfoCircleOutlined,
  SaveOutlined,
  StopOutlined,
} from "@ant-design/icons";
import RoleSwitch from "@lib/components/RoleSwitch";
import { AuthConsumer } from "@providers/authContext";

import { DocsTab, InfoTab, ReportsTab } from "components/Fund/Tabs";

type FundProps = {
  name: string;
};

type RefType = {
  onSave: () => Promise<void>;
};

const Actions: FC<{
  editable: boolean;
  onEdit: () => void;
  onSave: () => Promise<void>;
  onCancel: () => void;
}> = ({ editable, onEdit, onSave, onCancel }) => {
  const { t } = useTranslation("Fund");

  return (
    <>
      {!editable && (
        <Button type="primary" icon={<EditOutlined />} onClick={onEdit}>
          {t("$views.buttons.edit")}
        </Button>
      )}
      {editable && (
        <Space>
          <Button type="default" onClick={onCancel} icon={<StopOutlined />}>
            {t("$views.buttons.cancel")}
          </Button>
          <Button type="primary" onClick={onSave} icon={<SaveOutlined />}>
            {t("$views.buttons.save")}
          </Button>
        </Space>
      )}
    </>
  );
};

const FundView: FC<FundProps> = ({ name }) => {
  const [editable, setEditable] = useState(false);

  useEffect(() => {
    setEditable(false);
  }, [setEditable]);

  const { t } = useTranslation("Fund");

  const refetchRef = useRef<RefType | null>(null);

  const onSave = useCallback(async () => {
    refetchRef.current?.onSave();
    setEditable(false);
  }, []);

  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <Card
            title={t("title", { name })}
            extra={
              <RoleSwitch
                role={user.role}
                perform="fund:description-edit"
                yes={() => (
                  <Actions
                    editable={editable}
                    onEdit={() => setEditable(true)}
                    onSave={onSave}
                    onCancel={() => setEditable(false)}
                  />
                )}
              />
            }
          >
            <Tabs
              tabPosition="left"
              defaultActiveKey="1"
              onTabClick={() => {
                editable &&
                  Modal.warning({
                    title: t("modal.title"),
                    content: t("modal.description"),
                  }); // TODO: is it good enough for UX?
                setEditable(false);
              }}
            >
              <Tabs.TabPane
                key="1"
                tab={
                  <Tooltip title={t("description")}>
                    <InfoCircleOutlined />
                  </Tooltip>
                }
              >
                <InfoTab {...{ editable, role: user.role }} ref={refetchRef} />
              </Tabs.TabPane>

              <Tabs.TabPane
                key="2"
                tab={
                  <Tooltip title={t("docs")}>
                    <FileOutlined />
                  </Tooltip>
                }
              >
                <DocsTab />
              </Tabs.TabPane>

              <Tabs.TabPane
                key="3"
                tab={
                  <Tooltip title={t("reports")}>
                    <FileDoneOutlined />
                  </Tooltip>
                }
              >
                <ReportsTab />
              </Tabs.TabPane>
            </Tabs>
          </Card>
        );
      }}
    </AuthConsumer>
  );
};

export default FundView;
\end{lstlisting}
\subsection{components/Login/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import { Button, Card, Checkbox, Form, Input, Row, Typography } from "antd";
import { useForm } from "antd/lib/form/Form";
import { LockOutlined, UserOutlined, WarningOutlined } from "@ant-design/icons";
import { notify } from "@lib/utils/notification";
import { Credentials } from "@providers/authContext";

import styles from "./styles.module.less";

const { Paragraph } = Typography;

type LoginProps = {
  onLogin: (credentials: Credentials) => void;
};

const LoginForm: FC<LoginProps> = ({ onLogin }) => {
  const [form] = useForm<Credentials>();

  const { t } = useTranslation("Login");

  function onFinish(values: Credentials): void {
    onLogin({
      email: values.email,
      password: values.password,
    });
  }

  return (
    <>
      <Row style={{ height: 100 }}></Row>
      <Row justify="center" gutter={16}>
        <Card title={t("title")}>
          <Form
            name="normal_login"
            form={form}
            className={styles.form}
            initialValues={{ remember: true }}
            onFinish={onFinish}
          >
            <Form.Item
              name="email"
              rules={[{ required: true, message: t("messages.enterEmail") }]}
            >
              <Input
                prefix={<UserOutlined className="site-form-item-icon" />}
                placeholder={t("email")}
              />
            </Form.Item>
            <Form.Item
              name="password"
              rules={[{ required: true, message: t("messages.enterPassword") }]}
            >
              <Input
                prefix={<LockOutlined className="site-form-item-icon" />}
                type="password"
                placeholder={t("password")}
              />
            </Form.Item>
            <Form.Item>
              <Form.Item name="remember" valuePropName="checked" noStyle>
                <Checkbox>{t("rememberMe")}</Checkbox>
              </Form.Item>

              <Button
                size="small"
                type="link"
                className={styles.forgot}
                onClick={() => {
                  notify(t("forgotPassword_message"), "warning");
                }}
              >
                {t("forgotPassword")}
              </Button>
            </Form.Item>

            <div className={styles.desc}>
              <Paragraph>
                <WarningOutlined className={styles.icon} /> {t("message.title")}
                <a
                  target="_blank"
                  href="https://play.google.com/store/apps/details?id=com.hse.charity"
                  rel="noopener noreferrer"
                >
                  {" "}
                  {t("message.link")} &gt;
                </a>
              </Paragraph>
            </div>

            <Form.Item>
              <Button type="primary" htmlType="submit" className={styles.login}>
                {t("login")}
              </Button>
            </Form.Item>
          </Form>
        </Card>
      </Row>
    </>
  );
};

export default LoginForm;
\end{lstlisting}
\subsection{components/Login/styles.module.less}
\begin{lstlisting}
.form {
  max-width: 300px;
}

.forgot {
  float: right;
}

.login {
  width: 100%;
}

.icon {
  color: orange;
}

.desc {
  padding: 0px 8px 0px 8px;
  margin-bottom: 20px;
  //background-color: yellow;;
}
\end{lstlisting}
\subsection{components/Manager/View/applications.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import { Link } from "@curi/react-dom";
import {
  DonationRequestBody as Single,
  DonationRequestResponse as Result,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import { useListSelection } from "@lib/hooks";
import { format as formatCategory } from "@lib/utils/category";
import { format } from "@lib/utils/date";
import { cred } from "@lib/utils/name";
import { i18n, useTranslation } from "@providers";
import { DonationRequestFactory, UserApiModel as User } from "@providers/axios";

import StatusTag, {
  ApplicationStatus,
} from "components/Application/Status/tag";

import styles from "./styles.module.less";

const ManagersApplications: FC<{ user: User }> = ({ user }) => {
  const {
    isTarget,
    isSelected,
    onElementClick,
    setList,
  } = useListSelection<Single>();

  const paginationState = useRef<StateRef>(null);

  const language = i18n.language.substring(0, 2);

  const { t } = useTranslation("Application");

  const columns = [
    {
      key: "id",
      render(record: Single) {
        return (
          <Link params={{ id: record.id }} name="applications:show">
            {record.id}
          </Link>
        );
      },
    },
    {
      key: "title",
      render(record: Single) {
        return record.title;
      },
    },
    {
      key: "status",
      render(record: Single) {
        return (
          <StatusTag status={record.status as ApplicationStatus}></StatusTag>
        );
      },
    },
    {
      key: "type",
      render(record: Single) {
        return <span>{formatCategory(language, record.category)}</span>;
      },
    },
    {
      key: "author",
      name: t("author"),
      render(record: Single) {
        const { first_name, middle_name, last_name } = { ...record.author };
        return cred(first_name, middle_name, last_name);
      },
    },
    {
      key: "createdAt",
      name: t("createdAt"),
      render(record: Single) {
        return format(record.created_at);
      },
    },
  ];

  return (
    <PaginatedQuery<{ page: number; size: number }, Result, Single>
      className={styles.pagination}
      requestQuery={DonationRequestFactory.apiDonationRequestGet}
      variables={{ sort: "", author: null, assignee: [user.id] }}
      stateRef={paginationState}
      onResult={(result) => {
        setList(result.data ?? []);
      }}
      render={(entries) => (
        <RegistryTable
          entity="Application"
          columns={columns}
          // eslint-disable-next-line
          rows={entries as Record<string, any>[]} // TODO
          rowState={(record, index) => ({
            selected: isSelected(index),
            target: isTarget(index),
          })}
          onRecordClick={(event, record, index) => {
            if (index !== undefined) {
              onElementClick(event, index);
            }
          }}
        />
      )}
    />
  );
};

export default ManagersApplications;
\end{lstlisting}
\subsection{components/Manager/View/index.tsx}
\begin{lstlisting}
import React, { FC, useState } from "react";
import { useTranslation } from "react-i18next";
import { Card } from "antd";
import { UserApiModel as User, UserApiRole as ApiRole } from "@providers/axios";
import { Role } from "@providers/rbac-rules";

import UserInfo from "components/User/Info";

import ManagersApplications from "./applications";

type ManagerViewProps = {
  user: User;
  role: Role; // TODO: remove, already in User
};

const ManagerView: FC<ManagerViewProps> = ({ user, role }) => {
  const { t } = useTranslation("Manager");

  const [tab, setTab] = useState("tab1");

  const tabList = [
    {
      key: "tab1",
      tab: t("page.applications"),
    },
  ];

  const contentList: Record<string, React.ReactNode> = {
    tab1: <ManagersApplications user={user} />,
  };

  return (
    <>
      <Card title={t("page.infoTitle")} style={{ marginBottom: "10px" }}>
        <br />
        <UserInfo user={user} role={role} />
      </Card>
      {(user.role === ApiRole.SuperManager ||
        user.role === ApiRole.Manager) && (
        <Card
          tabList={tabList}
          onTabChange={(key) => setTab(key)}
          activeTabKey={tab}
        >
          {contentList[tab]}
        </Card>
      )}
    </>
  );
};

export default ManagerView;
\end{lstlisting}
\subsection{components/Manager/View/styles.module.less}
\begin{lstlisting}
\end{lstlisting}
\subsection{components/News/index.tsx}
\begin{lstlisting}
import React, { forwardRef, ForwardRefRenderFunction, useState } from "react";
import { Button, Form, Input, Upload } from "antd";
import { FormInstance } from "antd/lib/form";
import { UploadFile } from "antd/lib/upload/interface";
import { UploadOutlined } from "@ant-design/icons";
import { NewsInput as NewsEditableInfo, NewsView } from "@generated";
import { useTranslation } from "@providers";
import { customRequest } from "@providers/cusomUpload";

export type NewsFormState = NewsEditableInfo;

export type NewsFormHandler = FormInstance<NewsFormState>;

const layout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 8 },
};

type NewsFormProps = {
  initial?: NewsView;
  onSubmit: (value: NewsEditableInfo) => Promise<void> | void;
};

const NewsForm: ForwardRefRenderFunction<NewsFormHandler, NewsFormProps> = (
  { initial, onSubmit },
  ref,
) => {
  const { t } = useTranslation("News");

  const [id, setId] = useState<string | undefined>(initial?.image_id);

  // eslint-disable-next-line
  const handleOnChange = ({ fileList }: any): void => {
    setFileList(fileList);
  };

  // eslint-disable-next-line
  const [profileList, setFileList] = useState<Array<UploadFile<any>>>(
    id
      ? [
          {
            uid: id,
            status: "done",
            name: "photo",
            size: 0,
            type: "image/png",
            url: `/api/file/${initial?.image_id}/download`,
          },
        ]
      : [],
  );

  return (
    <Form
      {...layout}
      ref={ref}
      initialValues={{
        ...initial,
      }}
      onFinish={(values) => {
        const image_id = profileList[0]?.response
          ? profileList[0]?.response[0]?.id
          : undefined;
        onSubmit?.({
          ...values,
          image_id,
        });
      }}
    >
      <Form.Item name={["image_id"]} label={t("$views.create.image")}>
        <Upload
          listType="picture"
          customRequest={(options) => {
            customRequest(options, (ids) => setId(ids[0]));
          }}
          fileList={profileList}
          onChange={handleOnChange}
          multiple={false}
        >
          <Button icon={<UploadOutlined />}>
            {t("$views.create.imageUpload")}
          </Button>
        </Upload>
      </Form.Item>

      <Form.Item
        name={["title"]}
        label={t("$views.create.title")}
        rules={[
          { required: true, message: t("$views.message.title"), max: 100 },
        ]}
      >
        <Input />
      </Form.Item>

      <Form.Item
        name={["description"]}
        label={t("$views.create.description")}
        rules={[
          {
            required: true,
            message: t("$views.message.description"),
            max: 200,
          },
        ]}
      >
        <Input.TextArea
          showCount
          allowClear
          maxLength={200}
          autoSize={{ minRows: 2, maxRows: 3 }}
        />
      </Form.Item>

      <Form.Item
        name={["text"]}
        label={t("$views.create.text")}
        rules={[{ required: true, message: t("$views.message.text") }]}
      >
        <Input.TextArea allowClear autoSize={{ minRows: 6 }} />
      </Form.Item>
    </Form>
  );
};

export default forwardRef(NewsForm);
\end{lstlisting}
\subsection{components/Notifications/all.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import {
  NotificationsNotification as Single,
  NotificationsNotificationResponse as Result,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import { useListSelection } from "@lib/hooks";
import { formatDate } from "@lib/utils";
import { fullName } from "@lib/utils/name";
import { useTranslation } from "@providers";
import { NotificationsFactory } from "@providers/axios";

import styles from "./styles.module.less";

export const AllnNotificationsPage: FC = () => {
  // eslint-disable-next-line
  const { t } = useTranslation("Notifications");

  const paginationState = useRef<StateRef>(null);

  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const columns = [
    {
      key: "created_at",
      width: "15%",
      render(record: Single) {
        return formatDate(record.created_at);
      },
    },
    {
      key: "author",
      width: "15%",
      render(record: Single) {
        if (!record.notification_author) {
          return null;
        }

        const {
          first_name,
          middle_name,
          last_name,
        } = record.notification_author;
        return fullName(first_name, middle_name, last_name);
      },
    },
    {
      key: "body",
      width: "15%",
      render(record: Single) {
        return record.body;
      },
    },
    {
      key: "notification_type",
      render(record: Single) {
        return record.notification_type;
      },
    },
  ];

  return (
    <PaginatedQuery<{ page: number; size: number }, Result, Single>
      className={styles.pagination}
      requestQuery={NotificationsFactory.apiNotificationsGet}
      stateRef={paginationState}
      onResult={(result) => {
        setList(result.data ?? []);
      }}
      render={(entries) => (
        <RegistryTable
          entity="Notifications"
          columns={columns}
          rowKey="created_at"
          // eslint-disable-next-line
          rows={entries as Record<string, any>[]} // TODO
          rowState={(record, index) => ({
            selected: isSelected(index),
            target: isTarget(index),
          })}
          onRecordClick={() => {
            //
          }}
        />
      )}
    />
  );
};
\end{lstlisting}
\subsection{components/Notifications/blockchain.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import { Tag } from "antd";
import {
  BlockchainDonationsResponse as Result,
  BlockchainStatus as Single,
  BlockchainStatusStatusEnum,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import { useListSelection } from "@lib/hooks";
import { formatDate } from "@lib/utils";
import { useTranslation } from "@providers";
import { BatchStatusFactory } from "@providers/axios";

import styles from "./styles.module.less";

const BlockchainStatusTag: FC<{ status?: BlockchainStatusStatusEnum }> = ({
  status,
}) => {
  const { t } = useTranslation("Notifications");

  let color = "grey";

  switch (status) {
    case BlockchainStatusStatusEnum.Pending:
      color = "grey";
      break;
    case BlockchainStatusStatusEnum.Success:
      color = "green";
      break;
    case BlockchainStatusStatusEnum.Failure:
      color = "red";
      break;
    default:
      break;
  }

  return <Tag color={color}>{t(`BlockchainStatusStatusEnum.${status}`)}</Tag>;
};

export const BlockchainNotificationsPage: FC = () => {
  const { t } = useTranslation("Notifications");

  const paginationState = useRef<StateRef>(null);

  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const columns = [
    {
      key: "created_at",
      width: "15%",
      render(record: Single) {
        return formatDate(record.created_at);
      },
    },
    {
      key: "updated_at",
      width: "15%",
      render(record: Single) {
        return formatDate(record.updated_at);
      },
    },
    {
      key: "status",
      width: "12%",
      render(record: Single) {
        return <BlockchainStatusTag status={record.status} />;
      },
    },
    {
      key: "type",
      render(record: Single) {
        return t(`BlockchainStatusTypeEnum.${record.type}`);
      },
    },
  ];

  return (
    <PaginatedQuery<{ page: number; size: number }, Result, Single>
      className={styles.pagination}
      requestQuery={BatchStatusFactory.apiBatchStatusesGet}
      stateRef={paginationState}
      onResult={(result) => {
        setList(result.data ?? []);
      }}
      render={(entries) => (
        <RegistryTable
          entity="Notifications"
          columns={columns}
          rowKey="created_at"
          // eslint-disable-next-line
          rows={entries as Record<string, any>[]} // TODO
          rowState={(record, index) => ({
            selected: isSelected(index),
            target: isTarget(index),
          })}
          onRecordClick={() => {
            //
          }}
        />
      )}
    />
  );
};
\end{lstlisting}
\subsection{components/Notifications/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{components/Settings/index.tsx}
\begin{lstlisting}
export { default as PersonalSettings } from "./Personal";
\end{lstlisting}
\subsection{components/Settings/Personal/index.tsx}
\begin{lstlisting}
/* eslint-disable @typescript-eslint/no-explicit-any */
import React, {
  FC,
  forwardRef,
  ForwardRefRenderFunction,
  useState,
} from "react";
import { Card, DatePicker, Form, Input, Select, Switch, Upload } from "antd";
import { FormInstance } from "antd/lib/form";
import { UploadFile } from "antd/lib/upload/interface";
import { PlusOutlined } from "@ant-design/icons";
import {
  AuthManagerRegistrationInputRoleEnum as Roles,
  CategoryAdminCategory,
  UserEditableInfo,
} from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { formatCategories } from "@lib/utils";
import { i18n, useTranslation } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { UserApiModel, UserApiRole } from "@providers/axios";
import { customRequest } from "@providers/cusomUpload";
import moment from "moment";

import CategorySelect from "components/Category/select";
import BlockedTag from "components/User/Block/tag";
import RoleTag from "components/User/Role/tag";

const RolesArr = [
  Roles.User,
  Roles.SuperManager,
  Roles.Operator,
  Roles.Manager,
  Roles.ContentManager,
  Roles.Admin,
];

const { Option } = Select;

export type PersonalSettingsFormState = UserEditableInfo;

export type PersonalSettingsHandler = FormInstance<PersonalSettingsFormState>;

type PersonalSettingsFormProps = {
  initial?: UserApiModel;
  categories: CategoryAdminCategory[];
  onSubmit?: (values: PersonalSettingsFormState) => void | Promise<void>;
};

const layout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 12 },
};

const UploadButton: FC = () => {
  const { t } = useTranslation("Settings");
  return (
    <div>
      <PlusOutlined />
      <div style={{ marginTop: 8 }}>{t("upload")}</div>
    </div>
  );
};

const PersonalSettingsForm: ForwardRefRenderFunction<
  PersonalSettingsHandler,
  PersonalSettingsFormProps
> = ({ initial, onSubmit, categories }, ref) => {
  const { t } = useTranslation("Settings");

  const lang = i18n.language.substr(0, 2);

  const [id, setId] = useState<string | undefined>(initial?.image_id);

  const [profileList, setFileList] = useState<Array<UploadFile<any>>>(
    id
      ? [
          {
            uid: id,
            status: "done",
            name: "avatar",
            size: 0,
            type: "image/png",
            url: `/api/file/${initial?.image_id}/download`,
          },
        ]
      : [],
  );

  const handleOnChange = ({ fileList }: any): void => {
    setFileList(fileList);
  };

  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <Card bordered={false} title={t("personal")} id="personal">
            <Form
              {...layout}
              ref={ref}
              initialValues={{
                ...initial,
                assigned_categories: initial?.assigned_categories?.map(
                  (item) => item.id,
                ),
                birth_date: initial?.birth_date
                  ? moment(initial?.birth_date)
                  : undefined,
              }}
              onFinish={(values) => {
                const image_id = profileList[0]?.response
                  ? profileList[0]?.response[0]?.id
                  : undefined;
                onSubmit?.({
                  ...values,
                  image_id,
                });
              }}
            >
              <Form.Item label={t("profile_picture")} name="image">
                <Upload
                  accept="image/*"
                  customRequest={(options) => {
                    customRequest(options, (ids) => {
                      setId(ids[0]);
                    });
                  }}
                  listType="picture-card"
                  fileList={profileList}
                  onChange={handleOnChange}
                >
                  {profileList.length >= 1 ? null : <UploadButton />}
                </Upload>
              </Form.Item>

              <Form.Item
                name="first_name"
                label={t("first_name")}
                required={true}
              >
                <Input />
              </Form.Item>

              <Form.Item name="middle_name" label={t("middle_name")}>
                <Input />
              </Form.Item>

              <Form.Item
                name="last_name"
                label={t("last_name")}
                required={true}
              >
                <Input />
              </Form.Item>

              <RoleSwitch
                role={user.role}
                perform="user:edit"
                no={() => {
                  return (
                    <Form.Item name="role" label={t("role")}>
                      <RoleTag roles={[initial?.role ?? UserApiRole.Admin]} />
                    </Form.Item>
                  );
                }}
                yes={() => {
                  return (
                    <Form.Item name="role" label={t("role")}>
                      <Select>
                        {RolesArr.map((value) => {
                          return (
                            <Option key={value} value={value}>
                              {t(`Role.${value}`)}
                            </Option>
                          );
                        })}
                      </Select>
                    </Form.Item>
                  );
                }}
              />

              {initial?.role === UserApiRole.SuperManager && (
                <RoleSwitch
                  role={user.role}
                  perform="user:edit"
                  no={() => {
                    return (
                      <Form.Item
                        name="assigned_categories"
                        label={t("assigned_categories")}
                      >
                        <span>
                          {formatCategories(lang, initial.assigned_categories)}
                        </span>
                      </Form.Item>
                    );
                  }}
                  yes={() => {
                    return (
                      <Form.Item
                        name="assigned_categories"
                        label={t("assigned_categories")}
                      >
                        <CategorySelect categories={categories} lang={lang} />
                      </Form.Item>
                    );
                  }}
                />
              )}

              <Form.Item name="email" label={t("email")} required={true}>
                {initial?.email}
              </Form.Item>

              <Form.Item name="country" label={t("country")}>
                <Input />
              </Form.Item>

              <Form.Item name="city" label={t("city")}>
                <Input />
              </Form.Item>

              <Form.Item name="birth_date" label={t("birth_date")}>
                <DatePicker
                  placeholder={t("birth_date_placeholder")}
                  style={{ width: 200 }}
                />
              </Form.Item>

              <Form.Item name="phone" label={t("phone")}>
                <Input />
              </Form.Item>

              <RoleSwitch
                role={user.role}
                perform="user:edit"
                no={() => {
                  return (
                    <Form.Item name="blocked" label={t("blocked")}>
                      <BlockedTag isBlocked={initial?.blocked ?? false} />
                    </Form.Item>
                  );
                }}
                yes={() => {
                  return (
                    <Form.Item
                      name="blocked"
                      label={t("blocked")}
                      valuePropName="checked"
                    >
                      <Switch />
                    </Form.Item>
                  );
                }}
              />
            </Form>
          </Card>
        );
      }}
    </AuthConsumer>
  );
};

export default forwardRef(PersonalSettingsForm);
\end{lstlisting}
\subsection{components/Status/Select.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import { Select } from "antd";
import { DonationRequestBodyAvailableStatusesEnum as ApplicationStatus } from "@generated";

const { Option } = Select;

const StatusSelect: FC<{
  avaliable: ApplicationStatus[];
  onChange: (value: ApplicationStatus) => void;
}> = ({ avaliable, onChange }) => {
  const { t } = useTranslation("Application");

  return (
    <Select disabled={avaliable.length === 0} onChange={onChange}>
      {avaliable.map((d) => (
        <Option key={d} value={d}>
          {t(`Status.${d}`)}
        </Option>
      ))}
    </Select>
  );
};

export default StatusSelect;
\end{lstlisting}
\subsection{components/Transaction/Form/distribute.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import { Button, Card, Form } from "antd";
import { useForm } from "antd/lib/form/Form";
import { MoneyCollectOutlined } from "@ant-design/icons";
import { AmountInput, Currency } from "@lib/components/AmountInput";

import { ApplicationStatus } from "components/Application/Status/tag";

import { ApplicationSelect } from "./index";

const formItemLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 10 },
};

type DistributeMoneyFormProps = {
  onSubmit: (values: DistributeMoneyFormState) => void | Promise<void>;
};

export type DistributeMoneyFormState = {
  applicationId?: number;
  donation: {
    amount: number;
    currency: Currency;
  };
};

const DEFAULTS: DistributeMoneyFormState = {
  donation: {
    amount: 0,
    currency: "rmb",
  },
};

const DistributeMoneyForm: FC<DistributeMoneyFormProps> = ({ onSubmit }) => {
  const { t } = useTranslation("Transaction");

  const [form] = useForm();

  // eslint-disable-next-line
  const checkPrice = (_: any, value: { amount: number }): Promise<void> => {
    if (value.amount > 0) {
      return Promise.resolve();
    }
    return Promise.reject(t("form.priceValidation"));
  };

  return (
    <Card>
      <Form<DistributeMoneyFormState>
        {...formItemLayout}
        form={form}
        onFinish={async (values) => {
          await onSubmit?.(values);
          form.resetFields();
        }}
        initialValues={DEFAULTS}
      >
        <Form.Item
          name="applicationId"
          label={t("form.application")}
          hasFeedback
          rules={[
            {
              required: true,
              message: t("form.applicationMessage"),
            },
          ]}
        >
          <ApplicationSelect status={[ApplicationStatus.Active]} />
        </Form.Item>

        <Form.Item
          name="donation"
          label={t("form.amount")}
          rules={[{ validator: checkPrice }]}
        >
          <AmountInput />
        </Form.Item>

        <Form.Item wrapperCol={{ span: 12, offset: 6 }}>
          <Button
            type="primary"
            htmlType="submit"
            icon={<MoneyCollectOutlined />}
          >
            {t("form.submit_money")}
          </Button>
        </Form.Item>
      </Form>
    </Card>
  );
};

export default DistributeMoneyForm;
\end{lstlisting}
\subsection{components/Transaction/Form/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Button, Card, Form, Input, Radio, Select, Switch } from "antd";
import { useForm } from "antd/lib/form/Form";
import { MoneyCollectOutlined } from "@ant-design/icons";
import { DonationRequestBody } from "@generated";
import { AmountInput, Currency } from "@lib/components/AmountInput";
import { DonationRequestFactory } from "@providers/axios";

import { ApplicationStatus } from "components/Application/Status/tag";

const formItemLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 10 },
};

const { Option } = Select;

type TransactionFormProps = {
  onSubmit: (values: TransactionFormState) => void | Promise<void>;
};

export type TransactionFormState = {
  first_name?: string;
  middle_name?: string;
  last_name?: string;
  applicationId?: number;
  type: "fund" | "application";
  donation: {
    amount: number;
    currency: Currency;
  };
  anonymous: boolean;
};

const DEFAULTS: TransactionFormState = {
  type: "fund",
  anonymous: false,
  donation: {
    amount: 0,
    currency: "rmb",
  },
};

export const ApplicationSelect: FC<{ status?: ApplicationStatus[] }> = ({
  status,
  ...rest
}) => {
  const { t } = useTranslation("Transaction");

  const [data, setData] = useState<DonationRequestBody[] | undefined>();

  const onSearch = useCallback(
    async (value?: string) => {
      try {
        const { data: d } = await DonationRequestFactory.apiDonationRequestGet(
          0,
          10,
          "",
          undefined,
          undefined,
          status,
          undefined,
          value,
        );

        setData(d.data);
      } catch (e) {
        console.log(e);
      }
    },
    [status],
  );

  useEffect(() => {
    if (!data) {
      onSearch(undefined);
    }
  }, [data, onSearch]);

  return (
    <Select
      {...rest}
      showSearch
      placeholder={t("form.applicationPlaceholder")}
      onSearch={onSearch}
    >
      {data?.map((value) => {
        return (
          <Option value={value.id ?? 0} key={value.id}>
            {value.title}
          </Option>
        );
      })}
    </Select>
  );
};

const TransactionForm: FC<TransactionFormProps> = ({ onSubmit }) => {
  const { t } = useTranslation("Transaction");

  const [form] = useForm();

  // eslint-disable-next-line
  const checkPrice = (_: any, value: { amount: number }): Promise<void> => {
    if (value.amount > 0) {
      return Promise.resolve();
    }
    return Promise.reject(t("form.priceValidation"));
  };

  const [type, setType] = useState("fund");

  return (
    <Card>
      <Form<TransactionFormState>
        {...formItemLayout}
        form={form}
        onFinish={async (values) => {
          await onSubmit?.(values);
          form.resetFields();
        }}
        initialValues={DEFAULTS}
      >
        <Form.Item name="type" label={t("form.type.title")}>
          <Radio.Group
            onChange={(e) => {
              setType(e.target.value);
            }}
          >
            <Radio.Button value="fund">{t("form.type.fund")}</Radio.Button>
            <Radio.Button value="application">
              {t("form.type.application")}
            </Radio.Button>
          </Radio.Group>
        </Form.Item>

        <Form.Item name="first_name" label={t("form.first_name")}>
          <Input />
        </Form.Item>

        <Form.Item name="middle_name" label={t("form.middle_name")}>
          <Input />
        </Form.Item>

        <Form.Item name="last_name" label={t("form.last_name")}>
          <Input />
        </Form.Item>

        {type !== "fund" && (
          <Form.Item
            name="applicationId"
            label={t("form.application")}
            hasFeedback
            rules={[
              {
                required: type !== "fund",
                message: t("form.applicationMessage"),
              },
            ]}
          >
            <ApplicationSelect />
          </Form.Item>
        )}

        <Form.Item
          name="donation"
          label={t("form.amount")}
          rules={[{ validator: checkPrice }]}
        >
          <AmountInput />
        </Form.Item>
        <Form.Item
          hidden={type === "fund"}
          name="anonymous"
          label={t("form.anon")}
          valuePropName="checked"
        >
          <Switch />
        </Form.Item>
        <Form.Item wrapperCol={{ span: 12, offset: 6 }}>
          <Button
            type="primary"
            htmlType="submit"
            icon={<MoneyCollectOutlined />}
          >
            {t("form.submit")}
          </Button>
        </Form.Item>
      </Form>
    </Card>
  );
};

export default TransactionForm;
\end{lstlisting}
\subsection{components/Transaction/Status/tag.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import Tag, { TagProps } from "antd/lib/tag";
import { NO_DATA_PLACEHOLDER } from "@lib/utils";

export enum TransactionStatus {
  Success = "Success",
  Declined = "Declined",
  LowBalance = "LowBalance",
}

function getColor(level: TransactionStatus): TagProps["color"] {
  switch (level) {
    case TransactionStatus.Success:
      return "green";
    case TransactionStatus.Declined:
      return "red";
    case TransactionStatus.LowBalance:
      return "orange";
  }
}

const StatusTag: FC<{ status?: TransactionStatus | null }> = ({ status }) => {
  const { t } = useTranslation("Transaction");

  if (!status) {
    return <span>{NO_DATA_PLACEHOLDER}</span>;
  }

  return <Tag color={getColor(status)}>{t(`Status.${status}`)}</Tag>;
};

export default StatusTag;
\end{lstlisting}
\subsection{components/Transaction/View/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import {
  Card,
  Col,
  Descriptions,
  Divider,
  Progress,
  Row,
  Statistic,
  Tag,
} from "antd";
import { Link } from "@curi/react-dom";
import { BlockchainDonation, DonationRequestBodyStatusEnum } from "@generated";
import { formatDate, formatMoney } from "@lib/utils";
import { moneyCollected } from "@lib/utils/currency";
import { DateTimeFormat, daysLeft } from "@lib/utils/date";
import { cred } from "@lib/utils/name";

import StatusTag from "components/Application/Status/tag";

const TransactionView: FC<{ transaction: BlockchainDonation }> = ({
  transaction,
}) => {
  const { t } = useTranslation("Transaction");

  const application = transaction.donation_request;

  const untilProgress = daysLeft(application?.started_at, application?.until);

  console.log(application?.started_at);

  return (
    <>
      <Card>
        <Row gutter={16} align="middle">
          <Col span={5}>
            <Row>
              <Col>
                <Statistic
                  title={t("sum")}
                  value={formatMoney(transaction.amount)}
                  precision={2}
                />
              </Col>
            </Row>
            <br />
            {application && (
              <Row>
                <Col>
                  <Statistic
                    title={t("application_sum")}
                    value={formatMoney(application?.approved_amount)}
                    precision={2}
                  />
                </Col>
              </Row>
            )}
            <br />
            <Row>
              <Col>
                <Statistic
                  title={t("date")}
                  value={formatDate(
                    transaction.created_at,
                    DateTimeFormat.DATE_SHORT,
                  )}
                  precision={2}
                />
              </Col>
            </Row>
          </Col>
          <Col span={7}>
            <Row>
              <Col>
                <Statistic
                  title={t("donation_format")}
                  valueRender={() => {
                    if (application) {
                      return (
                        <Tag color="blue">
                          {t("to_application", { id: application.id })}
                        </Tag>
                      );
                    } else {
                      return <Tag color="default">{t("to_fund")}</Tag>;
                    }
                  }}
                ></Statistic>
              </Col>
            </Row>
            <br />
            <br />
            <Row>
              <Col>
                <Statistic
                  title={t("who")}
                  valueRender={() => {
                    if (!transaction.donation_author) {
                      return "-";
                    } else {
                      const {
                        first_name,
                        middle_name,
                        last_name,
                      } = transaction.donation_author;
                      return (
                        <span>{cred(first_name, middle_name, last_name)}</span>
                      );
                    }
                  }}
                ></Statistic>
              </Col>
            </Row>
          </Col>
          {application && (
            <Col span={1}>
              <Divider type="vertical" style={{ height: "200px" }} />
            </Col>
          )}
          {application && (
            <Col span={4}>
              <Progress
                type="circle"
                percent={moneyCollected(
                  application?.approved_amount,
                  application?.received_amount,
                )}
              />
            </Col>
          )}
          {untilProgress && (
            <Col span={4}>
              <Progress
                type="circle"
                percent={untilProgress.percentage}
                format={() => t("until", { days: untilProgress.days })}
              />
            </Col>
          )}
        </Row>
      </Card>

      {application && (
        <Card>
          <Descriptions
            title={t("info")}
            bordered
            column={{ xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }}
          >
            {application?.donee && (
              <Descriptions.Item label={t("whom")}>
                {cred(
                  application?.donee?.first_name,
                  application?.donee?.middle_name,
                  application?.donee?.last_name,
                )}
              </Descriptions.Item>
            )}
            <Descriptions.Item label={t("application_status")}>
              <StatusTag
                status={
                  (application?.status as unknown) as DonationRequestBodyStatusEnum
                }
              />
            </Descriptions.Item>

            <Descriptions.Item label={t("aim")}>
              <Link name="applications:show" params={{ id: application?.id }}>
                {application?.title}
              </Link>
            </Descriptions.Item>
          </Descriptions>
        </Card>
      )}
    </>
  );
};

export default TransactionView;
\end{lstlisting}
\subsection{components/User/Block/tag.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import Tag from "antd/lib/tag";

const BlockedTag: FC<{ isBlocked: boolean }> = ({ isBlocked }) => {
  const { t } = useTranslation("Users");

  if (!isBlocked) {
    return <Tag color="green">{t(`not_blocked`)}</Tag>;
  }

  return <Tag color="red">{t(`blocked`)}</Tag>;
};

export default BlockedTag;
\end{lstlisting}
\subsection{components/User/Drawer/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import { Button, Card, Descriptions, Drawer, Empty, Skeleton } from "antd";
import { UserApiFactory } from "@generated";
import { fullName } from "@lib/utils/name";
import { router } from "@providers";
import useAxios from "@providers/axios";

const UserPreview: FC<{
  visible: boolean;
  userId: string;
  onClose: () => void;
}> = ({ userId: id, visible, onClose }) => {
  const { t } = useTranslation("User");

  const { data, loading } = useAxios(
    UserApiFactory(undefined).apiUserIdGet,
    undefined,
    id,
  );
  return (
    <Drawer
      visible={visible}
      width={640}
      placement="right"
      closable={false}
      onClose={onClose}
    >
      <Card
        bordered={false}
        title={t("title")}
        extra={
          <Button
            onClick={() =>
              router.navigate({
                url: router.url({ name: "users:show", params: { id } }),
              })
            }
          >
            {t("$views.buttons.visitPage")}
          </Button>
        }
      >
        {!data && <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
        {loading && <Skeleton loading={true} />}

        {data && (
          <Descriptions bordered={true}>
            <Descriptions.Item label={t("credentials")} span={3}>
              {fullName(data.first_name, data.middle_name, data.last_name)}
            </Descriptions.Item>
            <Descriptions.Item label={t("birthday")} span={3}>
              {data.birth_date ?? "-"}
            </Descriptions.Item>
            <Descriptions.Item label={t("phone")} span={3}>
              {data.phone ?? "-"}
            </Descriptions.Item>
            <Descriptions.Item label={t("email")} span={3}>
              {data.email ?? "-"}
            </Descriptions.Item>
            <Descriptions.Item label={t("city")} span={3}>
              {data.city ?? "-"}
            </Descriptions.Item>
            <Descriptions.Item label={t("country")} span={3}>
              {data.country ?? "-"}
            </Descriptions.Item>
          </Descriptions>
        )}
      </Card>
    </Drawer>
  );
};

export default UserPreview;
\end{lstlisting}
\subsection{components/User/Info/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Avatar, Col, Form, Row } from "antd";
import { UserOutlined } from "@ant-design/icons";
import RoleSwitch from "@lib/components/RoleSwitch";
import { formatCategories, formatDate, formatString } from "@lib/utils";
import { fullName } from "@lib/utils/name";
import { i18n, useTranslation } from "@providers";
import { UserApiModel as User, UserApiRole } from "@providers/axios";
import { Role } from "@providers/rbac-rules";

import BlockedTag from "components/User/Block/tag";
import RoleTag from "components/User/Role/tag";

type UserInfoProps = {
  user: User;
  role: Role;
};

const UserInfo: FC<UserInfoProps> = ({ user, role }) => {
  const { t } = useTranslation("User");

  const lang = i18n.language.substr(0, 2);

  const { first_name, middle_name, last_name, image_id } = user;

  const props = {
    size: { xs: 24, sm: 40, md: 60, lg: 80, xl: 100, xxl: 150 },
    src: image_id ? `/api/file/${image_id}/download` : undefined,
    icon: image_id ? undefined : <UserOutlined />,
  };

  return (
    <Row align="top" justify="space-around" gutter={16}>
      <Col span={3}>
        <Avatar {...props} />
      </Col>
      <Col span={8}>
        <Form>
          <Form.Item label={t("credentials")}>
            <span>{fullName(first_name, middle_name, last_name)}</span>
          </Form.Item>
          <Form.Item label={t("phone")}>
            <span>{formatString(user.phone)}</span>
          </Form.Item>
          <Form.Item label={t("country")}>
            <span>{formatString(user.country)}</span>
          </Form.Item>
          {(user.blocked ?? false) && (
            <Form.Item>
              <BlockedTag isBlocked={user.blocked ?? false} />
            </Form.Item>
          )}
        </Form>
      </Col>
      <Col span={12}>
        <Form>
          <RoleSwitch
            role={role}
            perform="user:show-admin"
            yes={() => {
              return (
                <>
                  <Form.Item label={t("uuid")}>
                    <span>{user.id}</span>
                  </Form.Item>
                  <Form.Item label={t("created_at")}>
                    <span>{formatDate(user.created_at)}</span>
                  </Form.Item>
                </>
              );
            }}
          />
          <Form.Item label={t("email")}>
            <span>{formatString(user.email)}</span>
          </Form.Item>
          <Form.Item label={t("city")}>
            <span>{formatString(user.city)}</span>
          </Form.Item>
          <Form.Item label={t("roles")}>
            <span>
              <RoleTag roles={[user.role ?? UserApiRole.User]} />
            </span>
          </Form.Item>
        </Form>
      </Col>

      {user.role === UserApiRole.SuperManager && (
        <>
          <Col span={3}></Col>
          <Col span={19}>
            <Form.Item label={t("categories")}>
              {formatCategories(lang, user.assigned_categories)}
            </Form.Item>
          </Col>
          <Col span={1}></Col>
        </>
      )}
    </Row>
  );
};

export default UserInfo;
\end{lstlisting}
\subsection{components/User/Role/select.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Select } from "antd";
import { AuthManagerRegistrationInputRoleEnum as Roles } from "@generated";
import { i18n } from "@providers";

const { Option } = Select;

const RolesArr = [
  Roles.User,
  Roles.SuperManager,
  Roles.Operator,
  Roles.Manager,
  Roles.ContentManager,
  Roles.Admin,
];

const RoleSelect: FC = () => {
  return (
    <Select>
      {RolesArr.map((value) => (
        <Option key={"value"} value={"value"}>
          {i18n.t(`Users:Role.${value}`)}
        </Option>
      ))}
    </Select>
  );
};

export default RoleSelect;
\end{lstlisting}
\subsection{components/User/Role/tag.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import Tag, { TagProps } from "antd/lib/tag";
import { UserUserRoleEnum } from "@generated";
import { NO_DATA_PLACEHOLDER } from "@lib/utils";
import { UserApiRole } from "@providers/axios";

function getColor(role: UserApiRole): TagProps["color"] {
  switch (role) {
    case UserApiRole.Manager:
      return "blue";
    case UserApiRole.SuperManager:
      return "gold";
    case UserApiRole.Operator:
      return "pink";
    case UserApiRole.User:
      return "purple";
    case UserApiRole.ContentManager:
      return "orange";
    default:
      return "green";
  }
}

const RoleTag: FC<{ roles?: UserApiRole[] | UserUserRoleEnum[] | null }> = ({
  roles,
}) => {
  const { t } = useTranslation("Users");

  if (!roles) {
    return <span>{NO_DATA_PLACEHOLDER}</span>;
  }

  return (
    <>
      {(roles as UserApiRole[]).map((role) => (
        <Tag key={role} color={getColor(role)}>
          {t(`Role.${role}`)}
        </Tag>
      ))}
    </>
  );
};

export default RoleTag;
\end{lstlisting}
\subsection{components/User/View/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import { Card, Tabs, Tooltip } from "antd";
import {
  FolderOutlined,
  HistoryOutlined,
  InfoCircleOutlined,
} from "@ant-design/icons";
import { AuthConsumer } from "@providers/authContext";
import { UserApiModel } from "@providers/axios";
import { check, Role } from "@providers/rbac-rules";

import { ApplicationsTab, InfoTab, SessionsTab } from "./Tabs";

type UserViewProps = {
  user: UserApiModel;
  role: Role;
};

const UserView: FC<UserViewProps> = ({ user }) => {
  const { t } = useTranslation("User");

  return (
    <AuthConsumer>
      {({ user: u }) => {
        return (
          <Card>
            <Tabs defaultActiveKey="1" tabPosition="left">
              <Tabs.TabPane
                key="1"
                tab={
                  <Tooltip title={t("$views.tab.info")}>
                    <InfoCircleOutlined />
                  </Tooltip>
                }
              >
                <InfoTab user={user} role={u.role} />
              </Tabs.TabPane>

              <Tabs.TabPane
                key="2"
                disabled={!check(u.role, "user:view-applications")}
                tab={
                  <Tooltip title={t("$views.tab.applications")}>
                    <FolderOutlined />
                  </Tooltip>
                }
              >
                <ApplicationsTab userId={user.id ?? ""} />
              </Tabs.TabPane>

              <Tabs.TabPane
                disabled={!check(u.role, "user:view-sessions")}
                key="3"
                tab={
                  <Tooltip title={t("$views.tab.sessions")}>
                    <HistoryOutlined />
                  </Tooltip>
                }
              >
                <SessionsTab />
              </Tabs.TabPane>
            </Tabs>
          </Card>
        );
      }}
    </AuthConsumer>
  );
};

export default UserView;
\end{lstlisting}
\subsection{components/User/View/Tabs/Applications/index.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import { Card } from "antd";
import { Link } from "@curi/react-dom";
import {
  DonationRequestBody as Single,
  DonationRequestResponse as Result,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import { useListSelection } from "@lib/hooks";
import { format } from "@lib/utils/date";
import { useTranslation } from "@providers";
import { DonationRequestFactory } from "@providers/axios";

import StatusTag, {
  ApplicationStatus,
} from "components/Application/Status/tag";

export const ApplicationsTab: FC<{ userId: string }> = ({ userId }) => {
  const { t } = useTranslation("Application");

  const paginationState = useRef<StateRef>(null);

  const {
    isTarget,
    isSelected,
    onElementClick,
    setList,
  } = useListSelection<Single>();

  const columns = [
    {
      key: "id",
      render(record: Single) {
        return (
          <Link params={{ id: record.id }} name="applications:show">
            {record.id}
          </Link>
        );
      },
    },
    {
      key: "title",
      render(record: Single) {
        return record.title;
      },
    },
    {
      key: "status",
      render(record: Single) {
        return (
          <StatusTag status={record.status as ApplicationStatus}></StatusTag>
        );
      },
    },
    {
      key: "createdAt",
      name: t("createdAt"),
      render(record: Single) {
        return format(record.created_at);
      },
    },
  ];

  return (
    <Card title={t("listTitle")} bordered={false}>
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        //className={styles.pagination}
        requestQuery={DonationRequestFactory.apiDonationRequestGet}
        variables={{ sort: "", author: [userId] }}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <RegistryTable
            entity="Application"
            columns={columns}
            // eslint-disable-next-line
            rows={entries as Record<string, any>[]} // TODO
            rowState={(record, index) => ({
              selected: isSelected(index),
              target: isTarget(index),
            })}
            onRecordClick={(event, record, index) => {
              if (index !== undefined) {
                onElementClick(event, index);
              }
            }}
          />
        )}
      />
    </Card>
  );
};
\end{lstlisting}
\subsection{components/User/View/Tabs/index.tsx}
\begin{lstlisting}
export { SessionsTab } from "./Sessions";
export { ApplicationsTab } from "./Applications";
export { InfoTab } from "./Info";
\end{lstlisting}
\subsection{components/User/View/Tabs/Info/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Button, Card, Space } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useTranslation } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { UserApiModel } from "@providers/axios";
import { Role } from "@providers/rbac-rules";

import UserInfo from "../../../Info";

const Actions: FC<{ userData: UserApiModel }> = () => {
  const { t } = useTranslation("User");

  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform="user:actions" // user.isBlocked?
            yes={() => (
              <Space>
                <Button danger>{t("$views.buttons.edit")}</Button>
                <Button danger>{t("$views.buttons.block")}</Button>
              </Space>
            )}
          />
        );
      }}
    </AuthConsumer>
  );
};

export const InfoTab: FC<{ user: UserApiModel; role: Role }> = ({
  user,
  role,
}) => {
  const { t } = useTranslation("User");

  return (
    // TODO: fill up with real data
    <Card
      bordered={false}
      title={t("$views.tab.info")}
      extra={<Actions userData={user} />}
    >
      <UserInfo user={user} role={role} />
    </Card>
  );
};
\end{lstlisting}
\subsection{components/User/View/Tabs/Sessions/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Card } from "antd";
import { useTranslation } from "@providers";

export const SessionsTab: FC = () => {
  const { t } = useTranslation("User");
  return <Card title={t("$views.tab.sessions")} bordered={false}></Card>;
};
\end{lstlisting}
\subsection{Elm/Center.elm}
\begin{lstlisting}
module Elm.Center exposing
    ( markdown
    , styles
    )

import Element.Font as F
import Html exposing (..)
import Html.Attributes as Attr exposing (..)
import Markdown


markdown : String -> Html msg
markdown string =
    Markdown.toHtmlWith options [] string


styles : String -> List (Attribute msg)
styles width =
    [ style "display" "block"
    , style "max-width" width
    , style "margin" "0 auto"
    ]


options : Markdown.Options
options =
    { githubFlavored = Just { tables = False, breaks = False }
    , defaultHighlighting = Nothing
    , sanitize = False
    , smartypants = False
    }
\end{lstlisting}
\subsection{Elm/Colors.elm}
\begin{lstlisting}
module Elm.Colors exposing (..)

import Element as E exposing (Color)


black : Color
black =
    E.rgb255 0 0 0


white : Color
white =
    E.rgb255 255 255 255


gray : Color
gray =
    E.rgb255 128 128 128


darkGray : Color
darkGray =
    E.rgb255 100 100 100


lightGray : Color
lightGray =
    E.rgb255 250 250 250


blue : Color
blue =
    E.rgb255 18 147 216


darkBlue : Color
darkBlue =
    E.rgb255 12 145 216
\end{lstlisting}
\subsection{Elm/FAQ.elm}
\begin{lstlisting}
module Elm.FAQ exposing (..)

import Browser
import Element as E
import Elm.Center
import Elm.Skeleton exposing (Tab(..))
import Html exposing (..)
import Html.Attributes exposing (..)


main : Program Flags Model Model
main =
    Browser.element
        { init = init
        , update = \model _ -> ( model, Cmd.none )
        , subscriptions = \_ -> Sub.none
        , view = view
        }


init : Flags -> ( Model, Cmd msg )
init flags =
    let
        model =
            Model flags.faq
    in
    ( model, Cmd.none )


view : Model -> Html msg
view model =
    let
        mdFaq =
            E.html (Elm.Center.markdown model.faq)
    in
    Elm.Skeleton.skeleton FAQ [ mdFaq ]


type alias Flags =
    { faq : String
    }


type alias Model =
    { faq : String
    }
\end{lstlisting}
\subsection{Elm/Fund.elm}
\begin{lstlisting}
module Elm.Fund exposing (..)

import Browser
import Element as E
import Element.Background as Background
import Element.Font as F
import Elm.Center
import Elm.Colors as C
import Elm.Skeleton exposing (Tab(..))
import Html exposing (Html)
import Maybe exposing (withDefault)


type alias FileInfo =
    { id : String
    , mime_type : String
    , title : String
    }


type alias Fund =
    { title : String
    , description : Maybe String
    , address : Maybe String
    , files : Maybe (List FileInfo)
    , phone : Maybe String
    , email : Maybe String
    }


type alias Model =
    { fundInfo : Fund
    }


main : Program Fund Model Model
main =
    Browser.element
        { init = init
        , update = \model _ -> ( model, Cmd.none )
        , subscriptions = \_ -> Sub.none
        , view = view
        }


init : Fund -> ( Model, Cmd msg )
init flags =
    let
        model =
            Model flags
    in
    ( model, Cmd.none )


view : Model -> Html msg
view model =
    let
        totalDescription =
            E.paragraph [ E.width E.fill, E.spacing 45 ] <| [ titleLabel, mdFundDescription, fileLinks, contacts ]

        titleLabel =
            E.el [ F.size 24 ] <| E.text model.fundInfo.title

        oneLink file =
            E.link [ E.alignLeft, F.color C.darkBlue ] { url = downloadUrl file, label = E.text file.title }

        fileLinks =
            E.row [ E.width E.fill, E.spacing 10 ]
                [ E.el [ F.size 16, F.bold ] <| E.text "Files"
                , E.column
                    [ E.width E.fill
                    , E.spacing 16
                    ]
                    (List.map
                        oneLink
                     <|
                        withDefault [] model.fundInfo.files
                    )
                ]

        contacts =
            E.column
                [ E.width E.fill
                , E.spacing 16
                ]
                [ E.el [ F.size 16, F.semiBold ] <| E.text "Contacts"
                , E.text <| "E-mail: " ++ withDefault "" model.fundInfo.email
                , E.text <| "Address: " ++ withDefault "" model.fundInfo.address
                , E.text <| "Phone: " ++ withDefault "" model.fundInfo.phone
                ]

        mdFundDescription =
            E.html (Elm.Center.markdown <| withDefault "" model.fundInfo.description)
    in
    Elm.Skeleton.skeleton FundTab [ totalDescription ]


downloadUrl : FileInfo -> String
downloadUrl file =
    "/api/file/" ++ file.id ++ "/download"
\end{lstlisting}
\subsection{Elm/Main.elm}
\begin{lstlisting}
port module Elm.Main exposing (..)

import Browser
import Browser.Dom exposing (Element)
import Browser.Events as E
import Element as E
import Element.Events
import Element.Font as F
import Element.Region as R
import Elm.Skeleton exposing (charityTitle, container)
import Elm.Ui exposing (Link)
import Html exposing (..)
import Html.Attributes exposing (..)



-- MAIN


main : Program { width : Int, height : Int } Model Msg
main =
    Browser.element
        { init = \flags -> init flags
        , view = view
        , update = update
        , subscriptions = subscriptions
        }



-- MODEL


type alias Model =
    { window : { width : Int, height : Int }
    , title : String
    }


init : { width : Int, height : Int } -> ( Model, Cmd Msg )
init window =
    ( Model window "", Cmd.none )


port clickedUrl : String -> Cmd msg



-- UPDATE


type Msg
    = OnResize Int Int
    | Navigate String


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        OnResize width height ->
            ( { model | window = { width = width, height = height } }, Cmd.none )

        Navigate url ->
            ( model, clickedUrl url )



-- SUBSCRIPTIONS


subscriptions : Model -> Sub Msg
subscriptions model =
    Sub.batch
        [ E.onResize OnResize ]



-- VIEW


toplevel : List Link
toplevel =
    [ Link "FAQ" "fund:faq-index"
    , Link "Fund" "fund:description"

    ---, Link "News" "news:public"
    ]


view : Model -> Html Msg
view model =
    if model.window.width > 750 then
        viewMedium model

    else
        viewSmall model


viewMedium : Model -> Html Msg
viewMedium model =
    let
        viewFeature feature =
            E.column
                [ E.width E.fill
                , E.spacing 40
                ]
                [ featureText feature
                , featureImage feature
                ]
    in
    container <|
        E.column
            [ E.width (E.maximum 700 E.fill)
            , E.centerX
            , E.paddingXY 20 0
            , E.spacing 60
            ]
            [ E.row
                [ E.width E.fill
                , E.spaceEvenly
                , E.centerX
                , F.size 14
                , E.paddingXY 0 20
                ]
                [ charityTitle 30
                , E.row
                    [ E.width E.fill
                    , E.alignRight
                    , E.spacing 20
                    , R.navigation
                    ]
                    (List.map (\link -> Elm.Ui.link [ E.alignRight, Element.Events.onClick (Navigate link.url) ] link) toplevel)
                ]
            , E.row
                [ E.width E.fill ]
                [ E.el
                    [ E.width E.fill
                    , E.moveLeft 50
                    ]
                    (E.image [ E.width (E.maximum 400 E.fill) ] { src = "logo.svg", description = "Charity CRM logo" })
                , E.column
                    [ E.width E.fill
                    , E.centerX
                    , E.centerY
                    , E.spacing 40
                    ]
                    [ movingText model
                    , E.column
                        [ E.width E.fill
                        , E.centerX
                        , E.centerY
                        , E.spacing 25
                        ]
                        [ descriptionText model
                        , E.column
                            [ E.width E.fill
                            , E.centerX
                            , E.centerY
                            , E.spacing 15
                            ]
                            [ authButton
                            , smallDescriptionText
                            ]
                        ]
                    ]
                ]
            , E.column
                [ E.width E.fill
                , E.spacing 50
                , E.paddingEach { top = 0, bottom = 20, left = 0, right = 0 }
                , R.mainContent
                ]
              <|
                List.map viewFeature features
            , Elm.Skeleton.footer
            ]


viewSmall : Model -> Html Msg
viewSmall model =
    let
        viewFeature feature =
            E.column
                [ E.width E.fill
                , E.spacing 20
                ]
                [ featureText feature
                , featureImage feature
                ]
    in
    container <|
        E.column
            [ E.width (E.maximum 700 E.fill)
            , E.centerX
            , E.paddingXY 20 0
            , E.spacing 25
            ]
            [ E.row
                [ E.width E.fill
                , E.spaceEvenly
                , E.centerX
                , F.size 14
                , E.paddingXY 0 20
                , R.navigation
                ]
                (charityTitle 20 :: List.map (\link -> Elm.Ui.link [ E.paddingXY 5 0, F.size 13, Element.Events.onClick (Navigate link.url) ] link) toplevel)
            , E.row
                [ E.width E.fill ]
                [ E.el
                    [ E.width E.fill
                    , E.centerX
                    , E.centerY
                    , E.paddingXY 70 0
                    ]
                    (E.image [ E.width (E.maximum 300 E.fill) ] { src = "logo.svg", description = "Charity CRM logo" })
                ]
            , E.row
                [ E.width E.fill ]
                [ E.column
                    [ E.width E.fill
                    , E.centerX
                    , E.centerY
                    , E.spacing 40
                    ]
                    [ movingText model
                    , E.column
                        [ E.width E.fill
                        , E.centerX
                        , E.centerY
                        , E.spacing 25
                        ]
                        [ descriptionText model
                        , E.column
                            [ E.width E.fill
                            , E.centerX
                            , E.centerY
                            , E.spacing 15
                            ]
                            [ authButton
                            , smallDescriptionText
                            ]
                        ]
                    ]
                ]
            , E.column
                [ E.width E.fill
                , E.spacing 50
                , E.paddingEach { top = 0, bottom = 20, left = 0, right = 0 }
                , R.mainContent
                ]
              <|
                List.map viewFeature features
            , Elm.Skeleton.footer
            ]



-- VIEW HELPERS
-- CONTENT / INTRODUCTION


movingText : Model -> E.Element Msg
movingText model =
    E.textColumn
        [ E.alignTop
        , E.width E.fill
        ]
        [ E.paragraph
            [ F.size 30
            , F.center
            ]
            [ Elm.Ui.h1
                [ "CRM for automating "
                , "the Fund's business processes."
                ]
            ]
        ]


descriptionText model =
    E.textColumn
        [ E.alignTop
        , E.width E.fill
        ]
        [ E.paragraph [ F.center ]
            [ E.text "Our goal is to ensure transparency of actions. We strive to be open and honest about donations."
            ]
        ]


authButton : E.Element Msg
authButton =
    Elm.Ui.linkButton "Log in" [ Element.Events.onClick (Navigate "login:index") ]


smallDescriptionText : E.Element msg
smallDescriptionText =
    E.paragraph
        [ F.size 14, F.center ]
        [ E.text "or "
        , Elm.Ui.link [] (Link "open the mobile application" "https://play.google.com/store/apps/details?id=com.hse.charity")
        ]



--- FEATURE


type alias Feature msg =
    { title : String
    , description : List (E.Element msg)
    , image : E.Element msg
    }


featureImage : Feature Msg -> E.Element Msg
featureImage feature =
    E.el
        [ E.width E.fill ]
    <|
        E.el [ E.width E.fill ] <|
            feature.image


featureText : Feature msg -> E.Element msg
featureText feature =
    E.textColumn
        [ E.width E.fill
        , E.alignLeft
        , E.alignTop
        , E.spacing 15
        ]
        [ E.paragraph
            [ F.size 25
            , E.width E.fill
            ]
            [ Elm.Ui.h2 feature.title ]
        , E.paragraph
            [ F.size 16
            , E.width E.fill
            ]
            feature.description
        ]


features : List (Feature msg)
features =
    let
        paragraphLinked url label content =
            [ E.html <| Html.p [] (content ++ [ text " ", Html.a [ href url ] [ Html.text label ] ]) ]

        paragraph content =
            [ E.html <| Html.p [] content ]
    in
    [ { title = "CRM for your fund"
      , description = paragraph [ text "Managing the charity is a very complex process which includes not only working with donors and donees, but also controlling the staff and volunteers, preparing documentation for the authorities, etc. Consequently, non-profit organizations need a field specific platform to conduct all the information at one place. A CRM system for a Charity can provide all the benefits that businesses have used for years. It also would establish business processes, adjust time management and automate document circulation." ]
      , image = E.image [ E.width (E.maximum 400 E.fill), E.centerX ] { src = "architecture.jpg", description = "Charity CRM architecture" }
      }
    , { title = "Blockchain"
      , description = paragraphLinked "https://blockchaincharity.infostrategic.com" "Check transaction status." [ text "The blockchain is a way for donors, charities, and donees that don't trust each other to reach an agreement without the need for a trusted environment. Each party only needs to trust themselves, which is always the case. With the blockchain backing the system that the charity uses itself to track donations, you get additional reassurance that your donation was registered in a permanent unalterable distributed record. You now have a provable record of donation to a particular cause." ]
      , image = E.image [ E.width (E.maximum 400 E.fill), E.centerX ] { src = "blockchain.jpg", description = "Blockchain" }
      }
    , { title = "Android application"
      , description = paragraphLinked "https://play.google.com/store/apps/details?id=com.hse.charity" "Install now." [ text "The mobile application offers a solution that makes it quick and easy to seek help. The user can create a request for help and track status: from creation to publication. Donors also top up their personal wallet and send money to specific requests or directly send money to the foundation. Besides, there is communication with the fund’s employees for questions or issues from users." ]
      , image = E.image [ E.width (E.maximum 600 E.fill), E.centerX ] { src = "android.jpg", description = "Android" }
      }
    ]
\end{lstlisting}
\subsection{Elm/News.elm}
\begin{lstlisting}
module Elm.News exposing (..)

import Browser
import Element as E
import Element.Font as F
import Element.Region as R exposing (description)
import Elm.Skeleton exposing (Tab(..), container)
import Html exposing (Html, text)
import Http
import Json.Decode as Decode exposing (Decoder, field, list)
import Json.Decode.Field as Field



--- MAIN , mb make document instead


main : Program { baseUrl : String } Model Msg
main =
    Browser.element
        { init = \flags -> init flags
        , view = view
        , update = update
        , subscriptions = \_ -> Sub.none
        }


init : { baseUrl : String } -> ( Model, Cmd Msg )
init flags =
    ( { newsPageData = Nothing, error = Nothing, baseUrl = flags.baseUrl }
    , getNewsData flags.baseUrl
    )



--- MODEL


type alias News =
    { id : String
    , title : String
    , description : String
    , image_id : Maybe String
    }


type alias PageData =
    { page : Int
    , size : Int
    , totalElements : Int
    , totalPages : Int
    }


type alias NewsResponse =
    { data : List News
    , page : PageData
    }


type alias Model =
    { newsPageData : Maybe NewsResponse
    , error : Maybe String
    , baseUrl : String
    }



--- MSG


type Msg
    = OnNewsReceived (Result Http.Error NewsResponse)
    | OnRequestedNewsData


onePieceOfNewsDecoder : Decoder News
onePieceOfNewsDecoder =
    Field.require "id" Decode.string <|
        \id ->
            Field.require "title" Decode.string <|
                \title ->
                    Field.require "description" Decode.string <|
                        \description ->
                            Field.attempt "image_id" Decode.string <|
                                \image_id ->
                                    Decode.succeed
                                        { id = id
                                        , title = title
                                        , description = description
                                        , image_id = image_id
                                        }


pageDataDecoder : Decoder PageData
pageDataDecoder =
    Field.require "page" Decode.int <|
        \page ->
            Field.require "size" Decode.int <|
                \size ->
                    Field.require "totalElements" Decode.int <|
                        \totalElements ->
                            Field.require "totalPages" Decode.int <|
                                \totalPages ->
                                    Decode.succeed
                                        { page = page
                                        , size = size
                                        , totalPages = totalPages
                                        , totalElements = totalElements
                                        }


newsDataDecoder : Decoder NewsResponse
newsDataDecoder =
    Decode.map2 NewsResponse (field "data" (list onePieceOfNewsDecoder)) (field "page" pageDataDecoder)


getNewsData baseUrl =
    Http.get
        { url = baseUrl ++ "/api/news"
        , expect = Http.expectJson OnNewsReceived newsDataDecoder
        }


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        OnNewsReceived (Ok newsPageData) ->
            ( { model | newsPageData = Just newsPageData }, Cmd.none )

        OnNewsReceived (Err errorMessage) ->
            ( { model
                | error = Just "hello"
              }
            , Cmd.none
            )

        OnRequestedNewsData ->
            ( model, getNewsData model.baseUrl )



--- VIEW


view : Model -> Html Msg
view model =
    let
        news =
            E.column [ E.width E.fill, E.spacing 40 ] (viewNews model)
    in
    Elm.Skeleton.skeleton NewsTab [ news ]


imgUrl maybeImageId =
    case maybeImageId of
        Nothing ->
            "https://placeholder.pics/svg/300"

        Just imageId ->
            String.concat [ "/api/file/", imageId, "/download" ]


viewNews : Model -> List (E.Element Msg)
viewNews model =
    let
        oneStoryView story =
            E.row
                [ E.width E.fill, E.spacing 30 ]
                [ E.el [ E.width E.fill ]
                    (E.image [ E.width <| E.maximum 20 E.fill ] { src = imgUrl story.image_id, description = "" })
                , E.column
                    [ E.width E.fill
                    , E.alignTop
                    , E.spacing 20
                    ]
                    [ E.row [ E.width E.fill ] [ E.text story.title ]
                    , E.row [ E.width E.fill ] [ E.text story.description ]
                    ]
                ]
    in
    Maybe.withDefault [] (Maybe.map (\newsData -> List.map oneStoryView newsData.data) model.newsPageData)
\end{lstlisting}
\subsection{Elm/Skeleton.elm}
\begin{lstlisting}
module Elm.Skeleton exposing
    ( Author
    , Date
    , Tab(..)
    , charityTitle
    , container
    , evan
    ,  footer
       --

    , header
    , michael
    , skeleton
    )

-- import Browser.Events as E
-- import Element.Events
-- import Element.Region as R
-- import Elm.Colors as C

import Browser
import Browser.Dom exposing (Element)
import Dict
import Element as E
import Element.Events as Ev
import Element.Font as F
import Element.Region as R
import Elm.Colors as C
import Elm.Ui exposing (Link)
import Html exposing (..)
import Html.Attributes exposing (..)



-- SKELETON


skeleton : Tab -> List (E.Element msg) -> Html msg
skeleton tab content =
    container <|
        E.column
            [ E.width (E.maximum 700 E.fill)
            , E.centerX
            , E.paddingXY 20 0
            , E.spacing 60
            ]
            [ header tab
            , E.paragraph [ F.size 14, E.spacing 14 ] content -- E.spacing 14
            , footer
            ]



-- HEADER


type Tab
    = Applications
    | NewsTab
    | FAQ
    | FundTab
    | Other


charityTitle : Int -> E.Element msg
charityTitle size =
    E.el
        [ F.size size
        , E.alignTop
        , E.width E.fill

        -- , Ev.onClick (Navigate "index")
        ]
        (E.text "Charity CRM")


container : E.Element msg -> Html msg
container =
    E.layout
        [ E.width E.fill
        , F.family [ F.typeface "IBM Plex Sans", F.sansSerif ]
        ]


header : Tab -> E.Element msg
header tab =
    E.row
        [ E.width E.fill
        , E.spaceEvenly
        , E.centerX
        , F.size 14
        , E.paddingXY 0 20
        ]
        [ charityTitle 20
        , E.row
            [ E.width E.fill
            , E.alignRight
            , E.spacing 20
            , R.navigation
            ]
            (headerTabs tab)
        ]


headerTabs : Tab -> List (E.Element msg)
headerTabs tab =
    [ viewTab tab FAQ "FAQ" "/faq"
    , viewTab tab FundTab "Fund" "/fund/description"

    ---, viewTab tab NewsTab "News" "/news/public"
    ]


viewTab : Tab -> Tab -> String -> String -> E.Element msg
viewTab currentTab targetTab name link =
    let
        attrs =
            if currentTab == targetTab then
                [ E.alignRight, F.bold ]

            else
                [ E.alignRight, F.regular ]
    in
    E.link (F.color C.darkBlue :: attrs) { url = link, label = E.text name }



-- FOOTER


footer : E.Element msg
footer =
    E.row
        [ E.centerX
        , E.spacing 20
        , E.paddingEach { top = 20, bottom = 20, left = 0, right = 0 }
        , F.size 14
        , F.color C.darkGray
        , R.footer
        ]
    <|
        List.map Elm.Ui.grayLink sources
            ++ [ E.text "© 2021 Charity CRM" ]


sources : List Link
sources =
    [ Link "Facebook" "", Link "Instagram" "" ]



-- DOCS
-- HINT
-- NEWS
-- AUTHORS


type alias Author =
    { name : String
    , url : String
    }


evan : Author
evan =
    { name = "Evan Czaplicki"
    , url = "https://twitter.com/evancz"
    }


michael : Author
michael =
    { name = "Michael James"
    , url = "http://github.com/michaelbjames"
    }



-- DATES


type alias Date =
    { year : Int
    , month : Int
    , day : Int
    }


dateToString : Date -> String
dateToString date =
    case Dict.get date.month months of
        Nothing ->
            String.fromInt date.year

        Just month ->
            String.fromInt date.day ++ " " ++ month ++ " " ++ String.fromInt date.year


months : Dict.Dict Int String
months =
    Dict.fromList
        [ ( 1, "Jan" )
        , ( 2, "Feb" )
        , ( 3, "Mar" )
        , ( 4, "Apr" )
        , ( 5, "May" )
        , ( 6, "June" )
        , ( 7, "July" )
        , ( 8, "Aug" )
        , ( 9, "Sep" )
        , ( 10, "Oct" )
        , ( 11, "Nov" )
        , ( 12, "Dec" )
        ]
\end{lstlisting}
\subsection{Elm/Ui.elm}
\begin{lstlisting}
module Elm.Ui exposing (..)

import Element as E exposing (Attribute, Element)
import Element.Background as B
import Element.Border as Bo
import Element.Events
import Element.Font as F
import Elm.Colors as C
import Html
import Html.Attributes



--- LINK


type alias Link =
    { title : String
    , url : String
    }


link : List (Attribute msg) -> Link -> Element msg
link attrs config =
    E.el ([ F.color C.darkBlue, E.pointer ] ++ attrs) (E.text config.title)


grayLink : Link -> Element msg
grayLink config =
    E.link [ F.color C.darkGray ]
        { url = config.url
        , label = E.text config.title
        }



--- HEADINGS


h1 : List String -> E.Element msg
h1 contents =
    E.html <|
        Html.h1
            [ Html.Attributes.style "font-size" "inherit"
            , Html.Attributes.style "margin" "0"
            ]
            (List.map Html.text contents |> List.intersperse (Html.br [] []))


h2 : String -> E.Element msg
h2 content =
    E.html <|
        Html.h2
            [ Html.Attributes.style "font-size" "inherit"
            , Html.Attributes.style "margin" "0"
            ]
            [ Html.text content ]


linkButton : String -> List (Attribute msg) -> E.Element msg
linkButton label events =
    let
        styles =
            [ E.padding 10
            , E.width (E.maximum 400 E.fill)
            , E.centerX
            , F.center
            , B.color C.white
            , Bo.color C.blue
            , Bo.width 2
            , Bo.solid
            , Bo.shadow
                { offset = ( 5, 5 )
                , size = 1
                , blur = 0
                , color = C.blue
                }
            , E.mouseOver pressed
            , E.mouseDown pressed
            , E.focused pressed
            ]

        pressed =
            [ E.moveDown 3
            , E.moveRight 3
            , Bo.shadow
                { offset = ( 2, 2 )
                , size = 1
                , blur = 0
                , color = C.blue
                }
            ]
    in
    E.el (styles ++ events ++ [ E.htmlAttribute (Html.Attributes.class "special-button") ]) (E.text label)
\end{lstlisting}
\subsection{firebase.js}
\begin{lstlisting}
import { NotificationsFactory } from "@providers/axios";
import firebase from "firebase/app";

import "firebase/messaging";

const firebaseConfig = {
  apiKey: "AIzaSyCCK3Gf_2iQwMU3GTVWQKRptDsa4xIPQZ8",
  authDomain: "charity-crm.firebaseapp.com",
  projectId: "charity-crm",
  storageBucket: "charity-crm.appspot.com",
  messagingSenderId: "974936021523",
  appId: "1:974936021523:web:2c6905fc4788d5d5497de6",
  measurementId: "G-JCLFKD9DJ7",
};

firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();

export const getToken = () => {
  return messaging
    .getToken({
      vapidKey:
        "BIFR3ADLVPiWOp50nyFLwNyqSCiBMtSN6XNBtqSGlJiW0r3Qla3FrxzNZqCWKfVep5FFci1ZXietaHxHcuegHPg",
    })
    .then((currentToken) => {
      if (currentToken) {
        console.log("current token for client: ", currentToken);
        // Track the token -> client mapping, by sending to backend server
        // show on the UI that permission is secured
        return currentToken;
      } else {
        console.log(
          "No registration token available. Request permission to generate one.",
        );
        // shows on the UI that permission is required
      }
    })
    .catch((err) => {
      console.log("An error occurred while retrieving token. ", err);
      // catch error while creating client token
    });
};

export const onMessageListener = () =>
  new Promise((resolve) => {
    messaging.onMessage((payload) => {
      console.log("Received foreground message ", payload);
      resolve(payload);
    });
  });

export const onTokenExprired = () => {
  return messaging.onTokenExprired((token) => {
    console.log(`token expired ${token}`);

    getToken().then((maybeToken) => {
      sendTokenToServer(maybeToken);
    });
  });
};

export function sendTokenToServer(currentToken) {
  if (currentToken) {
    NotificationsFactory.apiNotificationsSetTokenPatch({
      id: currentToken,
    })
      .then(() => {
        console.log("Successfully sent token to server: " + currentToken);
      })
      .catch((e) => {
        console.error("Error sending token to server: " + e.message);
      });
  }
}
\end{lstlisting}
\subsection{Home/App/Content.jsx}
\begin{lstlisting}
import React from "react";
import QueueAnim from "rc-queue-anim";
import OverPack from "rc-scroll-anim/lib/ScrollOverPack";
import FAQView from "components/FAQ/View";

import { privacy_policy } from "./data";

export default function Page2() {
  return (
    <OverPack component="section" className="page-wrapper page2">
      <QueueAnim
        type="bottom"
        className="page text-left"
        leaveReverse
        key="page"
      >
        <div className="title">Charity Android App</div>
        <span key="line" className="separator" />
        <QueueAnim type="bottom" className="info-content" key="content">
          <FAQView text={privacy_policy} />
        </QueueAnim>
      </QueueAnim>
    </OverPack>
  );
}
\end{lstlisting}
\subsection{Home/App/data.ts}
\begin{lstlisting}
export const privacy_policy = `
**Privacy Policy**

Anna Mihaleva built the Charity app as a Free app. This SERVICE is provided by Anna Mihaleva at no cost and is intended for use as is.

This page is used to inform visitors regarding my policies with the collection, use, and disclosure of Personal Information if anyone decided to use my Service.

If you choose to use my Service, then you agree to the collection and use of information in relation to this policy. The Personal Information that I collect is used for providing and improving the Service. I will not use or share your information with anyone except as described in this Privacy Policy.

The terms used in this Privacy Policy have the same meanings as in our Terms and Conditions, which is accessible at Charity unless otherwise defined in this Privacy Policy.

**Information Collection and Use**

For a better experience, while using our Service, I may require you to provide us with certain personally identifiable information, including but not limited to email. The information that I request will be retained on your device and is not collected by me in any way.

The app does use third party services that may collect information used to identify you.

Link to privacy policy of third party service providers used by the app

*   [Google Play Services](https://www.google.com/policies/privacy/)

**Log Data**

I want to inform you that whenever you use my Service, in a case of an error in the app I collect data and information (through third party products) on your phone called Log Data. This Log Data may include information such as your device Internet Protocol (“IP”) address, device name, operating system version, the configuration of the app when utilizing my Service, the time and date of your use of the Service, and other statistics.

**Cookies**

Cookies are files with a small amount of data that are commonly used as anonymous unique identifiers. These are sent to your browser from the websites that you visit and are stored on your device's internal memory.

This Service does not use these “cookies” explicitly. However, the app may use third party code and libraries that use “cookies” to collect information and improve their services. You have the option to either accept or refuse these cookies and know when a cookie is being sent to your device. If you choose to refuse our cookies, you may not be able to use some portions of this Service.

**Service Providers**

I may employ third-party companies and individuals due to the following reasons:

*   To facilitate our Service;
*   To provide the Service on our behalf;
*   To perform Service-related services; or
*   To assist us in analyzing how our Service is used.

I want to inform users of this Service that these third parties have access to your Personal Information. The reason is to perform the tasks assigned to them on our behalf. However, they are obligated not to disclose or use the information for any other purpose.

**Security**

I value your trust in providing us your Personal Information, thus we are striving to use commercially acceptable means of protecting it. But remember that no method of transmission over the internet, or method of electronic storage is 100% secure and reliable, and I cannot guarantee its absolute security.

**Links to Other Sites**

This Service may contain links to other sites. If you click on a third-party link, you will be directed to that site. Note that these external sites are not operated by me. Therefore, I strongly advise you to review the Privacy Policy of these websites. I have no control over and assume no responsibility for the content, privacy policies, or practices of any third-party sites or services.

**Children’s Privacy**

These Services do not address anyone under the age of 13. I do not knowingly collect personally identifiable information from children under 13 years of age. In the case I discover that a child under 13 has provided me with personal information, I immediately delete this from our servers. If you are a parent or guardian and you are aware that your child has provided us with personal information, please contact me so that I will be able to do necessary actions.

**Changes to This Privacy Policy**

I may update our Privacy Policy from time to time. Thus, you are advised to review this page periodically for any changes. I will notify you of any changes by posting the new Privacy Policy on this page.

This policy is effective as of 2021-03-11

**Contact Us**

If you have any questions or suggestions about my Privacy Policy, do not hesitate to contact me at admihaleva@gmail.com.`;
\end{lstlisting}
\subsection{Home/App/index.jsx}
\begin{lstlisting}
import React from "react";
import DocumentTitle from "react-document-title";
import { enquireScreen } from "enquire-js";

import "../static/style";

import Footer from "../Footer";
import Header from "../Header";
import Content from "./Content";

let isMobile = false;
enquireScreen((b) => {
  isMobile = b;
});

class PrivacyPolicy extends React.PureComponent {
  state = {
    isMobile,
    showShadow: false,
  };

  componentDidMount() {
    enquireScreen((b) => {
      this.setState({
        isMobile: !!b,
      });
    });
  }
  navToShadow = (e) => {
    this.setState({ showShadow: e.mode === "leave" });
  };
  render() {
    return [
      <Header
        isMobile={isMobile}
        key="header"
        className={this.state.showShadow ? "header.show-shadow" : "header"}
      />,
      //<Banner key="banner" isMobile={this.state.isMobile} navToShadow={this.navToShadow} />,
      <Content key="content" />,
      <Footer key="footer" />,
      <DocumentTitle title="Charity App - Privacy Policy" />,
    ];
  }
}

export default PrivacyPolicy;
\end{lstlisting}
\subsection{Home/Banner.jsx}
\begin{lstlisting}
import React from "react";
import { i18n } from "@providers";
import PropTypes from "prop-types";
import QueueAnim from "rc-queue-anim";
import { Element } from "rc-scroll-anim";
import { withTranslation } from "react-i18next";

import BannerImage from "./BannerImage";
import { assets } from "./data";

class Banner extends React.PureComponent {
  static propTypes = {
    className: PropTypes.string,
    isMobile: PropTypes.bool,
    navToShadow: PropTypes.func,
  };
  static defaultProps = {
    className: "banner",
  };
  render() {
    const { className, isMobile, navToShadow } = this.props;

    return (
      <Element
        component="section"
        className={`${className}-wrapper page`}
        onChange={navToShadow}
      >
        <div className={className}>
          <div className={`${className}-img-wrapper`}>
            {isMobile ? (
              <img
                width="100%"
                src={`${assets}/image/home/intro-landscape-3a409.svg`}
                alt=""
              />
            ) : (
              <BannerImage />
            )}
          </div>
          <QueueAnim
            type={isMobile ? "bottom" : "right"}
            className={`${className}-text-wrapper`}
            delay={300}
          >
            <h1 key="h1">{i18n.t("Landing.title")}</h1>
            <p className="main-info" key="p">
              {i18n.t("Landing.description")}
            </p>
          </QueueAnim>
        </div>
      </Element>
    );
  }
}

export default withTranslation()(Banner);
\end{lstlisting}
\subsection{Home/BannerImage.jsx}
\begin{lstlisting}
import React from "react";
import TweenOne from "rc-tween-one";
import SvgDrawPlugin from "rc-tween-one/lib/plugin/SvgDrawPlugin";

TweenOne.plugins.push(SvgDrawPlugin);

let delay = 0;
function setAddDelay() {
  delay += 100;
  return delay;
}

const duration = 400;

const animate = {
  scale: {
    scale: 0,
    opacity: 0,
    type: "from",
    ease: "easeOutQuad",
    duration,
  },
  alpha: {
    opacity: 0,
    type: "from",
    ease: "easeOutQuad",
    duration,
  },
  y: {
    y: -30,
    opacity: 0,
    type: "from",
    ease: "easeOutQuad",
    duration,
  },
  yBig: {
    y: -120,
    opacity: 0,
    type: "from",
    ease: "easeOutQuad",
    duration,
  },
  draw: {
    style: { SVGDraw: 0 },
    type: "from",
    ease: "easeOutQuad",
  },
  loop: {
    yoyo: true,
    repeat: -1,
    duration: 2500,
  },
};

export default function BannerImage() {
  return (
    <svg viewBox="0 0 790 542" width="100%" height="100%">
      <defs>
        <linearGradient
          x1="90.6674592%"
          y1="40.4771205%"
          x2="17.4068727%"
          y2="55.2232143%"
          id="linearGradient-1"
        >
          <stop stopColor="#FCD63C" offset="0%" />
          <stop stopColor="#F8E71C" offset="100%" />
        </linearGradient>
        <linearGradient
          x1="80.2517361%"
          y1="55.2232146%"
          x2="22.7213542%"
          y2="31.2026515%"
          id="linearGradient-2"
        >
          <stop stopColor="#FCD63C" offset="0%" />
          <stop stopColor="#F8E71C" offset="100%" />
        </linearGradient>
        <polygon
          id="path-3"
          points="91.8584281 0 112 9.07599488 22.0196744 64 0 53.929429"
        />
        <linearGradient
          x1="91.6305611%"
          y1="50%"
          x2="19.6942478%"
          y2="44.9378714%"
          id="linearGradient-4"
        >
          <stop stopColor="#42C8FF" offset="0%" />
          <stop stopColor="#5DBEFF" offset="100%" />
        </linearGradient>
        <polygon
          id="path-5"
          points="0 54.0722421 126.438497 114 222 58.6430199 94.5116771 0"
        />
        <rect id="path-7" x="167" y="16" width="22" height="15" />
        <linearGradient
          x1="77.1642736%"
          y1="100%"
          x2="77.1642745%"
          y2="12.1688179%"
          id="linearGradient-8"
        >
          <stop stopColor="#FDF157" offset="0%" />
          <stop stopColor="#FADF2C" offset="100%" />
        </linearGradient>
        <polygon
          id="path-9"
          points="57.209613 0 0 32.4794101 79.15497 69 136 37.501598"
        />
        <polygon
          id="path-11"
          points="91.0578673 0 0 51.7787697 125.987266 110 216.464844 59.7851562"
        />
        <linearGradient
          x1="69.1189236%"
          y1="9.1796875%"
          x2="31.1352927%"
          y2="75.0473485%"
          id="linearGradient-13"
        >
          <stop stopColor="#FF6953" offset="0%" />
          <stop stopColor="#FF6852" offset="19.8620855%" />
          <stop stopColor="#FF543B" offset="100%" />
        </linearGradient>
      </defs>
      <g
        id="视觉稿"
        stroke="none"
        strokeWidth="1"
        fill="none"
        fillRule="evenodd"
      >
        <g id="首页" transform="translate(-68.000000, -88.000000)">
          <g id="Illustrator" transform="translate(68.000000, 88.000000)">
            <g id="i5" transform="translate(511.000000, 79.000000)">
              <TweenOne
                animation={[
                  { ...animate.alpha, delay: 200 },
                  { ...animate.loop, scale: 0.95 },
                ]}
                style={{ transformOrigin: "50%" }}
                component="g"
              >
                <polygon
                  id="Path-14"
                  fillOpacity="0.5"
                  fill="#EDEFF4"
                  points="0 103.723184 140.844089 170 279 91.4987247 136.718049 25"
                />
              </TweenOne>
              <TweenOne
                component="g"
                animation={{ ...animate.loop, y: -5, delay: duration + 200 }}
              >
                <TweenOne component="g" animation={{ ...animate.yBig }}>
                  <polygon
                    id="Path-14"
                    fill="#FFFFFF"
                    points="0 78.7231843 140.844089 145 279 66.4987247 136.718049 0"
                  />
                  <polygon
                    id="Path-32"
                    fill="#E0E1E8"
                    points="0 79 0 83.955908 141 150 141 145.042031"
                  />
                  <polygon
                    id="Path-32"
                    fill="#F0F1F6"
                    points="278.903503 66.7319336 278.903503 71.7208252 140.811768 150.478271 140.811768 145.487305"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: setAddDelay() + 200, ...animate.alpha }}
                >
                  <polygon
                    id="Path-27"
                    fill="#F0F1F6"
                    points="70.8965305 52.02283 121.978691 44 121.978691 60.3224153 177.222169 54.3844756 177.222169 76.2973489 236 70.4824116 197.045922 92.135411 164.907253 110 56 61.0358291"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay, ...animate.y }}
                  id="Group-25"
                  transform="translate(56.000000, 29.000000)"
                >
                  <polygon
                    id="Path-27"
                    fill="#DEC923"
                    points="14.8965305 18.02283 65.9786914 10 65.9786914 26.3224153 121.222169 20.3844756 121.222169 42.2973489 180 36.4824116 108.907253 76 0 27.0358291"
                  />
                  <polygon
                    id="Path-27"
                    fill="url(#linearGradient-1)"
                    points="14.8965305 13.02283 65.9786914 5 65.9786914 21.3224153 121.222169 15.3844756 121.222169 37.2973489 180 31.4824116 108.907253 71 0 22.0358291"
                  />
                  <polyline
                    id="Path-27"
                    points="19 7.94896696 70.1627859 0 70.1627859 16.1721413 125.493456 10.2888698 125.493456 32 182 26.2385985"
                  />
                  <polygon
                    id="Path-18"
                    fill="#DDC71E"
                    points="0.0529785156 22.0512695 0.0529785156 27.0438751 108.928711 75.9763184 108.928711 70.9331055"
                  />
                  <polygon
                    id="Path-18"
                    fill="#EEC239"
                    points="179.95105 31.4976807 179.95105 36.4902863 108.928711 75.9763184 108.928711 70.9331055"
                  />
                  <polygon
                    id="Path-27"
                    fill="url(#linearGradient-2)"
                    points="14.8965305 13.02283 65.9786914 5 65.9786914 21.3224153 121.222169 15.3844756 121.222169 37.2973489 180 31.4824116 108.907253 71 0 22.0358291"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 300, ...animate.alpha }}
                >
                  <polygon
                    id="Path-37"
                    fill="#F0F1F6"
                    points="44.1532869 67 41 69.0783298 147.984639 118 151 116.10171"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 100, ...animate.y }}
                  transform="translate(41.000000, 51.000000)"
                >
                  <polygon
                    id="Path-18"
                    fill="#E6B92C"
                    points="-7.10542736e-15 8 -7.10542736e-15 13.0245223 107 62 107 56.9245469"
                  />
                  <polygon
                    id="Path-18"
                    fill="#EEC239"
                    points="110 55 110 60.0869932 107 62 107 56.8596393"
                  />
                  <polygon
                    id="Path-37"
                    fill="#FADF2D"
                    points="3.15328687 6 0 8.07832981 106.984639 57 110 55.1017101"
                  />
                </TweenOne>
              </TweenOne>
            </g>
            <g id="i4" transform="translate(337.000000, 0.000000)">
              <TweenOne
                component="g"
                animation={[
                  { delay: setAddDelay() + 200, ...animate.alpha },
                  { ...animate.loop, scale: 1.05 },
                ]}
                style={{ transformOrigin: "50%" }}
              >
                <polygon
                  id="Path-22"
                  fillOpacity="0.5"
                  fill="#EDEFF4"
                  points="136.943579 25 0 104.057863 136.943579 168 279 92.3627973"
                />
              </TweenOne>
              <TweenOne
                component="g"
                animation={{
                  ...animate.loop,
                  y: 5,
                  delay: delay + duration + 200,
                }}
              >
                <TweenOne
                  component="g"
                  animation={{ delay, ...animate.yBig }}
                  id="Group-36"
                  transform="translate(6.000000, 0.000000)"
                >
                  <polygon
                    id="Path-22"
                    fill="#FFFFFF"
                    points="136.943579 0 0 79.057863 136.943579 143 279 67.3627973"
                  />
                  <polygon
                    id="Path-28"
                    fill="#E0E1E8"
                    points="0 79 0 83.3435449 136.927093 148 137 142.898501"
                  />
                  <polygon
                    id="Path-29"
                    fill="#F0F1F6"
                    points="278.94043 66.9602051 278.94043 72.1335449 137.096191 147.667969 137.173096 142.567932"
                  />
                </TweenOne>
                <g id="Group-7" transform="translate(46.000000, 18.000000)">
                  <TweenOne
                    component="g"
                    animation={{ delay: delay + 300, ...animate.y }}
                  >
                    <polygon
                      id="Path-23"
                      fill="#F0F1F6"
                      points="49.8130579 23 70 32.0671396 22.0692752 62 0 51.9392547"
                    />
                    <g id="Group-34" transform="translate(0.000000, 12.000000)">
                      <polygon
                        id="Path-23"
                        stroke="#FFC5BC"
                        strokeWidth="0.25"
                        fill="#FF543B"
                        points="49.8130579 0 70 9.06713957 22.0692752 39 0 28.9392547"
                      />
                      <polygon
                        id="Path-31"
                        fill="#F04B32"
                        points="22 38.9295726 22 44 70 14.0365205 70 9"
                      />
                      <polygon
                        id="Path-30"
                        fill="#DA4435"
                        points="0 29 0 33.9660046 22 44 22 38.9447747"
                      />
                    </g>
                  </TweenOne>
                  <TweenOne
                    component="g"
                    animation={{ delay: delay + 400, ...animate.y }}
                  >
                    <polygon
                      id="Path-23"
                      fill="#F0F1F6"
                      points="121.858428 11 142 20.0759949 52.0196744 75 30 64.929429"
                    />
                    <g id="Group-33" transform="translate(30.000000, 0.000000)">
                      <g id="Path-23">
                        <use
                          fill="#FF543B"
                          fillRule="evenodd"
                          xlinkHref="#path-3"
                        />
                        <path
                          stroke="#FF9C9C"
                          strokeWidth="0.25"
                          d="M91.8659889,0.140511459 L0.270387554,53.9156367 L22.0112507,63.858695 L111.732753,9.09267537 L91.8659889,0.140511459 Z"
                        />
                      </g>
                      <polygon
                        id="Path-31"
                        fill="#F04B32"
                        points="22 63.9244875 22 69 112 14.0415715 112 9"
                      />
                      <polygon
                        id="Path-30"
                        fill="#DA4435"
                        points="0 54 0 59.0783832 22 69 22 64.0640399"
                      />
                    </g>
                  </TweenOne>
                  <TweenOne
                    component="g"
                    animation={{ delay: delay + 500, ...animate.y }}
                  >
                    <polygon
                      id="Path-23"
                      fill="#F0F1F6"
                      points="109.813058 50 130 59.0671396 82.0692752 89 60 78.9392547"
                    />
                    <g
                      id="Group-30"
                      transform="translate(60.000000, 39.000000)"
                    >
                      <polygon
                        id="Path-23"
                        stroke="#FFC5BC"
                        strokeWidth="0.25"
                        fill="#FF543B"
                        points="49.8130579 0 70 9.06713957 22.0692752 39 0 28.9392547"
                      />
                      <polygon
                        id="Path-31"
                        fill="#F04B32"
                        points="22 38.9290247 22 44 70 14.0370647 70 9"
                      />
                      <polygon
                        id="Path-30"
                        fill="#DA4435"
                        points="0 29 0 34.0936125 22 44 22 39.0492377"
                      />
                    </g>
                  </TweenOne>
                  <TweenOne
                    component="g"
                    animation={{ delay: delay + 600, ...animate.y }}
                  >
                    <polygon
                      id="Path-24"
                      fill="#F0F1F6"
                      points="166 68.8416953 109.035994 102 90 93.4231661 148.446572 60"
                    />
                    <g id="Group-2" transform="translate(90.000000, 49.000000)">
                      <polygon
                        id="Path-24"
                        stroke="#FFCBB9"
                        strokeWidth="0.25"
                        fill="#FF543B"
                        points="76 8.84169526 19.0359941 42 0 33.4231661 58.4465721 0"
                      />
                      <polygon
                        id="Path-31"
                        fill="#F04B32"
                        points="19 41.9682164 19 47 76 13.9981351 76 9"
                      />
                      <polygon
                        id="Path-30"
                        fill="#DA4435"
                        points="0 33 0 38.2474325 19 47 19 41.8997316"
                      />
                    </g>
                  </TweenOne>
                </g>
              </TweenOne>
            </g>
            <g id="i3" transform="translate(0.000000, 45.000000)">
              <TweenOne
                component="g"
                animation={[
                  { delay: setAddDelay() + 200, ...animate.alpha },
                  { ...animate.loop, scale: 0.95 },
                ]}
                style={{ transformOrigin: "50%" }}
              >
                <polygon
                  id="Path-16"
                  fillOpacity="0.5"
                  fill="#EDEFF4"
                  points="0 153.669111 249.651516 268 455 148.765203 203.257796 35"
                />
              </TweenOne>
              <TweenOne
                component="g"
                animation={{
                  ...animate.loop,
                  y: -10,
                  delay: delay + duration + 200,
                }}
              >
                <TweenOne component="g" animation={{ delay, ...animate.yBig }}>
                  <polygon
                    id="Path-28"
                    fill="#E0E1E8"
                    points="0 119 0 123.956143 249 238 249 232.950015"
                  />
                  <polygon
                    id="Path-28"
                    fill="#EAEBF1"
                    points="454.692627 113.929932 454.692627 118.900635 249.470703 238.23584 249.470703 233.171018"
                  />
                  <polygon
                    id="Path-16"
                    fill="#FFFFFF"
                    points="0 118.669111 249.651516 233 455 113.765203 203.257796 0"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 400, ...animate.alpha }}
                  id="Group-18"
                  opacity="0.5"
                  transform="translate(69.000000, 72.000000)"
                >
                  <path
                    d="M46.5,33.5 L103.5,0.5"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <path
                    d="M54.5,36.5 L111.5,3.5"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <path
                    d="M62,40 L119,7"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <ellipse
                    id="Oval-3"
                    fill="#D4D5E2"
                    cx="20"
                    cy="42.5"
                    rx="20"
                    ry="10.5"
                  />
                  <path
                    d="M37,27 L81,1"
                    id="Line-4"
                    stroke="#F1F1F9"
                    strokeWidth="3"
                    strokeLinecap="round"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 500, ...animate.alpha }}
                  id="Group-38"
                  opacity="0.5"
                  transform="translate(119.000000, 92.000000)"
                >
                  <path
                    d="M37,27 L81,1"
                    id="Line-4"
                    stroke="#F1F1F9"
                    strokeWidth="3"
                    strokeLinecap="round"
                  />
                  <path
                    d="M46.5,33.5 L103.5,0.5"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <path
                    d="M54.5,36.5 L111.5,3.5"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <path
                    d="M62,40 L119,7"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <ellipse
                    id="Oval-3"
                    fill="#D8D9E0"
                    cx="20"
                    cy="42.5"
                    rx="20"
                    ry="10.5"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 500, ...animate.alpha }}
                  id="Group-18"
                  opacity="0.5"
                  transform="translate(174.000000, 27.000000)"
                >
                  <path
                    d="M51.5,50.5 L95.5,24.5"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeWidth="3"
                    strokeLinecap="round"
                  />
                  <path
                    d="M61.5,57.5 L118.5,24.5"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <path
                    d="M69.5,60.5 L126.5,27.5"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <path
                    d="M77,64 L134,31"
                    id="Line-4"
                    stroke="#E2E3F2"
                    strokeLinecap="round"
                  />
                  <g id="Group-39">
                    <polygon
                      id="Path-26"
                      fill="#DFDFDF"
                      opacity="0.5"
                      points="0 25.6995056 37.3061196 43 85 16.488809 46.3036387 0"
                    />
                    <polygon
                      id="Path-2"
                      fill="#FFFFFF"
                      points="27 20.8157119 43.756617 28 46 16"
                    />
                  </g>
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 600, ...animate.alpha }}
                >
                  <polygon
                    id="Path-17"
                    fill="#F0F1F6"
                    opacity="0.5"
                    points="175 137.072073 301.438497 197 397 141.642863 268.510726 82"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 200, ...animate.y }}
                  id="Group-37"
                  transform="translate(177.000000, 68.000000)"
                >
                  <polygon
                    id="Path-36"
                    fill="#56B9E9"
                    points="222 58.5712891 222 63.9607392 126 119 126 114.059163"
                  />
                  <polygon
                    id="Path-36"
                    fill="#4E99E2"
                    points="0 54 0 58.9917038 127 119 127 114.020161"
                  />
                  <g id="Group-32">
                    <mask id="mask-6" fill="white">
                      <use xlinkHref="#path-5" />
                    </mask>
                    <use
                      id="Mask"
                      fill="url(#linearGradient-4)"
                      xlinkHref="#path-5"
                    />
                    <g opacity="0.5" mask="url(#mask-6)">
                      <g transform="translate(-1.000000, -5.000000)">
                        <TweenOne
                          component="g"
                          animation={{ delay: delay + 900, ...animate.alpha }}
                          id="Group-28"
                        >
                          <polygon
                            id="Path-51"
                            fill="#63AFF9"
                            points="61.4814453 72.4892578 48.1523438 82.2763672 96.5068359 105.611328 102.546875 97.7265625 90.6376953 67.8359375"
                          />
                          <polygon
                            id="Path-52"
                            fill="#63AFF9"
                            points="93.9658203 67.5273438 127.579102 62.6025391 127.579102 102.199219 103.652344 97.6621094 89.9794922 67.5273438"
                          />
                          <polygon
                            id="Path-53"
                            fill="#63AFF9"
                            points="128.986328 62.2207031 161.228516 57.7226562 164.310547 113.430664 128.837891 105.356445"
                          />
                          <polygon
                            id="Path-49"
                            fill="#63AFF9"
                            points="83.8164062 30.5146484 44.0722656 43.9277344 61.0048828 72.0830078 102.643555 66.7998047"
                          />
                          <polygon
                            id="Path-54"
                            fill="#63AFF9"
                            points="160.619141 58.1230469 163.996094 99.8916016 225.474609 64.2128906 202.646484 51.8007812"
                          />
                          <polygon
                            id="Path-55"
                            fill="#63AFF9"
                            points="42.3789062 45.5957031 61.2958984 72.5957031 44.8369141 85.3925781 13.2382812 70.3076172"
                          />
                          <polygon
                            id="Path-56"
                            fill="#63AFF9"
                            points="37.5292969 37.0078125 41.3349609 44.4707031 75.4482422 33.8779297 80.4423828 9.03222656"
                          />
                          <polygon
                            id="Path-57"
                            fill="#63AFF9"
                            points="0.698242188 59.1328125 16.6074219 66.0722656 40.9335938 45.1464844 34.6982422 34.09375"
                          />
                          <polygon
                            id="Path-58"
                            fill="#63AFF9"
                            points="125.668945 16.7744141 76.0351562 34.2070312 81.5234375 8.16894531 97.7324219 0.0859375"
                          />
                          <polygon
                            id="Path-59"
                            stroke="#979797"
                            fill="#63AFF9"
                            points="101.885742 97.5800781 95.2314453 105.722656 129.585938 122.524414 146.84668 109.826172"
                          />
                          <polygon
                            id="Path-50"
                            fill="#63AFF9"
                            points="83.5800781 30.3320313 101.422852 65.90625 204.644531 52.9160156 125.508789 17.7236328"
                          />
                        </TweenOne>
                        <g
                          id="Group-31"
                          transform="translate(14.000000, 4.000000)"
                        >
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 550, ...animate.draw }}
                            d="M28.5,40.5 L117.5,11.5"
                            id="Line-15"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 750, ...animate.draw }}
                            d="M22.5,32.5 L47.5,68.5"
                            id="Line-16"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 700, ...animate.draw }}
                            d="M27.5,41.5 L0.5,64.5"
                            id="Line-17"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 650, ...animate.draw }}
                            d="M47.5,68.5 L28.5,82.5"
                            id="Line-18"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 550, ...animate.draw }}
                            d="M48.5,68.5 L190.5,48.5"
                            id="Line-19"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 600, ...animate.draw }}
                            d="M70.5,28.5 L87.5,60.5"
                            id="Line-20"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 500, ...animate.draw }}
                            d="M76.5,65.5 L88.5,93.5"
                            id="Line-21"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 700, ...animate.draw }}
                            d="M88.5,93.5 L78.5,106.5"
                            id="Line-22"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 650, ...animate.draw }}
                            d="M89.5,93.5 L134.5,105.5"
                            id="Line-23"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 600, ...animate.draw }}
                            d="M113.5,60.5 L113.5,97.5"
                            id="Line-24"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 550, ...animate.draw }}
                            d="M147.5,56.5 L150.5,104.5"
                            id="Line-25"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                          <TweenOne
                            component="path"
                            attr="attr"
                            animation={{ delay: delay + 500, ...animate.draw }}
                            d="M67.5,0.5 L61.5,27.5"
                            id="Line-14"
                            stroke="#7BD4FF"
                            strokeWidth="5"
                            strokeLinecap="square"
                          />
                        </g>
                      </g>
                    </g>
                  </g>
                </TweenOne>
                <g id="dian" transform="translate(286.000000, 69.000000)">
                  <TweenOne
                    component="g"
                    animation={{ delay: delay + 800, ...animate.alpha }}
                  >
                    <ellipse
                      id="Oval-17"
                      fillOpacity="0.300000012"
                      fill="#4E99E2"
                      cx="17.5"
                      cy="47"
                      rx="10.5"
                      ry="6"
                    />
                  </TweenOne>
                  <TweenOne
                    component="g"
                    animation={{
                      delay: delay + 600,
                      ...animate.yBig,
                      ease: "easeOutBounce",
                    }}
                  >
                    <path
                      d="M19.5,46 C7.83333333,34.5577829 2,25.4167573 2,18.5769231 C2,8.31717176 9.83501688,0 19.5,0 C29.1649831,0 37,8.31717176 37,18.5769231 C37,25.4167573 31.1666667,34.5577829 19.5,46 Z M19.5,26 C23.0898509,26 26,22.8659932 26,19 C26,15.1340068 23.0898509,12 19.5,12 C15.9101491,12 13,15.1340068 13,19 C13,22.8659932 15.9101491,26 19.5,26 Z"
                      id="Combined-Shape"
                      fill="#EEC239"
                    />
                    <polygon
                      id="Path-19"
                      fill="#EEC239"
                      points="19.6142578 45.9814453 17.5168457 46.9526367 17.5168457 44.3430176 21.046875 44.3430176"
                    />
                    <path
                      d="M17.5,47 C5.83333333,35.5577829 0,26.4167573 0,19.5769231 C0,9.31717176 7.83501688,1 17.5,1 C27.1649831,1 35,9.31717176 35,19.5769231 C35,26.4167573 29.1666667,35.5577829 17.5,47 Z M17.5,26 C21.0898509,26 24,22.8659932 24,19 C24,15.1340068 21.0898509,12 17.5,12 C13.9101491,12 11,15.1340068 11,19 C11,22.8659932 13.9101491,26 17.5,26 Z"
                      id="Combined-Shape"
                      fill="url(#linearGradient-8)"
                    />
                  </TweenOne>
                </g>
              </TweenOne>
            </g>
            <g id="i2" transform="translate(338.000000, 172.000000)">
              <TweenOne
                component="g"
                animation={[
                  { delay: setAddDelay() + 200, ...animate.alpha },
                  { ...animate.loop, scale: 1.05 },
                ]}
                style={{ transformOrigin: "50%" }}
              >
                <polygon
                  id="Path-25"
                  fillOpacity="0.5"
                  fill="#EDEFF4"
                  points="0 117.842753 150.402663 189 301 103.116396 147.052477 32"
                />
              </TweenOne>
              <TweenOne
                component="g"
                animation={{
                  ...animate.loop,
                  y: 10,
                  delay: delay + duration + 200,
                }}
              >
                <TweenOne component="g" animation={{ delay, ...animate.yBig }}>
                  <polygon
                    id="Path-25"
                    fill="#08C467"
                    points="0 90.8427532 150.402663 162 301 76.1163962 145.052477 6"
                  />
                  <polygon
                    id="Path-25"
                    fill="#0DE07A"
                    points="0 85.8427532 150.402663 157 301 71.1163962 147.052477 0"
                  />
                  <polygon
                    id="Path-4"
                    fill="#10CA6E"
                    points="0.0227050781 85.8400879 0.091796875 90.9919434 150.42627 162.224121 150.42627 157.058594"
                  />
                  <polygon
                    id="Path-4"
                    fill="#15D274"
                    points="301.055298 71.0273438 301.055298 76.2794189 150.42627 162.224121 150.42627 157.058594"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 500, ...animate.alpha }}
                  id="Group-20"
                  transform="translate(62.000000, 72.000000)"
                >
                  <polyline
                    id="Line-5"
                    stroke="#11D373"
                    strokeWidth="4"
                    strokeLinecap="square"
                    points="11.9264069 6.94366197 62.0995671 9.3943662 122.570177 21.7085167 178.973214 14.3260893"
                  />
                  <path
                    d="M121.320346,19.1971831 L85.952381,47.7887324"
                    id="Line-7"
                    stroke="#11D373"
                    strokeWidth="4"
                    strokeLinecap="square"
                  />
                  <ellipse
                    id="Oval-10"
                    fill="#11D373"
                    cx="11.9264069"
                    cy="6.94366197"
                    rx="11.9264069"
                    ry="6.94366197"
                  />
                  <ellipse
                    id="Oval-10"
                    fill="#11D373"
                    cx="178.073593"
                    cy="14.2957746"
                    rx="11.9264069"
                    ry="6.94366197"
                  />
                  <ellipse
                    id="Oval-10"
                    fill="#11D373"
                    cx="62.9220779"
                    cy="9.8028169"
                    rx="16.8614719"
                    ry="9.8028169"
                  />
                  <ellipse
                    id="Oval-10"
                    fill="#11D373"
                    cx="86.7748918"
                    cy="48.1971831"
                    rx="16.8614719"
                    ry="9.8028169"
                  />
                  <ellipse
                    id="Oval-10"
                    fill="#11D373"
                    cx="122.554113"
                    cy="21.6478873"
                    rx="20.5627706"
                    ry="11.8450704"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 300, ...animate.y }}
                  id="Group"
                  transform="translate(62.000000, 57.000000)"
                >
                  <g id="Group-20" transform="translate(0.000000, 3.000000)">
                    <polyline
                      id="Line-5"
                      stroke="#EEEFF2"
                      strokeWidth="4"
                      strokeLinecap="square"
                      points="11.9264069 6.94366197 62.0995671 9.3943662 122.570177 21.7085167 178.973214 14.3260893"
                    />
                    <path
                      d="M121.320346,19.1971831 L85.952381,47.7887324"
                      id="Line-7"
                      stroke="#EEEFF2"
                      strokeWidth="4"
                      strokeLinecap="square"
                    />
                    <ellipse
                      id="Oval-10"
                      stroke="#FFFFFF"
                      strokeWidth="0.25"
                      fill="#EEEFF2"
                      cx="11.9264069"
                      cy="6.94366197"
                      rx="11.9264069"
                      ry="6.94366197"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#EEEFF2"
                      cx="178.073593"
                      cy="14.2957746"
                      rx="11.9264069"
                      ry="6.94366197"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#EEEFF2"
                      cx="62.9220779"
                      cy="9.8028169"
                      rx="16.8614719"
                      ry="9.8028169"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#EEEFF2"
                      cx="86.7748918"
                      cy="48.1971831"
                      rx="16.8614719"
                      ry="9.8028169"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#EEEFF2"
                      cx="122.554113"
                      cy="21.6478873"
                      rx="20.5627706"
                      ry="11.8450704"
                    />
                  </g>
                  <g id="Group-20">
                    <polyline
                      id="Line-5"
                      stroke="#FFFFFF"
                      strokeWidth="4"
                      strokeLinecap="square"
                      points="11.9264069 6.94366197 62.0995671 9.3943662 122.570177 21.7085167 178.973214 14.3260893"
                    />
                    <path
                      d="M121.320346,19.1971831 L85.952381,47.7887324"
                      id="Line-7"
                      stroke="#FFFFFF"
                      strokeWidth="4"
                      strokeLinecap="square"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#FFFFFF"
                      cx="11.9264069"
                      cy="6.94366197"
                      rx="11.9264069"
                      ry="6.94366197"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#FFFFFF"
                      cx="178.073593"
                      cy="14.2957746"
                      rx="11.9264069"
                      ry="6.94366197"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#FFFFFF"
                      cx="62.9220779"
                      cy="9.8028169"
                      rx="16.8614719"
                      ry="9.8028169"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#FFFFFF"
                      cx="86.7748918"
                      cy="48.1971831"
                      rx="16.8614719"
                      ry="9.8028169"
                    />
                    <ellipse
                      id="Oval-10"
                      fill="#FFFFFF"
                      cx="122.554113"
                      cy="21.6478873"
                      rx="20.5627706"
                      ry="11.8450704"
                    />
                  </g>
                </TweenOne>
              </TweenOne>
            </g>
            <g id="i1" transform="translate(42.000000, 248.000000)">
              <TweenOne
                component="g"
                animation={[
                  { delay: setAddDelay() + 200, ...animate.alpha },
                  { ...animate.loop, scale: 0.95 },
                ]}
                style={{ transformOrigin: "50%" }}
              >
                <polygon
                  id="Path-25"
                  fillOpacity="0.5"
                  fill="#EDEFF4"
                  points="0 80.8066772 95.4382346 126 191 71.4536873 92.7352949 29"
                />
              </TweenOne>
              <TweenOne
                component="g"
                animation={{
                  ...animate.loop,
                  y: 15,
                  delay: delay + duration + 200,
                }}
              >
                <TweenOne
                  component="g"
                  animation={{ delay, ...animate.yBig }}
                  id="Group-21"
                  transform="translate(3.000000, 0.000000)"
                >
                  <polygon
                    id="Path-25"
                    fill="#FFFFFF"
                    points="0 51.8066772 95.4382346 97 191 42.4536873 92.7352949 0"
                  />
                  <polygon
                    id="Path-12"
                    fill="#E0E1E8"
                    points="0 52 0 55.4470108 95 101 95 97.5734492"
                  />
                  <polygon
                    id="Path-12"
                    fill="#F0F1F6"
                    points="191 42 190.977174 45.4486653 95 100 95 96.6078162"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 500, ...animate.alpha }}
                  id="Path-15"
                  opacity="0.5"
                  transform="translate(18.000000, 20.000000)"
                >
                  <mask id="mask-10" fill="white">
                    <use xlinkHref="#path-9" />
                  </mask>
                  <use id="Mask" fill="#F0F1F6" xlinkHref="#path-9" />
                  <polygon
                    fillOpacity="0.699999988"
                    fill="#DBDEF0"
                    mask="url(#mask-10)"
                    points="-6 28.5229773 57 25 54.2629176 62"
                  />
                  <polygon
                    fillOpacity="0.699999988"
                    fill="#DBDEF0"
                    mask="url(#mask-10)"
                    points="17 40.3799177 95 36 91.6112314 82"
                  />
                </TweenOne>
                <TweenOne
                  component="path"
                  attr="attr"
                  animation={{ delay: delay + 400, ...animate.draw }}
                  d="M96.4384615,10.4354839 L152.561538,36.5645161"
                  id="Line-3"
                  strokeOpacity="0.6"
                  stroke="#DDDEF0"
                  strokeWidth="3"
                  strokeLinecap="round"
                />
                <TweenOne
                  component="path"
                  attr="attr"
                  animation={{ delay: delay + 350, ...animate.draw }}
                  d="M89.4411765,13.4390244 L163.558824,48.5609756"
                  id="Line-3"
                  strokeOpacity="0.7"
                  stroke="#DDDEF0"
                  strokeLinecap="square"
                />
                <TweenOne
                  component="path"
                  attr="attr"
                  animation={{ delay: delay + 300, ...animate.draw }}
                  d="M84.4411765,17.4390244 L158.558824,52.5609756"
                  id="Line-3"
                  strokeOpacity="0.7"
                  stroke="#DDDEF0"
                  strokeLinecap="square"
                />
              </TweenOne>
            </g>
            <g id="i0" transform="translate(50.000000, 276.000000)">
              <TweenOne
                component="g"
                animation={[
                  { delay: setAddDelay() + 200, ...animate.alpha },
                  { ...animate.loop, scale: 1.05 },
                ]}
                style={{ transformOrigin: "50%" }}
              >
                <polygon
                  id="Mask"
                  fillOpacity="0.5"
                  fill="#EDEFF4"
                  points="254.649163 28 0 173.547621 197.249405 266 452 118.848173"
                />
              </TweenOne>
              <TweenOne
                component="g"
                animation={{
                  ...animate.loop,
                  y: -15,
                  delay: delay + duration + 200,
                }}
              >
                <TweenOne
                  component="g"
                  animation={{ delay, ...animate.yBig }}
                  id="Group-16"
                >
                  <polygon
                    id="Mask"
                    fill="#FFFFFF"
                    points="254.649163 0 0 145.547621 197.249405 238 452 90.8481731"
                  />
                  <polygon
                    id="Path-28"
                    fill="#E0E1E8"
                    points="0.122802734 145.555664 0.122802734 150.526367 197.268311 243.09656 197.268311 238.031738"
                  />
                  <polygon
                    id="Path-28"
                    fill="#F0F1F6"
                    points="451.993408 90.8466492 451.993408 95.8173523 197.145508 243.540896 197.145508 238.476074"
                  />
                </TweenOne>
                <TweenOne
                  component="g"
                  animation={{ delay: delay + 300, ...animate.alpha }}
                  id="Path-15"
                  opacity="0.5"
                  transform="translate(167.000000, 20.000000)"
                >
                  <mask id="mask-12" fill="white">
                    <use xlinkHref="#path-11" />
                  </mask>
                  <use id="Mask" fill="#F0F1F6" xlinkHref="#path-11" />
                  <polygon
                    fillOpacity="0.699999988"
                    fill="#DBDEF0"
                    mask="url(#mask-12)"
                    points="-10 45.6177205 91 40 86.6119791 99"
                  />
                  <polygon
                    fillOpacity="0.699999988"
                    fill="#DBDEF0"
                    mask="url(#mask-12)"
                    points="27 63.9507389 152 57 146.569281 130"
                  />
                </TweenOne>
                <g
                  id="Group-14"
                  opacity="0.5"
                  transform="translate(131.000000, 88.000000)"
                >
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 300, ...animate.draw }}
                    d="M49.5,17.5 L113.5,47.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeWidth="3"
                    strokeLinecap="round"
                  />
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 350, ...animate.draw }}
                    d="M41.5,23.5 L125.5,63.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeLinecap="square"
                  />
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 400, ...animate.draw }}
                    d="M35.5,27.5 L119.5,67.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeLinecap="square"
                  />
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 450, ...animate.draw }}
                    d="M28.5,31.5 L112.5,71.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeLinecap="square"
                  />
                  <TweenOne
                    component="g"
                    animation={{ delay: delay + 250, ...animate.alpha }}
                  >
                    <ellipse
                      id="Oval-3"
                      fill="#D5D6E2"
                      cx="20"
                      cy="10.5"
                      rx="20"
                      ry="10.5"
                    />
                  </TweenOne>
                </g>
                <g id="Group-35" transform="translate(92.000000, 109.000000)">
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 400, ...animate.draw }}
                    d="M49.5,17.5 L113.5,47.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeWidth="3"
                    opacity="0.5"
                    strokeLinecap="round"
                  />
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 450, ...animate.draw }}
                    d="M41.5,23.5 L125.5,63.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeLinecap="square"
                  />
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 500, ...animate.draw }}
                    d="M35.5,27.5 L119.5,67.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeLinecap="square"
                  />
                  <TweenOne
                    component="path"
                    attr="attr"
                    animation={{ delay: delay + 550, ...animate.draw }}
                    d="M28.5,31.5 L112.5,71.5"
                    id="Line-3"
                    stroke="#DDDEF0"
                    strokeLinecap="square"
                  />
                  <TweenOne
                    component="g"
                    animation={{ delay: delay + 300, ...animate.alpha }}
                  >
                    <ellipse
                      id="Oval-3"
                      fill="#D5D6E2"
                      opacity="0.5"
                      cx="20"
                      cy="10.5"
                      rx="20"
                      ry="10.5"
                    />
                  </TweenOne>
                </g>
              </TweenOne>
            </g>
            <g id="bin" transform="translate(350.000000, 355.000000)">
              <TweenOne
                component="g"
                animation={[
                  { delay: setAddDelay() + 200, ...animate.alpha },
                  { ...animate.loop, scale: 0.9 },
                ]}
                style={{ transformOrigin: "50%" }}
              >
                <path
                  d="M64,137 C29.2060608,137 1,122.225397 1,104 C1,85.7746033 29.2060608,71 64,71 C98.7939392,71 127,85.7746033 127,104 C127,122.225397 98.7939392,137 64,137 Z M64.5,119 C81.8969696,119 96,111.612698 96,102.5 C96,93.3873016 81.8969696,86 64.5,86 C47.1030304,86 33,93.3873016 33,102.5 C33,111.612698 47.1030304,119 64.5,119 Z"
                  id="Combined-Shape"
                  fillOpacity="0.800000012"
                  fill="#F0F1F6"
                />
              </TweenOne>
              <TweenOne
                component="g"
                animation={[
                  { delay, ...animate.yBig },
                  { delay: 200, ...animate.loop, y: 20 },
                ]}
                id="Group-23"
              >
                <path
                  d="M125.979738,38.9931641 C125.979739,38.9954427 125.97974,38.9977213 125.97974,39 C125.97974,57.2253967 97.7782143,72 62.9898698,72 C28.2015253,72 0,57.2253967 0,39 C0,38.6593581 0.00985178088,38.3199217 0.0294142148,37.9817647 L0.0294142148,33.0008545 L0.648899464,34.2455932 C5.0481821,18.272914 31.2832684,6 62.9898698,6 C94.9239937,6 121.307795,18.4496836 125.422167,34.5900152 L126,32.9699707 L126,38.9931641 L125.979738,38.9931641 Z M63.4897894,54 C80.8839616,54 94.9847243,46.6126984 94.9847243,37.5 C94.9847243,28.3873016 80.8839616,21 63.4897894,21 C46.0956172,21 31.9948545,28.3873016 31.9948545,37.5 C31.9948545,46.6126984 46.0956172,54 63.4897894,54 Z"
                  id="Combined-Shape"
                  fill="#C13B2A"
                />
                <path
                  d="M124.226999,47 C125.372738,44.478525 125.979674,41.845869 125.979674,39.1381224 C125.979674,39.135811 125.979674,39.1334996 125.979673,39.1311882 L126,39.1311882 L126,33.0214471 L125.420301,34.6647701 C123.353196,26.465651 115.683011,19.2054248 104.516383,14 L93.4437125,20.5001471 L91.6580825,17.8363715 L85.0098181,19.4046688 L85.0098181,25.4512159 L85,25.4569796 C85.0032734,25.4586202 85.0065461,25.4602612 85.0098181,25.4619025 L85.0098181,25.4796154 L85.0418143,25.4779747 C91.1044231,28.5276014 94.884565,32.8382443 94.884565,37.6165688 C94.884565,39.4507033 94.3276112,41.2159311 93.2984037,42.8673856 L117.125526,46.0888287 C116.563459,44.9661227 116.296338,44.3602049 116.324165,44.2710752 C116.362449,44.1484478 117.884071,42.4016783 120.88903,39.0307667 L124.226999,40.968494 L124.226999,47 Z"
                  id="Combined-Shape"
                  fill="#4BD4B5"
                />
                <path
                  d="M63,66 C28.2060608,66 0,51.2253967 0,33 C0,14.7746033 28.2060608,0 63,0 C97.7939392,0 126,14.7746033 126,33 C126,51.2253967 97.7939392,66 63,66 Z M63.5,48 C80.8969696,48 95,40.6126984 95,31.5 C95,22.3873016 80.8969696,15 63.5,15 C46.1030304,15 32,22.3873016 32,31.5 C32,40.6126984 46.1030304,48 63.5,48 Z"
                  id="Combined-Shape"
                  fill="url(#linearGradient-13)"
                />
                <path
                  d="M104.526063,8 C117.692166,14.1258956 126,23.101517 126,33.1030459 C126,35.8235013 125.385335,38.4680539 124.225427,41 L93.3025197,36.8271054 C94.3322377,35.1779552 94.8894677,33.4151905 94.8894677,31.5836153 C94.8894677,26.8009977 91.0900562,22.4875571 85,19.4409931 L104.526063,8 Z"
                  id="Combined-Shape"
                  fill="#50DFE3"
                />
              </TweenOne>
            </g>
          </g>
        </g>
      </g>
    </svg>
  );
}
\end{lstlisting}
\subsection{Home/data.js}
\begin{lstlisting}
export const assets = "https://gw.alipayobjects.com/os/s/prod/antv/assets";
export const base = "https://antv.alipay.com/";
\end{lstlisting}
\subsection{Home/FAQ/index.jsx}
\begin{lstlisting}
import React from "react";
import DocumentTitle from "react-document-title";
import { enquireScreen } from "enquire-js";

import "../static/style";

import Footer from "../Footer";
import Header from "../Header";
import Page2 from "./Page2";

let isMobile = false;
enquireScreen((b) => {
  isMobile = b;
});

class FAQ extends React.PureComponent {
  state = {
    isMobile,
    showShadow: false,
  };

  componentDidMount() {
    enquireScreen((b) => {
      this.setState({
        isMobile: !!b,
      });
    });
  }
  navToShadow = (e) => {
    this.setState({ showShadow: e.mode === "leave" });
  };
  render() {
    return [
      <Header
        isMobile={isMobile}
        key="header"
        className={this.state.showShadow ? "header.show-shadow" : "header"}
      />,
      //<Banner key="banner" isMobile={this.state.isMobile} navToShadow={this.navToShadow} />,
      <Page2 key="page2" />,
      <Footer key="footer" />,
      <DocumentTitle title="Charity CRM - FAQ" />,
    ];
  }
}

export default FAQ;
\end{lstlisting}
\subsection{Home/FAQ/Page2.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import useAxios, { CharityFactory } from "@providers/axios";
import QueueAnim from "rc-queue-anim";
import OverPack from "rc-scroll-anim/lib/ScrollOverPack";

import FAQView from "components/FAQ/View";

const Page2: FC = () => {
  const { data } = useAxios(CharityFactory.apiCharityFaqGet, false);

  return (
    <OverPack component="section" className="page-wrapper page2">
      <QueueAnim
        type="bottom"
        className="page text-center"
        leaveReverse
        key="page"
      >
        <div className="title">FAQ</div>
        <span key="line" className="separator" />
        <QueueAnim type="bottom" className="info-content" key="content">
          <FAQView text={data?.faq ?? ""} />
        </QueueAnim>
      </QueueAnim>
    </OverPack>
  );
};

export default Page2;
\end{lstlisting}
\subsection{Home/Footer.jsx}
\begin{lstlisting}
import React from "react";
import { Col, Row } from "antd";
import { i18n } from "@providers";
import { Link } from "@curi/react-dom";

const border = {
  lineHeight: "16px",
  paddingRight: 12,
  marginRight: 11,
  borderRight: "1px solid rgba(255, 255, 255, 0.55)",
};

function Footer() {
  return (
    <footer id="footer" className="dark">
      <Row className="bottom-bar">
        <Col lg={6} sm={24} />
        <Col lg={18} sm={24}>
          <span style={border}>
            <Link name="app:privacy-policy">
              {i18n.t("Landing.footer.app")}
            </Link>
          </span>
          <span style={{ marginRight: 24 }}>
            <Link name="fund:faq-index">{i18n.t("Landing.footer.faq")}</Link>
          </span>
          <span style={{ marginRight: 12 }}>Copyright © Charity CRM </span>
        </Col>
      </Row>
    </footer>
  );
}

export default Footer;
\end{lstlisting}
\subsection{Home/Header.tsx}
\begin{lstlisting}
import React, { FC, useState } from "react";
import { Button, Select, Space } from "antd";
import { LoginOutlined } from "@ant-design/icons";
import { Link } from "@curi/react-dom";
import { i18n, router } from "@providers";

const Header: FC<{ isMobile: boolean }> = (props) => {
  const { isMobile } = props;

  const [lang, setLang] = useState(
    i18n.language.substr(0, 2) === "ru" ? "ru" : "en",
  );

  return (
    <header {...props}>
      <div className="logo-wrapper">
        <Link name="home">
          <i className="logo" /> {!isMobile && <span>Charity CRM</span>}
        </Link>
      </div>
      <div className="buttons">
        <Space>
          <div className="auth">
            <Select
              onChange={(value) => {
                i18n.changeLanguage(value);
                setLang(value);
              }}
              value={lang}
              style={{ width: isMobile ? 80 : 120, margin: "0 8px" }}
            >
              <Select.Option value="ru">
                {isMobile ? "🇷🇺" : i18n.t("Landing.languageSetting.ru")}
              </Select.Option>
              <Select.Option value="en">
                {isMobile ? "🇺🇸" : i18n.t("Landing.languageSetting.eng")}
              </Select.Option>
            </Select>
          </div>

          <div className="auth">
            <Button
              onClick={() => {
                router.navigate({ url: router.url({ name: "login:index" }) });
              }}
              icon={isMobile ? <LoginOutlined /> : undefined}
            >
              {!isMobile && i18n.t("Landing.login")}
            </Button>
          </div>
        </Space>
      </div>
    </header>
  );
};

export default Header;
\end{lstlisting}
\subsection{Home/index.jsx}
\begin{lstlisting}
import React from "react";
import DocumentTitle from "react-document-title";
import { enquireScreen } from "enquire-js";
import { withTranslation } from "react-i18next";

import "./static/style";

import Banner from "./Banner";
import Footer from "./Footer";
import Header from "./Header";
import Page1 from "./Page1";
import Page2 from "./Page2";

let isMobile = false;
enquireScreen((b) => {
  isMobile = b;
});

class Home extends React.PureComponent {
  state = {
    isMobile,
    showShadow: false,
  };

  componentDidMount() {
    enquireScreen((b) => {
      this.setState({
        isMobile: !!b,
      });
    });
  }
  navToShadow = (e) => {
    this.setState({ showShadow: e.mode === "leave" });
  };
  render() {
    return [
      <Header
        key="header"
        isMobile={this.state.isMobile}
        className={this.state.showShadow ? "header.show-shadow" : "header"}
      />,
      <Banner
        key="banner"
        isMobile={this.state.isMobile}
        navToShadow={this.navToShadow}
      />,
      <Page1 key="page1" />,
      <Page2 key="page2" />,
      <Footer key="footer" />,
      <DocumentTitle title="Charity CRM" />,
    ];
  }
}
export default withTranslation()(Home);
\end{lstlisting}
\subsection{Home/Page1.jsx}
\begin{lstlisting}
import React from "react";
import { Col, Row } from "antd";
import { i18n } from "@providers";
import QueueAnim from "rc-queue-anim";

import { assets } from "./data";

export default function Page1() {
  const page1 = [
    {
      img: `${assets}/image/icon/g2-c94ef.svg`,
      title: i18n.t("Landing.data.fund"),
      description: i18n.t("Landing.data.fDescription"),
    },
    {
      img: `${assets}/image/icon/g6-b4554.svg`,
      title: i18n.t("Landing.data.transactions"),
      description: i18n.t("Landing.data.tDescription"),
    },
    {
      img: `${assets}/image/icon/f2-d360c.svg`,
      title: i18n.t("Landing.data.donee"),
      description: i18n.t("Landing.data.dDescription"),
    },
  ];

  const children = page1.map((card, i) => (
    <Col className="card-wrapper" key={i.toString()} md={8} xs={24}>
      <a className="card" href={card.href}>
        <h3>{card.title}</h3>
        <img src={card.img} alt="" className="card-img-top" />
        <div className="card-body">
          <span className="description text-secondary">{card.description}</span>
        </div>
      </a>
    </Col>
  ));

  return (
    <section className="page-wrapper page1">
      <QueueAnim
        component={Row}
        type="bottom"
        className="page row text-center"
        delay={500}
      >
        {children}
      </QueueAnim>
    </section>
  );
}
\end{lstlisting}
\subsection{Home/Page2.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Button } from "antd";
import { i18n } from "@providers";
import QueueAnim from "rc-queue-anim";
import OverPack from "rc-scroll-anim/lib/ScrollOverPack";

const Page2: FC = () => {
  return (
    <OverPack
      component="section"
      className="page-wrapper page2"
      style={{ backgroundColor: "#fff" }}
    >
      <QueueAnim
        type="bottom"
        className="page text-center"
        leaveReverse
        key="page"
      >
        <h2 key="title">{i18n.t("Landing.blockchain.title")}</h2>
        <span key="line" className="separator" />
        <QueueAnim type="bottom" className="info-content" key="content">
          <p className="main-info" key="1">
            {i18n.t("Landing.blockchain.description_1")}
          </p>
          <p className="main-info" key="2">
            {i18n.t("Landing.blockchain.description_2")}
          </p>
          <Button href="http://blockchaincharity.infostrategic.com" type="link">
            {i18n.t("Landing.blockchain.button")}
          </Button>
        </QueueAnim>
      </QueueAnim>
    </OverPack>
  );
};

export default Page2;
\end{lstlisting}
\subsection{Home/static/custom.less}
\begin{lstlisting}
body {
  // overflow: hidden;
}

.text-center {
  text-align: center !important;
}
\end{lstlisting}
\subsection{Home/static/default.less}
\begin{lstlisting}
@import "~antd/lib/style/themes/default.less";
@site-heading-color: #0d1a26;
@site-text-color: #314659;
@site-text-color-secondary: #697b8c;
@site-border-color-split: #ebedf0;
@border-color: rgba(229, 231, 235, 100);
@padding-space: 114px;
\end{lstlisting}
\subsection{Home/static/footer.less}
\begin{lstlisting}
@import "./default";

footer.dark {
  background-color: #000;
  color: rgba(255, 255, 255, 0.65);
  a {
    color: #fff;
  }
  h2 {
    color: rgba(255, 255, 255, 1);
    & > span {
      color: rgba(255, 255, 255, 1);
    }
  }
  .bottom-bar {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    overflow: hidden;
  }
}

footer {
  border-top: 1px solid @border-color;
  clear: both;
  font-size: 12px;
  background: #fff;
  position: relative;
  z-index: 100;
  color: @site-text-color;
  box-shadow: 0 1000px 0 1000px #fff;
  .ant-row {
    text-align: center;
    .footer-center {
      display: inline-block;
      text-align: left;
      > h2 {
        font-size: 14px;
        margin: 0 auto 24px;
        font-weight: 500;
        position: relative;
        > .anticon {
          font-size: 16px;
          position: absolute;
          left: -22px;
          top: 3px;
          color: #aaa;
        }
      }
      > div {
        margin: 12px 0;
      }
    }
  }
  .footer-wrap {
    position: relative;
    padding: 86px @padding-space 70px @padding-space;
  }
  .bottom-bar {
    border-top: 1px solid @border-color;
    text-align: right;
    padding: 20px @padding-space;
    margin: 0;
    line-height: 24px;
    a {
      color: rgba(255, 255, 255, 0.65);
      &:hover {
        color: #fff;
      }
    }
    .translate-button {
      text-align: left;
      width: 200px;
      margin: 0 auto;
    }
  }
  .footer-logo {
    position: relative;
    top: -2px;
  }
  .footer-flag {
    position: relative;
    top: -4px;
    margin-right: 8px;
  }
}
\end{lstlisting}
\subsection{Home/static/header.less}
\begin{lstlisting}
.header {
  position: fixed;
  z-index: 1000;
  height: 64px;
  padding: 0 32px;
  width: 100%;
  background: #f8fafe;
  transition: box-shadow 0.3s ease-out, background 0.3s ease-out;
  &.show-shadow {
    background: #fdfdfd;
    box-shadow: 0 2px 8px rgba(229, 229, 229, 0.5);
  }
  .logo {
    background: url("../../icons/logo.svg") no-repeat center;
    display: inline-block;
    width: 40px;
    height: 64px;
    &-wrapper {
      display: inline-block;
      height: 100%;
      line-height: 64px;
      span {
        line-height: 64px;
        font-size: 20px;
        margin-right: 18px;
        white-space: nowrap;
        color: rgba(0, 0, 0, 0.9);
        display: inline-block;
        vertical-align: top;
      }
    }
  }
}

.buttons {
  float: right;

  .auth {
    height: 100%;
    line-height: 64px;
    .ant-btn {
      border-radius: 32px;
      font-size: 14px;
      //line-height: 32px;
      height: 32px;
    }
  }
}
\end{lstlisting}
\subsection{Home/static/home.less}
\begin{lstlisting}
@import "./default.less";
@import "./custom.less";
#reat-content {
  font-family: Helvetica Neue For Number, -apple-system, BlinkMacSystemFont,
    Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, Microsoft YaHei,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.intro .header {
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
}

h2,
h3,
h4,
h5,
h6 {
  font-weight: 400;
}

.btn {
  transition: all 0.3s @ease-out;
}

.page-wrapper {
  width: 100%;
  padding: 0;
  overflow: hidden;
  .page {
    width: 90%;
    max-width: 1200px;
    margin: auto;
    position: relative;
    h2 {
      margin-bottom: 30px;
      font-size: 2rem;
    }
    .separator {
      margin-bottom: 65px;
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 60px;
      height: 5px;
      background: #1890ff;
      border-radius: 2.5px;
    }
  }
}

.card {
  text-decoration: none;
  .title,
  .description {
    color: rgba(0, 0, 0, 0.65) !important;
    font-size: 14px;
    font-weight: 300;
  }
}

.card:hover {
  .title {
    color: rgba(0, 0, 0, 0.65) !important;
  }
}

.features img {
  margin-top: 0 !important;
}

.page {
  h2,
  h4,
  h5,
  span,
  p,
  a,
  .feature,
  .card-wrapper,
  .main-info,
  .detail {
    will-change: transform;
  }
  .main-info {
    line-height: 36px;
  }
}

.banner {
  height: 100%;
  max-width: 1500px;
  margin: auto;
  position: relative;
  svg {
    display: block;
    margin-left: -30px;
    padding-top: 20px;
  }
  &-wrapper {
    background: #f8fafe;
    padding-top: 64px;
    height: 620px;
    overflow: hidden;
  }
  > div {
    display: inline-block;
  }
  &-img-wrapper {
    width: 60%;
    height: 100%;
  }
  &-text-wrapper {
    width: 40%;
    padding-right: 114px;
    height: 265px;
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    h1 {
      font-size: 46px;
    }
    p {
      font-size: 16px;
      margin: 50px 0 60px;
      font-weight: 300;
    }
    a {
      display: inline-block;
      .ant-btn {
        height: 40px;
        font-size: 16px;
        border-radius: 20px;
        padding: 10px 24px;
        &:hover {
          box-shadow: 0 4px 12px rgba(24, 144, 255, 0.4);
          transform: translateY(-4px);
        }
      }
    }
  }
}

.page1 {
  background: #f8fafe;
  padding-bottom: 100px;
  overflow: initial;
  min-height: 372px;
  .card {
    transition: transform 0.3s @ease-out, box-shadow 0.3s @ease-out;
    position: relative;
    color: #868e96;
    display: inline-block;
    max-width: 360px;
    height: 272px;
    padding: 32px;
    box-shadow: 0 2px 2px rgba(84, 48, 132, 0.06);
    margin: 0 auto;
    flex-direction: column;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    text-align: center;
    border-radius: 4px;
    .card-img-top {
      width: 100%;
      border-top-left-radius: calc(0.25rem - 1px);
      border-top-right-radius: calc(0.25rem - 1px);
    }
    h3 {
      font-size: 30px;
    }
    img {
      height: 50px;
      margin: 20px 0;
    }
    &:hover {
      text-decoration: none;
      transform: translateY(-12px);
      box-shadow: 0 12px 24px rgba(84, 48, 132, 0.06);
    }
  }
}

.page2 {
  background-color: #f8fafe;
  min-height: 555px;
  .title {
    font-size: 46px;
    text-align: center;
  }
  .page {
    padding: 112px 0 146px;
  }
  .info-content {
    max-width: 900px;
    line-height: 48px;
    margin: 0 auto;
    font-size: 20px;
    font-weight: 300;
  }
}

.page3 {
  min-height: 521px;
  background: #544ff9;
  background: linear-gradient(to right, #544ff9 0%, #7351f4 26%, #874bff 100%);
  color: #c3d1ff;
  .page {
    padding: 130px 0 156px;
    img {
      width: 96px;
      margin: 0 32px 32px;
    }
    h5 {
      color: white;
      margin-bottom: 16px;
      font-size: 20px;
      font-weight: 400;
    }
    .detail {
      display: inline-block;
      max-width: 240px;
      font-size: 14px;
      font-weight: 300;
      line-height: 26px;
    }
  }
}

.page4 {
  min-height: 715px;
  padding: 130px 0;
  background: #f8fafe;
  .slick-slide {
    height: 455px;
    .user {
      width: 98px;
      height: 98px;
      border-radius: 100%;
      margin: auto;
    }
    .comment {
      line-height: 48px;
      font-size: 20px;
      width: 100%;
      max-width: 680px;
      margin: 41px auto 47px;
      position: relative;
      color: #545454;
      font-weight: 300;
      > img {
        position: absolute;
        left: -40px;
        top: -15px;
      }
    }
    > h4 {
      font-size: 30px;
      line-height: 38px;
      font-weight: normal;
    }
    > p {
      margin-top: 16px;
      font-size: 14px;
      color: #888888;
      font-weight: 300;
    }
  }
  .slick-dots li {
    margin: 0 8px;
    button {
      transition: opacity 0.3s;
      width: 10px !important;
      height: 10px !important;
      background: #1890ff;
      border-radius: 100%;
      &:hover,
      &:focus {
        &::before {
          opacity: 1;
          background: #1890ff;
          width: 20px;
          height: 20px;
        }
      }
      &::before {
        transition: color 0.3s;
      }
    }
    &.slick-active {
      button {
        background: #1890ff;
        &::before {
          opacity: 1;
          background: #1890ff;
        }
      }
    }
  }
}

.page5 {
  min-height: 590px;
  h2 {
    margin: 120px auto 25px;
  }
  > span {
    margin-bottom: 72px;
  }
  .ant-row > div {
    margin-bottom: 20px;
  }
}
\end{lstlisting}
\subsection{Home/static/responsive.less}
\begin{lstlisting}
@import "./default.less";
@media only screen and (max-width: @screen-md) {
  .banner-wrapper {
    height: 100vh;
    .banner {
      overflow: hidden;
      .banner-img-wrapper,
      .banner-text-wrapper {
        width: 90%;
        margin: auto;
        display: block;
        position: relative;
      }
      .banner-img-wrapper {
        height: auto;
        margin: 40px auto;
      }
      .banner-text-wrapper {
        text-align: center;
        padding: 0;
        p {
          margin: 8% 0;
          line-height: 1.5em;
        }
      }
    }
  }
  .main-info {
    font-size: 16px;
    line-height: 2em;
  }
  .page2 {
    .info-content {
      font-size: 14px;
      line-height: 2em;
    }
  }
  .page3 {
    .ant-row > div {
      margin: 24px 0;
    }
  }
  .page4 .slick-slide .comment {
    font-size: 16px;
    line-height: 2em;
  }
  .page4 .slick-slide > p {
    font-size: 12px;
  }
  .page5 {
    min-height: 1100px;
  }
  footer .ant-row .footer-center {
    text-align: center;
  }
  #footer .footer-wrap {
    padding: 40px;
  }
  footer.dark .bottom-bar {
    padding: 20px 8px;
    text-align: center;
  }
}
\end{lstlisting}
\subsection{Home/static/style.js}
\begin{lstlisting}
import "./header.less";
import "./home.less";
import "./footer.less";
import "./responsive.less";
\end{lstlisting}
\subsection{icons/graphql.svg}
\begin{lstlisting}
<svg
  width="1em"
  height="1em"
  viewBox="0 0 17 17"
  fill="currentColor"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M9.95245 1.9481L13.447 3.96792C13.6096 3.79702 13.8098 3.66629 14.0316 3.58607C14.2535 3.50585 14.4909 3.47834 14.7253 3.5057C14.9596 3.53306 15.1843 3.61456 15.3817 3.74374C15.5791 3.87292 15.7437 4.04624 15.8626 4.25001C15.9801 4.45454 16.0483 4.68362 16.0619 4.9191C16.0754 5.15457 16.034 5.38997 15.9408 5.60664C15.8476 5.82331 15.7052 6.0153 15.5249 6.16738C15.3446 6.31947 15.1314 6.42748 14.9021 6.48285V10.5198C15.1318 10.574 15.3456 10.6813 15.5263 10.8331C15.707 10.9849 15.8496 11.1769 15.9427 11.3937C16.0358 11.6106 16.0767 11.8462 16.0623 12.0818C16.0478 12.3173 15.9783 12.5462 15.8594 12.75C15.7392 12.9576 15.5715 13.1337 15.3701 13.264C15.1687 13.3943 14.9393 13.475 14.7007 13.4996C14.4621 13.5241 14.221 13.4918 13.9973 13.4053C13.7736 13.3188 13.5735 13.1805 13.4135 13.0018L9.93811 15.0078C10.0134 15.2356 10.0336 15.478 9.99702 15.7151C9.96043 15.9522 9.8681 16.1772 9.72762 16.3717C9.58713 16.5661 9.40251 16.7245 9.18891 16.8337C8.97532 16.943 8.73886 17 8.49895 17C8.26315 17.0002 8.03057 16.9453 7.81974 16.8397C7.60891 16.7341 7.42566 16.5807 7.28459 16.3917C7.14352 16.2028 7.04854 15.9835 7.0072 15.7513C6.96587 15.5192 6.97933 15.2806 7.04651 15.0546L3.5493 13.0374C3.41196 13.1818 3.24749 13.2976 3.0653 13.3783C2.88311 13.4589 2.68679 13.5028 2.4876 13.5075C2.28841 13.5121 2.09026 13.4774 1.90451 13.4053C1.71877 13.3332 1.54908 13.2252 1.40517 13.0874C1.20913 12.8989 1.0673 12.6612 0.994476 12.3992C0.921656 12.1372 0.920524 11.8604 0.991198 11.5978C1.06187 11.3352 1.20176 11.0964 1.39625 10.9063C1.59074 10.7162 1.8327 10.5818 2.09686 10.5172V6.4802C1.88511 6.42979 1.68671 6.33436 1.51517 6.20039C1.34362 6.06642 1.20295 5.89706 1.10273 5.70384C1.00252 5.51062 0.945112 5.29808 0.93442 5.08068C0.923727 4.86329 0.960001 4.64614 1.04077 4.44402C1.12154 4.2419 1.24491 4.05955 1.40249 3.90939C1.56006 3.75924 1.74814 3.6448 1.95392 3.57386C2.15969 3.50292 2.37834 3.47715 2.59497 3.4983C2.8116 3.51946 3.02113 3.58704 3.2093 3.69645C3.33361 3.76817 3.44995 3.85688 3.54983 3.96207L7.04705 1.94492C6.93299 1.55999 6.97648 1.14552 7.16795 0.79265C7.35943 0.439783 7.68322 0.17741 8.06811 0.0632281C8.32982 -0.0150238 8.60782 -0.021018 8.87266 0.0458808C9.13749 0.11278 9.3793 0.250079 9.57245 0.44323C9.7656 0.63638 9.9029 0.878187 9.9698 1.14302C10.0367 1.40786 10.0307 1.68586 9.95245 1.94757V1.9481ZM9.58748 2.57073C9.57367 2.58454 9.56252 2.59835 9.54605 2.61217L14.1228 10.5368C14.1419 10.5315 14.1642 10.5257 14.1807 10.5204V6.47807C13.9879 6.43041 13.8065 6.34517 13.6467 6.22724C13.487 6.10931 13.3521 5.961 13.2498 5.79083C13.1474 5.62065 13.0797 5.43196 13.0505 5.23556C13.0213 5.03916 13.0311 4.83892 13.0794 4.64632C13.082 4.62985 13.0879 4.6102 13.0905 4.59373L9.58748 2.57073ZM7.45133 2.61217L7.40989 2.57073L3.90683 4.59054C4.01777 4.97617 3.97109 5.39007 3.77704 5.7413C3.583 6.09253 3.25746 6.35237 2.87195 6.46373L2.8167 6.47754V10.5198L2.8778 10.5363L7.45451 2.61163L7.45133 2.61217ZM8.92342 2.97182C8.64738 3.04939 8.35531 3.04939 8.07927 2.97182L3.50255 10.8965C3.71027 11.0957 3.85689 11.3528 3.92861 11.6354H13.0735C13.1426 11.3534 13.2892 11.0957 13.4996 10.8938L8.92342 2.97182ZM9.62042 14.4654L13.1012 12.4541C13.09 12.4206 13.082 12.3877 13.0735 12.3542H3.92595L3.90948 12.4121L7.40989 14.4319C7.55104 14.2854 7.72038 14.1689 7.90772 14.0894C8.09506 14.01 8.29653 13.9693 8.50002 13.9698C8.94573 13.9698 9.34417 14.1605 9.62042 14.4649V14.4654Z"
    fill="currentColor"
  />
</svg>
\end{lstlisting}
\subsection{icons/index.ts}
\begin{lstlisting}
export { ReactComponent as Wand } from "./wand.svg";
export { ReactComponent as GraphQL } from "./graphql.svg";
\end{lstlisting}
\subsection{icons/logo.svg}
\begin{lstlisting}
<svg width="50" height="50" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="80" height="80"/>
<path d="M64.7227 46.2233C62.7404 56.0416 41.3397 60.9495 39.9029 75.0237C34.1057 70.5753 32.5973 64.1545 34.0362 59.4808C38.4578 51.496 48.5417 44.5714 53.5311 38.0908C57.2962 45.2241 43.6777 55.8197 46.3535 54.2303C52.2404 50.7338 53.9799 47.8261 56.0589 46.3029C61.2563 42.495 65.9681 22.2472 70.984 24.9286C70.4969 29.6995 67.1544 34.1789 64.7227 46.2233Z" fill="#8CC7F7"/>
<path d="M11.5186 33.7258C9.053 22.2024 15.4433 12.4105 22.4467 4.49881C19.1202 23.1993 23.2623 24.6145 25.4806 34.1673C26.6063 39.0149 22.3429 47.1033 28.8855 55.6172C31.4806 58.9942 13.7777 44.2843 11.5186 33.7258Z" fill="#FF543D"/>
<path d="M33.726 26.6619C40.8603 17.3079 52.5322 15.9436 63.1795 16.269C46.7575 25.7631 48.4194 29.8908 42.6205 37.7804C39.6778 41.7841 30.7076 43.6989 28.5575 54.273C27.7047 58.4671 27.1891 35.2325 33.726 26.6619Z" fill="#0EE17A"/>
<path d="M21.7672 29.9634C23.9644 18.4062 33.7936 11.9656 43.4622 7.49459C33.0206 23.331 36.3532 26.2796 34.6954 35.9297C33.8541 40.8267 26.6875 46.5514 29.4939 56.9705C30.607 61.1032 19.7539 40.5527 21.7672 29.9634Z" fill="#F7E225"/>
<path d="M64.0665 44.2548C62.0842 54.0731 40.6835 58.981 39.2467 73.0552C33.4495 68.6068 31.9411 62.186 33.38 57.5123C37.8016 49.5275 47.8855 42.6029 52.8749 36.1223C56.64 43.2556 43.0215 53.8511 45.6973 52.2618C51.5843 48.7653 53.3237 45.8576 55.4027 44.3344C60.6001 40.5264 65.312 20.2787 70.3278 22.9601C69.8407 27.731 66.4982 32.2104 64.0665 44.2548Z" fill="#2C98F0"/>
<defs>
<radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(40 37.2) rotate(90) scale(52.8)">
<stop stop-color="white"/>
<stop offset="0.746212" stop-color="#8CC7F7"/>
</radialGradient>
</defs>
</svg>
\end{lstlisting}
\subsection{icons/wand.svg}
\begin{lstlisting}
<svg
  width="1em"
  height="1em"
  viewBox="0 0 17 17"
  fill="none"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M3.1875 6.90625H1.59375C1.45285 6.90625 1.31773 6.85028 1.2181 6.75065C1.11847 6.65102 1.0625 6.5159 1.0625 6.375C1.0625 6.2341 1.11847 6.09898 1.2181 5.99935C1.31773 5.89972 1.45285 5.84375 1.59375 5.84375H3.1875C3.3284 5.84375 3.46352 5.89972 3.56315 5.99935C3.66278 6.09898 3.71875 6.2341 3.71875 6.375C3.71875 6.5159 3.66278 6.65102 3.56315 6.75065C3.46352 6.85028 3.3284 6.90625 3.1875 6.90625Z"
    fill="currentColor"
  />
  <path
    d="M2.99658 2.99658L4.1235 4.1235L2.99658 2.99658Z"
    fill="currentColor"
  />
  <path
    d="M4.12351 4.65477C4.05373 4.65491 3.98462 4.64121 3.92017 4.61448C3.85571 4.58776 3.79719 4.54852 3.74798 4.49905L2.62074 3.37214C2.5211 3.2725 2.46512 3.13736 2.46512 2.99644C2.46512 2.85553 2.5211 2.72039 2.62074 2.62075C2.72038 2.52111 2.85552 2.46513 2.99643 2.46513C3.13734 2.46513 3.27248 2.52111 3.37212 2.62075L4.49904 3.748C4.57328 3.82229 4.62384 3.91693 4.64432 4.01995C4.6648 4.12297 4.65428 4.22975 4.61409 4.32679C4.5739 4.42383 4.50585 4.50679 4.41853 4.56516C4.33121 4.62354 4.22854 4.65473 4.12351 4.65477Z"
    fill="currentColor"
  />
  <path
    d="M6.375 3.71875C6.2341 3.71875 6.09898 3.66278 5.99935 3.56315C5.89972 3.46352 5.84375 3.3284 5.84375 3.1875V1.59375C5.84375 1.45285 5.89972 1.31773 5.99935 1.2181C6.09898 1.11847 6.2341 1.0625 6.375 1.0625C6.5159 1.0625 6.65102 1.11847 6.75065 1.2181C6.85028 1.31773 6.90625 1.45285 6.90625 1.59375V3.1875C6.90625 3.3284 6.85028 3.46352 6.75065 3.56315C6.65102 3.66278 6.5159 3.71875 6.375 3.71875Z"
    fill="currentColor"
  />
  <path
    d="M9.75809 2.99658L8.63118 4.1235L9.75809 2.99658Z"
    fill="currentColor"
  />
  <path
    d="M8.6328 4.65477C8.52776 4.65473 8.4251 4.62354 8.33778 4.56516C8.25046 4.50679 8.18241 4.42383 8.14222 4.32679C8.10203 4.22975 8.09151 4.12297 8.11199 4.01995C8.13246 3.91693 8.18302 3.82229 8.25727 3.748L9.38418 2.62075C9.43352 2.57141 9.49209 2.53228 9.55655 2.50558C9.62101 2.47888 9.6901 2.46513 9.75988 2.46513C9.82965 2.46513 9.89874 2.47888 9.9632 2.50558C10.0277 2.53228 10.0862 2.57141 10.1356 2.62075C10.1849 2.67009 10.224 2.72866 10.2507 2.79312C10.2774 2.85758 10.2912 2.92667 10.2912 2.99644C10.2912 3.06622 10.2774 3.13531 10.2507 3.19977C10.224 3.26423 10.1849 3.3228 10.1356 3.37214L9.00699 4.49905C8.95791 4.54832 8.8996 4.58743 8.83539 4.61415C8.77119 4.64087 8.70234 4.65468 8.6328 4.65477Z"
    fill="currentColor"
  />
  <path
    d="M4.1235 8.63118L2.99658 9.75809L4.1235 8.63118Z"
    fill="currentColor"
  />
  <path
    d="M2.99659 10.2893C2.89152 10.2893 2.78881 10.2581 2.70145 10.1998C2.61408 10.1414 2.54597 10.0585 2.50574 9.96143C2.46551 9.86437 2.45496 9.75757 2.47543 9.65452C2.4959 9.55146 2.54646 9.4568 2.62073 9.38248L3.74797 8.25557C3.84811 8.15836 3.98246 8.10446 4.12201 8.10551C4.26156 8.10656 4.39509 8.16248 4.49375 8.26118C4.5924 8.35988 4.64826 8.49344 4.64925 8.63298C4.65024 8.77253 4.59628 8.90687 4.49903 9.00695L3.37212 10.1339C3.27248 10.2334 3.13741 10.2893 2.99659 10.2893Z"
    fill="currentColor"
  />
  <path
    d="M7.27149 5.04122C7.19133 4.96105 7.09616 4.89746 6.99142 4.85408C6.88668 4.81069 6.77442 4.78836 6.66105 4.78836C6.54768 4.78836 6.43542 4.81069 6.33068 4.85408C6.22594 4.89746 6.13078 4.96105 6.05061 5.04122L5.04024 6.05159C4.96008 6.13175 4.89648 6.22692 4.8531 6.33166C4.80971 6.4364 4.78738 6.54866 4.78738 6.66203C4.78738 6.7754 4.80971 6.88766 4.8531 6.9924C4.89648 7.09714 4.96008 7.1923 5.04024 7.27247L6.93149 9.16405C6.94383 9.1764 6.95847 9.18619 6.9746 9.19288C6.99072 9.19956 7.008 9.203 7.02546 9.203C7.04291 9.203 7.06019 9.19956 7.07632 9.19288C7.09244 9.18619 7.10709 9.1764 7.11942 9.16405L9.16407 7.1194C9.17642 7.10707 9.18621 7.09242 9.1929 7.0763C9.19958 7.06017 9.20302 7.04289 9.20302 7.02544C9.20302 7.00798 9.19958 6.9907 9.1929 6.97458C9.18621 6.95845 9.17642 6.94381 9.16407 6.93147L7.27149 5.04122Z"
    fill="currentColor"
  />
  <path
    d="M15.6822 13.4509L10.1017 7.86917C10.0894 7.85682 10.0748 7.84702 10.0586 7.84034C10.0425 7.83366 10.0252 7.83022 10.0078 7.83022C9.99032 7.83022 9.97304 7.83366 9.95691 7.84034C9.94079 7.84702 9.92614 7.85682 9.91381 7.86917L7.86916 9.91382C7.85681 9.92615 7.84702 9.9408 7.84033 9.95692C7.83365 9.97304 7.83021 9.99033 7.83021 10.0078C7.83021 10.0252 7.83365 10.0425 7.84033 10.0586C7.84702 10.0748 7.85681 10.0894 7.86916 10.1017L13.4513 15.6822C13.6132 15.844 13.8327 15.9349 14.0615 15.9349C14.2904 15.9349 14.5099 15.844 14.6718 15.6822L15.6822 14.6718C15.7624 14.5917 15.8259 14.4965 15.8693 14.3918C15.9127 14.287 15.935 14.1748 15.935 14.0614C15.935 13.948 15.9127 13.8358 15.8693 13.731C15.8259 13.6263 15.7624 13.5311 15.6822 13.4509Z"
    fill="currentColor"
  />
</svg>
\end{lstlisting}
\subsection{index.tsx}
\begin{lstlisting}
import React from "react";
import ReactDOM from "react-dom";
import { init } from "@providers";

import App from "./App";
import { nameString } from "./appInfo";

const rootEl = document.getElementById("root");

init({ name: nameString }).then(() => {
  ReactDOM.render(<App />, rootEl);
});
\end{lstlisting}
\subsection{Layout/AppLogo.tsx}
\begin{lstlisting}
import React, { CSSProperties, FC } from "react";
import { Link } from "@curi/react-dom";

import { logoLarge, logoSmall } from "../appInfo";

type LogoProps = {
  small?: boolean;
  style?: CSSProperties;
  className?: string;
};

const Logo: FC<LogoProps> = ({ small = false, style = {}, className = "" }) => {
  return (
    <Link name="index">
      <div className={className} style={style}>
        {small ? logoSmall : logoLarge}
      </div>
    </Link>
  );
};

export default Logo;
\end{lstlisting}
\subsection{Layout/Header.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { useTranslation } from "react-i18next";
import { Badge, Divider, Dropdown, Layout, Menu } from "antd";
import {
  BellOutlined,
  DownOutlined,
  LogoutOutlined,
  MenuOutlined,
  UserOutlined,
} from "@ant-design/icons";
import { router } from "@providers";
import { AuthConsumer } from "@providers/authContext";

import styles from "./layout.module.less";

const { Header } = Layout;

type AppHeaderProps = {
  onMenuToggle?: () => void;
};

const UserDropdown: FC<{ className?: string }> = ({ className }) => {
  const { t } = useTranslation("Login");

  return (
    <AuthConsumer>
      {({ logout, user }) => {
        const menu = (
          <Menu
            onClick={({ key }) => {
              if (key === "logout") {
                logout();
              }
            }}
          >
            <Menu.Item key="logout">
              <LogoutOutlined />
              {t("logout")}
            </Menu.Item>
          </Menu>
        );

        return (
          <Dropdown overlay={menu} trigger={["click"]} placement="bottomRight">
            <span className={className}>
              <UserOutlined />
              <span>
                {user.name} {user.surname}
              </span>
              <DownOutlined />
            </span>
          </Dropdown>
        );
      }}
    </AuthConsumer>
  );
};

const NotificationItem: FC = () => {
  return (
    <Badge count={0}>
      <BellOutlined
        style={{ fontSize: "18px" }}
        onClick={() => {
          router.navigate({ url: router.url({ name: "notifications:index" }) });
        }}
      />
    </Badge>
  );
};

const AppHeader: FC<AppHeaderProps> = ({ onMenuToggle }) => {
  return (
    <Header className={styles.header}>
      <MenuOutlined className={styles.trigger} onClick={onMenuToggle} />
      <Divider
        type="vertical"
        orientation="center"
        style={{ margin: "0px 20px 0px 20px" }}
      />
      <NotificationItem />
      <UserDropdown className={styles.user} />
    </Header>
  );
};

export default AppHeader;
\end{lstlisting}
\subsection{Layout/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Layout } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useLocalStorage } from "@lib/hooks/storage";
import { AuthConsumer } from "@providers/authContext";

import AppLogo from "./AppLogo";
import AppHeader from "./Header";
import LeftBar from "./LeftBar";
import MainView from "./MainView";

import styles from "./layout.module.less";

const { Sider, Content } = Layout;

const MainLayout: FC = () => {
  const [collapsed, setCollapsed] = useLocalStorage("Layout.collapsed", false);

  const toggleSidebar = (): void => setCollapsed(!collapsed);

  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform="auth:login"
            // authenticated user
            no={() => (
              <Layout className={styles.mainLayout}>
                <Sider
                  trigger={null}
                  collapsible
                  collapsed={collapsed}
                  className={styles.leftBar}
                  width={260}
                >
                  <AppLogo className={styles.appLogo} small={collapsed} />
                  <LeftBar />
                </Sider>
                <Layout>
                  <AppHeader onMenuToggle={toggleSidebar} />
                  <Content>
                    <MainView />
                  </Content>
                </Layout>
              </Layout>
            )}
            // visitor
            yes={() => (
              <Layout className={styles.mainLayout}>
                <Content>
                  <MainView />
                </Content>
              </Layout>
            )}
          />
        );
      }}
    </AuthConsumer>
  );
};

export default MainLayout;
\end{lstlisting}
\subsection{Layout/layout.module.less}
\begin{lstlisting}
@import "../variables.less";

.mainLayout {
  min-height: 100vh;
}

.header {
  background-color: @component-background;
  padding-left: @main-horizontal-padding;
  padding-right: @main-horizontal-padding;
  margin-bottom: @layout-margin;

  .user {
    float: right;

    & > *:not(:last-child) {
      margin-right: 0.2em;
    }

    &:hover {
      cursor: pointer;
    }
  }
}

.leftBar {
  background-color: @component-background;
  margin-right: @layout-margin;

  .appLogo {
    height: @layout-header-height;
    background-color: @component-background;

    display: flex;
    justify-content: center;
    align-items: center;
  }

  .menu {
    border-right: none;
  }
}

.trigger {
  font-size: 150%;
  line-height: @layout-header-height;
  padding: 0;
  cursor: pointer;
  transition: color 0.3s;

  &:hover {
    color: @primary-color;
  }
}
\end{lstlisting}
\subsection{Layout/LeftBar.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Menu } from "antd";
import {
  AlignLeftOutlined,
  FolderOpenOutlined,
  HistoryOutlined,
  HomeOutlined,
  MessageOutlined,
  MoneyCollectOutlined,
  ProfileOutlined,
  QuestionOutlined,
  SettingOutlined,
  UnorderedListOutlined,
  UserOutlined,
} from "@ant-design/icons";
import { Link } from "@curi/react-dom";
import RoleSwitch from "@lib/components/RoleSwitch";
import { i18n } from "@providers";
import { AuthConsumer } from "@providers/authContext";

import { buildUseMenuKeys, entryToKey, MenuEntry, MenuKeys } from "./utils";

import styles from "./layout.module.less";

const MenuLink: FC<MenuEntry> = ({ name, params, display, ...rest }) => (
  <Menu.Item {...rest}>
    {!name ? (
      display
    ) : (
      <Link name={name} params={params}>
        {display}
      </Link>
    )}
  </Menu.Item>
);

// rest should be passed down to subitems because antd-menu requires it
const MenuItem: FC<{ entry: MenuEntry }> = ({ entry, ...rest }) => {
  return (
    <AuthConsumer>
      {({ user }) => {
        const { display, nested } = entry;
        const key = entryToKey(entry);

        if (!nested || nested.length === 0) {
          return (
            <RoleSwitch
              role={user.role}
              perform={entry.name ?? ""}
              yes={() => <MenuLink key={key} {...entry} {...rest} />}
            />
          );
        }

        const title = <span className="submenu-title-wrapper">{display}</span>;

        return (
          <RoleSwitch
            role={user.role}
            perform={entry.name ?? ""}
            yes={() => (
              <Menu.SubMenu {...rest} key={key} title={title}>
                {nested.map((subentry) => (
                  <MenuLink key={entryToKey(subentry)} {...subentry} />
                ))}
              </Menu.SubMenu>
            )}
          />
        );
      }}
    </AuthConsumer>
  );
};

const useMenuKeys = (conf: Array<MenuEntry>): (() => MenuKeys) =>
  buildUseMenuKeys(conf);

const LeftBar: FC = () => {
  const LeftBarConf: Array<MenuEntry> = [
    {
      display: (
        <>
          <HomeOutlined />
          <span>{i18n.t("LeftBar.Fund")}</span>
        </>
      ),
      name: "fund:index",
      nested: [
        {
          display: <span>{i18n.t("LeftBar.Fund_nested.Dashboard")}</span>,
          name: "fund:dashboard",
        },
        {
          display: <span>{i18n.t("LeftBar.Fund_nested.Description")}</span>,
          name: "fund:description",
        },
      ],
    },
    {
      display: (
        <>
          <QuestionOutlined />
          <span>{i18n.t("LeftBar.Fund_nested.FAQ")}</span>
        </>
      ),
      name: "fund:faq-index",
    },
    {
      display: (
        <>
          <MessageOutlined />
          <span>{i18n.t("LeftBar.Chats")}</span>
        </>
      ),
      name: "chats:index",
    },
    {
      display: (
        <>
          <AlignLeftOutlined />
          <span>{i18n.t("LeftBar.News")}</span>
        </>
      ),
      name: "news:index",
    },
    {
      display: (
        <>
          <UnorderedListOutlined />
          <span>{i18n.t("LeftBar.Category")}</span>
        </>
      ),
      name: "categories:index",
    },
    {
      display: (
        <>
          <FolderOpenOutlined />
          <span>{i18n.t("LeftBar.Applications.title")}</span>
        </>
      ),
      name: "applications:index",
      nested: [
        {
          display: <span>{i18n.t("LeftBar.Applications.All")}</span>,
          name: "applications:index",
        },
        {
          display: <span>{i18n.t("LeftBar.Applications.Processing")}</span>,
          name: "applications:processing",
        },
        {
          display: <span>{i18n.t("LeftBar.Applications.Active")}</span>,
          name: "applications:active",
        },
      ],
    },

    {
      display: (
        <>
          <ProfileOutlined />
          <span>{i18n.t("LeftBar.Managers")}</span>
        </>
      ),
      name: "managers:index",
    },

    {
      display: (
        <>
          <MoneyCollectOutlined />
          <span>{i18n.t("LeftBar.Transactions")}</span>
        </>
      ),
      name: "transactions:index",
    },

    {
      display: (
        <>
          <UserOutlined />
          <span>{i18n.t("LeftBar.Users")}</span>
        </>
      ),
      name: "users:index",
    },
    {
      display: (
        <>
          <HistoryOutlined />
          <span>{i18n.t("LeftBar.Logs")}</span>
        </>
      ),
      name: "logs:index",
    },
    {
      display: (
        <>
          <SettingOutlined />
          <span>{i18n.t("LeftBar.Settings")}</span>
        </>
      ),
      name: "settings:index",
    },
  ];

  const menuKeys = useMenuKeys(LeftBarConf);

  const inner = LeftBarConf.map((entry) => (
    <MenuItem key={entryToKey(entry)} entry={entry} />
  ));

  return (
    <Menu mode="inline" className={styles.menu} {...menuKeys}>
      {inner}
    </Menu>
  );
};

export default LeftBar;
\end{lstlisting}
\subsection{Layout/MainView.tsx}
\begin{lstlisting}
import React, { PureComponent, ReactNode } from "react";
import { ResponseConsumer } from "@curi/react-dom";

export default class MainView extends PureComponent {
  render(): JSX.Element {
    return (
      <ResponseConsumer>
        {({ response }): ReactNode => {
          const { body: Body } = response;

          return <Body response={response} />;
        }}
      </ResponseConsumer>
    );
  }
}
\end{lstlisting}
\subsection{Layout/utils.ts}
\begin{lstlisting}
import { ReactNode } from "react";
import { useResponse } from "@curi/react-dom";
import { queryStringify } from "@lib/utils";

export type MenuEntry = {
  display: ReactNode;
  key?: string;
  name?: string;
  params?: {
    [key: string]: string;
  };
  // TODO: proper support for nested leftbar menu
  nested?: Array<MenuEntry>;
};

export type MenuKeys = {
  selectedKeys: Array<string>;
  defaultOpenKeys: Array<string>;
};

export function entryToKey(
  entry: Pick<MenuEntry, "name" | "params" | "key">,
): string {
  const { name, params, key } = entry;
  return key ?? queryStringify({ name, params }, false);
}

function buildKeyCache(
  menuConf: Array<MenuEntry>,
): { [key: string]: Array<string> } {
  const keyCache: { [key: string]: Array<string> } = {};

  function openKeys(entry: MenuEntry, path: Array<string> = []): void {
    const { nested = [], name } = entry;
    const key = entryToKey(entry);

    if (name) {
      keyCache[key] = path;
    }

    if (nested.length > 0) {
      nested.forEach((subentry) => openKeys(subentry, [...path, key]));
    }
  }

  menuConf.forEach((entry) => openKeys(entry));

  return keyCache;
}

export function buildUseMenuKeys(menuConf: Array<MenuEntry>): () => MenuKeys {
  const openKeysCache = buildKeyCache(menuConf);
  return () => {
    const { response } = useResponse();
    const key = entryToKey(response);

    return {
      selectedKeys: [key],
      defaultOpenKeys: openKeysCache[key] ?? [],
    };
  };
}
\end{lstlisting}
\subsection{Layout/Workspace/__tests__/Layout.tsx}
\begin{lstlisting}
/* eslint-disable no-undef */
import React from "react";
import { render } from "@testing-library/react";

import Footer from "../Footer";

const randomString = (): string => Math.random().toString(36).substring(2);

test("renders footer", () => {
  const name = randomString();
  const version = randomString();
  const { getByText } = render(
    <Footer logo={<span>{name}</span>} version={version} />,
  );
  const nameText = getByText(new RegExp(name));
  const versionText = getByText(new RegExp(version));
  expect(nameText).toBeInTheDocument();
  expect(versionText).toBeInTheDocument();
});
\end{lstlisting}
\subsection{Layout/Workspace/Footer.tsx}
\begin{lstlisting}
import React, { FC, ReactElement } from "react";
import { Layout } from "antd";

import styles from "./styles.module.less";

type AppFooterProps = {
  logo?: ReactElement;
  version: string;
};

const AppFooter: FC<AppFooterProps> = ({ logo, version }) => {
  return (
    <Layout.Footer className={styles.footer}>
      {logo}&nbsp;{version}
    </Layout.Footer>
  );
};

export default AppFooter;
\end{lstlisting}
\subsection{Layout/Workspace/index.tsx}
\begin{lstlisting}
import React, { FC, ReactNode } from "react";
import { Button, Layout, PageHeader, Space } from "antd";
import { DoubleRightOutlined, SyncOutlined } from "@ant-design/icons";
import { useDocumentTitle } from "@lib/hooks";
import {
  shallowEqual,
  useActions,
  useSelector,
  useTranslation,
} from "@providers";
import { RootState } from "@providers/redux";
import classnames from "classnames";
import produce from "immer";
import { atom, Provider } from "jotai";

import { name, version } from "../../appInfo";
import { toggleRightPanel } from "../../reducer/workspace";

import Footer from "./Footer";

import styles from "./styles.module.less";

const { Sider, Content } = Layout;

export type WorkspaceState = {
  rightPanelCollapsed: boolean;
};

const workspaceAtom = atom<WorkspaceState>({
  rightPanelCollapsed: true,
});

export const toggleRightPanelAtom = atom(
  null,
  (get, set, newState: "open" | "closed" | undefined) => {
    let newValue = !get(workspaceAtom).rightPanelCollapsed;

    if (newState === "open") {
      newValue = false;
    }
    if (newState === "closed") {
      newValue = true;
    }

    set(
      workspaceAtom,
      produce((draft: WorkspaceState) => {
        draft.rightPanelCollapsed = newValue;
      }),
    );
  },
);

interface WorkspaceProps {
  withBack?: boolean;
  title: string;
  subTitle?: string;
  rightPanel?: ReactNode;
  actions?: ReactNode;
  rightPanelWidth?: number;
  noRefresh?: boolean;
}

const Workspace: FC<WorkspaceProps> = ({
  withBack = false,
  title,
  subTitle,
  rightPanel,
  rightPanelWidth = 360,
  children,
  actions,
  noRefresh = false,
}) => {
  const { t } = useTranslation();

  const workspace = useSelector(
    (state: RootState): WorkspaceState => state.workspace,
    shallowEqual,
  );

  useDocumentTitle(title);

  const toggleSidebar = useActions(toggleRightPanel);

  const onBack = withBack ? () => window.history.back() : undefined;

  return (
    <Provider>
      <Layout className={styles.workspaceLayout}>
        <PageHeader
          className={styles.pageHeader}
          onBack={onBack}
          ghost={false}
          title={title}
          subTitle={subTitle}
          extra={
            <Space align="center">
              {actions}
              {!noRefresh && (
                <Button
                  disabled={false}
                  key="refresh"
                  icon={<SyncOutlined />}
                  title={t("PageHeader.refresh")}
                />
              )}
              {rightPanel && (
                <Button
                  key="sidebar"
                  icon={
                    <DoubleRightOutlined
                      className={classnames(
                        workspace.rightPanelCollapsed && styles.rotated,
                      )}
                    />
                  }
                  title={t(
                    `PageHeader.rightPanel.${
                      workspace.rightPanelCollapsed ? "open" : "close"
                    }`,
                  )}
                  onClick={() => toggleSidebar()}
                />
              )}
            </Space>
          }
        />
        <Layout>
          <Content className={styles.workspaceMain}>
            <main>{children}</main>
            <Footer logo={name} version={version} />
          </Content>
          <Sider
            className={styles.rightSidebar}
            trigger={null}
            theme="light"
            collapsed={!rightPanel || workspace.rightPanelCollapsed}
            collapsible
            collapsedWidth="0"
            width={rightPanelWidth}
            reverseArrow
          >
            {rightPanel}
          </Sider>
        </Layout>
      </Layout>
    </Provider>
  );
};

export default Workspace;
\end{lstlisting}
\subsection{Layout/Workspace/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.footer {
  padding: @main-vertical-padding @main-horizontal-padding;
  margin-top: @layout-margin;
  background-color: @component-background;
}

.workspaceLayout {
  height: calc(100vh - @layout-header-height - @layout-margin);
  overflow: hidden;
}

.workspaceMain {
  .simpleScroll();

  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  & > main {
    flex: 1 1 auto;
  }
}

.rightSidebar {
  .simpleScroll();
  height: 100%;
  margin-left: @layout-margin;

  &:global(.ant-layout-sider-collapsed) {
    margin-left: 0;
  }
}

.pageHeader {
  background-color: @white;
  margin-bottom: @layout-margin;
}

.rotated {
  transform: rotate(-180deg);
}
\end{lstlisting}
\subsection{pages/_notFound.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Button, Card, Result } from "antd";
import { useTranslation } from "@providers";

const NotFound: FC = () => {
  const { t } = useTranslation("_error");

  return (
    <Card bordered={false}>
      <Result
        status="warning"
        title={<h1>{t("notFound.header")}</h1>}
        extra={
          <Button type="default" onClick={() => window.history.back()}>
            {t("notFound.back")}
          </Button>
        }
      />
    </Card>
  );
};

export default NotFound;
\end{lstlisting}
\subsection{pages/_redirect.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { router } from "@providers";
import { AuthConsumer } from "@providers/authContext";

import NotFound from "./_notFound";

const Redirect: FC<{ name?: string; component?: () => JSX.Element }> = ({
  name,
  component,
}) => {
  return (
    <AuthConsumer>
      {({ authenticated }) => {
        if (authenticated) {
          router.navigate({ url: router.url({ name }) });
        } else {
          router.navigate({ url: router.url({ name: "login:index" }) });
        }

        if (component) {
          return component();
        } else {
          return <NotFound />;
        }
      }}
    </AuthConsumer>
  );
};

export default Redirect;
\end{lstlisting}
\subsection{pages/_unauthorized.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Button, Result } from "antd";
import { AuthConsumer } from "@providers/authContext";

import Redirect from "./_redirect";

const Unauthorized: FC = () => {
  return (
    <AuthConsumer>
      {({ authenticated }) => {
        if (authenticated) {
          return (
            <Result
              status="403"
              title="403"
              subTitle="Sorry, you are not authorized to access this page."
              extra={<Button type="primary">Back Home</Button>}
            />
          );
        } else {
          return <Redirect name="login" />;
        }
      }}
    </AuthConsumer>
  );
};

export default Unauthorized;
\end{lstlisting}
\subsection{pages/app/privacypolicy.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import PrivacyPolicy from "Home/App";

const App: FC = () => {
  return <PrivacyPolicy />;
};

export const name = "app:privacy-policy";
export default App;
\end{lstlisting}
\subsection{pages/applications/[id]/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useRef } from "react";
import { Empty, Skeleton } from "antd";
import {
  DonationRequestBodyAvailableStatusesEnum as ApplicationStatus,
  DonationRequestBodyStatusEnum,
} from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { formatCategory } from "@lib/utils";
import {
  i18n,
  PageProps,
  //toggleRightPanelAtom,
  useTranslation,
  Workspace,
} from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { DonationRequestFactory } from "@providers/axios";
//import { useUpdateAtom } from "jotai/utils";
import Redirect from "pages/_redirect";

import { ChangeButton } from "components/Application/ActionForm";
import RightPanel from "components/Application/RightPanel";
import ApplicationView from "components/Application/View";

const Actions: FC<{
  currentStatus: ApplicationStatus;
  undoTransition?: boolean;
  applicationId: number;
  availiableStatuses: ApplicationStatus[];
  onRefetch: () => Promise<void>;
}> = ({
  availiableStatuses,
  applicationId,
  currentStatus,
  undoTransition,
  onRefetch,
}) => {
  return (
    <ChangeButton
      id={applicationId}
      currentStatus={currentStatus}
      undoTransition={undoTransition}
      refetch={onRefetch}
      availiableStatuses={availiableStatuses}
    />
  );
};

type RefType = {
  onRefetch: () => Promise<void>;
};

const ApplicationPage: FC<PageProps> = ({ response }) => {
  const id = response.params.id as number;

  const { t } = useTranslation("Application");

  const lang = i18n.language.substr(0, 2);
  // const toggleRightPanel = useUpdateAtom(toggleRightPanelAtom);

  const refetchRef = useRef<RefType | null>(null);

  const onRefetchButton = useCallback(async () => {
    refetchRef.current?.onRefetch();
  }, []);

  const { data, loading, refetchQuery } = useAxios(
    DonationRequestFactory.apiDonationRequestIdGet,
    undefined,
    id,
  );

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }
  if (loading) {
    return <Skeleton active={loading} />;
  }

  return (
    <Workspace
      withBack
      noRefresh
      title={t("$views.title", { id: data.id, title: data.title })}
      rightPanel={
        data.status ===
          DonationRequestBodyStatusEnum.SuperManagerConfirmation && (
          <RightPanel
            id={id}
            category={formatCategory(lang, data.category)}
            onRefetchApplication={refetchQuery}
          />
        )
      }
      actions={
        <Actions
          currentStatus={(data.status as unknown) as ApplicationStatus}
          undoTransition={data.undo_transition}
          applicationId={data.id ?? 0}
          availiableStatuses={data.available_statuses ?? []}
          onRefetch={onRefetchButton}
        />
      }
    >
      <ApplicationView
        donation={data}
        onRefetch={refetchQuery}
        ref={refetchRef}
      />
    </Workspace>
  );
};

export const name = "applications:show";

export const pageComponent: FC<PageProps> = (props) => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform={name}
          yes={() => <ApplicationPage {...props} />}
          no={() => <Redirect name="home"></Redirect>}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/applications/active.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import { Progress } from "antd";
import {
  DonationRequestBody as Single,
  DonationRequestResponse as Result,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { formatCategory, formatDate } from "@lib/utils";
import { moneyCollected } from "@lib/utils/currency";
import { DateTimeFormat } from "@lib/utils/date";
import { i18n, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { DonationRequestFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import { Actions } from "components/Application/Buttons/create";
import StatusTag, {
  ApplicationStatus,
} from "components/Application/Status/tag";

import { onElementClick } from "./index";

import styles from "./styles.module.less";

const ProcessingApplicationsPage: FC = () => {
  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const paginationState = useRef<StateRef>(null);

  const language = i18n.language.substr(0, 2);

  const { t } = useTranslation("Application");

  const columns = [
    {
      key: "id",
      render(record: Single) {
        return record.id;
      },
    },
    {
      key: "title",
      width: "35%",
      render(record: Single) {
        return record.title;
      },
    },
    {
      key: "status",
      render(record: Single) {
        return (
          <StatusTag status={record.status as ApplicationStatus}></StatusTag>
        );
      },
    },
    {
      key: "type",
      render(record: Single) {
        return <span>{formatCategory(language, record.category)}</span>;
      },
    },
    {
      key: "createdAt",
      render(record: Single) {
        return formatDate(record.created_at);
      },
    },
    {
      key: "collected",
      render(record: Single) {
        const percent = moneyCollected(
          record.approved_amount,
          record.received_amount,
        );
        return percent ? <Progress percent={percent} /> : "-";
      },
    },
    {
      key: "until",
      render(record: Single) {
        return (
          <span>{formatDate(record.until, DateTimeFormat.DATE_SHORT)}</span>
        );
      },
    },
  ];

  return (
    <Workspace noRefresh title={t("listTitle_active")} actions={<Actions />}>
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        requestQuery={DonationRequestFactory.apiDonationRequestGet}
        variables={{
          sort: "",
          author: null,
          assignee: null,
          status: [ApplicationStatus.Active],
        }}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <RegistryTable
            entity="Application"
            columns={columns}
            // eslint-disable-next-line
            rows={entries as Record<string, any>[]} // TODO
            rowState={(record, index) => ({
              selected: isSelected(index),
              target: isTarget(index),
            })}
            onRecordClick={(event, record, index) => {
              if (index !== undefined) {
                onElementClick(record);
              }
            }}
          />
        )}
      />
    </Workspace>
  );
};

export const name = "applications:active";

export const pageComponent: FC = () => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform="applications:index"
          yes={() => <ProcessingApplicationsPage />}
          no={() => <Redirect name="home"></Redirect>}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/applications/create/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback } from "react";
import { DonationRequestSuperManagerInput } from "@generated/models/donation-request-super-manager-input";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, {
  CategoryFactory,
  DonationRequestFactory,
} from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import CreateApplicationView from "components/Application/Form";

const CreatePage: FC = () => {
  const { t } = useTranslation("Application");

  const { data } = useAxios(CategoryFactory.apiCategoriesGet);

  const onCreateApplication = useCallback(
    async (values: DonationRequestSuperManagerInput) =>
      DonationRequestFactory.apiDonationRequestFromManagerPost(values),
    [],
  );

  return (
    <Workspace title={t("createPageTitle")} noRefresh withBack>
      <CreateApplicationView
        onCreate={onCreateApplication}
        categories={data ?? []}
      />
    </Workspace>
  );
};

export const name = "applications:create";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <CreatePage />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/applications/index.tsx}
\begin{lstlisting}
import React, { FC, useRef, useState } from "react";
import { Card, Space } from "antd";
import {
  DonationRequestBody as Single,
  DonationRequestResponse as Result,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { formatCategory } from "@lib/utils";
import { format } from "@lib/utils/date";
import { cred } from "@lib/utils/name";
import { i18n, router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, {
  DonationRequestFactory,
  UserRequestFactory,
} from "@providers/axios";
import Redirect from "pages/_redirect";

import { Actions } from "components/Application/Buttons/create";
import {
  AssignedToMe,
  ClearButton,
  NeedMyVote,
  StatusFilter,
} from "components/Application/Filters";
import StatusTag, {
  ApplicationStatus,
} from "components/Application/Status/tag";

import styles from "./styles.module.less";

export const onElementClick = (record: Single): void => {
  router.navigate({
    url: router.url({ name: "applications:show", params: { id: record.id } }),
  });
};

type FilterInfo = {
  assignedToMe?: boolean;
  status?: string[];
  needMyVote?: boolean;
  category?: string[];
};

type FilterSetting = {
  filterInfo?: FilterInfo;
};

const Filter: FC<{
  categoryIDs?: string[];
  initial: FilterSetting;
  onChange: (values: FilterSetting) => void;
}> = ({ initial, onChange, categoryIDs }) => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <Card style={{ marginBottom: "5px" }}>
            <Space>
              <AssignedToMe
                initial={initial.filterInfo?.assignedToMe ?? false}
                onChange={() => {
                  onChange({
                    ...initial,
                    filterInfo: {
                      ...initial.filterInfo,
                      assignedToMe: !(
                        initial.filterInfo?.assignedToMe ?? false
                      ),
                    },
                  });
                }}
              />
              <RoleSwitch
                role={user.role}
                perform="application:can-vote"
                yes={() => {
                  return (
                    <NeedMyVote
                      disabled={categoryIDs?.length === 0}
                      initial={initial.filterInfo?.needMyVote ?? false}
                      onChange={() => {
                        const needMyVote = !(
                          initial.filterInfo?.needMyVote ?? false
                        );

                        onChange({
                          ...initial,
                          filterInfo: {
                            ...initial.filterInfo,
                            status: needMyVote
                              ? [ApplicationStatus.SuperManagerConfirmation]
                              : [],
                            needMyVote,
                            category: needMyVote ? categoryIDs : undefined,
                          },
                        });
                      }}
                    />
                  );
                }}
              />
              <StatusFilter
                initial={initial.filterInfo?.status}
                onChange={(value) => {
                  onChange({
                    ...initial,
                    filterInfo: {
                      ...initial.filterInfo,
                      status: value,
                    },
                  });
                }}
              />
              <ClearButton onClearAll={() => onChange({})} />
            </Space>
          </Card>
        );
      }}
    </AuthConsumer>
  );
};

const ApplicationsPage: FC<{ userId?: string }> = ({ userId }) => {
  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const [filter, setFilter] = useState<FilterSetting>({});

  const { data } = useAxios(UserRequestFactory.apiUserIdGet, false, userId);

  const paginationState = useRef<StateRef>(null);

  const language = i18n.language.substr(0, 2);

  const { t } = useTranslation("Application");

  const columns = [
    {
      key: "id",
      render(record: Single) {
        return record.id;
      },
    },
    {
      key: "title",
      width: "35%",
      render(record: Single) {
        return record.title;
      },
    },
    {
      key: "status",
      render(record: Single) {
        return (
          <StatusTag status={record.status as ApplicationStatus}></StatusTag>
        );
      },
    },
    {
      key: "type",
      render(record: Single) {
        return <span>{formatCategory(language, record.category)}</span>;
      },
    },
    {
      key: "author",
      name: t("author"),
      render(record: Single) {
        const { first_name, middle_name, last_name } = { ...record.author };
        return cred(first_name, middle_name, last_name);
      },
    },
    {
      key: "createdAt",
      name: t("createdAt"),
      render(record: Single) {
        return format(record.created_at);
      },
    },
  ];

  const categoryIDs = data?.assigned_categories?.map((c) => {
    return c.id;
  });

  return (
    <Workspace noRefresh title={t("listTitle_all")} actions={<Actions />}>
      {data && (
        <Filter
          initial={filter}
          onChange={setFilter}
          categoryIDs={categoryIDs}
        />
      )}
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        requestQuery={DonationRequestFactory.apiDonationRequestGet}
        variables={{
          sort: "",
          author: undefined,
          assignee: filter.filterInfo?.assignedToMe ? [userId] : undefined,
          status: filter.filterInfo?.status,
          category: filter.filterInfo?.category,
        }}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <RegistryTable
            entity="Application"
            columns={columns}
            // eslint-disable-next-line
            rows={entries as Record<string, any>[]} // TODO
            rowState={(record, index) => ({
              selected: isSelected(index),
              target: isTarget(index),
            })}
            onRecordClick={(event, record, index) => {
              if (index !== undefined) {
                onElementClick(record);
              }
            }}
          />
        )}
      />
    </Workspace>
  );
};

export const pageComponent: FC = () => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform="applications:index"
          yes={() => <ApplicationsPage userId={user.uuid} />}
          no={() => <Redirect name="home"></Redirect>}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/applications/processing.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import {
  DonationRequestBody as Single,
  DonationRequestResponse as Result,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { formatCategory } from "@lib/utils";
import { format } from "@lib/utils/date";
import { cred } from "@lib/utils/name";
import { i18n, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { DonationRequestFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import { Actions } from "components/Application/Buttons/create";
import StatusTag, {
  ApplicationStatus,
} from "components/Application/Status/tag";
import RoleTag from "components/User/Role/tag";

import { onElementClick } from "./index";

import styles from "./styles.module.less";

const ProcessingApplicationsPage: FC = () => {
  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const paginationState = useRef<StateRef>(null);

  const language = i18n.language.substr(0, 2);

  const { t } = useTranslation("Application");

  const columns = [
    {
      key: "id",
      render(record: Single) {
        return record.id;
      },
    },
    {
      key: "title",
      width: "35%",
      render(record: Single) {
        return record.title;
      },
    },
    {
      key: "status",
      render(record: Single) {
        return (
          <StatusTag status={record.status as ApplicationStatus}></StatusTag>
        );
      },
    },
    {
      key: "type",
      render(record: Single) {
        return <span>{formatCategory(language, record.category)}</span>;
      },
    },
    {
      key: "createdAt",
      render(record: Single) {
        return format(record.created_at);
      },
    },
    {
      key: "assignee",
      render(record: Single) {
        const { first_name, middle_name, last_name } = { ...record.assignee };
        return cred(first_name, middle_name, last_name);
      },
    },
    {
      key: "assignee_status",
      render(record: Single) {
        return (
          <RoleTag
            roles={record.assignee?.role ? [record.assignee?.role] : []}
          />
        );
      },
    },
  ];

  return (
    <Workspace
      noRefresh
      title={t("listTitle_processing")}
      actions={<Actions />}
    >
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        requestQuery={DonationRequestFactory.apiDonationRequestGet}
        variables={{
          sort: "",
          author: null,
          assignee: null,
          status: [
            ApplicationStatus.InProcessing,
            ApplicationStatus.NeedsImprovement,
            ApplicationStatus.SuperManagerConfirmation,
            ApplicationStatus.UserConfirmation,
          ],
        }}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <RegistryTable
            entity="Application"
            columns={columns}
            // eslint-disable-next-line
            rows={entries as Record<string, any>[]} // TODO
            rowState={(record, index) => ({
              selected: isSelected(index),
              target: isTarget(index),
            })}
            onRecordClick={(event, record, index) => {
              if (index !== undefined) {
                onElementClick(record);
              }
            }}
          />
        )}
      />
    </Workspace>
  );
};

export const name = "applications:processing";

export const pageComponent: FC = () => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform="applications:index"
          yes={() => <ProcessingApplicationsPage />}
          no={() => <Redirect name="home"></Redirect>}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/applications/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{pages/categories/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Empty, Skeleton } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { CategoryFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import CategoryPage from "components/Category";

const CategoriesPage: FC = () => {
  const { t } = useTranslation("Category");

  const { data, loading } = useAxios(
    CategoryFactory.apiCategoriesGet,
    undefined,
  );

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  if (loading) {
    return <Skeleton active={loading} />;
  }

  return (
    <Workspace title={t("title")} noRefresh>
      <CategoryPage data={data} />
    </Workspace>
  );
};

export const pageComponent: FC = () => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform="categories:index"
          yes={() => <CategoriesPage />}
          no={() => <Redirect name="home"></Redirect>}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/chats/[id]/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useRef, useState } from "react";
import {
  Button,
  Comment,
  Empty,
  Form,
  Input,
  List,
  Skeleton,
  Tooltip,
} from "antd";
import Avatar from "antd/lib/avatar/avatar";
import { ChatMessageBody } from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { formatDate } from "@lib/utils";
import { cred } from "@lib/utils/name";
import { PageProps, useTranslation, Workspace } from "@providers";
import { AuthConsumer, User } from "@providers/authContext";
import useAxios, { ChatsFactory, soketUrl } from "@providers/axios";
// import { io } from "socket.io-client";
import Unauthorized from "pages/_unauthorized";

import styles from "./styles.module.less";

const ChatComment: FC<{
  first_name?: string;
  middle_name?: string;
  last_name?: string;
  item: ChatMessageBody;
}> = ({ first_name, middle_name, last_name, item }) => {
  return (
    <Comment
      className={styles.message}
      author={cred(first_name, middle_name, last_name)}
      avatar={
        <Avatar
          src={`/api/file/${item.author?.image_id}/download`}
          alt={cred(first_name, middle_name, last_name)}
        />
      }
      content={<p>{item.body}</p>}
      datetime={
        <Tooltip title={formatDate(item.created_at)}>
          <span>{formatDate(item.created_at)}</span>
        </Tooltip>
      }
    />
  );
};

const ChatPage: FC<PageProps & { user: User }> = ({ response }) => {
  const id = response.params.id;

  const [listState, setListState] = useState<{
    chats: ChatMessageBody[];
    cursor?: string;
    loading: boolean;
    hasMore: boolean;
  }>({
    chats: [],
    cursor: undefined,
    loading: false,
    hasMore: false,
  });

  const [state, setState] = useState<{
    submitting: boolean;
    value: string;
  }>({
    submitting: false,
    value: "",
  });

  useEffect(
    () => {
      const socket = new WebSocket(soketUrl);

      socket.onmessage = socketListener;

      return () => {
        socket.close();
      };
    },
    // eslint-disable-next-line
    [],
  );

  const socketListener = useCallback(
    // eslint-disable-next-line
    (...websocketTarget: MessageEvent<any>[]) => {
      const data = websocketTarget
        .map((item) => {
          return JSON.parse(item.data) as ChatMessageBody;
        })
        .filter((item) => item.dialog_id === id);

      setListState({
        ...listState,
        chats: data.concat(listState.chats),
      });
    },
    // eslint-disable-next-line
    [listState.chats, setListState],
  );

  useEffect(
    () => {
      if (!state.submitting) {
        fetchAPI();
      }
    },
    // eslint-disable-next-line
    [state.submitting],
  );

  const fetchAPI = useCallback(async () => {
    setListState({ ...listState, loading: true });

    const responseAPI = await ChatsFactory.apiChatDialogsIdMessagesGet(
      10,
      id,
      listState.cursor,
    );

    if (responseAPI.data.cursor !== listState.cursor) {
      setListState({
        chats: listState.cursor
          ? [...listState.chats, ...(responseAPI.data.data ?? [])]
          : responseAPI.data.data ?? [],
        loading: false,
        hasMore: !(
          "1" === responseAPI.data.cursor || "0" === responseAPI.data.cursor
        ),
        cursor: responseAPI.data.cursor,
      });
    } else {
      setListState({
        ...listState,
        hasMore: false,
        loading: false,
      });
    }
  }, [listState, setListState, id]);

  const sendMessage = useCallback(async () => {
    try {
      await ChatsFactory.apiChatOperatorPost({
        body: state.value,
        dialog_id: id,
      });
    } finally {
      setState({
        submitting: false,
        value: "",
      });
    }
  }, [state, setState, id]);

  const handleChange = useCallback(
    (e: React.ChangeEvent<HTMLTextAreaElement>) => {
      setState({
        ...state,
        value: e.target.value,
      });
    },
    [state],
  );

  const handleSubmit = useCallback(
    () => {
      if (!state.value) {
        return;
      }

      setListState({
        ...listState,
        chats: [],
        cursor: undefined,
      });

      setState({
        ...state,
        submitting: true,
      });

      sendMessage();
    },
    // eslint-disable-next-line
    [state, setState, setListState, listState],
  );

  const { data, loading } = useAxios(
    ChatsFactory.apiChatDialogsIdGet,
    false,
    id,
  );

  // eslint-disable-next-line
  const observer = useRef<any>();

  const lastMessageReceived = useCallback(
    (node) => {
      if (listState.loading) {
        return;
      }
      if (observer.current) {
        observer?.current?.disconnect();
      }

      observer.current = new IntersectionObserver((entries) => {
        if (entries[0].isIntersecting && listState.hasMore) {
          const lastChat = listState.chats.pop();
          if (lastChat) {
            setState({ ...state, submitting: true });
            listState.chats.push(lastChat);
            setListState({ ...listState, cursor: lastChat.id?.toString() });
            setState({ ...state, submitting: false });
          }
        }
      });
      if (node) {
        observer.current.observe(node);
      }
    },
    // eslint-disable-next-line
    [listState.chats, listState.loading, listState.hasMore],
  );

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  if (loading) {
    return <Skeleton active={true} />;
  }

  return (
    <Workspace noRefresh withBack title={data.user.email ?? ""}>
      <div style={{ background: "white" }}>
        <div className={styles.container}>
          {listState.chats.length !== 0 && (
            <List
              className={styles.pagination}
              loading={listState.loading}
              dataSource={listState.chats}
              renderItem={(item, index) => {
                if (!item.author) {
                  return null;
                }

                const { first_name, middle_name, last_name } = item.author;

                if (listState.chats.length - 1 === index) {
                  return (
                    <div ref={lastMessageReceived}>
                      <ChatComment
                        first_name={first_name}
                        middle_name={middle_name}
                        last_name={last_name}
                        item={item}
                      />
                    </div>
                  );
                }

                return (
                  <ChatComment
                    first_name={first_name}
                    middle_name={middle_name}
                    last_name={last_name}
                    item={item}
                  />
                );
              }}
            />
          )}
        </div>
        <Comment
          content={
            <Editor
              onChange={handleChange}
              onSubmit={handleSubmit}
              value={state.value}
            />
          }
        />
      </div>
    </Workspace>
  );
};

const Editor: FC<{
  onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
  onSubmit?: () => void;
  submitting?: boolean;
  value?: string;
}> = ({ onChange, onSubmit, submitting, value }) => {
  const { t } = useTranslation("Comments");

  return (
    <div className={styles.editor}>
      <Form.Item>
        <Input.TextArea rows={4} onChange={onChange} value={value} />
      </Form.Item>
      <Form.Item>
        <Button
          htmlType="submit"
          loading={submitting}
          onClick={onSubmit}
          type="primary"
        >
          {t("add_comment")}
        </Button>
      </Form.Item>
    </div>
  );
};

export const name = "chats:show";

export const pageComponent: FC<PageProps> = (props) => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <ChatPage {...props} user={user} />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/chats/[id]/styles.module.less}
\begin{lstlisting}
@import "../../../variables.less";

.pagination {
  background-color: white;
  padding: 20px;
}

.container {
  height: calc(
    100vh - @layout-header-height - @layout-margin - 51px - 72px - 240px
  );
  overflow: auto;
  transform: rotate(-180deg);
  direction: rtl;
}

.message {
  transform: rotate(-180deg);
  direction: ltr;
}

.messageAuthor {
  transform: rotate(-180deg);
  align-items: right;
  display: flex;
  justify-content: flex-end;
  direction: ltr;
}

.editor {
  background-color: white;
  padding: 0px 20px;
}
\end{lstlisting}
\subsection{pages/chats/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useState } from "react";
import { Badge, Col, List, Row, Skeleton } from "antd";
import Avatar from "antd/lib/avatar/avatar";
import { UserOutlined } from "@ant-design/icons";
import { Link } from "@curi/react-dom";
import {
  ChatDialogResponseBody as Single,
  ChatMessageBody,
  UtilsPageData,
} from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { formatDate } from "@lib/utils";
import { fullName } from "@lib/utils/name";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { ChatsFactory, soketUrl } from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

const ChatsPage: FC = () => {
  const { t } = useTranslation("Chats");

  //const { setList } = useListSelection<Single>();

  const [pageData, setPageData] = useState<UtilsPageData>({
    page: 1,
    size: 5,
  });
  const [loading, setLoading] = useState(false);
  const [data, setData] = useState<Single[]>([]);

  const onElementClick = (record: Single): void => {
    router.navigate({
      url: router.url({ name: "chats:show", params: { id: record.id } }),
    });
  };

  useEffect(
    () => {
      const socket = new WebSocket(soketUrl);

      socket.onmessage = socketListener;

      return () => {
        socket.close();
      };
    },
    // eslint-disable-next-line
    [],
  );

  useEffect(
    () => {
      fetchAPI();
    },
    // eslint-disable-next-line
    [pageData.page],
  );

  const fetchAPI = useCallback(async () => {
    try {
      setLoading(true);

      const apiPage = (pageData.page ?? 0) - 1;
      const dataFromAPI = await ChatsFactory.apiChatDialogsGet(
        apiPage,
        pageData.size,
        "last_message_at,desc",
      );

      setData(dataFromAPI.data?.data ?? []);
      setPageData({
        ...dataFromAPI.data.page,
        page: (dataFromAPI.data.page?.page ?? 0) + 1,
      });
    } catch (e) {
      console.error(e);
    } finally {
      setLoading(false);
    }
  }, [pageData.page, pageData.size]);

  const socketListener = useCallback(
    // eslint-disable-next-line
    (...websocketTarget: MessageEvent<any>[]) => {
      const dataMessages: Single[] = websocketTarget.map((item) => {
        const message = JSON.parse(item.data) as ChatMessageBody;
        return {
          id: message.dialog_id,
          user: message.dialog?.user,
          last_message: {
            ...message,
          },
        };
      });

      setData((prev) => {
        const dialogsss: Single[] = [...dataMessages];

        for (const newDialog of dataMessages) {
          for (const prevDialog of prev) {
            if (newDialog.id !== prevDialog.id) {
              dialogsss.push(prevDialog);
            }
          }
        }

        return dialogsss;
      });
    },
    // eslint-disable-next-line
    [],
  );

  return (
    <Workspace title={t("title")} noRefresh>
      {loading && <Skeleton active={true} />}
      {!loading && data && (
        <List
          style={{ background: "white", padding: "16px" }}
          pagination={{
            onChange: (page) => {
              setPageData({
                ...pageData,
                page,
              });
            },
            pageSize: pageData.size,
            total: pageData.totalElements,
            current: pageData.page ?? 0 + 1,
          }}
          itemLayout="horizontal"
          dataSource={data}
          renderItem={(item) => {
            if (!item.user) {
              return null;
            }

            const { first_name, middle_name, last_name } = item.user;

            return (
              <List.Item onClick={() => onElementClick(item)}>
                <List.Item.Meta
                  avatar={
                    <Avatar
                      src={
                        item.user?.image_id
                          ? `/api/file/${item.user?.image_id}/download`
                          : ""
                      }
                      icon={!item.user?.image_id ? <UserOutlined /> : null}
                    />
                  }
                  title={
                    <Link name={"users:show"} params={{ id: item.user?.id }}>
                      {fullName(first_name, middle_name, last_name)}
                    </Link>
                  }
                  description={item.last_message?.body}
                />
                <Row align="top" style={{ marginRight: "10px" }}>
                  <Col>
                    <Row
                      justify="center"
                      style={{
                        color: "gray",
                        fontSize: "12px",
                        marginBottom: "5px",
                      }}
                    >
                      {formatDate(item.last_message?.created_at)}
                    </Row>
                    <Row justify="end">
                      <Badge count={item.unread_message_counter}></Badge>
                    </Row>
                  </Col>
                </Row>
              </List.Item>
            );
          }}
        />
      )}
    </Workspace>
  );
};

export const name = "chats:index";

export const pageComponent: FC = () => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform={name}
          yes={() => <ChatsPage />}
          no={() => <Unauthorized />}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/chats/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{pages/faq/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useState } from "react";
import Elm from "react-elm-components";
import Editor from "react-markdown-editor-lite";
import { Button } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { CharityFactory } from "@providers/axios";
import FaqElm from "Elm/FAQ.elm";

// import PrettyFAQ from "Home/FAQ";
import FAQ from "components/FAQ";

const Actions: FC<{ onSubmit: () => Promise<void>; loading: boolean }> = ({
  onSubmit,
  loading,
}) => {
  const { t } = useTranslation("FAQ");

  return (
    <Button type="primary" onClick={onSubmit} loading={loading}>
      {t("save")}
    </Button>
  );
};

const FAQPage: FC = () => {
  const [loading, setLoading] = useState(false);

  const { data, refetchQuery } = useAxios(
    CharityFactory.apiCharityFaqGet,
    false,
  );

  const { t } = useTranslation("FAQ");

  const editorRef = React.useRef<Editor>(null);

  const onSubmit = useCallback(async () => {
    try {
      setLoading(true);
      const text = (editorRef as React.RefObject<Editor>).current?.getMdValue();
      await CharityFactory.apiCharityFaqPatch({ faq: text });

      notify(t("update_success"), "success");
    } catch (e) {
      console.log(e);
      notify(t("update_error"), "error");
    } finally {
      setLoading(false);
      await refetchQuery();
    }
  }, [editorRef, refetchQuery, t]);

  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform="faq:pretty"
            yes={() => (
              <Elm
                key={data?.faq}
                src={FaqElm.Elm.Elm.FAQ}
                flags={{
                  faq: data?.faq ?? "",
                }}
              />
            )}
            no={() => (
              <Workspace
                noRefresh
                title={t("title")}
                actions={
                  <RoleSwitch
                    role={user.role}
                    perform="faq:edit"
                    yes={() => (
                      <Actions onSubmit={onSubmit} loading={loading} />
                    )}
                  />
                }
              >
                <FAQ
                  role={user.role}
                  text={data?.faq ?? ""}
                  editorRef={editorRef}
                />
              </Workspace>
            )}
          />
        );
      }}
    </AuthConsumer>
  );
};

export const name = "fund:faq-index";

export default FAQPage;
\end{lstlisting}
\subsection{pages/fund/dashboard.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useEffect, useState } from "react";
import { Card, Typography } from "antd";
import { Bar, Line, Pie } from "@ant-design/charts";
import { useTranslation, Workspace } from "@providers";
import useAxios, {
  CharityFactory,
  DonationRequestFactory,
  AnalyticsFactory,
  UserApiRole,
  UserRequestFactory,
} from "@providers/axios";
import { drop } from "lodash";

import Elm from "react-elm-components";
import Analytics from "Elm/Analytics.elm";

import { ApplicationStatus } from "components/Application/Status/tag";
import StatisticsCard from "components/Fund/Statistics";

type BarData = {
  title: string;
  count: number;
};

const LineStat: FC = () => {

  const { data } = useAxios(AnalyticsFactory.apiAnalyticsGetDonationsSumByMonthGet);

  var config = {
    data: (drop(data, 1)).map((item) => {
      return {
        month: item.month,
        key: (`${item.month} ${item.year}`),
        value: item.total,
      }
    }),
    xField: 'month',
    yField: 'value',
    //seriesField: 'key',
    //stepType: 'hvh',
    label: {},
    point: {
      size: 5,
      shape: 'diamond',
      style: {
        fill: 'white',
        stroke: '#5B8FF9',
        lineWidth: 2,
      },
    },
    tooltip: { showMarkers: false },
    state: {
      active: {
        style: {
          shadowColor: 'yellow',
          shadowBlur: 4,
          stroke: 'transparent',
          fill: 'red',
        },
      },
    },
    theme: {
      geometries: {
        point: {
          diamond: {
            active: {
              style: {
                shadowColor: '#FCEBB9',
                shadowBlur: 2,
                stroke: '#F6BD16',
              },
            },
          },
        },
      },
    },
    interactions: [{ type: 'marker-active' }],
  };
  return <Line {...config} />;
}

const CategoryStat: FC = () => {
  const { data } = useAxios(AnalyticsFactory.apiAnalyticsGetTopCategoriesCountGet);

  var config = {
    data: (data ?? []).map((item) => {
      return {
        type: item.category_id,
        value: item.count
      }
    }),
    angleField: 'value',
    colorField: 'type',
    radius: 0.8,
    label: {
      type: 'outer',
      content: '{name} {percentage}',
    },
    interactions: [{ type: 'pie-legend-active' }, { type: 'element-active' }],
  };

  return <Pie loading={data === undefined} {...config} />
}

const ApplicationStat: FC = () => {
  const { t } = useTranslation("Application");

  const [data, setData] = useState<Array<BarData> | undefined>(undefined);

  const getBarDataFromAPI = useCallback(async (): Promise<void> => {
    const neW = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.New],
    );

    const inProcessing = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.InProcessing],
    );

    const imp = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.NeedsImprovement],
    );

    const uconf = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.UserConfirmation],
    );

    const sconf = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.SuperManagerConfirmation],
    );

    const active = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.Active],
    );

    const deleted = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.Deleted],
    );

    const spam = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.Spam],
    );

    const archieved = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.Archived],
    );

    const onRealizarion = await DonationRequestFactory.apiDonationRequestGet(
      0,
      1,
      "",
      undefined,
      undefined,
      [ApplicationStatus.OnRealization],
    );

    setData([
      {
        title: t(`Status.${ApplicationStatus.New}`),
        count: neW?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.InProcessing}`),
        count: inProcessing?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.NeedsImprovement}`),
        count: imp?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.UserConfirmation}`),
        count: uconf?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.SuperManagerConfirmation}`),
        count: sconf?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.Active}`),
        count: active?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.OnRealization}`),
        count: onRealizarion?.data.page?.totalElements ?? 0
      },
      {
        title: t(`Status.${ApplicationStatus.Deleted}`),
        count: deleted?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.Spam}`),
        count: spam?.data.page?.totalElements ?? 0,
      },
      {
        title: t(`Status.${ApplicationStatus.Archived}`),
        count: archieved?.data.page?.totalElements ?? 0,
      },
    ]);
  }, [t]);

  useEffect(
    () => {
      if (!data) {
        getBarDataFromAPI();
      }
    },
    // eslint-disable-next-line
    [],
  );

  return (
    <Bar
      loading={data ? false : true}
      {...{
        data: data ?? [],
        xField: "count",
        yField: "title",
        seriesField: "title",
      }}
    />
  );
};

const FundPage: FC = () => {
  const { t } = useTranslation("Fund");

  const { data: balance, loading: balanceLoading } = useAxios(
    CharityFactory.apiCharityBalanceGet,
    false,
  );
  const {
    data: staff,
    loading: staffLoading,
  } = useAxios(UserRequestFactory.apiUserGet, false, 0, 1, "", [
    UserApiRole.Admin,
    UserApiRole.Manager,
    UserApiRole.SuperManager,
    UserApiRole.Operator,
    UserApiRole.ContentManager,
  ]);

  const {
    data: users,
    loading: usersLoading,
  } = useAxios(UserRequestFactory.apiUserGet, false, 0, 1, "", [
    UserApiRole.User,
  ]);

  const {
    data: applications,
    loading: applicationsLoading,
  } = useAxios(
    DonationRequestFactory.apiDonationRequestGet,
    false,
    0,
    1,
    "",
    undefined,
    undefined,
    [ApplicationStatus.Active],
  );

  return (
    <Workspace title={t("title", { name: "Charity" })}>
      {/* <StatisticsCard
        loading={
          staffLoading || applicationsLoading || usersLoading || balanceLoading
        }
        balance={balance}
        usersCount={users?.page?.totalElements}
        activeApplications={applications?.page?.totalElements}
        staffCount={staff?.page?.totalElements}
      /> */}
      <Card style={{ marginTop: 5 }}>
        <CategoryStat />
      </Card>

      {/* <Card style={{ marginTop: 5 }}>
        <ApplicationStat />
      </Card> */}

      <Card style={{ marginTop: 5 }}>
        <Typography.Title level={3}>{t("dontations_ny_month")}</Typography.Title>
        <LineStat />
      </Card>

      <Elm
        src={Analytics.Elm.Elm.Main}
      />
    </Workspace>
  );
};

export const name = "fund:dashboard";

export default FundPage;
\end{lstlisting}
\subsection{pages/fund/description.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useRef } from "react";
import Elm from "react-elm-components";
import { Button, Empty, Skeleton } from "antd";
import { CharityFundInput } from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { CharityFactory } from "@providers/axios";
import FundElm from "Elm/Fund.elm";

import EditFundDescription, {
  CharityInfoHandler,
} from "components/Fund/Description/edit";
import { FundDescriptionView } from "components/Fund/Description/view";

const FundDescription: FC = () => {
  const { t } = useTranslation("Fund");

  const { data, loading } = useAxios(CharityFactory.apiCharityGet);

  const handlers = useRef<CharityInfoHandler>(null);

  const onSubmit = useCallback(
    async (values: CharityFundInput) => {
      try {
        await CharityFactory.apiCharityPatch({
          ...values,
        });

        notify(t("update_success"), "success");
      } catch (e) {
        console.error(e);
        notify(t("update_error"), "error");
      }
    },
    [t],
  );

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  if (loading) {
    return <Skeleton active={loading} />;
  }

  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform="fund:description-pretty" // visitor or not
            yes={() => (
              <Elm
                src={FundElm.Elm.Elm.Fund}
                flags={{
                  phone: null,
                  email: null,
                  address: null,
                  files: null,
                  ...data,
                }}
              />
            )}
            no={() => (
              <Workspace
                noRefresh
                title={t("title")}
                actions={
                  <RoleSwitch
                    role={user.role}
                    perform="fund:description-edit" // has permission to edit or not
                    yes={() => (
                      <Button
                        type="primary"
                        onClick={() => handlers.current?.submit()}
                      >
                        {t("save")}
                      </Button>
                    )}
                  />
                }
              >
                <RoleSwitch
                  role={user.role}
                  perform="fund:description-edit"
                  yes={() => (
                    <EditFundDescription
                      ref={handlers}
                      onSubmit={onSubmit}
                      initialInfo={data}
                    />
                  )}
                  no={() => <FundDescriptionView data={data} />}
                />
              </Workspace>
            )}
          />
        );
      }}
    </AuthConsumer>
  );
};

export const name = "fund:description";

export default FundDescription;
\end{lstlisting}
\subsection{pages/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import Elm from "react-elm-components";
import RoleSwitch from "@lib/components/RoleSwitch";
import { router } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { Role } from "@providers/rbac-rules";
import Main from "Elm/Main.elm";

//import Home from "Home";
import Redirect from "./_redirect";

// eslint-disable-next-line
function setupPorts(ports: { clickedUrl: any }): void {
  ports.clickedUrl.subscribe((urlName: string) => {
    router.navigate({ url: router.url({ name: urlName }) });
  });
}

const Index: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform="auth:login"
            yes={() => (
              /*<div style={{ background: "white" }}>*/
              <Elm
                src={Main.Elm.Elm.Main}
                flags={{ width: window.innerWidth, height: window.innerHeight }}
                ports={setupPorts}
              />
              //</div>
            )}
            no={() => {
              switch (user.role) {
                case Role.admin:
                  return <Redirect name="users:index" />;
                case Role.contentManager:
                  return <Redirect name="fund:description" />;
                case Role.operator:
                  return <Redirect name="chats:index" />;
                default:
                  return <Redirect name="applications:index" />;
              }
            }}
          />
        );
      }}
    </AuthConsumer>
  );
};

export const name = "home";

export default Index;
\end{lstlisting}
\subsection{pages/login/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import RoleSwitch from "@lib/components/RoleSwitch";
import { AuthConsumer } from "@providers/authContext";
import Redirect from "pages/_redirect";

import LoginForm from "components/Login";

const LoginPage: FC = () => {
  return (
    <AuthConsumer>
      {({ initiateLogin, user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform="auth:login"
            yes={() => <LoginForm onLogin={initiateLogin} />}
            no={() => <Redirect name="home" />}
          />
        );
      }}
    </AuthConsumer>
  );
};

export default LoginPage;
\end{lstlisting}
\subsection{pages/logs/index.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import { useTranslation } from "react-i18next";
import { AuditAudit as Single, AuditResponse as Result } from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { format } from "@lib/utils/date";
import { fullName } from "@lib/utils/name";
import { Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { AuditFactory } from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import RoleTag from "components/User/Role/tag";

import styles from "./styles.module.less";

const LogsPage: FC = () => {
  const { t } = useTranslation("Log");

  const {
    isTarget,
    isSelected,
    onElementClick,
    setList,
  } = useListSelection<Single>();

  const paginationState = useRef<StateRef>(null);

  const columns = [
    {
      key: "date",
      render(record: Single) {
        return format(record.created_at);
      },
    },
    {
      key: "who",
      render(record: Single) {
        if (!record.author) {
          return null;
        }
        const { first_name, middle_name, last_name } = record.author;
        return fullName(first_name, middle_name, last_name);
      },
    },
    {
      key: "role",
      render(record: Single) {
        if (!record?.author?.role) {
          return null;
        }
        return <RoleTag roles={[record.author.role]} />;
      },
    },
    {
      key: "action",
      render(record: Single) {
        return record.type;
      },
    },
  ];

  return (
    <Workspace noRefresh title={t("title")}>
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        requestQuery={AuditFactory.apiAuditGet}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <RegistryTable
            entity="Log"
            expandable={{
              expandedRowRender(record: Single) {
                const data = JSON.parse(record?.data ?? "");
                const r = {
                  ...record,
                  data,
                };
                return (
                  <div>
                    <pre style={{ fontSize: "10px" }}>
                      {JSON.stringify(r, null, 3)}
                    </pre>
                  </div>
                );
              },
              rowExpandable: (record) => record.name !== "Not Expandable",
            }}
            columns={columns}
            // eslint-disable-next-line
            rows={entries as Record<string, any>[]} // TODO
            rowState={(record, index) => ({
              selected: isSelected(index),
              target: isTarget(index),
            })}
            onRecordClick={(event, record, index) => {
              if (index !== undefined) {
                onElementClick(event, index);
              }
            }}
          />
        )}
      />
    </Workspace>
  );
};

export const name = "logs:index";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <LogsPage />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/logs/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{pages/managers/[id]/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Empty, Skeleton } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { PageProps, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { UserRequestFactory } from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import ManagerView from "components/Manager/View";

const ManagerPage: FC<PageProps> = ({ response }) => {
  const { t: pt } = useTranslation("Users");

  const id = response.params.id as string;

  const { data, loading } = useAxios(
    UserRequestFactory.apiUserIdGet,
    false,
    id,
  );

  if (loading) {
    return <Skeleton active={loading} />;
  }

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  const user = data;

  return (
    <AuthConsumer>
      {({ user: u }) => {
        return (
          <Workspace noRefresh withBack title={pt(`Role.${user.role}`)}>
            <ManagerView user={user} role={u.role} />
          </Workspace>
        );
      }}
    </AuthConsumer>
  );
};

export const name = "managers:show";

export const pageComponent: FC<PageProps> = (props) => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <ManagerPage {...props} />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/managers/index.tsx}
\begin{lstlisting}
import React, { FC, useRef, useState } from "react";
import { Avatar, Card, Select, Space } from "antd";
import { UserOutlined } from "@ant-design/icons";
// import { CheckOutlined, SyncOutlined } from "@ant-design/icons";
import {
  AuthManagerRegistrationInputRoleEnum as Roles,
  UserResponse as Result,
  UserUser as Single,
  UserUserRoleEnum,
} from "@generated";
// import Metrics from "@lib/components/Metrics";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { formatDate } from "@lib/utils";
import { fullName } from "@lib/utils/name";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { UserRequestFactory } from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import { ClearButton } from "components/Application/Filters";
import RoleTag from "components/User/Role/tag";

import styles from "./styles.module.less";

const FilterRolesArr = [
  Roles.SuperManager,
  Roles.Operator,
  Roles.Manager,
  Roles.ContentManager,
  Roles.Admin,
];

const ManagersFilters: FC<{
  initial?: string[];
  setFilter: (roles?: string[]) => void;
}> = ({ initial, setFilter }) => {
  const { t } = useTranslation("Users");

  return (
    <Card>
      <Space>
        <Select
          placeholder={t("filter.roles")}
          mode="multiple"
          onChange={(value) => {
            setFilter(value);
          }}
          allowClear
          value={initial}
          onClear={() => setFilter(undefined)}
          style={{ width: "auto", minWidth: 300 }}
        >
          {FilterRolesArr.map((value, ind) => {
            return (
              <Select.Option value={value} key={ind}>
                {t(`Role.${value}`)}
              </Select.Option>
            );
          })}
        </Select>
        <ClearButton onClearAll={() => setFilter()} />
      </Space>
    </Card>
  );
};

type ManagerFilter = {
  roles?: string[];
};

const ManagersPage: FC = () => {
  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const paginationState = useRef<StateRef>(null);

  const { t } = useTranslation("Manager");

  const [filter, setFilter] = useState<ManagerFilter>({});

  const onElementClick = (record: Single): void => {
    router.navigate({
      url: router.url({ name: "managers:show", params: { id: record.id } }),
    });
  };

  const columns = [
    {
      key: "photo",
      title: "",
      width: "6%",
      render(record: Single) {
        const props = {
          src: record.image_id
            ? `/api/file/${record.image_id}/download`
            : undefined,
          icon: record.image_id ? undefined : <UserOutlined />,
        };
        return <Avatar {...props} />;
      },
    },
    {
      key: "name",
      width: "25%",
      render(record: Single) {
        return fullName(
          record.first_name,
          record.middle_name,
          record.last_name,
        );
      },
    },
    {
      key: "roles",
      width: "12%",
      render(record: Single) {
        return <RoleTag roles={[record.role ?? UserUserRoleEnum.User]} />;
      },
    },
    {
      key: "email",
      render(record: Single) {
        return record.email;
      },
    },
    {
      key: "createdAt",
      render(record: Single) {
        return formatDate(record.created_at);
      },
    },
  ];

  return (
    <Workspace noRefresh title={t("title")}>
      <ManagersFilters
        initial={filter.roles}
        setFilter={(roles) => setFilter({ roles })}
      />
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        requestQuery={UserRequestFactory.apiUserGet}
        variables={{
          sort: "",
          role: filter.roles ?? FilterRolesArr,
        }}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <RegistryTable
            entity="Manager"
            columns={columns}
            // eslint-disable-next-line
            rows={entries as Record<string, any>[]} // TODO
            rowState={(record, index) => ({
              selected: isSelected(index),
              target: isTarget(index),
            })}
            onRecordClick={(event, record, index) => {
              if (index !== undefined) {
                onElementClick(record);
              }
            }}
          />
        )}
      />
    </Workspace>
  );
};

export const name = "managers:index";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <ManagersPage />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/managers/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{pages/news/[id]/edit/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useRef } from "react";
import { Button, Card, Empty, Skeleton } from "antd";
import { NewsInput } from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { PageProps, router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { NewsFactory } from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import NewsForm, { NewsFormHandler } from "components/News";

const EditNewsPage: FC<PageProps> = ({ response }) => {
  const { t } = useTranslation("News");

  const id = response.params.id as string;

  const handlers = useRef<NewsFormHandler>(null);

  const { data, loading } = useAxios(NewsFactory.apiNewsIdGet, undefined, id);

  const onEdit = useCallback(
    (values: NewsInput) => {
      NewsFactory.apiNewsIdPatch(id, {
        ...values,
      })
        .then(() => {
          notify(t("$views.editSuccess"), "success");
          router.navigate({ url: router.url({ name: "news:index" }) });
        })
        .catch((e) => {
          console.error(e);
          notify(t("$views.editError"), "error");
        });
    },
    [t, id],
  );

  if (loading) {
    return <Skeleton active={loading} />;
  }

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  return (
    <Workspace
      title={t("editTitle")}
      noRefresh
      withBack
      actions={
        <Button type="primary" onClick={() => handlers.current?.submit()}>
          {t("$views.buttons.edit")}
        </Button>
      }
    >
      <Card>
        <NewsForm ref={handlers} onSubmit={onEdit} initial={data} />
      </Card>
    </Workspace>
  );
};

export const name = "news:edit";

export const pageComponent: FC<PageProps> = (props) => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <EditNewsPage {...props} />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/news/create/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useRef } from "react";
import { Button, Card } from "antd";
import { NewsInput } from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { NewsFactory } from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import NewsForm, { NewsFormHandler } from "components/News";

const CreateNewsPage: FC = () => {
  const { t } = useTranslation("News");

  const handlers = useRef<NewsFormHandler>(null);

  const onCreate = useCallback(
    (values: NewsInput) => {
      NewsFactory.apiNewsPost({
        ...values,
      })
        .then(() => {
          notify(t("$views.createSuccess"), "success");
          router.navigate({ url: router.url({ name: "news:index" }) });
        })
        .catch((e) => {
          console.error(e);
          notify(t("$views.createError"), "error");
        });
    },
    [t],
  );

  return (
    <Workspace
      title={t("createTitle")}
      noRefresh
      withBack
      actions={
        <Button type="primary" onClick={() => handlers.current?.submit()}>
          {t("$views.buttons.add")}
        </Button>
      }
    >
      <Card>
        <NewsForm ref={handlers} onSubmit={onCreate} initial={undefined} />
      </Card>
    </Workspace>
  );
};

export const name = "news:create";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <CreateNewsPage />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/news/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useRef, useState } from "react";
import { Button, Col, Image, List, Row } from "antd";
import { NewsResponse as Result, NewsView as Single } from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { DateTimeFormat, format } from "@lib/utils/date";
import { notify } from "@lib/utils/notification";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { NewsFactory } from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import styles from "./styles.module.less";

const Actions: FC = () => {
  const { t } = useTranslation("News");

  return (
    <Button
      type="primary"
      onClick={() => {
        router.navigate({
          url: router.url({ name: "news:create" }),
        });
      }}
    >
      {t("create")}
    </Button>
  );
};

const NewsPage: FC = () => {
  const { t } = useTranslation("News");

  const { setList } = useListSelection<Single>();

  const [refetch, setRefetch] = useState<boolean | undefined>(undefined);

  const paginationState = useRef<StateRef>(null);

  // wtf
  const refetchFund = useCallback(() => {
    setRefetch(!refetch);
  }, [refetch]);

  const deleteItemRequest = useCallback(
    async (id: string) => {
      try {
        await NewsFactory.apiNewsIdDelete(id);

        notify(t("$views.deleteSuccess"));
      } catch (e) {
        console.error(e);
        notify(t("$views.deleteError"));
      } finally {
        refetchFund();
      }
    },
    [t, refetchFund],
  );

  return (
    <Workspace title={t("title")} noRefresh actions={<Actions />}>
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        requestQuery={NewsFactory.apiNewsGet}
        stateRef={paginationState}
        refetch={refetch}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <List
            className="demo-loadmore-list"
            itemLayout="horizontal"
            dataSource={entries}
            renderItem={(item) => (
              <List.Item
                key={item.created_at}
                actions={[
                  <Button
                    key="0"
                    type="link"
                    onClick={() => deleteItemRequest(item.id ?? "")}
                  >
                    {t("delete")}
                  </Button>,
                  <Button
                    key="1"
                    type="link"
                    onClick={() => {
                      router.navigate({
                        url: router.url({
                          name: "news:edit",
                          params: { id: item.id },
                        }),
                      });
                    }}
                  >
                    {t("edit")}
                  </Button>,
                ]}
              >
                <Row justify="start">
                  <Col>
                    <Image
                      width={150}
                      style={{ padding: 8, paddingRight: 20 }}
                      src={`/api/file/${item.image_id}/download`}
                      fallback={"https://placeholder.pics/svg/300"}
                    />
                  </Col>
                  <Col span={10}>
                    <div style={{ minWidth: "300px" }}>
                      <h3>{item.title}</h3>
                      <List.Item.Meta
                        description={format(
                          item.updated_at,
                          DateTimeFormat.DATE_SHORT,
                        )}
                      />
                      {item.description}
                    </div>
                  </Col>
                </Row>
              </List.Item>
            )}
          />
        )}
      />
    </Workspace>
  );
};

export const name = "news:index";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <NewsPage />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/news/public/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import Elm from "react-elm-components";
import RoleSwitch from "@lib/components/RoleSwitch";
import { AuthConsumer } from "@providers/authContext";
import NewsPublicElm from "Elm/News.elm";
import Redirect from "pages/_redirect";

const PublicNewsPage: FC = () => {
  return (
    <Elm
      src={NewsPublicElm.Elm.Elm.News}
      flags={{ baseUrl: process.env.REACT_APP_API_URL }}
    />
  );
};

export const name = "news:public";

export const pageComponent = (): JSX.Element => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <PublicNewsPage />}
            no={() => <Redirect name="home" />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/news/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{pages/notifications/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Card, Tabs } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import Redirect from "pages/_redirect";

import { AllnNotificationsPage } from "components/Notifications/all";
import { BlockchainNotificationsPage } from "components/Notifications/blockchain";

const { TabPane } = Tabs;

const NotificationsPage: FC = () => {
  const { t } = useTranslation("Notifications");

  return (
    <Workspace noRefresh title={t("title")}>
      <Card>
        <Tabs defaultActiveKey="1">
          <TabPane tab={t("all_title")} key="1">
            <AllnNotificationsPage />
          </TabPane>
          <TabPane tab={t("blockchain_title")} key="2">
            <BlockchainNotificationsPage />
          </TabPane>
        </Tabs>
      </Card>
    </Workspace>
  );
};

export const name = "notifications:index";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <NotificationsPage />}
            no={() => <Redirect name="home"></Redirect>}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/settings/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useRef } from "react";
import { useTranslation } from "react-i18next";
import { Button, Card, Empty, Select, Skeleton } from "antd";
import { UserEditableInfo, UserSettingsLanguageEnum } from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, {
  SettingsFactory,
  UserRequestFactory,
} from "@providers/axios";
import i18n from "i18next";
import Redirect from "pages/_redirect";

import { PersonalSettings } from "components/Settings";
import { PersonalSettingsHandler } from "components/Settings/Personal";

const SettingsPage: FC = () => {
  const { t } = useTranslation("Settings");

  const id = localStorage.getItem("uuid");

  const handlers = useRef<PersonalSettingsHandler>(null);

  const onSubmit = useCallback(
    async (values: UserEditableInfo) => {
      try {
        await UserRequestFactory.apiUserIdPatch(id ?? "", {
          ...values,
        });

        notify(t("update_success"), "success");
      } catch {
        notify(t("update_error"), "error");
      }
    },
    [id, t],
  );

  const onChangeLanguage = useCallback(
    async (lang: UserSettingsLanguageEnum) => {
      try {
        await SettingsFactory.apiUserSettingsPatch({
          language: lang,
        });

        i18n.changeLanguage(lang);

        localStorage.setItem("language", lang);

        notify(t("updateLang_success"), "success");
      } catch {
        notify(t("updateLang_error"), "error");
      }
    },
    [t],
  );

  const { data, loading } = useAxios(
    UserRequestFactory.apiUserIdGet,
    undefined,
    id,
  );

  if (loading) {
    return <Skeleton active={loading} />;
  }

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  return (
    <Workspace
      title={t("title")}
      noRefresh
      actions={
        <Button onClick={() => handlers.current?.submit()}>
          {t("updateButton")}
        </Button>
      }
    >
      <PersonalSettings
        ref={handlers}
        onSubmit={onSubmit}
        initial={data}
        categories={[]}
      />

      <Card title={t("language")} style={{ marginTop: "4px" }} id="language">
        <Select
          onChange={(value) => {
            onChangeLanguage(value as UserSettingsLanguageEnum);
          }}
          value={i18n.language.startsWith("en") ? "en" : "ru"}
          style={{ width: 180, margin: "0 8px" }}
        >
          <Select.Option value="ru">
            {t("languageSetting.russian")}
          </Select.Option>
          <Select.Option value="en">
            {t("languageSetting.english")}
          </Select.Option>
        </Select>
      </Card>
    </Workspace>
  );
};

export const pageComponent: FC = () => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform="settings:index"
          yes={() => <SettingsPage />}
          no={() => <Redirect name="home"></Redirect>}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/settings/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.header {
  background-color: @component-background;
  padding-left: @main-horizontal-padding;
  padding-right: @main-horizontal-padding;
  margin-bottom: @layout-margin;
}

.sider {
  background-color: @component-background;
  margin-right: @layout-margin;
  padding-top: 10px;
  padding-left: 15px;
}
\end{lstlisting}
\subsection{pages/transactions/[id]/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Empty, Skeleton } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { PageProps, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { DonationsFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import TransactionView from "components/Transaction/View";

const TransactionPage: FC<PageProps> = ({ response }) => {
  const id = response.params.id as string;

  const { t } = useTranslation("Transaction");

  const { data, loading } = useAxios(
    DonationsFactory.apiDonationsIdGet,
    undefined,
    id,
  );

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }
  if (loading) {
    return <Skeleton active={loading} />;
  }

  return (
    <Workspace noRefresh withBack title={t("pageTitle")}>
      <TransactionView transaction={data} />
    </Workspace>
  );
};

export const name = "transactions:show";

export const pageComponent: FC<PageProps> = (props) => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <TransactionPage {...props} />}
            no={() => <Redirect name="home"></Redirect>}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/transactions/create/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback } from "react";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { MoneyFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import TransactionForm, {
  TransactionFormState,
} from "components/Transaction/Form";

const TransactionCreatePage: FC = () => {
  const { t } = useTranslation("Transaction");

  const createTransactionToFundAPI = useCallback(
    async (values: TransactionFormState) => {
      try {
        await MoneyFactory.apiMoneyDonateCharityFromManagerPost({
          donor: {
            first_name: values.first_name,
            middle_name: values.middle_name,
            last_name: values.last_name,
          },
          amount: {
            denominator: 1,
            numerator: values.donation.amount,
            currency: "RUB",
          },
        });

        notify(t("create_donation_fund_success"), "success");

        router.navigate({ url: router.url({ name: "transactions:index" }) });
      } catch (e) {
        notify(t("create_donation_fund_error"), "error");
      }
    },
    [t],
  );

  const createTransactionToApplicationAPI = useCallback(
    async (values: TransactionFormState) => {
      try {
        const {
          data,
        } = await MoneyFactory.apiMoneyDonateCharityFromManagerPost({
          donor: {
            first_name: values.first_name,
            middle_name: values.middle_name,
            last_name: values.last_name,
          },
          amount: {
            denominator: 1,
            numerator: values.donation.amount,
            currency: "RUB",
          },
        });

        await MoneyFactory.apiMoneyDonateApplicationFromCharityPost({
          amount: {
            denominator: 1,
            numerator: values.donation.amount,
            currency: "RUB",
          },
          anonymous: values.anonymous,
          application_id: values.applicationId ?? 0,
          donor_id: data.id,
        });

        notify(t("create_donation_application"), "success");

        router.navigate({ url: router.url({ name: "transactions:create" }) });
      } catch (e) {
        notify(t("create_donation_application_err"), "error");
      }
    },
    [t],
  );

  return (
    <Workspace noRefresh withBack title={t("createPageTitle")}>
      <TransactionForm
        onSubmit={(values) => {
          if (values.type === "fund") {
            createTransactionToFundAPI(values);
          } else {
            createTransactionToApplicationAPI(values);
          }
        }}
      />
    </Workspace>
  );
};

export const name = "transactions:create";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <TransactionCreatePage />}
            no={() => <Redirect name="home"></Redirect>}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/transactions/distribute/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback } from "react";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { MoneyFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import DistributeMoneyForm, {
  DistributeMoneyFormState,
} from "components/Transaction/Form/distribute";

const DistributeMoneyPage: FC = () => {
  const { t } = useTranslation("Transaction");

  const createTransactionToFundAPI = useCallback(
    async (values: DistributeMoneyFormState) => {
      try {
        await MoneyFactory.apiMoneyDonateApplicationFromCharityPost({
          amount: {
            denominator: 1,
            numerator: values.donation.amount,
            currency: "RUB",
          },
          application_id: values.applicationId ?? 0,
        });

        notify(t("create_donation_fund_success"), "success");

        router.navigate({ url: router.url({ name: "transactions:index" }) });
      } catch (e) {
        notify(t("create_donation_fund_error"), "error");
      }
    },
    [t],
  );

  return (
    <Workspace noRefresh withBack title={t("createPageTitle")}>
      <DistributeMoneyForm onSubmit={createTransactionToFundAPI} />
    </Workspace>
  );
};

export const name = "transactions:distribute";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <DistributeMoneyPage />}
            no={() => <Redirect name="home"></Redirect>}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/transactions/index.tsx}
\begin{lstlisting}
import React, { FC, useRef } from "react";
import { Button, Space, Tag } from "antd";
import {
  BlockchainDonation as Single,
  BlockchainDonationsResponse as Result,
} from "@generated"; // TODO: replace to TransactionRequestBody
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable from "@lib/components/RegistryTable";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { formatDate, formatMoney } from "@lib/utils";
import { cred } from "@lib/utils/name";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { DonationsFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import styles from "./styles.module.less";

const Actions: FC = () => {
  const { t } = useTranslation("Transaction");

  return (
    <Space>
      <Button
        onClick={() => {
          router.navigate({ url: router.url({ name: "transactions:create" }) });
        }}
      >
        {t("createTransaction")}
      </Button>

      <Button
        type="primary"
        onClick={() => {
          router.navigate({
            url: router.url({ name: "transactions:distribute" }),
          });
        }}
      >
        {t("dictributeMoney")}
      </Button>
    </Space>
  );
};

const TransactionsPage: FC = () => {
  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const onElementClick = (id: string): void => {
    router.navigate({
      url: router.url({ name: "transactions:show", params: { id } }),
    });
  };

  const paginationState = useRef<StateRef>(null);

  const { t } = useTranslation("Transaction");

  const columns = [
    {
      key: "sum",
      render(record: Single) {
        return formatMoney(record.amount);
      },
    },
    {
      key: "who",
      render(record: Single) {
        if (!record.donation_author) {
          return <>-</>;
        }
        const { first_name, middle_name, last_name } = record.donation_author;
        return cred(first_name, middle_name, last_name);
      },
    },
    {
      key: "aim",
      render(record: Single) {
        return (
          <>
            {record.donation_request && (
              <Tag color="blue">
                {t("to_application", { id: record.donation_request.id })}
              </Tag>
            )}
            {!record.donation_request && (
              <Tag color="default">{t("to_fund")}</Tag>
            )}
          </>
        );
      },
    },

    {
      key: "createdAt",
      render(record: Single) {
        return formatDate(record.created_at);
      },
    },
  ];

  // TODO: replace api calls to TransactionsFactory
  return (
    <Workspace noRefresh title={t("title")} actions={<Actions />}>
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        requestQuery={DonationsFactory.apiDonationsGet}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <RegistryTable
            entity="Transaction"
            columns={columns}
            // eslint-disable-next-line
            rows={entries as Record<string, any>[]} // TODO
            rowState={(record, index) => ({
              selected: isSelected(index),
              target: isTarget(index),
            })}
            onRecordClick={(event, record, index) => {
              if (index !== undefined) {
                onElementClick(record.id);
              }
            }}
          />
        )}
      />
    </Workspace>
  );
};

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform="transactions:index"
            yes={() => <TransactionsPage />}
            no={() => <Redirect name="home" />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/transactions/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{pages/users/[id]/edit.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useRef } from "react";
import { Button, Empty, Skeleton } from "antd";
import { UserEditableInfo } from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { PageProps, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, {
  CategoryFactory,
  UserRequestFactory,
} from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import { PersonalSettings } from "components/Settings";
import { PersonalSettingsHandler } from "components/Settings/Personal";

const EditUserPage: FC<PageProps> = ({ response }) => {
  const { t } = useTranslation("Settings");

  const id = response.params.id as string;

  const handlers = useRef<PersonalSettingsHandler>(null);

  const onSubmit = useCallback(
    async (values: UserEditableInfo) => {
      try {
        await UserRequestFactory.apiUserIdPatch(id ?? "", {
          ...values,
        });

        notify(t("update_success"), "success");
      } catch {
        notify(t("update_error"), "error");
      }
    },
    [id, t],
  );

  const { data, loading } = useAxios(
    UserRequestFactory.apiUserIdGet,
    undefined,
    id,
  );

  const { data: categories, loading: loadingCategories } = useAxios(
    CategoryFactory.apiCategoriesGet,
  );

  if (loading || loadingCategories) {
    return <Skeleton active={loading} />;
  }

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  if (!categories) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  return (
    <Workspace
      title={t("edit_title")}
      noRefresh
      withBack
      actions={
        <Button onClick={() => handlers.current?.submit()}>
          {t("updateButton")}
        </Button>
      }
    >
      <PersonalSettings
        ref={handlers}
        onSubmit={onSubmit}
        initial={data}
        categories={categories}
      />
    </Workspace>
  );
};

export const name = "user:edit";

export const pageComponent: FC<PageProps> = (props) => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform={name}
          yes={() => <EditUserPage {...props} />}
          no={() => <Unauthorized />}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/users/[id]/index.tsx}
\begin{lstlisting}
import React, { FC } from "react";
import { Empty, Skeleton } from "antd";
import RoleSwitch from "@lib/components/RoleSwitch";
import { fullName } from "@lib/utils/name";
import { PageProps, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, { UserRequestFactory } from "@providers/axios";
import { Role } from "@providers/rbac-rules";

import UserView from "components/User/View";

import Unauthorized from "../../_unauthorized";

const UserPage: FC<PageProps> = ({ response }) => {
  const id = response.params.id as string;

  const { data, loading } = useAxios(
    UserRequestFactory.apiUserIdGet,
    false,
    id,
  );

  if (loading) {
    return <Skeleton active={loading} />;
  }

  if (!data) {
    return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />;
  }

  const user = data;

  const { first_name, middle_name, last_name } = user;

  return (
    <Workspace
      withBack
      noRefresh
      title={fullName(first_name, middle_name, last_name)}
    >
      <UserView user={user} role={Role.manager} />
    </Workspace>
  );
};

export const name = "users:show";

export const pageComponent: FC<PageProps> = (props) => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform={name}
          yes={() => <UserPage {...props} />}
          no={() => <Unauthorized />}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/users/create/index.tsx}
\begin{lstlisting}
import React, { FC, useCallback, useState } from "react";
import { Button, Card, Form, Input, Select, Space } from "antd";
import { useForm } from "antd/lib/form/Form";
import {
  AuthManagerRegistrationInput,
  AuthManagerRegistrationInputRoleEnum as Roles,
} from "@generated";
import RoleSwitch from "@lib/components/RoleSwitch";
import { notify } from "@lib/utils/notification";
import { i18n, router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import useAxios, {
  CategoryFactory,
  RegistrationFactory,
} from "@providers/axios";
import Unauthorized from "pages/_unauthorized";

import SelectCategory from "components/Category/select";

const RolesArr = [
  Roles.User,
  Roles.SuperManager,
  Roles.Operator,
  Roles.Manager,
  Roles.ContentManager,
  Roles.Admin,
];

const { Option } = Select;

const formLayout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 8 },
};

const tailLayout = {
  wrapperCol: { offset: 8, span: 8 },
};

const UserRegisterPage: FC = () => {
  const { t } = useTranslation("Users");

  const [form] = useForm<AuthManagerRegistrationInput>();

  const [role, setRole] = useState<Roles | undefined>();
  const [loading, setLoading] = useState(false);

  const onReset = (): void => {
    form.resetFields();
    setRole(undefined);
  };

  const lang = i18n.language.substr(0, 2);

  const { data: categories } = useAxios(CategoryFactory.apiCategoriesGet);

  const onAdd = useCallback(async () => {
    const data = form.getFieldsValue();
    setLoading(true);
    RegistrationFactory.apiRegisterManagerPost(data)
      .then(() => {
        notify(t("$views.registrationSuccess"), "success");
        router.navigate({ url: router.url({ name: "users:index" }) });
      })
      .catch((e) => {
        console.error(e);
        notify(t("$views.registrationError"), "error");
      })
      .finally(() => {
        setLoading(false);
      });
  }, [form, t]);

  return (
    <Workspace noRefresh withBack title={t("$views.register.title")}>
      <Card>
        <Form {...formLayout} form={form} name="control-hooks" onFinish={onAdd}>
          <Form.Item
            name={["user", "last_name"]}
            label={t("$views.register.last_name")}
            rules={[{ required: true, message: t("$views.message.last_name") }]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            name={["user", "first_name"]}
            label={t("$views.register.name")}
            rules={[
              { required: true, message: t("$views.message.first_name") },
            ]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            name={["user", "middle_name"]}
            label={t("$views.register.middle_name")}
          >
            <Input />
          </Form.Item>

          <Form.Item
            name={["user", "email"]}
            label={t("$views.register.email")}
            rules={[{ required: true, message: t("$views.message.email") }]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            name={["role"]}
            label={t("$views.register.roles")}
            rules={[{ required: true, message: t("$views.message.roles") }]}
          >
            <Select //mode="multiple" TODO
              onChange={(value) => setRole(value as Roles)}
            >
              {RolesArr.map((value) => {
                return (
                  <Option key={value} value={value}>
                    {t(`Role.${value}`)}
                  </Option>
                );
              })}
            </Select>
          </Form.Item>

          {role === Roles.SuperManager && (
            <Form.Item
              name={["assigned_categories"]}
              label={t("$views.register.categories")}
            >
              <SelectCategory categories={categories ?? []} lang={lang} />
            </Form.Item>
          )}

          <Form.Item {...tailLayout}>
            <Space>
              <Button type="primary" htmlType="submit" loading={loading}>
                {t("$views.buttons.add")}
              </Button>

              <Button htmlType="button" onClick={onReset}>
                {t("$views.buttons.reset")}
              </Button>
            </Space>
          </Form.Item>
        </Form>
      </Card>
    </Workspace>
  );
};

export const name = "users:create";

export const pageComponent: FC = () => {
  return (
    <AuthConsumer>
      {({ user }) => {
        return (
          <RoleSwitch
            role={user.role}
            perform={name}
            yes={() => <UserRegisterPage />}
            no={() => <Unauthorized />}
          />
        );
      }}
    </AuthConsumer>
  );
};
\end{lstlisting}
\subsection{pages/users/index.tsx}
\begin{lstlisting}
import React, { FC, useRef, useState } from "react";
import { Avatar, Button, Card, Select, Space, Tooltip } from "antd";
import {
  DownOutlined,
  FrownOutlined,
  UpOutlined,
  UserOutlined,
} from "@ant-design/icons";
import {
  UserResponse as Result,
  UserUser as Single,
  UserUserRoleEnum,
} from "@generated";
import PaginatedQuery, { StateRef } from "@lib/components/Pagination";
import RegistryTable, {
  RegistryColumnConf,
} from "@lib/components/RegistryTable";
import RoleSwitch from "@lib/components/RoleSwitch";
import { useListSelection } from "@lib/hooks";
import { format } from "@lib/utils/date";
import { fullName } from "@lib/utils/name";
import { router, useTranslation, Workspace } from "@providers";
import { AuthConsumer } from "@providers/authContext";
import { UserApiRole, UserRequestFactory } from "@providers/axios";
import Redirect from "pages/_redirect";

import { ClearButton } from "components/Application/Filters";
import RoleTag from "components/User/Role/tag";

import styles from "./styles.module.less";

function sortIcon(sortedInfo?: string): React.ReactNode {
  if (sortedInfo === "role,asc") {
    return <DownOutlined />;
  } else if (sortedInfo === "role,desc") {
    return <UpOutlined />;
  } else {
    return null;
  }
}

const Filter: FC<{
  initial: FilterState;
  onChange: (values: FilterState) => void;
}> = ({ initial, onChange }) => {
  const { t } = useTranslation("Users");

  return (
    <Card style={{ marginBottom: "5px" }}>
      <Space>
        <RoleFilter
          initial={initial.filteredInfo ?? []}
          setFilter={(roles) => {
            onChange({
              ...initial,
              filteredInfo: roles,
            });
          }}
        />
        <Button
          icon={sortIcon(initial.sortedInfo)}
          onClick={() => {
            onChange({
              ...initial,
              sortedInfo:
                initial.sortedInfo === "role,asc" ? "role,desc" : "role,asc",
            });
          }}
        >
          {t("sort.roles")}
        </Button>
        <ClearButton onClearAll={() => onChange({})} />
      </Space>
    </Card>
  );
};

const RoleFilter: FC<{
  initial: string[];
  setFilter: (roles?: string[]) => void;
}> = ({ initial, setFilter }) => {
  const { t } = useTranslation("Users");

  return (
    <Select
      placeholder={t("filter.roles")}
      mode="multiple"
      onChange={(value) => {
        setFilter(value);
      }}
      allowClear
      value={initial}
      onClear={() => setFilter(undefined)}
      style={{ width: "auto", minWidth: 300 }}
    >
      <Select.Option value={UserApiRole.Admin}>
        {t(`Role.${UserApiRole.Admin}`)}
      </Select.Option>
      <Select.Option value={UserApiRole.User}>
        {t(`Role.${UserApiRole.User}`)}
      </Select.Option>
      <Select.Option value={UserApiRole.ContentManager}>
        {t(`Role.${UserApiRole.ContentManager}`)}
      </Select.Option>
      <Select.Option value={UserApiRole.Manager}>
        {t(`Role.${UserApiRole.Manager}`)}
      </Select.Option>
      <Select.Option value={UserApiRole.SuperManager}>
        {t(`Role.${UserApiRole.SuperManager}`)}
      </Select.Option>
    </Select>
  );
};

const BlockedIcon: FC<{ blocked?: boolean }> = ({ blocked }) => {
  const { t } = useTranslation("Users");
  return blocked ? (
    <Tooltip title={t("blocked_tooltip")}>
      <FrownOutlined style={{ color: "red" }} />
    </Tooltip>
  ) : null;
};

const Actions: FC = () => {
  const { t } = useTranslation("Users");

  return (
    <Button
      onClick={() => {
        router.navigate({ url: router.url({ name: "users:create" }) });
      }}
    >
      {t("$views.buttons.registerUser")}
    </Button>
  );
};

type FilterState = {
  filteredInfo?: Array<string>;
  sortedInfo?: string;
};

const UsersPage: FC = () => {
  const [filter, setFilter] = useState<FilterState>({});

  const { isTarget, isSelected, setList } = useListSelection<Single>();

  const onElementClick = (record: Single): void => {
    router.navigate({
      url: router.url({ name: "user:edit", params: { id: record.id } }),
    });
  };

  const paginationState = useRef<StateRef>(null);

  const { t } = useTranslation("Users");

  const columns: Array<RegistryColumnConf<Single>> = [
    {
      key: "photo",
      title: "",
      width: "6%",
      render(record: Single) {
        const props = {
          src: record.image_id
            ? `/api/file/${record.image_id}/download`
            : undefined,
          icon: record.image_id ? undefined : <UserOutlined />,
        };
        return <Avatar {...props} />;
      },
    },
    {
      key: "name",
      render(record: Single) {
        return (
          <span>
            {<BlockedIcon blocked={record.blocked} />}{" "}
            {fullName(record.first_name, record.middle_name, record.last_name)}
          </span>
        );
      },
    },

    {
      key: "email",
      render(record: Single) {
        return record.email;
      },
    },

    {
      key: "createdAt",
      render(record: Single) {
        return format(record.created_at);
      },
    },

    {
      key: "role",
      render(record: Single) {
        return <RoleTag roles={[record.role ?? UserUserRoleEnum.User]} />;
      },
    },
  ];

  return (
    <Workspace noRefresh title={t("title")} actions={<Actions />}>
      <Filter initial={filter} onChange={setFilter} />
      <PaginatedQuery<{ page: number; size: number }, Result, Single>
        className={styles.pagination}
        variables={{
          sort: filter.sortedInfo,
          roles: filter.filteredInfo,
        }}
        requestQuery={UserRequestFactory.apiUserGet}
        stateRef={paginationState}
        onResult={(result) => {
          setList(result.data ?? []);
        }}
        render={(entries) => (
          <>
            <RegistryTable
              entity="Users"
              columns={columns}
              // eslint-disable-next-line
              rows={entries as Record<string, any>[]} // TODO
              rowState={(record, index) => ({
                selected: isSelected(index),
                target: isTarget(index),
              })}
              onRecordClick={(event, record, index) => {
                if (index !== undefined) {
                  onElementClick(record);
                }
              }}
            />
          </>
        )}
      />
    </Workspace>
  );
};

export const pageComponent: FC = () => (
  <AuthConsumer>
    {({ user }) => {
      return (
        <RoleSwitch
          role={user.role}
          perform="users:index"
          yes={() => <UsersPage />}
          no={() => <Redirect name="home"></Redirect>}
        />
      );
    }}
  </AuthConsumer>
);
\end{lstlisting}
\subsection{pages/users/styles.module.less}
\begin{lstlisting}
@import "../../variables.less";

.pagination {
  .infoSegment();
  .simpleScroll();
}

.centered {
  display: inline-flex;
  align-items: center;
}

.left_icon {
  margin-right: 10px;
}

.right_icon {
  margin-left: 25px;
}

.icon {
  margin-left: 25px;
  margin-right: 10px;
}
\end{lstlisting}
\subsection{react-app-env.d.ts}
\begin{lstlisting}
/// <reference types="react-scripts" />
/// <reference types="@curi/types" />
\end{lstlisting}
\subsection{reducer/counter.ts}
\begin{lstlisting}
import { createSlice } from "@reduxjs/toolkit";

const counter = createSlice({
  name: "counter",
  initialState: 0,
  reducers: {
    increment(state): number {
      return state + 1;
    },
    decrement(state): number {
      return state - 1;
    },
  },
});

export const { increment, decrement } = counter.actions;

export default counter.reducer;
\end{lstlisting}
\subsection{reducer/index.ts}
\begin{lstlisting}
import { combineReducers } from "@reduxjs/toolkit";

import counter from "./counter";
import workspace from "./workspace";

const rootReducer = combineReducers({ workspace, counter });

export default rootReducer;
\end{lstlisting}
\subsection{reducer/README.md}
\begin{lstlisting}

# Slice

```javascript
import { createSlice } from "@reduxjs/toolkit";

\end{lstlisting}
\subsection{reducer/workspace.ts}
\begin{lstlisting}
import { createSlice, PayloadAction } from "@reduxjs/toolkit";

export type WorkspaceState = {
  rightPanelCollapsed: boolean;
  width: number;
};

const initialState: WorkspaceState = {
  rightPanelCollapsed: true,
  width: 360,
};

const workspace = createSlice({
  name: "workspace",
  initialState,
  reducers: {
    toggleRightPanel(state): void {
      state.rightPanelCollapsed = !state.rightPanelCollapsed;
    },
    openRightPanel(state): void {
      state.rightPanelCollapsed = false;
    },
    closeRightPanel(state): void {
      state.rightPanelCollapsed = true;
    },
    setRightPanelCollapsed(state, action: PayloadAction<boolean>): void {
      state.rightPanelCollapsed = action.payload;
    },
  },
});

export const {
  toggleRightPanel,
  setRightPanelCollapsed,
  closeRightPanel,
  openRightPanel,
} = workspace.actions;

export default workspace.reducer;
\end{lstlisting}
\subsection{setupProxy.js}
\begin{lstlisting}
/* eslint-disable */
const { createProxyMiddleware } = require("http-proxy-middleware");

const API_URL = process.env.REACT_APP_API_URL ?? "hello";

module.exports = (app) => {
  app.use(
    "/api",
    createProxyMiddleware({
      target: API_URL,
      changeOrigin: true,
    }),
  );
};
\end{lstlisting}
\subsection{setupTests.ts}
\begin{lstlisting}
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import "@testing-library/jest-dom/extend-expect";
\end{lstlisting}
\subsection{variables.less}
\begin{lstlisting}
@import "~antd/lib/style/themes/default.less";
@import "~antd/lib/style/color/colorPalette.less";

@gray-1: #ffffff;
@gray-2: #fafafa;
@gray-3: #f5f5f5;
@gray-4: #e8e8e8;
@gray-5: #d9d9d9;
@gray-6: #bfbfbf;
@gray-7: #8c8c8c;
@gray-8: #595959;
@gray-9: #262626;
@gray-10: #000000;

@main-horizontal-padding: 1.2em;
@main-vertical-padding: 1em;
@layout-margin: 4px;

.simpleScroll(@color: @gray-6) {
  @width: 5px;
  overflow-y: auto;

  &::-webkit-scrollbar-track {
    background-color: transparent;
  }

  &::-webkit-scrollbar {
    width: @width;
    height: @width;
    background-color: transparent;
  }

  &::-webkit-scrollbar-thumb {
    background-color: @color;
  }
}

.infoSegment() {
  background: @component-background;
  padding: @main-horizontal-padding;
  margin-bottom: @layout-margin;
}

.selectAndHover(@select-color: @blue-1, @hover-color: @gray-3) {
  transition: background 0.3s ease-in;

  &.selected {
    background-color: @select-color !important;

    &:hover {
      background-color: mix(@select-color, @hover-color) !important;
    }
  }

  &:not(.selected):hover {
    background-color: @hover-color !important;
  }
}
\end{lstlisting}