import React, {useRef, useState, useEffect, useLayoutEffect} from 'react';

import { Typography, CircularProgress } from '@material-ui/core';

const SetAuthentication = (props) => {
  const { globalUrl, isLoggedIn, isLoaded, userdata } = props;

	const [firstRequest, setFirstRequest] = useState(true) 
	const [finished, setFinished] = useState(false) 
	const [response, setResponse] = useState("") 
	const [failed, setFailed] = useState(false) 

	if (firstRequest) {
		setFirstRequest(false)

		//code
		//session_state
		const urlSearchParams = new URLSearchParams(window.location.search);
		const params = Object.fromEntries(urlSearchParams.entries());

		const authenticationStore = []
		var appAuthData = {
			"label": "",
			"app": {
				"name": "",
				"id": "",
				"app_version": "",
			},
			"fields": [],
			"type": "oauth2",
		}

		if (window !== undefined && window !== null) {
			console.log(window.location)
			appAuthData.fields.push({"key": "redirect_uri", "value": window.location.origin+window.location.pathname})
		}

		if (params.code !== undefined && params.code !== null) {
				appAuthData.fields.push({"key": "code", "value": params.code})
		}

		if (params.session_state !== undefined && params.session_state !== null) {
				appAuthData.fields.push({"key": "session_state", "value": params.session_state})
		}

		if (params.state !== undefined && params.state !== null) {
			const paramsplit = params.state.split("&")
			console.log(paramsplit)
			for (var key in paramsplit) {
				const query = paramsplit[key].split("=")
				console.log(query)

				if (query.length !== 2) {
					console.log("INVALID QUERY: ", query)
					continue
				}

				if (query[0] === "workflow_id") {
					appAuthData.reference_workflow = query[1]
				}

				if (query[0] === "reference_action_id") {
					//appAuthData.ReferenceWorkflow = query[1]
				}

				if (query[0] === "app_name") {
					appAuthData.app.name = query[1]
					appAuthData.label = "Oauth2 for "+query[1]
				}

				if (query[0] === "app_id") {
					appAuthData.app.id = query[1]
				}

				if (query[0] === "app_version") {
					appAuthData.app.app_version = query[1]
				}

				if (query[0] === "authentication_url") {
					appAuthData.fields.push({"key": "authentication_url", "value": query[1]})
				}

				if (query[0] === "scope") {
					appAuthData.fields.push({"key": "scope", "value": query[1]})
				}

				if (query[0] === "client_id") {
					appAuthData.fields.push({"key": "client_id", "value": query[1]})
				}

				if (query[0] === "client_secret") {
					appAuthData.fields.push({"key": "client_secret", "value": query[1]})
				}

				if (query[0] === "oauth_url") {
					appAuthData.fields.push({"key": "oauth_url", "value": query[1]})
				}

				if (query[0] === "refresh_uri") {
					appAuthData.fields.push({"key": "refresh_uri", "value": query[1]})
				}

				if (query[0] === "refresh_url") {
					appAuthData.fields.push({"key": "refresh_url", "value": query[1]})
				}
			}
		}

		console.log(appAuthData)

		fetch(globalUrl+"/api/v1/apps/authentication", {
    	  method: 'PUT',
				headers: {
					'Content-Type': 'application/json',
					'Accept': 'application/json',
				},
	  		credentials: "include",
				body: JSON.stringify(appAuthData),
    })
		.then((response) => {
			if (response.status !== 200) {
				console.log("Status not 200 for oauth2 authentication")
				setFailed(true)
			}

			return response.json()
		})
    .then((responseJson) => {
			//setUserSettings(responseJson)
			console.log("Resp: ", responseJson)
			setFinished(true)
			setResponse(responseJson.reason)

			setTimeout(() => {
				window.close()
			}, 1000)
    })
		.catch(error => {
    		console.log(error)
		});

	}

	return (
		<div style={{width: 1000, margin: "auto", itemAlign: "center",}}>
			<Typography variant="h6" style={{marginLeft: "auto", marginRight: "auto", marginTop: 200, }}>
				{!finished ? <CircularProgress />	: "DONE WITH AUTH - this will close soon!!"}
				<div />
				{failed ? "Failed setup. Error: " : ""} {response}
			</Typography>
		</div>
	)
}

export default SetAuthentication;