Skip to content

Instantly share code, notes, and snippets.

@luffybyte

luffybyte/components.app\.js

Created May 26, 2021 11:19
Show Gist options
  • Save luffybyte/944c9f7c8d550dccd479e377e17b8803 to your computer and use it in GitHub Desktop.
Save luffybyte/944c9f7c8d550dccd479e377e17b8803 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. luffybyte revised this gist May 26, 2021. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions controllers.application\.js
    View file
    Original file line number Diff line number Diff line change
    @@ -8,8 +8,8 @@ export default class ApplicationController extends Controller {
    @service store;

    @tracked user = {
    fullname: 'Test',
    profile: 'testurl',
    fullname: '',
    profile: '',
    };

    constructor() {
  2. luffybyte created this gist May 26, 2021.
    4 changes: 4 additions & 0 deletions components.app\.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,4 @@
    import Component from '@glimmer/component';

    export default class extends Component {
    }
    4 changes: 4 additions & 0 deletions components.user\.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,4 @@
    import Component from '@glimmer/component';

    export default class extends Component {
    }
    23 changes: 23 additions & 0 deletions controllers.application\.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,23 @@
    import Controller from '@ember/controller';
    import { inject as service } from '@ember/service';
    import { tracked } from '@glimmer/tracking';
    import { set } from '@ember/object';

    export default class ApplicationController extends Controller {
    appName = 'Ember Twiddle';
    @service store;

    @tracked user = {
    fullname: 'Test',
    profile: 'testurl',
    };

    constructor() {
    super(...arguments);
    this.store.queryRecord('user', {}).then((user) => {
    const fullname = `${user.firstName} ${user.lastName}`;
    set(this.user, 'fullname', fullname);
    set(this.user, 'profile', user.profile?.url);
    });
    }
    }
    13 changes: 13 additions & 0 deletions models.user\.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,13 @@
    import Model from 'ember-data/model';
    import attr from 'ember-data/attr';
    /*
    import attr from 'ember-data/attr';
    import { belongsTo, hasMany } from 'ember-data/relationships';
    */

    export default class extends Model {
    @attr('string') firstName;
    @attr('string') lastName;
    @attr() profile;
    }

    6 changes: 6 additions & 0 deletions templates.application\.hbs
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,6 @@
    <h1>Welcome to {{this.appName}}</h1>
    <br>
    <br>
    <App @user={{this.user}} />
    <br>
    <br>
    3 changes: 3 additions & 0 deletions templates.components.app\.hbs
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,3 @@
    <h1> SOME EXAMPLE </h1>

    <User @user={{@user}}/>
    4 changes: 4 additions & 0 deletions templates.components.user\.hbs
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,4 @@
    <h2>USer details </h2>
    name: {{@user.fullname}}
    <br>
    profile: {{@user.profile}}
    23 changes: 23 additions & 0 deletions twiddle\.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,23 @@
    {
    "version": "0.17.1",
    "EmberENV": {
    "FEATURES": {},
    "_TEMPLATE_ONLY_GLIMMER_COMPONENTS": false,
    "_APPLICATION_TEMPLATE_WRAPPER": true,
    "_JQUERY_INTEGRATION": true
    },
    "options": {
    "use_pods": false,
    "enable-testing": false
    },
    "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js",
    "ember": "3.18.1",
    "ember-template-compiler": "3.18.1",
    "ember-testing": "3.18.1"
    },
    "addons": {
    "@glimmer/component": "1.0.0",
    "ember-data": "3.18.0"
    }
    }