Giter Club home page Giter Club logo

elm-saved's Introduction

Saved a

A type keeping track of changes to a value since it was last saved. This is great for building editing interfaces that keep track of whether the user has made any changes.

Dealing with an intial unsaved value

Suppose we're writing a text editing application. Saved a assumes that a saved value we can revert to always exists. For our text editing example such a value can for instance be an empty document. If we're saving these documents to some backend, we might want to distinguish between this initial unpersisted value and a value that has been persisted to the backend.

One way to do this is to use different types for persisted and unpersisted documents. For instance, let's assume a document that is persisted on the backend has an id, while one that's not persisted does not. We can define separate types for documents in these different states:

type alias PersistedDoc =
    { id : Int
    , title : String
    -- More properties here
    }

type alias UnpersistedDoc =
    { title : String
    -- More properties here
    }

type Model
    = Persisted (Saved PersistedDoc)
    | Unpersisted (Saved UnpersistedDoc)

When we perform the initial save, we can turn a Saved UnpersistedDoc to a Saved PersistedCo using the map function.

Saving data to a server

Lets stay with the example of a text editing application a bit longer. At some point we'll want to save a version of the document to a backend, keeping track of the progress of this operation and whether it results in a successful safe or not. The Saved a type has no opinion on what it means for a value to be saved, but the RemoteData is perfect for this use case. We can put the Saved a and RemoteData e a types next to each other on the model:

type alias Model =
    { doc : Saved Doc
    , saveState : RemoteData Http.Error Doc
    }

At this point it looks a bit like by using both Saved a and RemoteData e a we're duplicating state, but really the above solution precisely tracks the tree versions of a document that are relevant while the document is in the process being saved:

  1. The last succesfully saved version, which is tracked by Saved a.
  2. The version we're currently attempting to save, which is tracked by RemoteData e a.
  3. The most recently edited version the user is seeing on the screen, which can already have diverged from the version we're currently saving. This version is also traced by Saved a.

Once our Http request responds that the save was successfull, we can use setSaved to update the last saved value of our document.

elm-saved's People

Contributors

jwoudenberg avatar lukewestby avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

elm-saved's Issues

Similar packages?

@lukewestby hi! ๐Ÿ‘‹

Just came across this nice package. Just for posterity (and possibly a future collaboration) It seems to be similar in concept to EdtiableWebData which is just a RemoteData wrapper around @stoeffel 's Editable

In the README, it also mentions StorageKey which is nice for having more knowledge on the entity ID - is this entity new, or did it come from the server.

Anyway, It's fun seeing similar ideas popping, and the way they are implemented ๐Ÿ‘

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.