// import { createMachine, assign, forwardTo } from 'xstate';
// import { fileMachine } from '$lib/@iioioo_utils/State/fileMachine';
// import type { 
//     CsvContext,
//     CsvEvent,
//     Csv_Event_FileLoad,
//     Csv_Event_CsvLoaded,
//     Csv_Event_Failure
// } from '../models';

// // Note: --> https://sebhastian.com/javascript-csv-to-array/
// const csvToArray = (str, delimiter = ",") => {

//     // slice from start of text to the first \n index
//     // use split to create an array from string by delimiter
//     const headers = str.slice(0, str.indexOf("\n")).split(delimiter).map(s => s.replace(/\r/,""));
  
//     // slice from \n index + 1 to the end of the text
//     // use split to create an array of each csv value row
//     const rows = str.slice(str.indexOf("\n") + 1).split("\n");
  
//     // Map the rows
//     // split values from each row into an array
//     // use headers.reduce to create an object
//     // object properties derived from headers:values
//     // the object passed as an element of the array
//     const arr = rows.map(function (row) {
//       const values = row.split(delimiter);
//       const el = headers.reduce(function (object, header, index) {
//         const value = (values[index] as string).replace(/\r/,"");
//         object[header] = value;
//         return object;
//       }, {});
//       return el;
//     });
  
//     // return the array
//     return arr;
// }

// const csvFileLoad = assign({
//     files: (context: CsvContext, event: Csv_Event_CsvLoaded) => {
//         console.log("WRANGLING: ", event); 
//         return event.files 
//     }
// });

// const wrangle = (context: CsvContext, event: any) => new Promise(( resolve, reject) => {
    
//     const data = csvToArray(event.data);
//     console.log("WRANGLE FUNCTION: ", data); 
//     resolve( data )
// })

// const assignData = assign({
//     data: (context: CsvContext, event: any) => event.data
// })

// export const csvMachine = () => createMachine<CsvContext, CsvEvent>( 
// {
//     initial: 'idle',
//     context: {
//         field: null,
//         files: [],
//         data: null 
//     },
//     states: {
//         idle: {
//             invoke: {
//                 id: 'fileMachine',
//                 src: fileMachine,
//                 onDone: {
//                     target: 'wrangling'
//                 },
//                 onError: {
//                     target: 'failure',
//                 }
//             },
//             on: {
//                 'FILE_LOADING': {
//                     actions: forwardTo('fileMachine')
//                 },
//                 'FILE_CHANGE': {
//                     actions: [ (c,e)=> console.log("IN CSV MACHINE CHANGE: ", c,e), forwardTo('fileMachine')]
//                 }
//             }
//         },
//         wrangling: {
//             entry: ['csvFileLoad'],
//             invoke: {
//                 id: 'wrangle',
//                 src: wrangle,
//                 onDone: {
//                     actions: [ 'assignData' ],
//                     target: 'success'
//                 },
//                 onError: {
//                     target: 'failure',
//                 }
//             }
//         },
//         success: {
//             entry: (c,e)=> console.log("IN CSV MACHINE SUCCESS: ", c,e),
//             on: {
//                 'CSV_RESET': 'idle'
//             }
//         },
//         failure: {
//             on: {
//                 'CSV_RESET': 'idle'
//             }
//         },
//     }
// },
// {
//     actions: {
//         csvFileLoad,
//         assignData
//     }
// });