frontendmasters/ember-octane

Mike North's Ember Octane workshop

ember-octane's Issues

`did-insert` is not a helper

When we get to the ~4 hr mark, the course introduces Glimmer's lifecycle hooks. When I add them to my local copy, Glimmer starts throwing compile errors that {{did-insert and {{did-update aren't helpers.
I've blown away node_modules and reinstalled.

$ ember -v
ember-cli: 3.11.0-beta.3
node: 10.16.0
os: darwin x64

{{!-- chat-container.hbs --}}
<main class="flex-1 flex flex-col bg-white overflow-hidden channel">
  {{did-insert this.loadMessages}}
  {{yield this.messages}}
</main>

// chat-container.js
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';

export default class ChatContainerComponent extends Component {
  @tracked messages = [];

  @action async loadMessages() {
    const {
      channel: { id, teamId }
    } = this.args;

    const response = await fetch(`/api/teams/${teamId}/channels/${id}/messages`);
    this.messages = [
      ...this.messages,
      ...(await response.json())
    ];
  }
}

TeamSidebar doesn't span full height of the window

After generating the component's JS module in the "Auth State and transitionTo" section, the TeamSidebar component no longer spans the full height of the window.

I assume this is because of the wrapper div that gets added. Adding a tagName = ' '; to app/components/team-sidebar.js fixes it for me, or alternatively removing the outer section from the template and adding its classes to the component's classNames.

git clone command (from the README.md) fails

➜ ~ git clone [email protected]:mike-north/ember-octane-workshop.git
Cloning into 'ember-octane-workshop'...
[email protected]: Permission denied (publickey).
fatal: Could not read from remote repository.

Broken Link -- Dilbert icon image

Broken image link is on line 39 in db.json: https://github.com/FrontendMasters/ember-octane/blob/steps/19-notifications/db.json

Cannot run ember serve on M1

I am on a M1 Macbook. When I try to run ember serve this is what I get:

> ember serve
Browserslist: caniuse-lite is outdated. Please run next command `yarn upgrade`
WARNING: Node v16.14.0 is not tested against Ember CLI on your platform. We recommend that you use the most-recent "Active LTS" version of Node.js. See https://git.io/v7S5n for details.
Could not start watchman
Visit https://ember-cli.com/user-guide/#watchman for more info.
Browserslist: caniuse-lite is outdated. Please run next command `yarn upgrade`
⠋ building... JSON Server is running
⠦ building... [Babel: @ember/test-helpers > applyPatches]node:internal/validators:164
      throw new ERR_INVALID_ARG_TYPE(name, 'Object', value);
      ^

TypeError [ERR_INVALID_ARG_TYPE]: The "options" argument must be of type object. Received an instance of Array
    at ChildProcess.target.send (node:internal/child_process:733:7)
    at Array.forEach (<anonymous>)
    at dispatchQueuedRequests (/Users/ogirginc/Projects/shlack/node_modules/workerpool/lib/WorkerHandler.js:174:21)
    at ChildProcess.<anonymous> (/Users/ogirginc/Projects/shlack/node_modules/workerpool/lib/WorkerHandler.js:129:7)
    at ChildProcess.emit (node:events:520:28)
    at emit (node:internal/child_process:938:14)
    at processTicksAndRejections (node:internal/process/task_queues:84:21) {
  code: 'ERR_INVALID_ARG_TYPE'
}

Here are some additional data:

> ember --version
Browserslist: caniuse-lite is outdated. Please run next command `yarn upgrade`
WARNING: Node v16.14.0 is not tested against Ember CLI on your platform. We recommend that you use the most-recent "Active LTS" version of Node.js. See https://git.io/v7S5n for details.
ember-cli: 3.11.0-beta.3
node: 16.14.0
os: darwin arm64

Is there a quick fix I can apply to start the course?