chore: name button actions according to tutorial docs

Author: LevelbossMike

tests/dummy/app/components/quickstart-button-refined.js

@@ -62,7 +62,7 @@ export default class QuickstartButtonFinal extends Component {
           states: {
             idle: {
               on: {
-                CLICK: {
+                SUBMIT: {
                   target: 'busy',
                   cond: 'isEnabled',
                 },
@@ -78,7 +78,7 @@ export default class QuickstartButtonFinal extends Component {
             success: {
               entry: ['handleSuccess'],
               on: {
-                CLICK: {
+                SUBMIT: {
                   target: 'busy',
                   cond: 'isEnabled',
                 },
@@ -87,7 +87,7 @@ export default class QuickstartButtonFinal extends Component {
             error: {
               entry: ['handleError'],
               on: {
-                CLICK: {
+                SUBMIT: {
                   target: 'busy',
                   cond: 'isEnabled',
                 },
@@ -100,7 +100,7 @@ export default class QuickstartButtonFinal extends Component {
     {
       actions: {
         handleSubmit(context) {
-          context.handleClickTask.perform();
+          context.handleSubmitTask.perform();
         },
         handleSuccess(context) {
           context.onSuccess();
@@ -126,11 +126,11 @@ export default class QuickstartButtonFinal extends Component {
       this.statechart.send('ERROR', { error: e });
     }
   })
-  handleClickTask;
+  handleSubmitTask;
 
   @action
   handleClick() {
-    this.statechart.send('CLICK');
+    this.statechart.send('SUBMIT');
   }
 
   @action

tests/dummy/app/components/quickstart-button.js

@@ -32,11 +32,11 @@ export default class QuickstartButton extends Component {
       states: {
         idle: {
           on: {
-            CLICK: 'busy',
+            SUBMIT: 'busy',
           },
         },
         busy: {
-          entry: ['handleClick'],
+          entry: ['handleSubmit'],
           on: {
             SUCCESS: 'success',
             ERROR: 'error',
@@ -45,21 +45,21 @@ export default class QuickstartButton extends Component {
         success: {
           entry: ['handleSuccess'],
           on: {
-            CLICK: 'busy',
+            SUBMIT: 'busy',
           },
         },
         error: {
           entry: ['handleError'],
           on: {
-            CLICK: 'busy',
+            SUBMIT: 'busy',
           },
         },
       },
     },
     {
       actions: {
-        handleClick(context) {
-          context.handleClickTask.perform();
+        handleSubmit(context) {
+          context.handleSubmitTask.perform();
         },
         handleSuccess(context) {
           context.onSuccess();
@@ -80,11 +80,11 @@ export default class QuickstartButton extends Component {
       this.statechart.send('ERROR', { error: e });
     }
   })
-  handleClickTask;
+  handleSubmitTask;
 
   @action
   handleClick() {
-    this.statechart.send('CLICK');
+    this.statechart.send('SUBMIT');
   }
 }
 // END-SNIPPET

tests/dummy/app/templates/docs/index.md

@@ -86,10 +86,10 @@ about how your application behaves based on a visual language that everyone unde
 
 ## Powered by xstate
 
-`ember-statecharts` provides a small Ember.js specific wrapper around the fabolous
+`ember-statecharts` provides a small Ember.js specific wrapper around the fabulous
 and widely-used [xstate](https://xstate.js.org/docs/)-library. All of the  powerful
 features of `xstate` are supported. The purpose of `ember-statecharts` is to
-make it easy to use `xsstate` in an Ember.js application without having
+make it easy to use `xstate` in an Ember.js application without having
 to write the same boilerplate code over and over again.
 
 ## ember-statecharts vs. ember-concurrency