From 8273b8d68d12664224a6cf53771a56fcdbe30a7f Mon Sep 17 00:00:00 2001 From: Jordan Hawker Date: Sun, 16 Aug 2015 12:25:43 -0700 Subject: [PATCH] Display errors when posts are not found --- addon/components/tumblr-blog.js | 12 +++++++ app/templates/components/tumblr-blog.hbs | 40 +++++++++++++---------- package.json | 2 +- tests/dummy/app/router.js | 1 + tests/dummy/app/routes/error-blog.js | 7 ++++ tests/dummy/app/templates/error-blog.hbs | 5 +++ tests/dummy/app/templates/index.hbs | 1 + tests/unit/components/tumblr-blog-test.js | 2 ++ tests/unit/components/tumblr-post-test.js | 2 ++ 9 files changed, 54 insertions(+), 18 deletions(-) create mode 100644 tests/dummy/app/routes/error-blog.js create mode 100644 tests/dummy/app/templates/error-blog.hbs diff --git a/addon/components/tumblr-blog.js b/addon/components/tumblr-blog.js index c9acd6b..54b8d98 100644 --- a/addon/components/tumblr-blog.js +++ b/addon/components/tumblr-blog.js @@ -36,6 +36,18 @@ export default Ember.Component.extend({ */ formatDates: true, + /** + * Display an error message instead of attempting to render posts when none are returned + * @type {boolean} + * @default + */ + showErrors: true, + + /** + * Error message to display when no posts were found + */ + errorMessage: "We're sorry, we were unable to retrieve any posts. Please check back later!", + /** * Configurable Sort Options * @type {Array.string} diff --git a/app/templates/components/tumblr-blog.hbs b/app/templates/components/tumblr-blog.hbs index 0579296..e32743e 100644 --- a/app/templates/components/tumblr-blog.hbs +++ b/app/templates/components/tumblr-blog.hbs @@ -1,24 +1,30 @@ -{{#each sortedPosts as |post|}} - {{#if collapsible}} - {{#if collapseByDefault}} - {{tumblr-post - post=post - postsRoute=postsRoute - collapsible=true - collapsed=true - formatDates=formatDates}} +{{#if sortedPosts.length}} + {{#each sortedPosts as |post|}} + {{#if collapsible}} + {{#if collapseByDefault}} + {{tumblr-post + post=post + postsRoute=postsRoute + collapsible=true + collapsed=true + formatDates=formatDates}} + {{else}} + {{tumblr-post + post=post + postsRoute=postsRoute + collapsible=true + collapsed=false + formatDates=formatDates}} + {{/if}} {{else}} {{tumblr-post post=post postsRoute=postsRoute - collapsible=true - collapsed=false formatDates=formatDates}} {{/if}} - {{else}} - {{tumblr-post - post=post - postsRoute=postsRoute - formatDates=formatDates}} + {{/each}} +{{else}} + {{#if showErrors}} + {{errorMessage}} {{/if}} -{{/each}} \ No newline at end of file +{{/if}} \ No newline at end of file diff --git a/package.json b/package.json index c522e18..4c18b22 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-tumblr", - "version": "0.5.1", + "version": "0.6.0", "description": "Ember Addon for integrating a Tumblr blog", "directories": { "doc": "doc", diff --git a/tests/dummy/app/router.js b/tests/dummy/app/router.js index 1108281..a7a2b2d 100644 --- a/tests/dummy/app/router.js +++ b/tests/dummy/app/router.js @@ -13,6 +13,7 @@ Router.map(function() { this.route('uncollapsed-blog'); this.route('sorted-blog'); this.route('no-format-blog'); + this.route('error-blog'); this.route('post', { path: '/posts/:post_id' }); }); diff --git a/tests/dummy/app/routes/error-blog.js b/tests/dummy/app/routes/error-blog.js new file mode 100644 index 0000000..7d6d9f5 --- /dev/null +++ b/tests/dummy/app/routes/error-blog.js @@ -0,0 +1,7 @@ +import Ember from 'ember'; + +export default Ember.Route.extend({ + model() { + return Ember.A([]); + } +}); diff --git a/tests/dummy/app/templates/error-blog.hbs b/tests/dummy/app/templates/error-blog.hbs new file mode 100644 index 0000000..c82b68d --- /dev/null +++ b/tests/dummy/app/templates/error-blog.hbs @@ -0,0 +1,5 @@ +

Welcome to my blog!

+ +

This blog demonstrates the error message when no posts are found

+ +{{tumblr-blog posts=model}} \ No newline at end of file diff --git a/tests/dummy/app/templates/index.hbs b/tests/dummy/app/templates/index.hbs index 42e626b..dd318de 100644 --- a/tests/dummy/app/templates/index.hbs +++ b/tests/dummy/app/templates/index.hbs @@ -7,4 +7,5 @@ {{#link-to 'uncollapsed-blog'}}{{/link-to}} {{#link-to 'sorted-blog'}}{{/link-to}} {{#link-to 'no-format-blog'}}{{/link-to}} + {{#link-to 'error-blog'}}{{/link-to}} \ No newline at end of file diff --git a/tests/unit/components/tumblr-blog-test.js b/tests/unit/components/tumblr-blog-test.js index d6dd81d..72a7343 100644 --- a/tests/unit/components/tumblr-blog-test.js +++ b/tests/unit/components/tumblr-blog-test.js @@ -30,4 +30,6 @@ test('defaults', function (assert) { assert.equal(sortBy.length, 0, 'sortBy has no elements'); assert.ok(component.get('formatDates'), 'date formatting enabled by default'); + assert.ok(component.get('showErrors'), 'error is displayed by default if no posts are found'); + assert.ok(Ember.isPresent(component.get('errorMessage')), 'default error message is supplied'); }); diff --git a/tests/unit/components/tumblr-post-test.js b/tests/unit/components/tumblr-post-test.js index b37cda5..9a8909a 100644 --- a/tests/unit/components/tumblr-post-test.js +++ b/tests/unit/components/tumblr-post-test.js @@ -26,6 +26,8 @@ test('defaults', function (assert) { assert.ok(component.get('collapsed'), 'post is set to collapse by default if collapsible'); assert.ok(!component.get('isCollapsed'), 'post will not collapse by default, because it is not collapsible'); assert.ok(component.get('formatDates'), 'date formatting enabled by default'); + assert.ok(Ember.isPresent(component.get('collapsedText')), 'default collapsedText is supplied'); + assert.ok(Ember.isPresent(component.get('expandedText')), 'default expandedText is supplied'); }); test('isCollapsed', function (assert) {