stateDiagram-v2
  state "Notes app" as App {
    state "Connection" as Connection {
      [*] --> Online
      Online --> Offline : the network drops
      Offline --> Online : the network returns
    }
    --
    state "Sync badge" as Sync {
      state "Synced" as Synced
      state "Waiting to sync" as Pending
      [*] --> Synced
      Synced --> Pending : you edit a note
      Synced --> Pending : the network drops
      Pending --> Synced : the server confirms
    }
  }
  [*] --> App
  %% never NeverSyncedWhileOffline: Offline & Synced -- You never see "Synced" while you are offline.