Skip to content

Commit

Permalink
Make changes to the Job plugin UI
Browse files Browse the repository at this point in the history
  • Loading branch information
henrikbossart committed Sep 13, 2023
1 parent 8602edf commit 871a7d6
Show file tree
Hide file tree
Showing 3 changed files with 87 additions and 68 deletions.
54 changes: 27 additions & 27 deletions example/src/plugins/job-ui-single/pages/CreateJobEntity.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,13 @@
import {
EBlueprint,
ErrorResponse,
Stack,
TGenericObject,
TJob,
splitAddress,
useDMSS,
} from '@development-framework/dm-core'
import { Button, Card, Typography } from '@equinor/eds-core-react'
import { Button, Typography } from '@equinor/eds-core-react'
import { AxiosError, AxiosResponse } from 'axios'
import React, { useEffect, useState } from 'react'
import React, { useState } from 'react'
import { JobForm } from './JobForm'

type TCreateJobEntityProps = {
Expand Down Expand Up @@ -98,7 +96,6 @@ export const CreateJobEntity = (props: TCreateJobEntityProps) => {
}
}

// TODO: Implement document check
DmssApi.documentCheck({
address: jobEntityDestination,
}).then((response: AxiosResponse) =>
Expand Down Expand Up @@ -130,31 +127,34 @@ export const CreateJobEntity = (props: TCreateJobEntityProps) => {

return (
<div>
<Stack spacing={1}>
<h3>Create new object of type: {EBlueprint.JOB}</h3>
{defaultJobEntity ? (
<>
{defaultJobEntity ? (
<div style={{ padding: '1rem' }}>
<Typography variant={'h5'}>Create new job</Typography>

<div>
<p>
Using default job entity. Will be saved to destination{' '}
{jobEntityDestination}
This will create a new job with a default job entity. The job will
be saved to the following destination:
</p>
<Button
onClick={() => {
createJobEntity(defaultJobEntity)
}}
>
Create
</Button>
</>
) : (
<JobForm
onSubmit={(jobEntityFormData: TJob) => {
createJobEntity(jobEntityFormData as TJob)

<pre>{jobEntityDestination}</pre>
</div>
<Button
onClick={() => {
createJobEntity(defaultJobEntity)
}}
defaultJobOutputTarget={defaultJobOutputTarget}
/>
)}
</Stack>
>
Create new job
</Button>
</div>
) : (
<JobForm
onSubmit={(jobEntityFormData: TJob) => {
createJobEntity(jobEntityFormData as TJob)
}}
defaultJobOutputTarget={defaultJobOutputTarget}
/>
)}
</div>
)
}
73 changes: 47 additions & 26 deletions example/src/plugins/job-ui-single/pages/JobControl.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ import {
Loading,
useJob,
} from '@development-framework/dm-core'
import React, {useContext, useState} from 'react'
import { Button, Chip, Icon } from '@equinor/eds-core-react'
import React, { useState } from 'react'
import {Button, Card, Icon} from '@equinor/eds-core-react'
import { stop, play, refresh, autorenew } from '@equinor/eds-icons'
import styled from 'styled-components'

Expand All @@ -21,7 +21,7 @@ export const JobControl = (props: { jobEntityId: string }) => {
start,
error,
isLoading,
// fetchResult,
fetchResult,
fetchStatusAndLogs,
logs,
status,
Expand All @@ -34,8 +34,8 @@ export const JobControl = (props: { jobEntityId: string }) => {
if (error) console.error(error)

return (
<div style={{ display: 'flex', flexDirection: 'column', gap: '8px' }}>
<Chip>Status: {status}</Chip>
<div style={{ display: 'flex', flexDirection: 'column' }}>
{/*<Chip>Status: {status}</Chip>*/}
<JobButtonWrapper>
{jobIsStarted ? (
<Button
Expand All @@ -60,34 +60,55 @@ export const JobControl = (props: { jobEntityId: string }) => {
Start
</Button>
)}
{(status === JobStatus.Completed || status === JobStatus.Failed) && <Button

{(status === JobStatus.Completed || status === JobStatus.Failed) && (
<Button
onClick={() => fetchStatusAndLogs()}
variant={'outlined'}
aria-label='Re-run job'
>
<Icon data={autorenew}/>
</Button>}
aria-label="Re-run job"
>
<Icon data={autorenew} />
</Button>
)}
{/* TODO: Make this button query the API for an update on the running job */}
{status === JobStatus.Running && <Button variant='outlined' onClick={() => fetchStatusAndLogs()} aria-label='Get job status'>
<Icon data={refresh}/>
</Button>}
{/* The results should be loaded automatically when the job is finished, and loaded initially if a result is available */}
{/*<Button*/}
{/* onClick={() =>*/}
{/* fetchResult().then((res: GetJobResultResponse) => setResult(res))*/}
{/* }*/}
{/* variant={'outlined'}*/}
{/* disabled={status === JobStatus.NotStarted}*/}
{/*>*/}
{/* Get results*/}
{/*</Button>*/}
{status === JobStatus.Running && (
<Button
variant="outlined"
onClick={() => fetchStatusAndLogs()}
aria-label="Get job status"
>
<Icon data={refresh} />
</Button>
)}
<Button
onClick={() =>
fetchResult().then((res: GetJobResultResponse) => setResult(res))
}
variant={'outlined'}
disabled={status === JobStatus.NotStarted}
>
Get results
</Button>
</JobButtonWrapper>
<Card variant={'info'} style={{marginTop: '8px'}}>
<Card.Header>
Job status: {status}
</Card.Header>
</Card>
{(error || logs) && (
<>
<h4>Logs:</h4>
{error ? (
<pre>{JSON.stringify(error, null, 2)}</pre>
) : (
<pre>{logs}</pre>
)}
</>
)}

<h4>Logs:</h4>
{error ? <pre>{JSON.stringify(error, null, 2)}</pre> : <pre>{logs}</pre>}
<h4>Result:</h4>
{result && (
<>
<h4>Result:</h4>
<pre>{result.message}</pre>
<pre>{result.result}</pre>
</>
Expand Down
28 changes: 13 additions & 15 deletions example/src/plugins/job-ui-single/pages/JobPlugin.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,18 @@ import {
EBlueprint,
JobStatus,
TJob,
IUIPlugin, splitAddress, useDMSS,
IUIPlugin,
useDMSS,
} from '@development-framework/dm-core'
import React, {useEffect, useState} from 'react'
import React, { useEffect, useState } from 'react'

import { JobControl } from './JobControl'
import { CreateJobEntity } from './CreateJobEntity'

export const JobPlugin = (props: IUIPlugin) => {
// TODO make this plugin general and move to dm-core-packages/packages/dm-core-plugins. Right now, it can only be used in the SignalApp due to hard coded values.

const DmssApi = useDMSS();
const DmssApi = useDMSS()
const [jobEntityId, setJobEntityId] = useState<string>('')
const [jobExists, setJobExists] = useState(false)
const jobEntityDestination = `DemoDataSource/$4483c9b0-d505-46c9-a157-94c79f4d7a6a.study.cases[0].job`
Expand Down Expand Up @@ -66,37 +67,34 @@ export const JobPlugin = (props: IUIPlugin) => {
started: 'Not started',
}


function fetchJobIfExists(): void {
const addressObject =splitAddress(jobEntityDestination)
const addressPath = `${addressObject.dataSource}/${addressObject.documentPath}`
// const addressObject =splitAddress(jobEntityDestination)
// const addressPath = `${addressObject.dataSource}/${addressObject.documentPath}`
DmssApi.documentCheck({
address: addressPath,
address: jobEntityDestination,
}).then((res) => {
console.log(res)
if (res.data) {
DmssApi.documentGet({ address: addressPath }).then((resp) => {
console.log(resp)
setJobEntityId(addressPath)
DmssApi.documentGet({ address: jobEntityDestination }).then((resp) => {
setJobEntityId(jobEntityDestination)
setJobExists(true)
})
}
})
}
useEffect(fetchJobIfExists, [])



return (
<div>
{/*// TODO do not include CreateJobEntity component if entity exists in destination*/}
{/*TODO have a way to check if an entity of type job already exists in 'jobEntityDestination'. Must scan content of entire package if jobEntityDestination is a package, but its simpler to check if jobEntityDestination is refering to an object's attribute. */}
{!jobExists && <CreateJobEntity
{!jobExists && (
<CreateJobEntity
jobEntityDestination={jobEntityDestination}
onCreate={(jobEntityId: string) => setJobEntityId(jobEntityId)}
defaultJobOutputTarget={props.idReference + '.signal'}
defaultJobEntity={defaultJobEntity}
/>}
/>
)}
{jobEntityId && <JobControl jobEntityId={jobEntityId} />}
</div>
)
Expand Down

0 comments on commit 871a7d6

Please sign in to comment.