diff --git a/app/components/tab.hbs b/app/components/tab.hbs
new file mode 100644
index 0000000..3625fcb
--- /dev/null
+++ b/app/components/tab.hbs
@@ -0,0 +1,11 @@
+
+ {{#if @icon}}
+
+ {{/if}}
+ {{@text}}
+
diff --git a/app/templates/admin.hbs b/app/templates/admin.hbs
index d149f7a..2843b87 100644
--- a/app/templates/admin.hbs
+++ b/app/templates/admin.hbs
@@ -19,7 +19,7 @@
-
diff --git a/app/templates/admin/indexes/item.hbs b/app/templates/admin/indexes/item.hbs
index 4d2d953..5afe870 100644
--- a/app/templates/admin/indexes/item.hbs
+++ b/app/templates/admin/indexes/item.hbs
@@ -1,5 +1,10 @@
{{page-title "Item"}}
-{{@model.name}}
+{{capitalize @model.name}}
+
+
+
+
+
{{outlet}}
diff --git a/tests/integration/components/tab-test.js b/tests/integration/components/tab-test.js
new file mode 100644
index 0000000..9ec54a3
--- /dev/null
+++ b/tests/integration/components/tab-test.js
@@ -0,0 +1,26 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Component | tab', function (hooks) {
+ setupRenderingTest(hooks);
+
+ test('it renders', async function (assert) {
+ // Set any properties with this.set('myProperty', 'value');
+ // Handle any actions with this.set('myAction', function(val) { ... });
+
+ await render(hbs``);
+
+ assert.dom(this.element).hasText('');
+
+ // Template block usage:
+ await render(hbs`
+
+ template block text
+
+ `);
+
+ assert.dom(this.element).hasText('template block text');
+ });
+});