<commit_before>import React from 'react';

import $ from 'jquery';

import GetSheetDone from 'get-sheet-done';

import SendEmail from './SendEmail.jsx';


export default class Admin extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            animationHelper: '',
            EditTribalAdminOverlay: '',
            rootVisibility: ''
        }
    }
    componentDidMount() {
        window.setTimeout(() => {
            this.setState({
                animationHelper: 'fadeIn'
            })
        }, 3000)
    }
    editTribalAdmin(e) {
        // let EditTribalAdminOverlay = '';
        this.setState({
            EditTribalAdminOverlay: EditTribalAdminOverlay
        })
    }
  render() {
    let EditTribalAdminOverlay = this.state.EditTribalAdminOverlay,    //just so it doesnt look weird during the return in render
        navButtonDisplay = this.state.EditTribalAdminOverlay === '' ? '' : 'none';
    return (
        <div id='Admin' className={this.state.animationHelper} style={{...styles.root, visibility: this.state.rootVisibility, opacity: this.state.animationHelper === '' ? 0 : ''}}>
            {navButtonDisplay !== 'none' &&
                <div style={styles.navButton}>Edit Tribal Administration:{'  '}<span className='button buttonHover' style={styles.button} onClick={this.editTribalAdmin.bind(this)}>Go</span></div>
            }
            
            
            {EditTribalAdminOverlay !== '' &&
                <EditTribalAdminOverlay />
            }
        </div>
    );
  }
}

class EditTribalAdminOverlay extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            administration: [],
            newAdmin: []
        }
    }
    addAdmin() {
        let clonedAdmin = this.state.newAdmin.map((value) => value);
        clonedAdmin.push('');

        this.setState({
            newAdmin: clonedAdmin
        })
    }
    componentDidMount() {
        //1. get tribal administration list
        GetSheetDone.raw('1hZr_x7r36h_qAe0bpQ6P33Bxd5msf5tpg1eS2J3uDFo')
        .then(sheet => {
            this.setState({ administration: sheet.data })
        })
        
        //2. separate fields
        // sheet.data.map((data, i) => {


        //     return (

        //     )
        // })

        //3. add different field values into text boxes

        //4. add save button

        //5. onclick collect the input values

        //6. send input values as a string to the google spreadsheet

        //7. update the spreadsheet values
        //now I will use an npm api to make using google sheets easier
    }
    makeApiCall() {
        var params = {
            // The spreadsheet to apply the updates to.
            spreadsheetId: '1hZr_x7r36h_qAe0bpQ6P33Bxd5msf5tpg1eS2J3uDFo'
        };

        var batchUpdateSpreadsheetRequestBody = {
            // A list of updates to apply to the spreadsheet.
            // Requests will be applied in the order they are specified.
            // If any request is not valid, no requests will be applied.
            requests: [
                'one',
                'two',
                'three'
            ]

            // TODO: Add desired properties to the request body.
        };

        var request = gapi.client.sheets.spreadsheets.batchUpdate(params, batchUpdateSpreadsheetRequestBody);
        request.then(function (response) {
            // TODO: Change code below to process the `response` object:
            console.log(response.result, response);
        }, function (reason) {
            console.error('error: ' + reason.result.error.message, reason);
        });
    }
    onInputChange(id, event) {
        let adminArray = this.state.administration.map((e) => e);
        adminArray[id] = event.value;
        this.setState({administration: adminArray});
    }
    saveAdmin() {
        let inputs = document.getElementsByTagName('input'),
            concatinatedString = '';

        for(let i = 0; i < inputs.length; i++) {
            concatinatedString += inputs[i].value + '__$$^$$__';
        }
    
        console.log(concatinatedString);

        //send concatinatedString data to google spreadsheet to update it
        // this.makeApiCall();
        // this._sendEmail({test: 1});  //this sends an email by using the <CIFrame /> component below (I think lol - commenting out for now)
        console.log('doing get');

        $.get({
            url: 'https://script.google.com/macros/s/AKfycbw3jmNPfOGLzWA5gPjsVHE2_LA_ey4R6hFgeIh_hWSVhzqreQwj/exec',
            data: {
                // test: 1,
                // and: 'two',
                type: 'updateAdmin',
                // newAdmin: concatinatedString
            },
            success: (e) => {
                console.log('e = ', e);
            }        <commit_msg>Admin - FINALLY got logic to update google spreadsheet (it needs a bit of tweaking though)<commit_after>import React from 'react';

import $ from 'jquery';

import GetSheetDone from 'get-sheet-done';

import SendEmail from './SendEmail.jsx';


export default class Admin extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            animationHelper: '',
            EditTribalAdminOverlay: '',
            rootVisibility: ''
        }
    }
    componentDidMount() {
        window.setTimeout(() => {
            this.setState({
                animationHelper: 'fadeIn'
            })
        }, 3000)
    }
    editTribalAdmin(e) {
        // let EditTribalAdminOverlay = '';
        this.setState({
            EditTribalAdminOverlay: EditTribalAdminOverlay
        })
    }
  render() {
    let EditTribalAdminOverlay = this.state.EditTribalAdminOverlay,    //just so it doesnt look weird during the return in render
        navButtonDisplay = this.state.EditTribalAdminOverlay === '' ? '' : 'none';
    return (
        <div id='Admin' className={this.state.animationHelper} style={{...styles.root, visibility: this.state.rootVisibility, opacity: this.state.animationHelper === '' ? 0 : ''}}>
            {navButtonDisplay !== 'none' &&
                <div style={styles.navButton}>Edit Tribal Administration:{'  '}<span className='button buttonHover' style={styles.button} onClick={this.editTribalAdmin.bind(this)}>Go</span></div>
            }
            
            
            {EditTribalAdminOverlay !== '' &&
                <EditTribalAdminOverlay />
            }
        </div>
    );
  }
}

class EditTribalAdminOverlay extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            administration: [],
            newAdmin: []
        }
    }
    addAdmin() {
        let clonedAdmin = this.state.newAdmin.map((value) => value);
        clonedAdmin.push('');

        this.setState({
            newAdmin: clonedAdmin
        })
    }
    componentDidMount() {
        //1. get tribal administration list
        GetSheetDone.raw('1hZr_x7r36h_qAe0bpQ6P33Bxd5msf5tpg1eS2J3uDFo')
        .then(sheet => {
            this.setState({ administration: sheet.data })
        })
        
        //2. separate fields
        // sheet.data.map((data, i) => {


        //     return (

        //     )
        // })

        //3. add different field values into text boxes

        //4. add save button

        //5. onclick collect the input values

        //6. send input values as a string to the google spreadsheet

        //7. update the spreadsheet values
        //now I will use an npm api to make using google sheets easier
    }
    makeApiCall() {
        var params = {
            // The spreadsheet to apply the updates to.
            spreadsheetId: '1hZr_x7r36h_qAe0bpQ6P33Bxd5msf5tpg1eS2J3uDFo'
        };

        var batchUpdateSpreadsheetRequestBody = {
            // A list of updates to apply to the spreadsheet.
            // Requests will be applied in the order they are specified.
            // If any request is not valid, no requests will be applied.
            requests: [
                'one',
                'two',
                'three'
            ]

            // TODO: Add desired properties to the request body.
        };

        var request = gapi.client.sheets.spreadsheets.batchUpdate(params, batchUpdateSpreadsheetRequestBody);
        request.then(function (response) {
            // TODO: Change code below to process the `response` object:
            console.log(response.result, response);
        }, function (reason) {
            console.error('error: ' + reason.result.error.message, reason);
        });
    }
    onInputChange(id, event) {
        let adminArray = this.state.administration.map((e) => e);
        adminArray[id] = event.value;
        this.setState({administration: adminArray});
    }
    saveAdmin() {
        let inputs = document.getElementsByTagName('input'),
            concatinatedString = '';

        for(let i = 0; i < inputs.length; i++) {
            concatinatedString += inputs[i].value + '__$$^$$__';
        }
    
        console.log(concatinatedString);

        //send concatinatedString data to google spreadsheet to update it
        // this.makeApiCall();
        // this._sendEmail({test: 1});  //this sends an email by using the <CIFrame /> component below (I think lol - commenting out for now)
        console.log('doing get');


//var url = "https://script.google.com/macros/s/{YourProjectId}/exec?offset="+offset+"&baseDate="+baseDate+"&callback=?";
   //$.getJSON( url,function( returnValue ){...});

        // window.callback = function(e) {
        //     console.log('in callback', e);
        // }

        // $.getJSON('https://script.google.com/macros/s/AKfycbw3jmNPfOGLzWA5gPjsVHE2_LA_ey4R6hFgeIh_hWSVhzqreQwj/exec?callback=callback',
        //     function(e) {
        //         console.log('in getJSON return ', e);
        //     }
        // )

       
        $.get({
            url: 'https://script.google.com/macros/s/AKfycbw3jmNPfOGLzWA5gPjsVHE2_LA_ey4R6hFgeIh_hWSVhzqreQwj/exec',
            data: {
                // test: 1,
                // and: 'two',
                type: 'updateAdmin',
                // dataType: 'jsonp',
                newAdmin: concatinatedString
            },
            success: (e) => {
                console.log('e = ', e);
            }        
{'fraction_non_alphanumeric': 0.1191301000769823, 'fraction_numerical': 0.009334103156274058, 'mean_word_length': 1.8195876288659794, 'pattern_counts': {'":': 0, '<': 21, '<?xml version=': 0, '>': 31, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2201895', 'n_tokens_mistral': 3026, 'n_tokens_neox': 2932, 'n_words': 657}