use one single component for commander

README.md

@@ -36,21 +36,9 @@ Make use of the many generators for code, try `ember help generate` for more det
 ### Linting
 
 * `npm run lint`
-* `npm run lint:fix`
 
 ### Building
 
 * `ember build` (development)
 * `ember build --environment production` (production)
 
-### Deploying
-
-Specify what it takes to deploy your app.
-
-## Further Reading / Useful Links
-
-* [ember.js](https://emberjs.com/)
-* [ember-cli](https://ember-cli.com/)
-* Development Browser Extensions
-  * [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi)
-  * [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/)

app/components/commander/right.hbs → app/components/commander/index.hbs

@@ -14,21 +14,5 @@
     @onClose={{this.closeNewFolderModal}}
     {{show-when this.show_new_folder_modal}} />
 
-  <Breadcrumb::Right
-    @node={{@node}}
-    @extranode={{@extranode}} />
-
-  {{#each @nodes as |node|}}
-    {{#let (component node.nodeType) as |NodeType|}}
-      {{! NodeType is either <Folder /> or <Document />}}
-      <NodeType @model={{node}}>
-        <LinkTo
-          @route="authenticated.nodes"
-          @model={{@extranode.id}}
-          @query={{hash extranode_id=node.id}}>
-            {{node.title}}
-        </LinkTo>
-      </NodeType>
-    {{/let}}
-  {{/each}}
+  {{yield}}
 </div>

app/components/commander/base.js → app/components/commander/index.js

@@ -3,7 +3,7 @@ import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
 
 
-export default class BaseCommanderComponent extends Component {
+export default class CommanderComponent extends Component {
   @tracked show_new_folder_modal = false;
 
   @action
@@ -15,5 +15,4 @@ export default class BaseCommanderComponent extends Component {
   closeNewFolderModal() {
     this.show_new_folder_modal = false;
   }
-
 }

app/components/commander/left.hbs

-<div class="panel commander row">
-  <div class="d-flex justify-content-between">
-    <Commander::ActionButtons
-      @openNewFolderModal={{this.openNewFolderModal}} />
-
-    <Commander::ActionModes
-      @onPanelToggle={{@onPanelToggle}}
-      @dualPanelMode={{@dualPanelMode}} />
-  </div>
-
-  <Modal::NewFolder
-    id="new-folder"
-    @node={{@node}}
-    @onClose={{this.closeNewFolderModal}}
-    {{show-when this.show_new_folder_modal}} />
-
-  <Breadcrumb::Left
-    @node={{@node}}
-    @extranode={{@extranode}} />
-
-  {{#each @nodes as |node|}}
-    {{#let (component node.nodeType) as |NodeType|}}
-      {{! NodeType is either <Folder /> or <Document />}}
-      <NodeType @model={{node}}>
-        {{#if @extranode}}
-          <LinkTo
-            @route="authenticated.nodes"
-            @model={{node.id}}
-            @query={{hash extranode_id=@extranode.id}}>
-              {{node.title}}
-          </LinkTo>
-        {{else}}
-          <LinkTo
-            @route="authenticated.nodes"
-            @model={{node.id}}>
-              {{node.title}}
-          </LinkTo>
-        {{/if}}
-      </NodeType>
-    {{/let}}
-  {{/each}}
-</div>

app/components/commander/left.js

-import BaseCommanderComponent from "./base";
-
-
-class LeftCommanderComponent extends BaseCommanderComponent {
-}
-
-export default LeftCommanderComponent;

app/components/commander/link_to_left.hbs

+{{#if @extranode}}
+  <LinkTo
+    @route="authenticated.nodes"
+    @model={{@node.id}}
+    @query={{hash extranode_id=@extranode.id}}>
+      {{@node.title}}
+  </LinkTo>
+{{else}}
+  <LinkTo
+    @route="authenticated.nodes"
+    @model={{@node.id}}>
+      {{@node.title}}
+  </LinkTo>
+{{/if}}
\ No newline at end of file

app/components/commander/link_to_right.hbs

+<LinkTo
+  @route="authenticated.nodes"
+  @model={{@extranode.id}}
+  @query={{hash extranode_id=@node.id}}>
+    {{@node.title}}
+</LinkTo>
\ No newline at end of file

app/components/commander/right.js

-import BaseCommanderComponent from "./base";
-
-
-class RightCommanderComponent extends BaseCommanderComponent {
-}
-
-export default RightCommanderComponent;

app/templates/authenticated/index.hbs

 <div class="panels d-flex">
-  <Commander::Left
+  <Commander
     @node={{@model}}
     @nodes={{@model.children}} />
 </div>

app/templates/authenticated/nodes.hbs

 <div class="panels d-flex">
-  <Commander::Left
-    @node={{this.mainnode}}
-    @nodes={{this.mainnode.children}}
-    @extranode={{this.extranode}}
+  <Commander
     @onPanelToggle={{this.onPanelToggle}}
-    @dualPanelMode={{this.dualpanel_mode}} />
+    @dualPanelMode={{this.dualpanel_mode}} >
+
+    <Breadcrumb::Left
+      @node={{@node}}
+      @extranode={{@extranode}} />
+
+    {{#each this.mainnode.children as |node|}}
+      {{#let (component node.nodeType) as |NodeType|}}
+        {{! NodeType is either <Folder /> or <Document />}}
+        <NodeType @model={{node}}>
+          <Commander::LinkToLeft
+            @node={{node}}
+            @extranode={{this.extranode}} />
+        </NodeType>
+      {{/let}}
+    {{/each}}
+  </Commander>
 
   {{#if this.dualpanel_mode}}
-    <Commander::Right
-      @node={{this.extranode}}
-      @nodes={{this.extranode.children}}
-      @extranode={{this.mainnode}}
+    <Commander
       @onPanelToggle={{this.onPanelToggle}}
-      @dualPanelMode={{this.dualpanel_mode}} />
+      @dualPanelMode={{this.dualpanel_mode}} >
+
+      <Breadcrumb::Right
+        @node={{@node}}
+        @extranode={{@extranode}} />
+
+        {{#each this.extranode.children as |node|}}
+          {{#let (component node.nodeType) as |NodeType|}}
+            {{! NodeType is either <Folder /> or <Document />}}
+            <NodeType @model={{node}}>
+              <Commander::LinkToRight
+                @node={{node}}
+                @extranode={{this.mainnode}} />
+            </NodeType>
+          {{/let}}
+        {{/each}}
+    </Commander>
   {{/if}}
 </div>