[SalesForce] lightning aura iteration

I am having fits with lightning aura iteration,
the response looks corerect, it doesnt do anything just puts in a blank row, no errors

I've tried changing apex class variable types, uppercasing the iteration, having zero luck

here is my lightning component

<aura:attribute name="response" type="Map"/>
<aura:attribute name="ListOfGifts" type="String[]"/>  


<div class="slds">
  <div class="slds-box" aura:id="main">
    <div aura:id="panelList">
      <header>
        <h2 class="slds-text-heading--small slds-m-bottom--small">Giving Summary from JSON</h2>
      </header>
        <table class="slds-table slds-table--bordered slds-table--cell-buffer slds-no-row-hover">
            <tr>
                <th class="slds-text-heading--label">ID</th> 
                <th class="slds-text-heading--label">receipt date</th>
                <th class="slds-text-heading--label">associated desc</th>
                <th class="slds-text-heading--label">main receipt</th>
                <th class="slds-text-heading--label">transation group</th> 
                <th class="slds-text-heading--label">extended amount</th> 
                <th class="slds-text-heading--label">recent trans number</th> 
            </tr>

            <aura:iteration items="{!v.ListOfGifts}" var="gifts">
                <tr> 
                    <td>{!gifts.id_number}</td>
                    <td>{!gifts.RECEIPT_DATE}</td>       
                    <td>{!gifts.ASSOCIATED_DESC}</td>
                    <td>{!gifts.MAIN_RECEIPT_NUMBER}</td>
                    <td>{!gifts.TRANSATION_GROUP_3}</td>       
                    <td>{!gifts.EXTENDED_AMOUNT}</td>
                    <td>{!gifts.RECENT_TRANS_NUM}</td>

                </tr>
            </aura:iteration>
        </table>
      </div>
    </div>
</div>
</aura:component>

i have the following http callout apex class

    public class httpCallOutCtrl {
    // Pass in the endpoint to be used using the string url
    @AuraEnabled

    public static Map < String, Object > getCalloutResponseContents(String url) {

        // Instantiate a new http object
        Http h = new Http();

        // Instantiate a new HTTP request, specify the method (GET) as well as the endpoint
        HttpRequest req = new HttpRequest();

        // dummy data 

        req.setEndpoint(url);
        req.setMethod('GET');

        // Send the request, and return a response
        HttpResponse res = h.send(req);
        System.debug('response:--> ' + res.getBody());

        // Deserialize the JSON string into collections of primitive data types.
        Map < String,
        Object > resultsMap = (Map < String, Object > ) JSON.deserializeUntyped(res.getBody());
        system.debug('resultsMap-->' + resultsMap);
        return resultsMap;

    }

}

which returns the following JSON encased in a return value

{
    "gifts": [{
        "id_number": "0000729789",
        "receipt_date": "2016-04-28 00:00:00.000",
        "associated_desc": "Primary",
        "main_receipt_number": "0004172594",
        "transation_group_3": "Outright Gift",
        "extended_amount": "10.00",
        "recent_trans_num": 1
    }, {
        "id_number": "0000729789",
        "receipt_date": "2015-05-15 00:00:00.000",
        "associated_desc": "Primary",
        "main_receipt_number": "0004044990",
        "transation_group_3": "Outright Gift",
        "extended_amount": "10.00",
        "recent_trans_num": 2
    }, {
        "id_number": "0000729789",
        "receipt_date": "2009-04-02 00:00:00.000",
        "associated_desc": "Beneficiary",
        "main_receipt_number": "0003312553",
        "transation_group_3": "Outright Gift",
        "extended_amount": "210.00",
        "recent_trans_num": 3
    }]
}

my controller.js

({
    getResponse: function(component) {
        // create a server side action.       
        var action = component.get("c.getCalloutResponseContents");

        action.setCallback(this, function(response) {
            var state = response.getState();
            if (component.isValid() && state === "SUCCESS") {

                component.set("v.response", response.getReturnValue());


                var getAllGifts = component.get("v.response")['gifts'];
                var GiftList = [];

                for (var key in getAllGifts) {
                    // push all rates with there Name in CurrencyList variable.        
                    GiftList.push(key + ' = ' + getAllGifts[key]);   
                }

                component.set("v.ListOfGifts", GiftList);
                console.log(GiftList);
            }
        });

        $A.enqueueAction(action);
    },
})