import * as React from 'react';
import AutoComplete from 'material-ui/AutoComplete';
import {ProcedureState, fetchProcedureRequest} from "../modules/procedure-app";
import {getLogger} from "../../../utils/logger";
const log = getLogger('procedure-component');

interface IProcedure extends ProcedureState {
    getProcedures:() => void;
}
export default class Procedure extends React.Component<IProcedure,any > {
    constructor(props) {
        super(props)
    }

    render():JSX.Element {
        log(this.props.procedures);
        return (<div>
            <AutoComplete
                floatingLabelText="Type procedure name"
                filter={AutoComplete.caseInsensitiveFilter}
                dataSource={['a','aa','aaa','aaa','aaa','b','c']}
            />
        </div>)
    }

    componentDidMount():void {
        this.props.getProcedures();
    }
}



import {StateStatus} from "../../../utils/state-status";
const fetch = require('isomorphic-fetch');
import {getLogger} from "../../../utils/logger";
import {mock_procedure_request} from "../../../middleware/api-urls";
import {getResetAction} from "../../reset-action";
import {RESET} from "../../reset-action";
const log = getLogger('procedure-request-reducer');

//----- fetch ------


export function fetchProcedureRequest() {
    return dispatch => {
        log(`fetchProcedureRequest`);
        dispatch(procedureRequest());
        return fetch(mock_procedure_request, null)
            .then((response:any) => response.json())
            .then((proceduresRequest:any) => {
                if (proceduresRequest.error) {
                    log(`healthServices failed`);
                    dispatch(procedureFailedAction(proceduresRequest.error.message))
                } else {
                    log(`healthServices succeeded`);
                    dispatch(procedureSucceededAction(proceduresRequest));
                }
            })
            .catch(err => dispatch(procedureFailedAction(err.message)))
    }
}


export interface ProcedureState {
    message:string,
    status:StateStatus;
    procedures:any[];
}

export interface IProcedure {
    fetchProcedureRequest:(identifier:string)=>void;
    servicesState:ProcedureState;
}

//----- action handler ------

let actionHandler = {};

//----- actions ------

export const PROCEDURE_REQUEST = 'PROCEDURE_REQUEST';
const procedureRequest = () =>
    ({type: PROCEDURE_REQUEST});
actionHandler[PROCEDURE_REQUEST] = (state:any, action:any) =>
    Object.assign({}, state, {status: StateStatus.INPROGRESS, message: "procedure request"});

const PROCEDURE_SUCCEEDED:string = 'PROCEDURE_SUCCEEDED';
const procedureSucceededAction = (procedureRequest:any[]) =>
    ({type: PROCEDURE_SUCCEEDED, procedureRequest: procedureRequest});
actionHandler[PROCEDURE_SUCCEEDED] = (state:any, action:any) =>
    Object.assign({}, state, {
        message: "success",
        status: StateStatus.SUCCEEDED,
        procedures: action.procedures
    });

const PROCEDURE_FAILED:string = 'PROCEDURE_FAILED';
const procedureFailedAction = (message) => ({type: PROCEDURE_FAILED, message});
actionHandler[PROCEDURE_FAILED] = (state:any, action:any) =>
    Object.assign({}, state, {status: StateStatus.FAILED, message: action.message});


//----- initial state ---
const initialState:ProcedureState = {
    procedures: [], // make of type
    status: StateStatus.PENDING,
    message: "pending"
};

actionHandler[RESET] = getResetAction(initialState);

//----- reducer ------
export default function procedureStateReducer(state:any = initialState, action:Redux.Action) {
    const handler = actionHandler[action.type];
    return handler ? handler(state, action) : state
}