src/state/models/onboard.ts


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63

import {makeAutoObservable} from 'mobx'
import {isObj, hasProp} from '../lib/type-guards'

export const OnboardStage = {
  Explainers: 'explainers',
  Follows: 'follows',
}

export const OnboardStageOrder = [OnboardStage.Explainers, OnboardStage.Follows]

export class OnboardModel {
  isOnboarding: boolean = false
  stage: string = OnboardStageOrder[0]

  constructor() {
    makeAutoObservable(this, {
      serialize: false,
      hydrate: false,
    })
  }

  serialize(): unknown {
    return {
      isOnboarding: this.isOnboarding,
      stage: this.stage,
    }
  }

  hydrate(v: unknown) {
    if (isObj(v)) {
      if (hasProp(v, 'isOnboarding') && typeof v.isOnboarding === 'boolean') {
        this.isOnboarding = v.isOnboarding
      }
      if (
        hasProp(v, 'stage') &&
        typeof v.stage === 'string' &&
        OnboardStageOrder.includes(v.stage)
      ) {
        this.stage = v.stage
      }
    }
  }

  start() {
    this.isOnboarding = true
  }

  stop() {
    this.isOnboarding = false
  }

  next() {
    if (!this.isOnboarding) return
    let i = OnboardStageOrder.indexOf(this.stage)
    i++
    if (i >= OnboardStageOrder.length) {
      this.isOnboarding = false
      this.stage = OnboardStageOrder[0] // in case they make a new account
    } else {
      this.stage = OnboardStageOrder[i]
    }
  }
}