Skip to content

Instantly share code, notes, and snippets.

@JonAbrams

JonAbrams/SpaceAce-customActions.jsx

Last active July 23, 2018 01:08
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save JonAbrams/2bd80a23bbf81b880f7eaace3f2936a4 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save JonAbrams/2bd80a23bbf81b880f7eaace3f2936a4 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. JonAbrams revised this gist Jul 23, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion SpaceAce-customActions.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -38,7 +38,7 @@ export const PizzaForm = ({ space }) => (
    {/* ... some input elements */}
    <p className="error">{space.errorMsg}</p>
    {space.pizza && <p>You’ve been given: {space.pizza}</p>}
    <button disabled={space.saving} type="submit">Submit</button>
    <button disabled={space.saving} type="submit">Get Pizza</button>
    <button disabled={space.saving} type="button" onClick={space(handleReset)}>Reset</button>
    </form>
    );
  2. JonAbrams revised this gist Jul 23, 2018. 1 changed file with 5 additions and 1 deletion.
    6 changes: 5 additions & 1 deletion SpaceAce-customActions.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -21,8 +21,12 @@ const handleSubmit = async ({ space, merge }, event) => {
    });
    };

    /*
    handleReset is another custom action.
    This one erases all properties on the space,
    replacing them with only the specified ones.
    */
    const handleReset = ({ replace }) => {
    // Replace erases all properties, replacing them with only the given ones
    replace({
    name: '',
    pizzaLover: false
  3. JonAbrams revised this gist Jul 23, 2018. 1 changed file with 6 additions and 4 deletions.
    10 changes: 6 additions & 4 deletions SpaceAce-customActions.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,11 @@
    import { fetchPizza } from '../apiCalls';

    // handleSubmit is a custom action
    // The first parameter is provided by SpaceAce
    // The remaining parameters are passed-through
    // which in this case consists of React's event object
    /*
    handleSubmit is a custom action.
    The first parameter is provided by SpaceAce.
    The remaining parameters are passed-through
    which in this case consists of React's event object
    */
    const handleSubmit = async ({ space, merge }, event) => {
    event.preventDefault();

  4. JonAbrams revised this gist Jul 23, 2018. 1 changed file with 4 additions and 0 deletions.
    4 changes: 4 additions & 0 deletions SpaceAce-customActions.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,9 @@
    import { fetchPizza } from '../apiCalls';

    // handleSubmit is a custom action
    // The first parameter is provided by SpaceAce
    // The remaining parameters are passed-through
    // which in this case consists of React's event object
    const handleSubmit = async ({ space, merge }, event) => {
    event.preventDefault();

  5. JonAbrams revised this gist Jul 22, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion SpaceAce-customActions.jsx
    View file
    Original file line number Diff line number Diff line change
    @@ -23,7 +23,7 @@ const handleReset = ({ replace }) => {
    });
    };

    export const MyForm = ({ space }) => (
    export const PizzaForm = ({ space }) => (
    <form onSubmit={space(handleSubmit)}>
    {/* ... some input elements */}
    <p className="error">{space.errorMsg}</p>
  6. JonAbrams renamed this gist Jul 22, 2018. 1 changed file with 0 additions and 0 deletions.
    0 SpaceAceCustomActions.jsx → SpaceAce-customActions.jsx
    View file
    File renamed without changes.
  7. JonAbrams renamed this gist Jul 22, 2018. 1 changed file with 0 additions and 0 deletions.
    0 gistfile1.txt → SpaceAceCustomActions.jsx
    View file
    File renamed without changes.
  8. JonAbrams created this gist Jul 22, 2018.
    34 changes: 34 additions & 0 deletions gistfile1.txt
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,34 @@
    import { fetchPizza } from '../apiCalls';

    const handleSubmit = async ({ space, merge }, event) => {
    event.preventDefault();

    // merge does a shallow merge, allowing the assignment of multiple properties at once
    merge({ saving: true }); // updates space immediately, triggers re-render

    const { data, error } = await fetchPizza({ name: space.name });
    if (error) return merge({ error: errorMsg, saving: false });

    merge({
    saving: false,
    pizza: data.pizza // 'Pepperoni', hopefully
    });
    };

    const handleReset = ({ replace }) => {
    // Replace erases all properties, replacing them with only the given ones
    replace({
    name: '',
    pizzaLover: false
    });
    };

    export const MyForm = ({ space }) => (
    <form onSubmit={space(handleSubmit)}>
    {/* ... some input elements */}
    <p className="error">{space.errorMsg}</p>
    {space.pizza && <p>You’ve been given: {space.pizza}</p>}
    <button disabled={space.saving} type="submit">Submit</button>
    <button disabled={space.saving} type="button" onClick={space(handleReset)}>Reset</button>
    </form>
    );