import Service from '@ember/service'; import {run} from '@ember/runloop'; import {inject as service} from '@ember/service'; import {task} from 'ember-concurrency-decorators'; import {tracked} from '@glimmer/tracking'; export default class CustomThemeSettingsServices extends Service { @service store; @tracked settings = []; load() { return this.loadTask.perform(); } @task *loadTask() { // unload stored settings and re-load from API so they always match active theme // run is required here, see https://github.com/emberjs/data/issues/5447#issuecomment-845672812 run(() => this.store.unloadAll('custom-theme-setting')); const settings = yield this.store.findAll('custom-theme-setting'); this.settings = settings; return this.settings; } save() { return this.saveTask.perform(); } @task *saveTask() { // save all records in a single request to `/custom_theme_settings` const listRecord = this.store.createRecord('custom-theme-setting-list', {customThemeSettings: this.settings}); yield listRecord.save(); // don't keep references to individual settings around this.store.unloadRecord(listRecord); return this.settings; } rollback() { run(() => this.store.unloadAll('custom-theme-setting')); this.settings = []; } }