From: 임준혁 Date: Sat, 7 Sep 2024 05:00:01 +0000 (+0900) Subject: Add an Axios instance and Modularize your API code X-Git-Tag: 4.0.0~29 X-Git-Url: https://gerrit.o-ran-sc.org/r/gitweb?a=commitdiff_plain;h=refs%2Fchanges%2F03%2F13303%2F6;p=portal%2Faiml-dashboard.git Add an Axios instance and Modularize your API code Issue-ID: AIMLFW-115 Change-Id: I85248f2de7e5e0cf2f2b8366467db08030db16be Signed-off-by: CodImJun --- diff --git a/src/apis/feature-group.js b/src/apis/feature-group.js new file mode 100644 index 0000000..dd4c692 --- /dev/null +++ b/src/apis/feature-group.js @@ -0,0 +1,16 @@ +import { instance } from '../states'; + +export const featureGroupAPI = { + getAllFeatureGroup: async () => { + return await instance.get('/featureGroup'); + }, + getFeatureGroup: async ({ params }) => { + return await instance.get(`/featureGroups/${params.featureGroupName}`); + }, + createFeatureGroup: async ({ data }) => { + return await instance.post('/featureGroup', { ...data }); + }, + deleteFeatureGroup: async ({ data }) => { + return await instance.delete('/featureGroup', { ...data }); + }, +}; diff --git a/src/apis/index.js b/src/apis/index.js new file mode 100644 index 0000000..c3fc835 --- /dev/null +++ b/src/apis/index.js @@ -0,0 +1,3 @@ +export * from './feature-group'; +export * from './pipeline'; +export * from './training-job'; diff --git a/src/apis/pipeline.js b/src/apis/pipeline.js new file mode 100644 index 0000000..fb834d6 --- /dev/null +++ b/src/apis/pipeline.js @@ -0,0 +1,13 @@ +import { instance } from '../states'; + +export const pipelineAPI = { + getPipelines: async () => { + return await instance.get('/pipelines'); + }, + getPipelineVersions: async ({ params }) => { + return await instance.get(`/pipelines/${params.pipelineName}/versions`); + }, + uploadPipeline: async ({ params, data }) => { + return await instance.post(`/pipelines/${params.pipelineName}/upload`, { ...data }); + }, +}; diff --git a/src/apis/training-job.js b/src/apis/training-job.js new file mode 100644 index 0000000..cbc517f --- /dev/null +++ b/src/apis/training-job.js @@ -0,0 +1,19 @@ +import { instance } from '../states'; + +export const trainingJobAPI = { + getTrainingJobByNameAndVersion: async ({ params }) => { + return await instance.get(`/trainingjobs/${params.trainingJobName}/${params.trainingJobVersion}`); + }, + getTrainingJobStepsState: async ({ params }) => { + return await instance.get(`/trainingjobs/${params.trainingJobName}/${params.trainingJobVersion}/steps_state`); + }, + getLatestTrainingJob: async () => { + return await instance.get('/trainingjobs/latest'); + }, + invokeTrainingJob: async ({ data }) => { + return await instance.post('/trainingjobs/retraining', { ...data }); + }, + deleteTrainingJob: async ({ data }) => { + return await instance.delete('/trainingjobs', { ...data }); + }, +}; diff --git a/src/components/home/HomePage.js b/src/components/home/HomePage.js index e5a451b..5ad0d14 100644 --- a/src/components/home/HomePage.js +++ b/src/components/home/HomePage.js @@ -23,10 +23,10 @@ import UploadPipelineForm from './pipelines/UploadPipeline'; import CreateFeatureGroup from './create/CreateFeatureGroup'; import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'; import NavbarComponent from './navbar/NavbarComponent'; -import * as CONSTANTS from './common/Constants'; import ListFeatureGroup from './status/ListFeatureGroup'; +import { debug_var } from '../../states'; -var DEBUG = CONSTANTS.debug_var === 'true'; +var DEBUG = debug_var === 'true'; var logger = function () { if (DEBUG) { console.log.apply(console, arguments); diff --git a/src/components/home/common/Constants.js b/src/components/home/common/Constants.js deleted file mode 100644 index 8aaa999..0000000 --- a/src/components/home/common/Constants.js +++ /dev/null @@ -1,26 +0,0 @@ -// ================================================================================== - -// Copyright (c) 2022 Samsung Electronics Co., Ltd. All Rights Reserved. - -// 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. - -// ================================================================================== - -export const UCMgr_baseUrl = 'http://' + process.env.REACT_APP_UCM_HOST + ':' + process.env.REACT_APP_UCM_PORT; -export const notebook_url = 'http://' + process.env.REACT_APP_NOTEBOOK_HOST + ':' + process.env.REACT_APP_NOTEBOOK_PORT; -export const ServiceMgr_baseUrl = - 'http://' + process.env.REACT_APP_ServiceMgr_HOST + ':' + process.env.REACT_APP_ServiceMgr_PORT; -export const debug_var = process.env.REACT_APP_DEBUG; -// export const UCMgr_baseUrl = 'http://localhost:32002' -// export const notebook_url = 'http://localhost:32088' -// export const ServiceMgr_baseUrl = 'http://localhost:30180' diff --git a/src/components/home/form/CreateFeatureGroupForm.js b/src/components/home/form/CreateFeatureGroupForm.js index d06943b..d9f64a0 100644 --- a/src/components/home/form/CreateFeatureGroupForm.js +++ b/src/components/home/form/CreateFeatureGroupForm.js @@ -19,11 +19,11 @@ import React from 'react'; import Form from 'react-bootstrap/Form'; import Button from 'react-bootstrap/Button'; -import * as CONSTANTS from '../common/Constants'; import { convertDatalakeDBName } from '../common/CommonMethods'; -import axios from 'axios'; import './CreateFeatureGroupForm.css'; import { Row, Col } from 'react-bootstrap'; +import { instance, UCMgr_baseUrl } from '../../../states'; +import { featureGroupAPI } from '../../../apis'; class CreateFeatureGroup extends React.Component { constructor(props) { @@ -43,7 +43,7 @@ class CreateFeatureGroup extends React.Component { dbOrg: '', measuredObjClass: '', _measurement: '', - UCMgr_baseUrl: CONSTANTS.UCMgr_baseUrl, + UCMgr_baseUrl: UCMgr_baseUrl, }; this.regName = new RegExp('\\W+'); @@ -195,21 +195,24 @@ class CreateFeatureGroup extends React.Component { invokeAddFeatureGroup(event) { this.logger('Add New Request is posted at ' + this.state.UCMgr_baseUrl + '/featureGroup'); let convertedDatalakeDBName = convertDatalakeDBName(this.state.dataLake); - axios - .post(this.state.UCMgr_baseUrl + '/featureGroup', { - featureGroupName: this.state.featureGroupName, - feature_list: this.state.featureNames, - datalake_source: convertedDatalakeDBName, - enable_Dme: this.state.dme, - Host: this.state.host, - Port: this.state.port, - dmePort: this.state.dmePort, - bucket: this.state.bucketName, - token: this.state.token, - source_name: this.state.sourceName, - measured_obj_class: this.state.measuredObjClass, - _measurement: this.state._measurement, - dbOrg: this.state.dbOrg, + + featureGroupAPI + .createFeatureGroup({ + data: { + featureGroupName: this.state.featureGroupName, + feature_list: this.state.featureNames, + datalake_source: convertedDatalakeDBName, + enable_Dme: this.state.dme, + Host: this.state.host, + Port: this.state.port, + dmePort: this.state.dmePort, + bucket: this.state.bucketName, + token: this.state.token, + source_name: this.state.sourceName, + measured_obj_class: this.state.measuredObjClass, + _measurement: this.state._measurement, + dbOrg: this.state.dbOrg, + }, }) .then(res => { this.logger('featureGroup Created', res.data); diff --git a/src/components/home/form/CreateOrEditTrainingJobForm.js b/src/components/home/form/CreateOrEditTrainingJobForm.js index a8b3331..121736b 100644 --- a/src/components/home/form/CreateOrEditTrainingJobForm.js +++ b/src/components/home/form/CreateOrEditTrainingJobForm.js @@ -19,14 +19,14 @@ import React from 'react'; import Form from 'react-bootstrap/Form'; import Button from 'react-bootstrap/Button'; -import axios from 'axios'; -import * as CONSTANTS from '../common/Constants'; import './CreateOrEditTrainingJobForm.css'; import { getDatalakeNameWithoutConversion, convertDatalakeDBName, convertToCommaSeparatedString, } from '../common/CommonMethods'; +import { instance, UCMgr_baseUrl } from '../../../states'; +import { pipelineAPI } from '../../../apis/pipeline'; class CreateTrainingJob extends React.Component { constructor(props) { @@ -46,7 +46,7 @@ class CreateTrainingJob extends React.Component { plList: [], expList: [], featureGroupList: [], - UCMgr_baseUrl: CONSTANTS.UCMgr_baseUrl, + UCMgr_baseUrl: UCMgr_baseUrl, plVerList: [], plVerName: '', plVerDescription: '', @@ -91,8 +91,8 @@ class CreateTrainingJob extends React.Component { } }; if (!this.props.isCreateTrainingJobForm) { - axios - .get(`${CONSTANTS.UCMgr_baseUrl}/trainingjobs/${this.props.trainingjob_name}/${this.props.version}`) + instance + .get(`/trainingjobs/${this.props.trainingjob_name}/${this.props.version}`) .then(result => { console.log('from result is: ', result.data.trainingjob); this.setState( @@ -110,7 +110,7 @@ class CreateTrainingJob extends React.Component { plList: [], expList: [], featureGroupList: [], - UCMgr_baseUrl: CONSTANTS.UCMgr_baseUrl, + UCMgr_baseUrl: UCMgr_baseUrl, plVerList: [], plVerName: result.data.trainingjob.pipeline_version, plVerDescription: '', @@ -131,11 +131,10 @@ class CreateTrainingJob extends React.Component { } fetchPipelines() { - axios - .get(this.state.UCMgr_baseUrl + '/pipelines') + pipelineAPI + .getPipelines() .then(res => { this.logger('Server reponded pl', res.data.pipeline_names); - //setState because this is async response from axios, so re-render this.setState( { plList: res.data.pipeline_names, @@ -212,11 +211,10 @@ class CreateTrainingJob extends React.Component { } fetchPipelineVersions(pipeline_name, shouldGetLatestVersion) { - axios - .get(`${this.state.UCMgr_baseUrl}/pipelines/${pipeline_name}/versions`) + instance + .get(`/pipelines/${pipeline_name}/versions`) .then(res => { this.logger('Server reponded pipeline versions list', res.data.versions_list); - //setState because this is async response from axios, so re-render this.setState( { plVerList: res.data.versions_list, @@ -242,11 +240,10 @@ class CreateTrainingJob extends React.Component { } fetchExperiments() { - axios - .get(this.state.UCMgr_baseUrl + '/experiments') + instance + .get('/experiments') .then(res => { this.logger('Server reponded exp', res.data.experiment_names); - //setState because this is async response from axios, so re-render this.setState( { expList: res.data.experiment_names, @@ -277,11 +274,10 @@ class CreateTrainingJob extends React.Component { } fetchFeatureGroups() { - axios - .get(this.state.UCMgr_baseUrl + '/featureGroup') + instance + .get('/featureGroup') .then(res => { this.logger('Server reponded FG', res.data.featuregroups); - //setState because this is async response from axios, so re-render this.setState( { featureGroupList: res.data.featuregroups, @@ -360,8 +356,8 @@ class CreateTrainingJob extends React.Component { let hyperParamsDict = this.buildHyperparamsDict(this.state.hyparams); let convertedDatalakeDBName = convertDatalakeDBName(this.state.datalakeSourceName); this.logger('Add New Request is posted at ' + this.state.UCMgr_baseUrl + '/trainingjobs/' + this.state.ucName); - axios - .post(this.state.UCMgr_baseUrl + '/trainingjobs/' + this.state.ucName, { + instance + .post('/trainingjobs/' + this.state.ucName, { trainingjob_name: this.state.ucName, is_mme: this.state.isMme, model_name: this.state.modelName, @@ -391,8 +387,8 @@ class CreateTrainingJob extends React.Component { let hyperParamsDict = this.buildHyperparamsDict(this.state.hyparams); let convertedDatalakeDBName = convertDatalakeDBName(this.state.datalakeSourceName); this.logger('Add New Request is posted at ' + this.state.UCMgr_baseUrl + '/trainingjobs/' + this.state.ucName); - axios - .put(this.state.UCMgr_baseUrl + '/trainingjobs/' + this.state.ucName, { + instance + .put('/trainingjobs/' + this.state.ucName, { trainingjob_name: this.state.ucName, is_mme: this.state.isMme, model_name: this.state.modelName, @@ -425,8 +421,8 @@ class CreateTrainingJob extends React.Component { invokeStartTrainingForCreate(event) { this.logger('Training called '); - axios - .post(this.state.UCMgr_baseUrl + '/trainingjobs/' + this.state.ucName + '/training', { + instance + .post('/trainingjobs/' + this.state.ucName + '/training', { trainingjobs: this.state.ucName, }) .then(res => { @@ -447,8 +443,8 @@ class CreateTrainingJob extends React.Component { invokeStartTrainingForEdit(event) { this.logger('Training called '); - axios - .post(this.state.UCMgr_baseUrl + '/trainingjobs/' + this.state.ucName + '/training', { + instance + .post('/trainingjobs/' + this.state.ucName + '/training', { trainingjobs: this.state.ucName, }) .then(res => { diff --git a/src/components/home/pipelines/UploadPipeline.js b/src/components/home/pipelines/UploadPipeline.js index 1bc6cd7..db20d2d 100644 --- a/src/components/home/pipelines/UploadPipeline.js +++ b/src/components/home/pipelines/UploadPipeline.js @@ -19,10 +19,11 @@ import React from 'react'; import Form from 'react-bootstrap/Form'; import Button from 'react-bootstrap/Button'; -import axios from 'axios'; -import * as CONSTANTS from '../common/Constants'; + import OverlayTrigger from 'react-bootstrap/OverlayTrigger'; import Popover from 'react-bootstrap/Popover'; +import { notebook_url, UCMgr_baseUrl } from '../../../states'; +import { pipelineAPI } from '../../../apis/pipeline'; class UploadPipelineForm extends React.Component { constructor(props) { @@ -31,7 +32,7 @@ class UploadPipelineForm extends React.Component { this.state = { fileName: '', plName: '', - UCMgr_baseUrl: CONSTANTS.UCMgr_baseUrl, + UCMgr_baseUrl: UCMgr_baseUrl, }; this.handleInputChange = this.handleInputChange.bind(this); } @@ -76,11 +77,8 @@ class UploadPipelineForm extends React.Component { const data = new FormData(); data.append('file', this.state.fileName); - let url = this.state.UCMgr_baseUrl + '/pipelines/' + this.state.plName + '/upload'; - - //Option-3 - axios - .post(url, data) + pipelineAPI + .uploadPipeline({ params: { pipelineName: this.state.plName }, data }) .then(res => { console.log('Pipeline responsed ', res); console.log('Status responsed ', res.status); @@ -106,7 +104,30 @@ class UploadPipelineForm extends React.Component { handleCreatePipeline = event => { console.log('handleCreatePipeline clicked..', event); - window.open(CONSTANTS.notebook_url + '/tree', '_blank'); + window.open(notebook_url + '/tree', '_blank'); + }; + + componentDidMount() { + this.handleGetPipelines(); + this.handleGetPipelinesVersion(); + } + + handleGetPipelines = async () => { + try { + const response = await pipelineAPI.getPipelines(); + console.log('Pipelines response', response); + } catch (error) { + console.error('Error in getting pipelines', error); + } + }; + + handleGetPipelinesVersion = async () => { + try { + const response = await pipelineAPI.getPipelineVersions({ params: { pipelineName: this.state.plName } }); + console.log('Pipelines version response', response); + } catch (err) { + console.error('Error in getting pipelines version', err); + } }; render() { @@ -121,7 +142,7 @@ class UploadPipelineForm extends React.Component {
{' '} +
Training Function Name* diff --git a/src/components/home/status/API_STATUS.js b/src/components/home/status/API_STATUS.js index 9fbea6f..cc1798d 100644 --- a/src/components/home/status/API_STATUS.js +++ b/src/components/home/status/API_STATUS.js @@ -16,15 +16,13 @@ // ================================================================================== -import axios from 'axios'; -import * as CONSTANTS from '../common/Constants'; +import { featureGroupAPI } from '../../../apis/feature-group'; +import { trainingJobAPI } from '../../../apis/training-job'; export const invokeStartTraining = async trainingjobNames => { console.log('Retraining called ', trainingjobNames); try { - let res = await axios.post(`${CONSTANTS.UCMgr_baseUrl}/trainingjobs/retraining`, { - trainingjobs_list: trainingjobNames, - }); + let res = await trainingJobAPI.invokeTrainingJob({ data: { trainingjobs_list: trainingjobNames } }); console.log('Retraining response', res); let result = 'Retraining initiated for selected trainingjob(s),Result' + '\n' + JSON.stringify(res.data); alert(result); @@ -36,11 +34,7 @@ export const invokeStartTraining = async trainingjobNames => { export const deleteTrainingjobs = async deleteTJList => { console.log('Delete API called ', deleteTJList); try { - let res = await axios.delete(CONSTANTS.UCMgr_baseUrl + '/trainingjobs', { - data: { - list: deleteTJList, - }, - }); + const res = await trainingJobAPI.deleteTrainingJob({ data: { data: { list: deleteTJList } } }); console.log('Delete API response', res); let result = 'trainingjob deletion initiated for selected trainingjob(s),Result' + '\n' + JSON.stringify(res.data); alert(result); @@ -52,11 +46,7 @@ export const deleteTrainingjobs = async deleteTJList => { export const deleteFeatureGroups = async featureGroup_names => { console.log('deleting feature groups', featureGroup_names); try { - let res = await axios.delete(`${CONSTANTS.UCMgr_baseUrl}/featureGroup`, { - data: { - featuregroups_list: featureGroup_names, - }, - }); + let res = await featureGroupAPI.deleteFeatureGroup({ data: { data: { featuregroups_list: featureGroup_names } } }); console.log('Deletion response', res); let result = 'FeatureGroup deletion initiated for selected featureGroups ,Result' + '\n' + JSON.stringify(res.data); alert(result); diff --git a/src/components/home/status/FeatureGroupInfo.js b/src/components/home/status/FeatureGroupInfo.js index e84e4a3..5a840b3 100644 --- a/src/components/home/status/FeatureGroupInfo.js +++ b/src/components/home/status/FeatureGroupInfo.js @@ -18,8 +18,8 @@ import React, { useEffect, useState } from 'react'; import { Form } from 'react-bootstrap'; -import axios from 'axios'; -import { UCMgr_baseUrl } from '../common/Constants'; +import { UCMgr_baseUrl } from '../../../states'; +import { featureGroupAPI } from '../../../apis/feature-group'; const FeatureGroupInfo = props => { const [featureGroupName, setFeatureGroupName] = useState(''); @@ -38,8 +38,8 @@ const FeatureGroupInfo = props => { useEffect(() => { try { - axios - .get(`${UCMgr_baseUrl}/featureGroup/${props.featureGroupName.featureGroupName}`) + featureGroupAPI + .getFeatureGroup({ params: { featureGroupName: props.featureGroupName.featureGroupName } }) .then(response => { console.log( `response for ${UCMgr_baseUrl}/trainingjobs/featureGroup/${props.featureGroupName.featureGroupName}`, diff --git a/src/components/home/status/ListFeatureGroup.js b/src/components/home/status/ListFeatureGroup.js index fec31e1..acb0b90 100644 --- a/src/components/home/status/ListFeatureGroup.js +++ b/src/components/home/status/ListFeatureGroup.js @@ -20,13 +20,13 @@ import React, { useMemo, useState, useEffect } from 'react'; import BTable from 'react-bootstrap/Table'; import Button from 'react-bootstrap/Button'; import { useTable, useRowSelect } from 'react-table'; -import { UCMgr_baseUrl } from '../common/Constants'; -import axios from 'axios'; import { Checkbox } from './Checkbox'; import Popup from './Popup'; import FeatureGroupInfo from './FeatureGroupInfo'; import CreateFeatureGroup from '../create/CreateFeatureGroup'; import { deleteFeatureGroups } from './API_STATUS'; +import { UCMgr_baseUrl } from '../../../states'; +import { featureGroupAPI } from '../../../apis/feature-group'; const ListFeatureGroup = props => { const logger = props.logger; @@ -49,7 +49,7 @@ const ListFeatureGroup = props => { const fetchFeatureGroups = async () => { logger('fetchFeatureGroup UCMgr_baseUrl', UCMgr_baseUrl); try { - const result = await axios.get(`${UCMgr_baseUrl}/featureGroup`); + const result = await featureGroupAPI.getAllFeatureGroup(); logger('fetchFeatureGroup Result', result); logger('feature groups are --> ', result.data.featuregroups); setFeatureGroups(result.data.featuregroups); diff --git a/src/components/home/status/StatusPageRows.js b/src/components/home/status/StatusPageRows.js index 783f83b..ae5d1c9 100644 --- a/src/components/home/status/StatusPageRows.js +++ b/src/components/home/status/StatusPageRows.js @@ -20,8 +20,6 @@ import React, { useMemo, useState, useEffect } from 'react'; import BTable from 'react-bootstrap/Table'; import Button from 'react-bootstrap/Button'; import { useTable, useRowSelect } from 'react-table'; -import { UCMgr_baseUrl } from '../common/Constants'; -import axios from 'axios'; import { Checkbox } from './Checkbox'; import Popup from './Popup'; import TrainingJobInfo from './TrainingJobInfo'; @@ -29,6 +27,8 @@ import { invokeStartTraining, deleteTrainingjobs } from './API_STATUS'; import StepsState from './StepsState'; import CreateOrEditTrainingJobForm from '../form/CreateOrEditTrainingJobForm'; import CreateTrainingJob from '../create/CreateTrainingJob'; +import { UCMgr_baseUrl } from '../../../states'; +import { trainingJobAPI } from '../../../apis/training-job'; const StatusPageRows = props => { const logger = props.logger; @@ -62,7 +62,7 @@ const StatusPageRows = props => { const fetchTrainingJobs = async () => { logger('fetchTrainingJobs UCMgr_baseUrl', UCMgr_baseUrl); try { - const result = await axios.get(`${UCMgr_baseUrl}/trainingjobs/latest`); + const result = await trainingJobAPI.getLatestTrainingJob(); logger('fetchTrainingJobs Result', result); logger('Training Jobs are --> ', result.data.trainingjobs); setTrainingJobs(result.data.trainingjobs); diff --git a/src/components/home/status/StepsState.js b/src/components/home/status/StepsState.js index 42d2f2d..cbbd2cf 100644 --- a/src/components/home/status/StepsState.js +++ b/src/components/home/status/StepsState.js @@ -17,9 +17,9 @@ // ================================================================================== import React, { useEffect, useState } from 'react'; -import axios from 'axios'; import './StepsState.css'; -import { UCMgr_baseUrl } from '../common/Constants'; +import { UCMgr_baseUrl } from '../../../states'; +import { trainingJobAPI } from '../../../apis/training-job'; const StepsState = props => { const [boxesState, setBoxesState] = useState([]); @@ -29,9 +29,12 @@ const StepsState = props => { const periodicTask = async () => { let res = null; try { - res = await axios.get( - `${UCMgr_baseUrl}/trainingjobs/${props.trainingjob_name_and_version.trainingjob_name}/${props.trainingjob_name_and_version.version}/steps_state`, - ); + res = await trainingJobAPI.getTrainingJobStepsState({ + params: { + trainingJobName: props.trainingjob_name_and_version.trainingjob_name, + trainingJobVersion: props.trainingjob_name_and_version.version, + }, + }); } catch (error) { console.log(error); } diff --git a/src/components/home/status/TrainingJobInfo.js b/src/components/home/status/TrainingJobInfo.js index 864abf9..1a371ab 100644 --- a/src/components/home/status/TrainingJobInfo.js +++ b/src/components/home/status/TrainingJobInfo.js @@ -18,9 +18,9 @@ import React, { useEffect, useState } from 'react'; import { Form } from 'react-bootstrap'; -import axios from 'axios'; -import { UCMgr_baseUrl } from '../common/Constants'; import { convertToCommaSeparatedString, getDatalakeNameWithoutConversion } from '../common/CommonMethods'; +import { UCMgr_baseUrl } from '../../../states'; +import { trainingJobAPI } from '../../../apis/training-job'; const TrainingJobInfo = props => { const [trainingJobName, setTrainingJobName] = useState(''); @@ -42,10 +42,13 @@ const TrainingJobInfo = props => { useEffect(() => { try { - axios - .get( - `${UCMgr_baseUrl}/trainingjobs/${props.trainingjob_name_and_version.trainingjob_name}/${props.trainingjob_name_and_version.version}`, - ) + trainingJobAPI + .getTrainingJobByNameAndVersion({ + params: { + trainingJobName: props.trainingjob_name_and_version.trainingjob_name, + trainingJobVersion: props.trainingjob_name_and_version.version, + }, + }) .then(response => { console.log( `response for ${UCMgr_baseUrl}/trainingjobs/${props.trainingjob_name_and_version.trainingjob_name}/${props.trainingjob_name_and_version.version}`, diff --git a/src/states/index.js b/src/states/index.js new file mode 100644 index 0000000..0ce5251 --- /dev/null +++ b/src/states/index.js @@ -0,0 +1 @@ +export * from './server'; diff --git a/src/states/server/axios.js b/src/states/server/axios.js new file mode 100644 index 0000000..8cd69dc --- /dev/null +++ b/src/states/server/axios.js @@ -0,0 +1,20 @@ +import axios from 'axios'; + +export const UCMgr_baseUrl = 'http://' + process.env.REACT_APP_UCM_HOST + ':' + process.env.REACT_APP_UCM_PORT; +export const notebook_url = 'http://' + process.env.REACT_APP_NOTEBOOK_HOST + ':' + process.env.REACT_APP_NOTEBOOK_PORT; +export const ServiceMgr_baseUrl = + 'http://' + process.env.REACT_APP_ServiceMgr_HOST + ':' + process.env.REACT_APP_ServiceMgr_PORT; +export const debug_var = process.env.REACT_APP_DEBUG; +// export const UCMgr_baseUrl = 'http://localhost:32002'; +// export const notebook_url = 'http://localhost:32088'; +// export const ServiceMgr_baseUrl = 'http://localhost:30180'; + +export const BaseInstanceConfig = { + baseURL: UCMgr_baseUrl, + headers: { + 'Content-Type': 'application/json', + }, + timeout: 3000, +}; + +export const instance = axios.create(BaseInstanceConfig); diff --git a/src/states/server/index.js b/src/states/server/index.js new file mode 100644 index 0000000..2466ac8 --- /dev/null +++ b/src/states/server/index.js @@ -0,0 +1 @@ +export * from './axios';