Hooked up frontend and backend

ember-ui/app/adapters/application.js

@@ -1,5 +1,5 @@
 import JSONAPIAdapter from '@ember-data/adapter/json-api';
 
 export default class ApplicationAdapter extends JSONAPIAdapter {
-  host = 'https://www.themealdb.com/api/json/v1/1';
+  host = 'http://localhost:8000/';
 }

ember-ui/app/adapters/meal.js

@@ -1,51 +1,15 @@
 import ApplicationAdapter from './application';
-import { dasherize } from '@ember/string';
 
 export default class MealAdapter extends ApplicationAdapter {
   async findRecord(store, model, id) {
-    let result = await fetch(`${this.host}/lookup.php?i=${id}`);
-    let json = await result.json();
-    return normalize(json.meals[0]);
+    let result = await fetch(`${this.host}meal/${id}`);
+    return await result.json();
   }
 
   async queryRecord(store, model, query) {
     if (query === 'random') {
-      let result = await fetch(`${this.host}/random.php`);
-      let json = await result.json();
-      return normalize(json.meals[0]);
+      let result = await fetch(`${this.host}meals/random`);
+      return await result.json();
     }
   }
 }
-
-function normalize(obj) {
-  let attributes = {};
-
-  Object.keys(obj).forEach(key => attributes[cleanKey(key)] = obj[key]);
-  attributes.ingredients = groupByKeyPrefix('ingredient', attributes);
-
-  return {
-    data: {
-      type: 'meal',
-      id: attributes.id,
-      attributes,
-    },
-  };
-}
-
-function cleanKey(key) {
-  key = dasherize(key);
-  key = key.replace('str-', '');
-  if (key === 'id-meal') key = 'id';
-  if (key === 'meal') key = 'name';
-  return key;
-}
-
-function groupByKeyPrefix(keyPrefix, obj) {
-  let resultingArray = [];
-  Object.keys(obj).forEach(key => {
-    let value = obj[key];
-    if (!value) return;
-    if (key.startsWith(keyPrefix)) resultingArray.push(value);
-  });
-  return resultingArray;
-}

ember-ui/app/components/recipe-list.js

@@ -14,7 +14,6 @@ export default class RecipeListComponent extends Component {
   }
 
   get sortedItems() {
-    console.log('sorted items called');
     return this.items.sortBy('listOrder');
   }
 

ember-ui/app/components/recipe-preview.hbs

@@ -1,7 +1,7 @@
 <LinkTo @route="meal" @model={{@meal}} class="block bg-white border border-gray-400 focus:border-teal-500 focus:shadow-sm focus:bg-teal-100 outline-none">
   <div class="max-w-sm w-full lg:max-w-full lg:flex">
     <div class="h-48 lg:h-auto lg:w-48 flex-none">
-      <img src={{@meal.mealThumb}} alt="" class="h-full w-full object-cover">
+      <img src={{@meal.thumbnailUrl}} alt="" class="h-full w-full object-cover">
     </div>
     <div class="p-4 flex flex-col justify-between leading-normal">
       <div class="mb-8">
@@ -9,9 +9,7 @@
           {{@meal.name}}
         </div>
         <p class="text-gray-700 text-base">
-          {{#each @meal.ingredients as |ingredient|}}
-            {{ingredient}}
-          {{/each}}
+          {{@meal.ingredientsList}}
         </p>
       </div>
       <div>

ember-ui/app/models/meal.js

@@ -2,15 +2,21 @@ import DS from 'ember-data';
 const { Model, attr } = DS;
 
 export default class MealModel extends Model {
-  @attr name;
-  @attr dateModified;
-  @attr category;
+  @attr alternateDrink;
   @attr area;
-  @attr mealThumb;
+  @attr category;
+  @attr dateModified;
   @attr instructions;
-  @attr ingredients;
+  @attr name;
+  @attr sourceUrl;
   @attr tags;
-  @attr youtube;
-  @attr source;
+  @attr thumbnailUrl;
+  @attr youtubeUrl;
+  @attr ingredients;
+
   @attr('number', { defaultValue: Infinity }) listOrder;
+
+  get ingredientsList() {
+    return this.ingredients.map(ingredient => ingredient.name).join(', ');
+  }
 }

ember-ui/app/templates/meal.hbs

@@ -2,7 +2,7 @@
   {{@model.name}}
 </h1>
 
-<img src={{@model.mealThumb}} alt="" class="float-right w-1/3 rounded-lg ml-8 mb-4 shadow-lg border-8 border-white">
+<img src={{@model.thumbnailUrl}} alt="" class="float-right w-1/3 rounded-lg ml-8 mb-4 shadow-lg border-8 border-white">
 
 <p class="text-gray-700 text-base whitespace-pre-line">
   {{@model.instructions}}

python-api/.gitignore

@@ -1 +1 @@
-/__pycache__
+__pycache__

python-api/api.py

@@ -14,13 +14,24 @@ class Base(Handler):
                 ["strCategory", "category"],
                 ["strArea", "area"],
                 ["strInstructions", "instructions"],
-                ["strDrinkAlternate", "alternate_drink"],
-                ["strMealThumb", "thumbnail_url"],
+                ["strDrinkAlternate", "alternate-drink"],
+                ["strMealThumb", "thumbnail-url"],
                 ["strTags", "tags"],
-                ["strYoutube", "youtube_url"],
-                ["strSource", "source_url"],
-                ["dateModified", "date_modified"],
+                ["strYoutube", "youtube-url"],
+                ["strSource", "source-url"],
+                ["dateModified", "date-modified"],
             ])
+
+    def normalize(self, response, model_type = "meal"):
+        return {
+            "data": {
+                "id": response["id"],
+                "attributes": response,
+                "type": model_type,
+                }
+            }
+
+
     def cleanup(self, meal):
         self.replacable_keys.do_replace(meal)
         self.cleanup_ingredients(meal)
@@ -49,23 +60,22 @@ class Base(Handler):
 
 class Details(Base):
     def get(self, meal_id = ''):
-        response = json.loads(requests.get(self.hostname + "lookup.php?i=" + meal_id).text)
-        for meal in response["meals"]:
-            self.cleanup(meal)
+        response = json.loads(requests.get(self.hostname + "lookup.php?i=" + meal_id).text)["meals"][0]
+        self.cleanup(response)
 
-        return json.dumps(response)
+        return self.normalize(response)
 
 
 class Random(Base):
     def get(self):
-        response = json.loads(requests.get(self.hostname + "random.php").text)
-        for meal in response["meals"]:
-            self.cleanup(meal)
+        response = json.loads(requests.get(self.hostname + "random.php").text)["meals"][0]
+        self.cleanup(response)
 
-        return json.dumps(response)
+        return self.normalize(response)
 
 class app(WSGI):
-  routes = [
-    ("/meals/random", Random()),
-    ("/meal/([\w]+)", Details())
-  ]
+    headers = [("Access-Control-Allow-Origin", "*")]
+    routes = [
+                ("/meals/random", Random()),
+                ("/meal/([\w]+)", Details())
+            ]