chrismllr

import Controller from '@ember/controller';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';
import validationState, { validate } from 'ember-validation-state';
import { task } from 'ember-concurrency-decorators';
import { timeout } from 'ember-concurrency';

const validators = {
  username: [validate('presence', { presence: true })],
  password: [

chrismllr

/**
 * @description Declares a one-way read-only component property, which reads from `this.args`
 *  and falls back to default declared on the class property.
 * @export
 * @returns {ClassProperty}
 */
export default function arg(target, property, descriptor) {
  let _value;

  if (descriptor.initializer !== null) {

chrismllr

import { task, timeout } from 'ember-concurrency';
import Config from 'app/config/environment';

const DEFAULT_POLL_MS = 20000; // 20 sec

export function pollTask(_requestTask, pollMs = DEFAULT_POLL_MS) {
  const taskProperty = task(_requestTask).restartable();
  const ogTaskFn = taskProperty.taskFn;

  taskProperty.taskFn = function*(...args) {

chrismllr

license: mit

chrismllr

import Controller from '@ember/controller';
import { inject as service } from '@ember/service';

export default Controller.extend({
  confirmAction: service(),
  api: service(),

  async deleteRecord(record) {
    try {
      const result = await this.confirmAction.ask({

chrismllr

{{! The rest of your application template }}

{{#if confirmAction.showPrompt}}
  <ModalDialog>
    <h2>{{confirmAction.title}}</h2>
    <p>{{confirmAction.message}}</p>

    <div class="flex justify-end p--default">
      <button {{action "cancel" target=this.confirmAction}}>
        Cancel

chrismllr

import Service from '@ember/service';
import { setProperties } from '@ember/object';
import { defer } from 'rsvp';

export default Service.extend({
  showPrompt: false,
  title: null,
  message: null,
  
  _deferred: null,

chrismllr

/* Usage
const navigationHandlers = [
  {
    predicate: props => props.currentUser.isAuthenticated === false,
    handler: navigator => {
      navigator.resetTo({
        screen: LOGIN_SCREEN,
        animationType: 'fade'
      });
    }

chrismllr

<Spacing bottom="30px">
  <Label>Username</Label>
  <TextInput 
    value={this.state.userName}
    onChange={this.updateUsername} 
  />
</Spacing>

chrismllr

<Input 
  labelText="Username"
  value={this.state.username}
  onChange={this.updateUsername} 
/>