// store/records.ts
import { defineStore } from "pinia";
import { ref } from "vue";

import {
  type AleoRecord,
  type AleoRecordList,
  type AleoRecordIndex,
  type RestResponse,
  parse,
} from "aleo-record-interfaces";

export const useAleoRecordStore = defineStore("AleoRecords", () => {
  const records = ref<AleoRecordList>({});
  const index = ref<AleoRecordIndex>([]);

  function consume(response: RestResponse): void {
    const keys = Object.keys(response);
    for (let i = 0; i < keys.length; i++) {
      const key: string = keys[i];
      const record: AleoRecord | undefined = parse(response[key]);
      if (!record) {
        continue;
      }
      records.value[key] = record;
      index.value = Object.keys(records.value);
      // Unicode for record icon before printing record and key.
      console.log("\u{1F4C8}", key, record);
    }
  }

  function get(key: string): AleoRecord | undefined {
    return records.value[key];
  }

  return {
    consume,
    get,
    index,
    records,
  };
});

// views/Records.vue setup script
import { axios } from 'axios';
import { useAleoRecordStore } from '@/store/records.ts';

const aleoRecordStore = useAleoRecordStore();

try {
    // /api/ is set up as a vuejs proxy to the development node.
    const response = await axios.post("/api/testnet3/records/unspent", {
        view_key: "AViewKey1huxxFRxUvS9Xx2Cy49JK8nn7ZNQ9mrfeMiq6UYZbbdZ5",
    });
    // The keys are hashes, (field values) in string format.
    // Each record starts out serialized as a JSON string.
    // It is important to pull records from the response before parsing.
    aleoRecordStore.consume(response.data.records); 
} catch (error) {
    console.log(error);
}