import { runInAction } from 'mobx';

import { RootStore, Substore } from './rootStore';
import { makeAutoObservableSubstore } from './utils';

export class Ga4Store implements Substore {
  hasCreatedSong = false;

  readonly root: RootStore;
  get apiClient() {
    return this.root.apiClient;
  }
  // DO NOT ADD INIT LOGIC IN constructor. this will run on every page! considering adding any it in the component init logic instead
  constructor(root: RootStore) {
    this.root = root;
    makeAutoObservableSubstore(this);
  }

  loadHasCreatedSong = async (): Promise<boolean> => {
    if (this.hasCreatedSong) {
      return this.hasCreatedSong;
    }

    const { data } = await this.apiClient.GET('/api/analytics/user-event/');
    const hasCreatedSong = data?.has_created_song ?? false;
    runInAction(() => {
      this.hasCreatedSong = hasCreatedSong;
    });
    return hasCreatedSong;
  };
}