/* * ============LICENSE_START======================================================= * Copyright (C) 2021 Nordix Foundation. * ================================================================================ * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. * * SPDX-License-Identifier: Apache-2.0 * ============LICENSE_END========================================================= */ import React, { useState } from "react"; import Modal from "react-bootstrap/Modal"; import Button from "react-bootstrap/Button"; import styled from "styled-components"; import Row from "react-bootstrap/Row"; import Form from "react-bootstrap/Form"; import UploadToscaInstantiationFile from "./UploadToscaInstantiationFile"; import jsYaml from "js-yaml"; import Alert from "react-bootstrap/Alert"; const ModalStyled = styled(Modal)` background-color: transparent; ` const StyledMessagesDiv = styled.div` overflow: auto; min-width: 100%; max-height: 300px; padding: 5px 5px 0px 5px; text-align: center; ` const UploadToscaInstantiation = (props) => { const [show, setShow] = useState(true); const [fileIsSelected, setFileIsSelected] = useState(false); const [selectedFile, setSelectedFile] = useState(); const [jsonObject, setJsonObject] = useState([]); const [alertMessages, setAlertMessages] = useState(); const fileUploadHandler = (event) => { event.preventDefault(); console.log('fileUploadHandler called'); const file = event.currentTarget.files[0]; if (file !== undefined) { console.log('fileDefined called'); setSelectedFile(file); setFileIsSelected(true); const fileReader = new FileReader(); fileReader.onload = () => { const jsonFile = jsYaml.load(fileReader.result, 'utf8') setJsonObject(jsonFile) } fileReader.readAsText(file); } else { console.log('fileUndefined called'); } } const onResponseReceivedHandler = async (response) => { console.log('onResponseReceivedHandler called'); if (await response.ok) { setAlertMessages( Upload Success

Tosca Instantiation from { selectedFile.name } was Successfully Uploaded


Type: { selectedFile.type }

Size: { +selectedFile.size / 1000 }Kb

); } else { setAlertMessages( Upload Failure

Tosca Instantiation from { selectedFile.name } failed to upload

Status code: { await response.status }: { response.statusText }

Response Text: { await response.text() }


Type: { selectedFile.type }

Size: { +selectedFile.size / 1000 }Kb

); } } const handleClose = () => { console.log('handleClose called'); setShow(false); props.history.push('/'); } return ( Tosca Control Loop - Create Instantiation
Only .yaml, .yml and .json files are supported { alertMessages }
) } export default UploadToscaInstantiation;