import { IonButton, IonContent, IonPage } from '@ionic/react';
import './style.css';
import { useAppStateContext } from '../../contexts/AppState';
import { useMyIonMetric } from '../../contexts/MyIonMetric';
import { useFullmarkCount } from '../../contexts/MyIonMetric/FullmarkCount';
import { useListeningPracticeTimeSpent } from '../../contexts/MyIonMetric/ListeningPracticeTimeSpent';
import { useMatchingFrenzyCorrectCount } from '../../contexts/MyIonMetric/MatchingFrenzyCorrectCount';
import { useConnectivesRevisionCorrectCount } from '../../contexts/MyIonMetric/ConnectivesRevisionCorrectCount';
import { useAppUseTime } from '../../contexts/MyIonMetric/AppUseTime';

const DebugPage: React.FC = () => {
  // Genius
  const { myIonMetricSetFullMarkCount } = useFullmarkCount();

  // hardworker
  const { myIonMetricSetAppUseTime } = useAppUseTime();

  // Attentive ears
  const { myIonMetricSetListeningPracticeProgress } = useListeningPracticeTimeSpent();

  // matchmaking
  const { myIonMetricSetMatchingFrenzyCorrectCount } = useMatchingFrenzyCorrectCount();

  // connecives conqueror
  const { myIonMetricSetConnectivesRevisionCorrectCount } = useConnectivesRevisionCorrectCount();

  return (
    <IonPage>
      <IonContent fullscreen>
        <div>debug page</div>
        <div>
          <IonButton
            onClick={() => {
              myIonMetricSetFullMarkCount(1001);
            }}
          >
            set count (Genius)
          </IonButton>
        </div>

        <div>
          <IonButton
            onClick={() => {
              myIonMetricSetAppUseTime(600);
            }}
          >
            set count (hardworker)
          </IonButton>
        </div>

        <div>
          <IonButton
            onClick={() => {
              myIonMetricSetListeningPracticeProgress(610);
            }}
          >
            set count (attentive ears)
          </IonButton>
        </div>

        <div>
          <IonButton
            onClick={() => {
              myIonMetricSetMatchingFrenzyCorrectCount(40);
            }}
          >
            set count (matchmaking)
          </IonButton>
        </div>

        <div>
          <IonButton
            onClick={() => {
              myIonMetricSetConnectivesRevisionCorrectCount(40);
            }}
          >
            set count (connectives)
          </IonButton>
        </div>
      </IonContent>
    </IonPage>
  );
};

export default DebugPage;
