diff --git a/src/app/Workflows/Pipelines/Pipeline/_Layout/Layout.tsx b/src/app/Workflows/Pipelines/Pipeline/_Layout/Layout.tsx index c046c332b..bc429bab8 100644 --- a/src/app/Workflows/Pipelines/Pipeline/_Layout/Layout.tsx +++ b/src/app/Workflows/Pipelines/Pipeline/_Layout/Layout.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Router } from '../_Router'; const Layout: React.FC = () => { - return + return ; }; export default Layout; diff --git a/src/app/Workflows/Pipelines/Pipeline/_Router/Router.tsx b/src/app/Workflows/Pipelines/Pipeline/_Router/Router.tsx index 4ae6718e6..9aedc1c75 100644 --- a/src/app/Workflows/Pipelines/Pipeline/_Router/Router.tsx +++ b/src/app/Workflows/Pipelines/Pipeline/_Router/Router.tsx @@ -1,22 +1,29 @@ import React from 'react'; -import { Redirect, Route, RouteComponentProps, Switch, useLocation, useRouteMatch } from 'react-router-dom'; +import { + Redirect, + Route, + RouteComponentProps, + Switch, + useLocation, + useRouteMatch, +} from 'react-router-dom'; import { default as Pipeline } from '../Pipeline'; import { default as PipelineRunsLayout } from '../../PipelineRuns'; import { default as TaskLayout } from '../../Task'; import { Menu } from 'app/Workflows/Pipelines/Pipeline/_components'; const Router: React.FC = () => { - const location = useLocation() - const { path } = useRouteMatch() + const location = useLocation(); + const { path } = useRouteMatch(); return ( + + + - - - @@ -34,8 +41,8 @@ const Router: React.FC = () => { tab: string; }>) => ( <> - - + + )} /> diff --git a/src/app/Workflows/Pipelines/Pipeline/_components/DagView/DagView.tsx b/src/app/Workflows/Pipelines/Pipeline/_components/DagView/DagView.tsx index 9116b4150..4aeb7c528 100644 --- a/src/app/Workflows/Pipelines/Pipeline/_components/DagView/DagView.tsx +++ b/src/app/Workflows/Pipelines/Pipeline/_components/DagView/DagView.tsx @@ -122,7 +122,7 @@ const DagViewDrawer: React.FC = ({ { - console.log({task}) + console.log({ task }); handleCreateDagTask(task as Workflows.Task); }} > diff --git a/src/app/Workflows/Pipelines/Pipeline/_components/Menu/Menu.tsx b/src/app/Workflows/Pipelines/Pipeline/_components/Menu/Menu.tsx index dc9dea855..ba83469d9 100644 --- a/src/app/Workflows/Pipelines/Pipeline/_components/Menu/Menu.tsx +++ b/src/app/Workflows/Pipelines/Pipeline/_components/Menu/Menu.tsx @@ -3,14 +3,14 @@ import { useHistory, useRouteMatch } from 'react-router-dom'; import { Box, Tab } from '@mui/material'; import { TabList, TabContext } from '@mui/lab'; -const Menu: React.FC<{tab: string}> = ({tab}) => { - const { url } = useRouteMatch() - const history = useHistory() +const Menu: React.FC<{ tab: string }> = ({ tab }) => { + const { url } = useRouteMatch(); + const history = useHistory(); const handleChangeTab = (_: React.SyntheticEvent, value: string) => { - const parts = url.split("/") - parts.pop() - history.push(`${parts.join("/")}/${value}`) -} + const parts = url.split('/'); + parts.pop(); + history.push(`${parts.join('/')}/${value}`); + }; return ( diff --git a/src/app/Workflows/Pipelines/_Router/Router.tsx b/src/app/Workflows/Pipelines/_Router/Router.tsx index 60a3e6c47..9bb711fa5 100644 --- a/src/app/Workflows/Pipelines/_Router/Router.tsx +++ b/src/app/Workflows/Pipelines/_Router/Router.tsx @@ -14,7 +14,7 @@ const Router: React.FC = () => { - + diff --git a/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.module.scss b/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.module.scss index d0ae65f2c..07cee0653 100644 --- a/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.module.scss +++ b/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.module.scss @@ -1,7 +1,6 @@ .form { - width: 100%; - padding: 16px; - display: grid; - gap: 16px; - } - \ No newline at end of file + width: 100%; + padding: 16px; + display: grid; + gap: 16px; +} diff --git a/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.tsx b/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.tsx index 7da92ee90..0f51f0702 100644 --- a/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.tsx +++ b/src/app/Workflows/Pipelines/_components/TaskEditor/Tabs/GitTab/GitTab.tsx @@ -2,12 +2,26 @@ import { usePatchTask } from 'app/Workflows/_hooks'; import { Workflows } from '@tapis/tapis-typescript'; import { Sidebar } from '../../../Sidebar'; import { useEffect, useRef, useState } from 'react'; -import styles from "./GitTab.module.scss" -import { FormControl, FormHelperText, InputLabel, Input, InputAdornment, Button, Select, MenuItem, Alert, AlertTitle, Box, Stepper, Step, StepLabel } from '@mui/material'; +import styles from './GitTab.module.scss'; +import { + FormControl, + FormHelperText, + InputLabel, + Input, + InputAdornment, + Button, + Select, + MenuItem, + Alert, + AlertTitle, + Box, + Stepper, + Step, + StepLabel, +} from '@mui/material'; import { Search } from '@mui/icons-material'; import { listRepos, listBranches } from 'app/apis/Github'; - const GitTab: React.FC<{ toggle: () => void }> = ({ toggle }) => { const { task, @@ -21,31 +35,49 @@ const GitTab: React.FC<{ toggle: () => void }> = ({ toggle }) => { reset, } = usePatchTask(); - const [username, setUsername] = useState(undefined) - const [repos, setRepos] = useState>([]) - const [repo, setRepo] = useState(undefined) - const [branches, setBranches] = useState | undefined>(undefined) - const [branch, setBranch] = useState(undefined) - const [error, setError] = useState(undefined) - const searchRef = useRef(null) + const [username, setUsername] = useState(undefined); + const [repos, setRepos] = useState>( + [] + ); + const [repo, setRepo] = useState(undefined); + const [branches, setBranches] = useState< + Array<{ [key: string | number]: any }> | undefined + >(undefined); + const [branch, setBranch] = useState(undefined); + const [error, setError] = useState(undefined); + const searchRef = useRef(null); useEffect(() => { if (username) { - listRepos({username}, { - onSuccess: (response) => {setRepos(response.result!)}, - onError: (response) => {setError(response.error), setUsername(undefined)} - }) + listRepos( + { username }, + { + onSuccess: (response) => { + setRepos(response.result!); + }, + onError: (response) => { + setError(response.error), setUsername(undefined); + }, + } + ); } - }, [username]) + }, [username]); useEffect(() => { if (username && repo) { - listBranches({username, repo}, { - onSuccess: (response) => {setBranches(response.result!)}, - onError: (response) => {setError(response.error), setBranches(undefined)} - }) + listBranches( + { username, repo }, + { + onSuccess: (response) => { + setBranches(response.result!); + }, + onError: (response) => { + setError(response.error), setBranches(undefined); + }, + } + ); } - }, [repo, branches]) + }, [repo, branches]); return ( @@ -53,24 +85,24 @@ const GitTab: React.FC<{ toggle: () => void }> = ({ toggle }) => { {setError(undefined)}} + onClose={() => { + setError(undefined); + }} > Error {error.message} )} -
+
<> - - Repository owner - + Repository owner - + } /> @@ -79,97 +111,76 @@ const GitTab: React.FC<{ toggle: () => void }> = ({ toggle }) => { The owner of the git repository you want to clone - { - repos.length > 0 && ( - <> - - - Repository - - - - - The git repository to clone into the task's execution directory - - - ) - } - { - repo && branches && ( - <> - - - Branch - - - - - The branch of the repoistory to clone - - - ) - } - { - branch && ( - <> - - - Clone directory - - - - - The repository will be cloned into this directory inside of the task's exection directory - - - ) - } + {repos.length > 0 && ( + <> + + Repository + + + + The git repository to clone into the task's execution directory + + + )} + {repo && branches && ( + <> + + Branch + + + + The branch of the repoistory to clone + + + )} + {branch && ( + <> + + Clone directory + + + + The repository will be cloned into this directory inside of the + task's exection directory + + + )}
- { - task.git_repositories!.map((repo) => { - return ( -
-

{repo.url}

-

{repo.branch}

-

{repo.directory}

-
- ) - }) - } + {task.git_repositories!.map((repo) => { + return ( +
+

{repo.url}

+

{repo.branch}

+

{repo.directory}

+
+ ); + })}
); diff --git a/src/app/Workflows/_components/Menu/Menu.tsx b/src/app/Workflows/_components/Menu/Menu.tsx index d61647c7e..39c6afaa6 100644 --- a/src/app/Workflows/_components/Menu/Menu.tsx +++ b/src/app/Workflows/_components/Menu/Menu.tsx @@ -1,4 +1,4 @@ -import React, {useState} from 'react'; +import React, { useState } from 'react'; import { useHistory } from 'react-router-dom'; import Stack from '@mui/material/Stack'; import { @@ -8,59 +8,80 @@ import { List, ListItem, ListItemButton, - ListItemIcon + ListItemIcon, } from '@mui/material'; -import { Menu as MenuIcon, Groups, SpaceDashboard, AccountTree, Backup } from '@mui/icons-material'; +import { + Menu as MenuIcon, + Groups, + SpaceDashboard, + AccountTree, + Backup, +} from '@mui/icons-material'; const Menu: React.FC = () => { - const history = useHistory() - const [open, setOpen] = useState(false) - const toggle = () => {setOpen(!open)} - + const history = useHistory(); + const [open, setOpen] = useState(false); + const toggle = () => { + setOpen(!open); + }; + return (
- {setOpen(!open)}} style={{cursor: "pointer"}}/> + { + setOpen(!open); + }} + style={{ cursor: 'pointer' }} + /> - {history.push("/workflows")}}> + { + history.push('/workflows'); + }} + > - + - {history.push("/workflows/groups")}}> + { + history.push('/workflows/groups'); + }} + > - + - {history.push("/workflows/pipelines")}}> + { + history.push('/workflows/pipelines'); + }} + > - + - {history.push("/workflows/archives")}}> + { + history.push('/workflows/archives'); + }} + > - + diff --git a/src/app/apis/Github/index.ts b/src/app/apis/Github/index.ts index c9bb7203b..4b9aab8e8 100644 --- a/src/app/apis/Github/index.ts +++ b/src/app/apis/Github/index.ts @@ -1,2 +1,2 @@ -export { default as listRepos } from "./listRepos" -export { default as listBranches } from "./listBranches" \ No newline at end of file +export { default as listRepos } from './listRepos'; +export { default as listBranches } from './listBranches'; diff --git a/src/app/apis/Github/listBranches.ts b/src/app/apis/Github/listBranches.ts index 7bb5d51a6..b63e48e6a 100644 --- a/src/app/apis/Github/listBranches.ts +++ b/src/app/apis/Github/listBranches.ts @@ -1,11 +1,17 @@ -import { type API } from "app/apis" -import { decoder, request } from "../utils" +import { type API } from 'app/apis'; +import { decoder, request } from '../utils'; -type ListBranchesResponse = Array<{[key: string | number]: any}> -type ListBranchesRequest = {username: string, repo: string} +type ListBranchesResponse = Array<{ [key: string | number]: any }>; +type ListBranchesRequest = { username: string; repo: string }; -const listBranches: API = ({username, repo}, callbacks) => { - decoder(() => request(`https://api.github.com/repos/${username}/${repo}/branches`), callbacks) -} +const listBranches: API = ( + { username, repo }, + callbacks +) => { + decoder( + () => request(`https://api.github.com/repos/${username}/${repo}/branches`), + callbacks + ); +}; -export default listBranches \ No newline at end of file +export default listBranches; diff --git a/src/app/apis/Github/listRepos.ts b/src/app/apis/Github/listRepos.ts index 36d71eaf2..935747e49 100644 --- a/src/app/apis/Github/listRepos.ts +++ b/src/app/apis/Github/listRepos.ts @@ -1,11 +1,17 @@ -import { type API } from "app/apis" -import { decoder, request } from "../utils" +import { type API } from 'app/apis'; +import { decoder, request } from '../utils'; -type ListReposResponse = Array<{[key: string | number]: any}> -type ListReposRequest = {username: string} +type ListReposResponse = Array<{ [key: string | number]: any }>; +type ListReposRequest = { username: string }; -const listRepos: API = ({username}, callbacks) => { - decoder(() => request(`https://api.github.com/users/${username}/repos`), callbacks) -} +const listRepos: API = ( + { username }, + callbacks +) => { + decoder( + () => request(`https://api.github.com/users/${username}/repos`), + callbacks + ); +}; -export default listRepos \ No newline at end of file +export default listRepos; diff --git a/src/app/apis/index.ts b/src/app/apis/index.ts index 3508d61a8..52c22812d 100644 --- a/src/app/apis/index.ts +++ b/src/app/apis/index.ts @@ -1,9 +1,14 @@ -export * as Github from "./Github" +export * as Github from './Github'; -export type APIResponse = { result: Resp | undefined, error: Error | undefined} +export type APIResponse = { + result: Resp | undefined; + error: Error | undefined; +}; -export type Callbacks = { - onSuccess?: (response: APIResponse) => void - onError?: (response: APIResponse) => void -} | undefined -export type API = (params: Req, callbacks?: Callbacks) => void \ No newline at end of file +export type Callbacks = + | { + onSuccess?: (response: APIResponse) => void; + onError?: (response: APIResponse) => void; + } + | undefined; +export type API = (params: Req, callbacks?: Callbacks) => void; diff --git a/src/app/apis/utils/decoder.ts b/src/app/apis/utils/decoder.ts index 9c552e837..cea8bd802 100644 --- a/src/app/apis/utils/decoder.ts +++ b/src/app/apis/utils/decoder.ts @@ -1,20 +1,20 @@ -import { request } from "app/apis/utils" -import { type Callbacks } from "app/apis" +import { request } from 'app/apis/utils'; +import { type Callbacks } from 'app/apis'; export const decoder = async ( fn: () => ReturnType, callbacks: Callbacks ) => { - fn() - .then(res => res.json()) - .then((res: T) => { - const success = res.status === undefined ? true : false - if (success && callbacks?.onSuccess) { - callbacks.onSuccess({result: res, error: undefined}) - } + fn() + .then((res) => res.json()) + .then((res: T) => { + const success = res.status === undefined ? true : false; + if (success && callbacks?.onSuccess) { + callbacks.onSuccess({ result: res, error: undefined }); + } - if (!success && callbacks?.onError) { - callbacks.onError({result: undefined, error: new Error(res.message)}) - } - }) -} \ No newline at end of file + if (!success && callbacks?.onError) { + callbacks.onError({ result: undefined, error: new Error(res.message) }); + } + }); +}; diff --git a/src/app/apis/utils/index.ts b/src/app/apis/utils/index.ts index 1a7911b86..738eef8be 100644 --- a/src/app/apis/utils/index.ts +++ b/src/app/apis/utils/index.ts @@ -1,2 +1,2 @@ -export { decoder } from "./decoder" -export { request } from "./request" \ No newline at end of file +export { decoder } from './decoder'; +export { request } from './request'; diff --git a/src/app/apis/utils/request.ts b/src/app/apis/utils/request.ts index e5e8abe44..ec0589095 100644 --- a/src/app/apis/utils/request.ts +++ b/src/app/apis/utils/request.ts @@ -1,3 +1,3 @@ export const request = (requestUrl: string) => { - return fetch(requestUrl) -} \ No newline at end of file + return fetch(requestUrl); +};