diff --git a/wherehows-web/mirage/config.ts b/wherehows-web/mirage/config.ts
index 7f60ba6c41..86beb0a576 100644
--- a/wherehows-web/mirage/config.ts
+++ b/wherehows-web/mirage/config.ts
@@ -26,6 +26,7 @@ import { getDatasetUpstreams } from 'wherehows-web/mirage/helpers/dataset-upstre
 import { getDatasetRetention } from 'wherehows-web/mirage/helpers/dataset-retentions';
 import { getDatasetFabrics } from 'wherehows-web/mirage/helpers/dataset-fabrics';
 import { getDatasetHealth } from 'wherehows-web/mirage/helpers/dataset-health';
+import { getDatasetCount } from 'wherehows-web/mirage/helpers/dataset-count';
 
 export default function(this: IMirageServer) {
   this.get('/config', getConfig);
@@ -60,6 +61,8 @@ export default function(this: IMirageServer) {
 
   this.get('/datasets/:dataset_id/health', getDatasetHealth);
 
+  this.get('/datasets/count/platform/:platform_id/prefix/:prefix_id', getDatasetCount);
+
   this.namespace = '/api/v1';
 
   this.get('/datasets/:dataset_id', getDataset);
diff --git a/wherehows-web/mirage/factories/datasets-count.ts b/wherehows-web/mirage/factories/datasets-count.ts
new file mode 100644
index 0000000000..0b2472a509
--- /dev/null
+++ b/wherehows-web/mirage/factories/datasets-count.ts
@@ -0,0 +1,7 @@
+import { Factory, faker } from 'ember-cli-mirage';
+
+export default Factory.extend({
+  count() {
+    return faker.random.number({ min: 0, max: 10000 });
+  }
+});
diff --git a/wherehows-web/mirage/helpers/dataset-count.ts b/wherehows-web/mirage/helpers/dataset-count.ts
new file mode 100644
index 0000000000..00cbf659cf
--- /dev/null
+++ b/wherehows-web/mirage/helpers/dataset-count.ts
@@ -0,0 +1,9 @@
+import { IFunctionRouteHandler } from 'wherehows-web/typings/ember-cli-mirage';
+
+const getDatasetCount = function(this: IFunctionRouteHandler, { datasetsCounts }: any) {
+  const { count } = this.serialize(datasetsCounts.first());
+
+  return count;
+};
+
+export { getDatasetCount };
diff --git a/wherehows-web/mirage/models/datasets-count.ts b/wherehows-web/mirage/models/datasets-count.ts
new file mode 100644
index 0000000000..770b50936d
--- /dev/null
+++ b/wherehows-web/mirage/models/datasets-count.ts
@@ -0,0 +1,3 @@
+import { Model } from 'ember-cli-mirage';
+
+export default Model.extend({});
diff --git a/wherehows-web/mirage/scenarios/default.ts b/wherehows-web/mirage/scenarios/default.ts
index c32a412fe4..27697c2bd0 100644
--- a/wherehows-web/mirage/scenarios/default.ts
+++ b/wherehows-web/mirage/scenarios/default.ts
@@ -12,6 +12,7 @@ const fixtures = [
 export default function(server: IMirageServer) {
   server.loadFixtures(...fixtures);
   server.create('config');
+  server.create('datasetsCount');
   server.createList('owner', 6);
   server.createList('dataset', 10);
   server.createList('datasetView', 2);
diff --git a/wherehows-web/package.json b/wherehows-web/package.json
index e8c618724c..f4d9e1bbd9 100644
--- a/wherehows-web/package.json
+++ b/wherehows-web/package.json
@@ -24,6 +24,7 @@
     "@types/ember-qunit": "^3.0.3",
     "@types/ember-test-helpers": "^0.7.1",
     "@types/ember-testing-helpers": "^0.0.3",
+    "@types/ember__test-helpers": "^0.7.0",
     "@types/lodash": "^4.14.83",
     "@types/qunit": "^2.5.2",
     "@types/rsvp": "^4.0.2",
diff --git a/wherehows-web/tests/integration/components/datasets/containers/data-systems-count-test.ts b/wherehows-web/tests/integration/components/datasets/containers/data-systems-count-test.ts
new file mode 100644
index 0000000000..ecf955eaeb
--- /dev/null
+++ b/wherehows-web/tests/integration/components/datasets/containers/data-systems-count-test.ts
@@ -0,0 +1,56 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import hbs from 'htmlbars-inline-precompile';
+
+import { startMirage } from 'wherehows-web/initializers/ember-cli-mirage';
+import { nonHdfsUrn } from 'wherehows-web/mirage/fixtures/urn';
+
+module('Integration | Component | datasets/containers/data-systems-count', function(hooks) {
+  setupRenderingTest(hooks);
+
+  hooks.beforeEach(function(this: any) {
+    this.server = startMirage();
+  });
+
+  hooks.afterEach(function(this: any) {
+    this.server.shutdown();
+  });
+
+  test('component rendering', async function(assert) {
+    assert.expect(2);
+
+    await render(hbs`
+      {{#datasets/containers/data-systems-count}}
+        nested container content
+      {{/datasets/containers/data-systems-count}}
+    `);
+
+    assert.ok(this.element, 'expect component to be rendered in DOM');
+    assert.equal(
+      this.element.textContent!.trim(),
+      'nested container content',
+      'expect container to render nested content'
+    );
+  });
+
+  test('component rendering with a urn', async function(assert) {
+    assert.expect(2);
+
+    const { server }: any = this;
+    server.create('datasetsCount');
+
+    this.set('urn', nonHdfsUrn);
+
+    await render(hbs`
+      {{#datasets/containers/data-systems-count urn=urn as |container|}}
+        {{container.count}}
+      {{/datasets/containers/data-systems-count}}
+    `);
+
+    assert.ok(this.element, 'expect component to be rendered in DOM');
+
+    const yieldedCount = parseInt(this.element.textContent!);
+    assert.ok(yieldedCount >= 0, 'expect yielded value to be a number greater or equal to 0');
+  });
+});
diff --git a/wherehows-web/yarn.lock b/wherehows-web/yarn.lock
index e8068a4cdf..06548e7eb6 100644
--- a/wherehows-web/yarn.lock
+++ b/wherehows-web/yarn.lock
@@ -201,6 +201,13 @@
     "@types/jquery" "*"
     "@types/rsvp" "*"
 
+"@types/ember__test-helpers@^0.7.0":
+  version "0.7.0"
+  resolved "https://registry.yarnpkg.com/@types/ember__test-helpers/-/ember__test-helpers-0.7.0.tgz#0c0e86cb39dbe5e97bb4f09a898dcde0f5c1966a"
+  dependencies:
+    "@types/ember" "*"
+    "@types/htmlbars-inline-precompile" "*"
+
 "@types/handlebars@*":
   version "4.0.39"
   resolved "https://registry.yarnpkg.com/@types/handlebars/-/handlebars-4.0.39.tgz#961fb54db68030890942e6aeffe9f93a957807bd"